Newer
Older
gnexus-ui-kit / docs / catalog.json
[
  { "need": "Button", "component": "GnButton", "props": ["variant", "size", "icon", "loading", "disabled"] },
  { "need": "Icon-only button", "component": "GnIconButton", "props": ["icon", "label", "size"] },
  { "need": "Copy button", "component": "GnCopyButton", "props": ["text", "icon", "successIcon", "duration", "label", "size"] },
  { "need": "Status label", "component": "GnBadge", "props": ["variant", "outline"] },
  { "need": "Message block", "component": "GnAlert", "props": ["variant"] },
  { "need": "Card / panel", "component": "GnCard", "props": ["title (slot)", "footer (slot)"] },
  { "need": "Horizontal card", "component": "GnHorizontalCard", "props": ["image", "title", "titleHref", "icon", "footer (slot)"] },
  { "need": "Login card", "component": "GnLoginCard", "props": ["title", "logoIcon", "usernameLabel", "passwordLabel", "rememberMe", "submitText", "error", "forgotHref", "signupHref"] },
  { "need": "User card", "component": "GnUserCard", "props": ["name", "email", "role", "avatar", "href", "compact", "actions"] },
  { "need": "Page title bar", "component": "GnPageHeader", "props": ["kicker", "title", "subtitle", "meta", "actions (slot)"] },
  { "need": "Text field", "component": "GnInput", "props": ["v-model", "label", "icon", "state", "help"] },
  { "need": "Textarea", "component": "GnTextarea", "props": ["v-model", "label", "state", "help"] },
  { "need": "Select dropdown", "component": "GnSelect", "props": ["v-model", "label", "options"] },
  { "need": "Checkbox", "component": "GnCheckbox", "props": ["v-model", "label", "disabled"] },
  { "need": "Toggle switch", "component": "GnSwitch", "props": ["v-model", "label", "disabled"] },
  { "need": "Radio", "component": "GnRadio / GnRadioGroup", "props": ["v-model", "options"] },
  { "need": "Range slider", "component": "GnRange", "props": ["v-model", "label", "min", "max"] },
  { "need": "File upload", "component": "GnFileUpload", "props": ["v-model", "badge", "multiple", "accept"] },
  { "need": "Searchable select", "component": "GnCombobox", "props": ["v-model", "label", "options", "placeholder"] },
  { "need": "Tag / multi-value input", "component": "GnTagInput", "props": ["v-model", "label", "placeholder", "separator", "unique", "maxItems"] },
  { "need": "Tabs", "component": "GnTabs", "props": ["v-model", "items"] },
  { "need": "Router tabs", "component": "GnRouterTabs", "props": ["`items` (with `to`)", "activeMatch"] },
  { "need": "Accordion", "component": "GnAccordion", "props": ["items", "v-model", "multiple"] },
  { "need": "Modal dialog", "component": "GnModal", "props": ["v-model:open", "title", "closeOnBackdrop"] },
  { "need": "Side drawer", "component": "GnDrawer", "props": ["v-model:open", "title", "position"] },
  { "need": "Toasts", "component": "GnToastProvider + useToast", "propsNote": "Wrap app once; call `toast.success({ title, text })`" },
  { "need": "Confirm dialog", "component": "GnConfirmDialog", "props": ["v-model:open", "title", "message", "confirmVariant"] },
  { "need": "Table", "component": "GnTable", "props": ["columns", "rows", "caption", "emptyText"] },
  { "need": "Toolbar", "component": "GnToolbar", "props": ["title", "meta", "actions (slot)"] },
  { "need": "Input group", "component": "GnInputGroup", "props": ["addon (slot)", "action (slot)"] },
  { "need": "Search field", "component": "GnSearchField", "props": ["v-model"] },
  { "need": "Pagination", "component": "GnPagination", "props": ["page", "total-pages"] },
  { "need": "Empty state", "component": "GnEmptyState", "props": ["title", "text", "icon", "actions (slot)"] },
  { "need": "Skeleton loader", "component": "GnSkeleton", "props": [] },
  { "need": "Key-value list", "component": "GnDescriptionList", "props": ["items"] },
  { "need": "Progress bar", "component": "GnProgress", "props": ["value", "label", "animated"] },
  { "need": "Usage meter card", "component": "GnUsageMeter", "props": ["title", "value", "max", "meta"] },
  { "need": "Staged progress", "component": "GnProgressStages", "props": ["items"] },
  { "need": "Wizard steps", "component": "GnSteps", "props": ["items", "vertical"] },
  { "need": "Chip / tag", "component": "GnChip", "props": ["variant", "selected", "removable"] },
  { "need": "Chip group", "component": "GnChipGroup", "props": [] },
  { "need": "Avatar", "component": "GnAvatar", "props": ["src", "alt", "initials", "icon", "size", "status"] },
  { "need": "Identity row", "component": "GnIdentity", "propsNote": "`title`, `meta`, `avatar` props" },
  { "need": "Avatar stack", "component": "GnAvatarStack", "props": ["items"] },
  { "need": "Timeline", "component": "GnTimeline", "props": ["items"] },
  { "need": "Activity log", "component": "GnActivityLog", "props": ["items"] },
  { "need": "Basic list", "component": "GnList", "props": ["items"] },
  { "need": "Definition list", "component": "GnDefinitionList", "props": ["items"] },
  { "need": "Action list", "component": "GnActionList", "props": ["items"] },
  { "need": "Loader / spinner", "component": "GnLoader", "props": [] },
  { "need": "Status card", "component": "GnStatusCard", "props": ["title", "text", "icon", "variant"] },
  { "need": "Metric card", "component": "GnMetricCard", "props": ["label", "value", "icon", "delta", "negative", "meta"] },
  { "need": "Action card", "component": "GnActionCard", "props": ["title", "text", "actions (slot)"] },
  { "need": "Dropdown menu", "component": "GnDropdown", "props": ["items", "label", "variant"] },
  { "need": "Popover panel", "component": "GnPopover", "props": ["title", "text", "label"] },
  { "need": "Tooltip", "component": "GnTooltip", "props": ["text"] },
  { "need": "Navigation list", "component": "GnNavList", "props": ["items"] },
  { "need": "App shell", "component": "GnNavigationShell", "props": ["brand", "items", "current", "footerLeft", "footerRight"] }
]