@gunjo/ui 0.0.1-alpha.0 → 0.0.1-alpha.2

package/src/index.ts

@@ -3,87 +3,188 @@
  * Generated by `npm run design:sync:components`. Do not edit manually.
  */
 
-/** Atoms */
-export * from './components/atoms/Alert';
-export * from './components/atoms/Avatar';
-export * from './components/atoms/Badge';
-export * from './components/atoms/Button';
-export * from './components/atoms/Checkbox';
-export * from './components/atoms/Img';
-export * from './components/atoms/Input';
-export * from './components/atoms/Kbd';
-export * from './components/atoms/Label';
-export * from './components/atoms/Progress';
-export * from './components/atoms/RadioGroup';
-export * from './components/atoms/Select';
-export * from './components/atoms/Separator';
-export * from './components/atoms/Skeleton';
-export * from './components/atoms/Slider';
-export * from './components/atoms/Spinner';
-export * from './components/atoms/Switch';
-export * from './components/atoms/Textarea';
-export * from './components/atoms/ToggleGroup';
-export * from './components/atoms/ToolPill';
-export * from './components/atoms/ButtonVariants';
+/** Patterns */
+export * from './components/patterns/AuthTemplate';
+export * from './components/patterns/BannalyzeTemplate';
+export * from './components/patterns/BlogTemplate';
+export * from './components/patterns/ChatTemplate';
+export * from './components/patterns/DashboardTemplate';
+export * from './components/patterns/DocsTemplate';
+export * from './components/patterns/EditorTemplate';
+export * from './components/patterns/KanbanTemplate';
+export * from './components/patterns/LandingTemplate';
+export * from './components/patterns/MediaLibraryTemplate';
+export * from './components/patterns/OnboardingTemplate';
+export * from './components/patterns/PricingTemplate';
+export * from './components/patterns/SettingsTemplate';
 
-/** Molecules */
-export * from './components/molecules/Accordion';
-export * from './components/molecules/AIChatInput';
-export * from './components/molecules/AIChatMessage';
-export * from './components/molecules/Breadcrumb';
-export * from './components/molecules/Calendar';
-export * from './components/molecules/Card';
-export * from './components/molecules/Carousel';
-export * from './components/molecules/Command';
-export * from './components/molecules/ContextMenu';
-export * from './components/molecules/Dialog';
-export * from './components/molecules/DropdownMenu';
-export * from './components/molecules/FilterButton';
-export * from './components/molecules/Form';
-export * from './components/molecules/HoverCard';
-export * from './components/molecules/List';
-export * from './components/molecules/Menubar';
-export * from './components/molecules/Modal';
-export * from './components/molecules/NotificationCenter';
-export * from './components/molecules/Pagination';
-export * from './components/molecules/Popover';
-export * from './components/molecules/ProgressWidget';
-export * from './components/molecules/Resizable';
-export * from './components/molecules/ScrollArea';
-export * from './components/molecules/Sheet';
-export * from './components/molecules/SidebarItem';
-export * from './components/molecules/SortButton';
-export * from './components/molecules/StatusBar';
-export * from './components/molecules/Stepper';
-export * from './components/molecules/Table';
-export * from './components/molecules/Tabs';
-export * from './components/molecules/Toast';
-export * from './components/molecules/Tooltip';
+/** Feedback */
+export * from './components/feedback/Alert';
+export * from './components/feedback/Banner';
+export * from './components/feedback/NotificationCenter';
+export * from './components/feedback/Progress';
+export * from './components/feedback/ProgressWidget';
+export * from './components/feedback/Spinner';
+export * from './components/feedback/StatusBar';
+export * from './components/feedback/StatusScreen';
+export * from './components/feedback/Stepper';
+export * from './components/feedback/Toast';
+export * from './components/feedback/ToastProvider';
 
-/** Organisms */
-export * from './components/organisms/AppRail';
-export * from './components/organisms/CommandPalette';
-export * from './components/organisms/FileUploader';
-export * from './components/organisms/FloatingPanel';
-export * from './components/organisms/InspectorPanel';
-export * from './components/organisms/RightRail';
-export * from './components/organisms/ShareModal';
-export * from './components/organisms/SpatialCanvas';
-export * from './components/organisms/ToastProvider';
+/** Layout */
+export * from './components/layout/AspectRatio';
+export * from './components/layout/AssetInspectorPanel';
+export * from './components/layout/Cluster';
+export * from './components/layout/CollapsiblePanelToggle';
+export * from './components/layout/Container';
+export * from './components/layout/DeviceFrame';
+export * from './components/layout/Grid';
+export * from './components/layout/HStack';
+export * from './components/layout/InspectorPanel';
+export * from './components/layout/MarqueeFrame';
+export * from './components/layout/Resizable';
+export * from './components/layout/ScrollArea';
+export * from './components/layout/SpatialCanvas';
+export * from './components/layout/VStack';
 
-/** Templates */
-export * from './components/templates/AuthTemplate';
-export * from './components/templates/BannalyzeTemplate';
-export * from './components/templates/ChatTemplate';
-export * from './components/templates/DashboardTemplate';
-export * from './components/templates/EditorTemplate';
-export * from './components/templates/KanbanTemplate';
-export * from './components/templates/LandingTemplate';
-export * from './components/templates/MediaLibraryTemplate';
-export * from './components/templates/SettingsTemplate';
+/** Navigation */
+export * from './components/navigation/AppRail';
+export * from './components/navigation/Breadcrumb';
+export * from './components/navigation/Command';
+export * from './components/navigation/CommandPalette';
+export * from './components/navigation/DocumentPager';
+export * from './components/navigation/Footer';
+export * from './components/navigation/Header';
+export * from './components/navigation/Menubar';
+export * from './components/navigation/NavigationMenu';
+export * from './components/navigation/PageAside';
+export * from './components/navigation/Pagination';
+export * from './components/navigation/RightRail';
+export * from './components/navigation/Sidebar';
+export * from './components/navigation/SidebarItem';
+export * from './components/navigation/Tabs';
+export * from './components/navigation/TextLink';
+
+/** Overlay */
+export * from './components/overlay/AlertDialog';
+export * from './components/overlay/ChatPanel';
+export * from './components/overlay/ContextMenu';
+export * from './components/overlay/Dialog';
+export * from './components/overlay/Drawer';
+export * from './components/overlay/DropdownMenu';
+export * from './components/overlay/FloatingPanel';
+export * from './components/overlay/HoverCard';
+export * from './components/overlay/MediaLightbox';
+export * from './components/overlay/MediaPickerDialog';
+export * from './components/overlay/Modal';
+export * from './components/overlay/OnboardingFlow';
+export * from './components/overlay/Popover';
+export * from './components/overlay/ShareModal';
+export * from './components/overlay/Sheet';
+export * from './components/overlay/Tooltip';
+
+/** Display */
+export * from './components/display/Accordion';
+export * from './components/display/AccordionGroup';
+export * from './components/display/ActionDataTable';
+export * from './components/display/ActivityTimelineCard';
+export * from './components/display/AnalyticsCard';
+export * from './components/display/AssetCard';
+export * from './components/display/AssetGrid';
+export * from './components/display/Avatar';
+export * from './components/display/AvatarGroup';
+export * from './components/display/Badge';
+export * from './components/display/BarChart';
+export * from './components/display/Card';
+export * from './components/display/Carousel';
+export * from './components/display/ChartLegend';
+export * from './components/display/ChatMessage';
+export * from './components/display/ChoroplethMap';
+export * from './components/display/Code';
+export * from './components/display/CodeBlock';
+export * from './components/display/ColorSwatch';
+export * from './components/display/ConcentricProgressCard';
+export * from './components/display/DataTable';
+export * from './components/display/DistributionBar';
+export * from './components/display/DocNote';
+export * from './components/display/DonutChart';
+export * from './components/display/EmptyState';
+export * from './components/display/FileTree';
+export * from './components/display/GaugeChart';
+export * from './components/display/HeatmapChart';
+export * from './components/display/Icon';
+export * from './components/display/ImagePreview';
+export * from './components/display/Img';
+export * from './components/display/Kbd';
+export * from './components/display/LabeledDonutCard';
+export * from './components/display/LineChart';
+export * from './components/display/List';
+export * from './components/display/MarkdownRenderer';
+export * from './components/display/MetadataList';
+export * from './components/display/MiniDistributionBarCard';
+export * from './components/display/PieChart';
+export * from './components/display/QuadrantMatrix';
+export * from './components/display/RadarChart';
+export * from './components/display/RadialBarChart';
+export * from './components/display/RetentionCohortCard';
+export * from './components/display/RibbonChart';
+export * from './components/display/SearchableAccordion';
+export * from './components/display/SegmentedGaugeCard';
+export * from './components/display/SegmentTimelineCard';
+export * from './components/display/Separator';
+export * from './components/display/Skeleton';
+export * from './components/display/Spacer';
+export * from './components/display/SparklineChart';
+export * from './components/display/StackedBarChart';
+export * from './components/display/Statistic';
+export * from './components/display/Table';
+export * from './components/display/Tag';
+export * from './components/display/TagEditor';
+export * from './components/display/Timeline';
+export * from './components/display/ToolPill';
+export * from './components/display/TreeView';
+
+/** Inputs */
+export * from './components/inputs/Button';
+export * from './components/inputs/Calendar';
+export * from './components/inputs/ChatComposer';
+export * from './components/inputs/ChatInput';
+export * from './components/inputs/Checkbox';
+export * from './components/inputs/Combobox';
+export * from './components/inputs/CopyButton';
+export * from './components/inputs/DatePicker';
+export * from './components/inputs/DateRangePicker';
+export * from './components/inputs/EditableField';
+export * from './components/inputs/FileUploader';
+export * from './components/inputs/FilterButton';
+export * from './components/inputs/Form';
+export * from './components/inputs/Input';
+export * from './components/inputs/InputOTP';
+export * from './components/inputs/Label';
+export * from './components/inputs/Mention';
+export * from './components/inputs/NumberInput';
+export * from './components/inputs/PasswordGroup';
+export * from './components/inputs/PasswordInput';
+export * from './components/inputs/PasswordRequirementList';
+export * from './components/inputs/PasswordStrengthMeter';
+export * from './components/inputs/PhoneInput';
+export * from './components/inputs/PostalCodeInput';
+export * from './components/inputs/RadioGroup';
+export * from './components/inputs/RangeSlider';
+export * from './components/inputs/SearchInput';
+export * from './components/inputs/Select';
+export * from './components/inputs/Slider';
+export * from './components/inputs/SortButton';
+export * from './components/inputs/Switch';
+export * from './components/inputs/TagInput';
+export * from './components/inputs/Textarea';
+export * from './components/inputs/TimePicker';
+export * from './components/inputs/Toggle';
+export * from './components/inputs/ToggleGroup';
+export * from './components/inputs/TooltipButton';
+export * from './components/inputs/ButtonVariants';
 
 /** Utility */
 export { cn } from './lib/utils';
 export { componentManifest } from './components/generated/component-manifest';
 export { componentStyleHints } from './components/generated/component-style-hints';
-

package/tailwind-theme-extend.cjs

@@ -4,22 +4,56 @@ module.exports = {
         input: "hsl(var(--input))",
         ring: "hsl(var(--ring))",
         overlay: "hsl(var(--overlay))",
-        info: "hsl(var(--info))",
-        success: "hsl(var(--success))",
-        warning: "hsl(var(--warning))",
         background: "hsl(var(--background))",
         foreground: "hsl(var(--foreground))",
         primary: {
+            subtle: "hsl(var(--primary-subtle))",
+            "subtle-foreground": "hsl(var(--primary-subtle-foreground))",
             DEFAULT: "hsl(var(--primary))",
             foreground: "hsl(var(--primary-foreground))",
+            strong: "hsl(var(--primary-strong))",
+            "strong-foreground": "hsl(var(--primary-strong-foreground))",
+            border: "hsl(var(--primary-border))",
+        },
+        info: {
+            subtle: "hsl(var(--info-subtle))",
+            "subtle-foreground": "hsl(var(--info-subtle-foreground))",
+            DEFAULT: "hsl(var(--info))",
+            foreground: "hsl(var(--info-foreground))",
+            strong: "hsl(var(--info-strong))",
+            "strong-foreground": "hsl(var(--info-strong-foreground))",
+            border: "hsl(var(--info-border))",
+        },
+        success: {
+            subtle: "hsl(var(--success-subtle))",
+            "subtle-foreground": "hsl(var(--success-subtle-foreground))",
+            DEFAULT: "hsl(var(--success))",
+            foreground: "hsl(var(--success-foreground))",
+            strong: "hsl(var(--success-strong))",
+            "strong-foreground": "hsl(var(--success-strong-foreground))",
+            border: "hsl(var(--success-border))",
+        },
+        warning: {
+            subtle: "hsl(var(--warning-subtle))",
+            "subtle-foreground": "hsl(var(--warning-subtle-foreground))",
+            DEFAULT: "hsl(var(--warning))",
+            foreground: "hsl(var(--warning-foreground))",
+            strong: "hsl(var(--warning-strong))",
+            "strong-foreground": "hsl(var(--warning-strong-foreground))",
+            border: "hsl(var(--warning-border))",
         },
         secondary: {
             DEFAULT: "hsl(var(--secondary))",
             foreground: "hsl(var(--secondary-foreground))",
         },
         destructive: {
+            subtle: "hsl(var(--destructive-subtle))",
+            "subtle-foreground": "hsl(var(--destructive-subtle-foreground))",
             DEFAULT: "hsl(var(--destructive))",
             foreground: "hsl(var(--destructive-foreground))",
+            strong: "hsl(var(--destructive-strong))",
+            "strong-foreground": "hsl(var(--destructive-strong-foreground))",
+            border: "hsl(var(--destructive-border))",
         },
         muted: {
             DEFAULT: "hsl(var(--muted))",
@@ -37,6 +71,17 @@ module.exports = {
             DEFAULT: "hsl(var(--card))",
             foreground: "hsl(var(--card-foreground))",
         },
+        palette: {
+            red: "hsl(var(--palette-red))",
+            green: "hsl(var(--palette-green))",
+            blue: "hsl(var(--palette-blue))",
+            yellow: "hsl(var(--palette-yellow))",
+            cyan: "hsl(var(--palette-cyan))",
+            magenta: "hsl(var(--palette-magenta))",
+            gray: "hsl(var(--palette-gray))",
+            white: "hsl(var(--palette-white))",
+            black: "hsl(var(--palette-black))",
+        },
     },
     borderRadius: {
         lg: "var(--radius)",

package/design/atoms-metadata.json

@@ -1,82 +0,0 @@
-{
-  "button": {
-    "title": "Button",
-    "description": "Displays a button or a component that looks like a button."
-  },
-  "input": {
-    "title": "Input",
-    "description": "Displays a form input field or a component that looks like an input field."
-  },
-  "badge": {
-    "title": "Badge",
-    "description": "Displays a badge or a component that looks like a badge."
-  },
-  "label": {
-    "title": "Label",
-    "description": "Renders an accessible label associated with controls."
-  },
-  "checkbox": {
-    "title": "Checkbox",
-    "description": "A control that allows the user to toggle between checked and not checked."
-  },
-  "separator": {
-    "title": "Separator",
-    "description": "Visually or semantically separates content."
-  },
-  "switch": {
-    "title": "Switch",
-    "description": "A control that allows the user to toggle between checked and not checked."
-  },
-  "textarea": {
-    "title": "Textarea",
-    "description": "Displays a form textarea or a component that looks like a textarea."
-  },
-  "alert": {
-    "title": "Alert",
-    "description": "Displays a callout for user attention."
-  },
-  "avatar": {
-    "title": "Avatar",
-    "description": "An image element with a fallback for representing the user."
-  },
-  "kbd": {
-    "title": "Kbd",
-    "description": "Displays a keyboard shortcut key."
-  },
-  "img": {
-    "title": "Img",
-    "description": "An enhanced image component with loading skeleton and error fallback."
-  },
-  "progress": {
-    "title": "Progress",
-    "description": "Displays an indicator showing the completion progress of a task, typically displayed as a progress bar."
-  },
-  "spinner": {
-    "title": "Spinner",
-    "description": "A visual indicator that content is being loaded."
-  },
-  "radioGroup": {
-    "title": "RadioGroup",
-    "description": "A set of checkable buttons—known as radio buttons—where no more than one of the buttons can be checked at a time."
-  },
-  "slider": {
-    "title": "Slider",
-    "description": "An input where the user selects a value from within a given range."
-  },
-  "select": {
-    "title": "Select",
-    "description": "Displays a list of options for the user to pick from."
-  },
-  "toggleGroup": {
-    "title": "ToggleGroup",
-    "description": "A set of two-state buttons that can be toggled on or off."
-  },
-  "toolPill": {
-    "title": "ToolPill",
-    "description": "Compact icon pill used for toolbar quick actions with active and danger states."
-  },
-  "skeleton": {
-    "title": "Skeleton",
-    "description": "Loading placeholder for content while it is being fetched."
-  }
-}

package/design/molecules-metadata.json

@@ -1,130 +0,0 @@
-{
-  "card": {
-    "title": "Card",
-    "description": "Displays a card with header, content, and footer."
-  },
-  "list": {
-    "title": "List",
-    "description": "A semantic list component with customizable markers and spacing."
-  },
-  "accordion": {
-    "title": "Accordion",
-    "description": "A vertically stacked set of interactive headings that each reveal a section of content."
-  },
-  "breadcrumb": {
-    "title": "Breadcrumb",
-    "description": "Displays the path to the current resource using a hierarchy of links."
-  },
-  "dropdownMenu": {
-    "title": "Dropdown Menu",
-    "description": "Displays a menu to the user—such as a set of actions or functions—triggered by a button."
-  },
-  "popover": {
-    "title": "Popover",
-    "description": "Displays rich content in a portal, triggered by a button."
-  },
-  "command": {
-    "title": "Command",
-    "description": "Fast, composable, unstyled command menu for React."
-  },
-  "calendar": {
-    "title": "Calendar",
-    "description": "A date field component that allows users to enter and edit date."
-  },
-  "table": {
-    "title": "Table",
-    "description": "A responsive table component."
-  },
-  "tabs": {
-    "title": "Tabs",
-    "description": "A set of layered sections of content—known as tab panels—that are displayed one at a time."
-  },
-  "toast": {
-    "title": "Toast",
-    "description": "Transient feedback message with semantic variants."
-  },
-  "modal": {
-    "title": "Modal",
-    "description": "Dialog surface with header, content, and optional footer actions."
-  },
-  "carousel": {
-    "title": "Carousel",
-    "description": "Embla-powered slider with keyboard and arrow controls."
-  },
-  "pagination": {
-    "title": "Pagination",
-    "description": "Navigation controls for traversing paged content."
-  },
-  "notificationCenter": {
-    "title": "Notification Center",
-    "description": "Popover-based inbox for unread activity and quick actions."
-  },
-  "dialog": {
-    "title": "Dialog",
-    "description": "Centered modal dialog with overlay, header, and footer actions."
-  },
-  "sheet": {
-    "title": "Sheet",
-    "description": "Side panel variant with overlay, heading, and action area."
-  },
-  "tooltip": {
-    "title": "Tooltip",
-    "description": "Compact helper text bubble for hover and focus states."
-  },
-  "hoverCard": {
-    "title": "HoverCard",
-    "description": "Rich hover content with compact profile-like layout."
-  },
-  "contextMenu": {
-    "title": "ContextMenu",
-    "description": "Right-click style action list with labels and nested trigger."
-  },
-  "menubar": {
-    "title": "Menubar",
-    "description": "Top application menu with trigger items and nested submenu entry."
-  },
-  "scrollArea": {
-    "title": "ScrollArea",
-    "description": "Custom scrollbar container with viewport and thumb controls."
-  },
-  "resizable": {
-    "title": "Resizable",
-    "description": "Pane group with draggable handle and optional grip indicator."
-  },
-  "statusBar": {
-    "title": "StatusBar",
-    "description": "Bottom fixed utility bar with left, center and right regions."
-  },
-  "sidebarItem": {
-    "title": "SidebarItem",
-    "description": "Nested sidebar row with chevron, icon, label, and counter area."
-  },
-  "aiChatInput": {
-    "title": "AIChatInput",
-    "description": "Composer row with attachments, autosizing textarea, and send/stop actions."
-  },
-  "aiChatMessage": {
-    "title": "AIChatMessage",
-    "description": "Chat row for user/assistant with avatar, bubble, and action controls."
-  },
-  "filterButton": {
-    "title": "FilterButton",
-    "description": "Filter trigger with dashed border, count badge, and command popover list."
-  },
-  "sortButton": {
-    "title": "SortButton",
-    "description": "Three-state sort trigger (none, asc, desc) with icon + text."
-  },
-  "progressWidget": {
-    "title": "ProgressWidget",
-    "description": "Metric card showing title, value, progress bar, and optional subtext."
-  },
-  "stepper": {
-    "title": "Stepper",
-    "description": "A multi-step progress indicator with completed, current, and upcoming states."
-  },
-  "form": {
-    "title": "Form",
-    "description": "Compound form primitives: Form / FormField / FormLabel / FormControl / FormDescription / FormMessage."
-  }
-}

package/design/organisms-metadata.json

@@ -1,38 +0,0 @@
-{
-  "appRail": {
-    "title": "App Rail",
-    "description": "Primary vertical icon rail used for application-wide navigation."
-  },
-  "commandPalette": {
-    "title": "Command Palette",
-    "description": "Global quick-action launcher with grouped commands and keyboard shortcuts."
-  },
-  "rightRail": {
-    "title": "Right Rail",
-    "description": "Secondary side panel for contextual tools and inspector content."
-  },
-  "floatingPanel": {
-    "title": "Floating Panel",
-    "description": "Animated floating container for transient UI surfaces."
-  },
-  "inspectorPanel": {
-    "title": "Inspector Panel",
-    "description": "Structured side panel for detailed property editing."
-  },
-  "spatialCanvas": {
-    "title": "Spatial Canvas",
-    "description": "Large grid-based interaction surface for node and layout editing."
-  },
-  "shareModal": {
-    "title": "Share Modal",
-    "description": "Dialog for toggling public access and copying shareable URLs."
-  },
-  "fileUploader": {
-    "title": "File Uploader",
-    "description": "Drag-and-drop file intake with compact list rendering."
-  },
-  "toastProvider": {
-    "title": "Toast Provider",
-    "description": "Global toast stack manager for showing transient feedback messages."
-  }
-}

package/design/templates-metadata.json

@@ -1,38 +0,0 @@
-{
-  "dashboardTemplate": {
-    "title": "Dashboard Template",
-    "description": "Two-column dashboard shell with optional header and sidebar."
-  },
-  "editorTemplate": {
-    "title": "Editor Template",
-    "description": "Panel-based editing layout with top bar and side docks."
-  },
-  "landingTemplate": {
-    "title": "Landing Template",
-    "description": "Marketing page skeleton with sticky header and section rhythm."
-  },
-  "authTemplate": {
-    "title": "Auth Template",
-    "description": "Split authentication layout with branded panel and centered form."
-  },
-  "kanbanTemplate": {
-    "title": "Kanban Template",
-    "description": "Board workflow shell with optional sidebar and horizontal columns."
-  },
-  "chatTemplate": {
-    "title": "Chat Template",
-    "description": "Conversation layout with channel rail, message area, and detail pane."
-  },
-  "settingsTemplate": {
-    "title": "Settings Template",
-    "description": "Responsive settings layout with mobile stack and desktop split view."
-  },
-  "bannalyzeTemplate": {
-    "title": "Bannalyze Template",
-    "description": "Three-region analysis workspace with center canvas and side inspectors."
-  },
-  "mediaLibraryTemplate": {
-    "title": "Media Library Template",
-    "description": "Asset management workspace with folders, grid area, and details pane."
-  }
-}