@nexa-ui-kit/theme-default 1.0.0

package/components/sonner.css

@@ -0,0 +1,103 @@
+/* Sonner Toast Component Styles */
+/* Uses class names set via toastOptions.classNames */
+
+/* Base toast styling */
+.nexa-toast {
+  @apply group pointer-events-auto relative flex w-full items-center justify-between gap-4 overflow-hidden rounded-lg border p-4 shadow-lg transition-all;
+  @apply bg-background text-foreground;
+}
+
+.nexa-toast-title {
+  @apply text-sm font-semibold leading-none tracking-tight;
+}
+
+.nexa-toast-description {
+  @apply text-sm text-muted-foreground;
+}
+
+/* Variant colors (when richColors enabled) */
+.nexa-toast-success {
+  @apply border-green-500/30 bg-green-50 text-green-900;
+}
+
+.nexa-toast-success .nexa-toast-description {
+  @apply text-green-800;
+}
+
+.nexa-toast-error {
+  @apply border-red-500/30 bg-red-50 text-red-900;
+}
+
+.nexa-toast-error .nexa-toast-description {
+  @apply text-red-800;
+}
+
+.nexa-toast-warning {
+  @apply border-yellow-500/30 bg-yellow-50 text-yellow-900;
+}
+
+.nexa-toast-warning .nexa-toast-description {
+  @apply text-yellow-800;
+}
+
+.nexa-toast-info {
+  @apply border-blue-500/30 bg-blue-50 text-blue-900;
+}
+
+.nexa-toast-info .nexa-toast-description {
+  @apply text-blue-800;
+}
+
+.nexa-toast-loading {
+  @apply border-muted bg-muted/50;
+}
+
+/* Dark mode variants */
+.dark .nexa-toast-success {
+  @apply border-green-500/30 bg-green-950 text-green-100;
+}
+
+.dark .nexa-toast-success .nexa-toast-description {
+  @apply text-green-200;
+}
+
+.dark .nexa-toast-error {
+  @apply border-red-500/30 bg-red-950 text-red-100;
+}
+
+.dark .nexa-toast-error .nexa-toast-description {
+  @apply text-red-200;
+}
+
+.dark .nexa-toast-warning {
+  @apply border-yellow-500/30 bg-yellow-950 text-yellow-100;
+}
+
+.dark .nexa-toast-warning .nexa-toast-description {
+  @apply text-yellow-200;
+}
+
+.dark .nexa-toast-info {
+  @apply border-blue-500/30 bg-blue-950 text-blue-100;
+}
+
+.dark .nexa-toast-info .nexa-toast-description {
+  @apply text-blue-200;
+}
+
+/* Action buttons */
+.nexa-toast-action {
+  @apply inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium transition-colors;
+  @apply hover:bg-secondary focus:outline-none focus:ring-1 focus:ring-ring;
+  @apply disabled:pointer-events-none disabled:opacity-50;
+}
+
+.nexa-toast-cancel {
+  @apply inline-flex h-8 shrink-0 items-center justify-center rounded-md px-3 text-sm font-medium;
+  @apply text-muted-foreground hover:text-foreground;
+}
+
+.nexa-toast-close {
+  @apply absolute right-1 top-1 rounded-md p-1 text-muted-foreground opacity-0 transition-opacity;
+  @apply hover:text-foreground focus:opacity-100 focus:outline-none group-hover:opacity-100;
+}

package/components/spinner.css

@@ -0,0 +1,5 @@
+/* Spinner Component Styles */
+
+[data-slot="spinner"] {
+  @apply animate-spin text-muted-foreground;
+}

package/components/stat-card.css

@@ -0,0 +1,33 @@
+/* Stat Card Component Styles */
+
+[data-slot="stat-card"] {
+  @apply rounded-lg border bg-card p-6 text-card-foreground shadow-sm;
+}
+
+[data-slot="stat-icon"] {
+  @apply mb-2 text-muted-foreground;
+}
+
+[data-slot="stat-label"] {
+  @apply text-sm font-medium text-muted-foreground;
+}
+
+[data-slot="stat-value"] {
+  @apply text-2xl font-bold tracking-tight;
+}
+
+[data-slot="stat-trend"] {
+  @apply inline-flex items-center text-sm font-medium;
+}
+
+[data-slot="stat-trend"][data-direction="up"] {
+  @apply text-green-600 dark:text-green-500;
+}
+
+[data-slot="stat-trend"][data-direction="down"] {
+  @apply text-red-600 dark:text-red-500;
+}
+
+[data-slot="stat-trend"][data-direction="neutral"] {
+  @apply text-muted-foreground;
+}

package/components/stepper.css

@@ -0,0 +1,137 @@
+/* Stepper Component Styles */
+
+[data-slot="stepper"] {
+  @apply flex flex-col gap-4;
+}
+
+[data-slot="stepper"][data-orientation="horizontal"] {
+  @apply w-full;
+}
+
+[data-slot="stepper"][data-orientation="vertical"] {
+  @apply w-auto;
+}
+
+/* Stepper List */
+[data-slot="stepper-list"] {
+  @apply flex items-center gap-2;
+}
+
+[data-slot="stepper-list"][data-orientation="horizontal"] {
+  @apply flex-row;
+}
+
+[data-slot="stepper-list"][data-orientation="vertical"] {
+  @apply flex-col items-start;
+}
+
+/* Stepper Item */
+[data-slot="stepper-item"] {
+  @apply flex items-center gap-2;
+}
+
+[data-slot="stepper-item"][data-disabled] {
+  @apply opacity-50;
+}
+
+/* Stepper Trigger */
+[data-slot="stepper-trigger"] {
+  @apply flex items-center gap-2 p-0 bg-transparent border-none cursor-pointer;
+  @apply transition-opacity duration-200;
+}
+
+[data-slot="stepper-trigger"]:hover:not([data-disabled]) {
+  @apply opacity-80;
+}
+
+[data-slot="stepper-trigger"][data-disabled] {
+  @apply cursor-not-allowed opacity-50;
+}
+
+[data-slot="stepper-trigger"]:focus-visible {
+  @apply outline-none ring-2 ring-ring ring-offset-2 rounded-sm;
+}
+
+/* Stepper Indicator */
+[data-slot="stepper-indicator"] {
+  @apply flex items-center justify-center w-8 h-8 rounded-full text-sm font-medium shrink-0;
+  @apply transition-all duration-200;
+  @apply bg-muted text-muted-foreground;
+}
+
+[data-slot="stepper-trigger"][data-state="active"] [data-slot="stepper-indicator"] {
+  @apply bg-primary text-primary-foreground;
+}
+
+[data-slot="stepper-trigger"][data-state="completed"] [data-slot="stepper-indicator"] {
+  @apply bg-primary text-primary-foreground;
+}
+
+/* Stepper Label */
+[data-slot="stepper-label"] {
+  @apply text-sm transition-colors duration-200;
+  @apply text-muted-foreground;
+}
+
+[data-slot="stepper-trigger"][data-state="active"] [data-slot="stepper-label"] {
+  @apply text-foreground font-medium;
+}
+
+[data-slot="stepper-trigger"][data-state="completed"] [data-slot="stepper-label"] {
+  @apply text-foreground;
+}
+
+/* Stepper Separator */
+[data-slot="stepper-separator"] {
+  @apply flex-1 transition-colors duration-200;
+  @apply bg-border;
+}
+
+[data-slot="stepper-separator"][data-orientation="horizontal"] {
+  @apply h-px min-w-6;
+}
+
+[data-slot="stepper-separator"][data-orientation="vertical"] {
+  @apply w-px min-h-6 ml-4;
+}
+
+/* Active separator (between completed steps) */
+[data-slot="stepper-item"][data-state="completed"] + [data-slot="stepper-separator"] {
+  @apply bg-primary;
+}
+
+/* Stepper Content */
+[data-slot="stepper-content"] {
+  @apply outline-none;
+}
+
+[data-slot="stepper-content"][data-state="inactive"] {
+  @apply hidden;
+}
+
+/* Stepper Title */
+[data-slot="stepper-title"] {
+  @apply text-sm font-medium leading-normal m-0;
+}
+
+/* Stepper Description */
+[data-slot="stepper-description"] {
+  @apply text-xs text-muted-foreground leading-normal m-0;
+}
+
+/* Size variants */
+[data-slot="stepper"][data-size="sm"] [data-slot="stepper-indicator"] {
+  @apply w-6 h-6 text-xs;
+}
+
+[data-slot="stepper"][data-size="sm"] [data-slot="stepper-label"] {
+  @apply text-xs;
+}
+
+[data-slot="stepper"][data-size="lg"] [data-slot="stepper-indicator"] {
+  @apply w-10 h-10 text-base;
+}
+
+[data-slot="stepper"][data-size="lg"] [data-slot="stepper-label"] {
+  @apply text-base;
+}

package/components/switch.css

@@ -0,0 +1,9 @@
+/* Switch Component Styles */
+
+[data-slot="switch"] {
+  @apply peer inline-flex h-[20px] w-[36px] shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input;
+}
+
+[data-slot="switch-thumb"] {
+  @apply pointer-events-none block h-4 w-4 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0;
+}

package/components/table.css

@@ -0,0 +1,42 @@
+/* Table Component Styles */
+
+[data-slot="table"] {
+  @apply w-full caption-bottom text-sm;
+}
+
+[data-slot="table-header"] {
+  @apply [&_tr]:border-b;
+}
+
+[data-slot="table-body"] {
+  @apply [&_tr:last-child]:border-0;
+}
+
+[data-slot="table-footer"] {
+  @apply border-t bg-muted/50 font-medium [&>tr]:last:border-b-0;
+}
+
+[data-slot="table-row"] {
+  @apply border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted;
+}
+
+[data-slot="table-head"] {
+  @apply h-12 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0;
+}
+
+[data-slot="table-cell"] {
+  @apply p-4 align-middle [&:has([role=checkbox])]:pr-0;
+}
+
+[data-slot="table-caption"] {
+  @apply mt-4 text-sm text-muted-foreground;
+}
+
+[data-slot="table-toolbar"] {
+  @apply flex items-center justify-between gap-4 py-4;
+}
+
+[data-slot="table-pagination"] {
+  @apply flex items-center justify-end space-x-2 py-4;
+}
+

package/components/tabs.css

@@ -0,0 +1,37 @@
+/* Tabs Component Styles */
+
+[data-slot="tabs"] {
+  @apply flex flex-col;
+}
+
+[data-slot="tabs"][data-orientation="horizontal"] {
+  @apply flex-col;
+}
+
+[data-slot="tabs"][data-orientation="vertical"] {
+  @apply flex-row;
+}
+
+[data-slot="tabs-list"] {
+  @apply relative inline-flex items-center justify-center rounded-md bg-muted p-1 text-muted-foreground;
+}
+
+[data-slot="tabs-list"][data-orientation="horizontal"] {
+  @apply border-b-0;
+}
+
+[data-slot="tabs-list"][data-orientation="vertical"] {
+  @apply flex-col border-r-0;
+}
+
+[data-slot="tabs-indicator"] {
+  @apply absolute rounded-sm bg-background shadow-sm transition-all duration-300 ease-in-out;
+}
+
+[data-slot="tabs-content"] {
+  @apply mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2;
+}
+
+[data-slot="tabs-trigger"] {
+  @apply inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm;
+}

package/components/textarea.css

@@ -0,0 +1,17 @@
+/* Textarea Component Styles */
+
+[data-slot="textarea"] {
+  @apply flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50;
+}
+
+[data-slot="textarea-wrapper"] {
+  @apply relative w-full;
+}
+
+[data-slot="textarea-counter"] {
+  @apply mt-1 text-right text-xs text-muted-foreground transition-colors duration-200;
+}
+
+[data-slot="textarea-counter"][data-error="true"] {
+  @apply text-destructive;
+}

package/components/toast.css

@@ -0,0 +1,45 @@
+/* Toast Component Styles */
+
+[data-slot="toast-viewport"] {
+  @apply fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px];
+}
+
+[data-slot="toast"] {
+  @apply pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-md border p-6 pr-8 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full;
+}
+
+[data-slot="toast"][data-variant="default"] {
+  @apply border bg-background text-foreground;
+}
+
+[data-slot="toast"][data-variant="destructive"] {
+  @apply border-destructive bg-destructive text-destructive-foreground;
+}
+
+[data-slot="toast-action"] {
+  @apply inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50;
+}
+
+[data-slot="toast"][data-variant="destructive"] [data-slot="toast-action"] {
+  @apply border-muted/40 hover:border-destructive/30 hover:bg-destructive hover:text-destructive-foreground focus:ring-destructive;
+}
+
+[data-slot="toast-close"] {
+  @apply absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2;
+}
+
+[data-slot="toast"]:hover [data-slot="toast-close"] {
+  @apply opacity-100;
+}
+
+[data-slot="toast"][data-variant="destructive"] [data-slot="toast-close"] {
+  @apply text-red-300 hover:text-red-50 focus:ring-red-400 focus:ring-offset-red-600;
+}
+
+[data-slot="toast-title"] {
+  @apply text-sm font-semibold;
+}
+
+[data-slot="toast-description"] {
+  @apply text-sm opacity-90;
+}

package/components/toggle-group.css

@@ -0,0 +1,25 @@
+/* Toggle Group Component Styles */
+
+[data-slot="toggle-group"] {
+  @apply inline-flex items-center justify-center gap-1 rounded-md;
+}
+
+[data-slot="toggle-group-item"] {
+  @apply inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors hover:bg-muted hover:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground;
+}
+
+[data-slot="toggle-group-item"][data-variant="outline"] {
+  @apply border border-input bg-transparent hover:bg-accent hover:text-accent-foreground;
+}
+
+[data-slot="toggle-group-item"][data-size="default"] {
+  @apply h-10 px-3;
+}
+
+[data-slot="toggle-group-item"][data-size="sm"] {
+  @apply h-9 px-2.5;
+}
+
+[data-slot="toggle-group-item"][data-size="lg"] {
+  @apply h-11 px-5;
+}

package/components/toggle.css

@@ -0,0 +1,21 @@
+/* Toggle Component Styles */
+
+[data-slot="toggle"] {
+  @apply inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors hover:bg-muted hover:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground;
+}
+
+[data-slot="toggle"][data-variant="outline"] {
+  @apply border border-input bg-transparent hover:bg-accent hover:text-accent-foreground;
+}
+
+[data-slot="toggle"][data-size="default"] {
+  @apply h-10 px-3;
+}
+
+[data-slot="toggle"][data-size="sm"] {
+  @apply h-9 px-2.5;
+}
+
+[data-slot="toggle"][data-size="lg"] {
+  @apply h-11 px-5;
+}

package/components/toolbar.css

@@ -0,0 +1,25 @@
+/* Toolbar Component Styles */
+
+[data-slot="toolbar"] {
+  @apply inline-flex h-10 items-center gap-1 rounded-md border bg-background p-1;
+}
+
+[data-slot="toolbar-button"] {
+  @apply inline-flex items-center justify-center rounded-md px-3 text-sm font-medium ring-offset-background transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50;
+}
+
+[data-slot="toolbar-link"] {
+  @apply inline-flex items-center justify-center rounded-md px-3 text-sm font-medium text-muted-foreground underline-offset-4 ring-offset-background transition-colors hover:text-foreground hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2;
+}
+
+[data-slot="toolbar-separator"] {
+  @apply mx-1 h-5 w-px bg-border;
+}
+
+[data-slot="toolbar-toggle-group"] {
+  @apply inline-flex items-center gap-1;
+}
+
+[data-slot="toolbar-toggle-item"] {
+  @apply inline-flex h-8 items-center justify-center rounded-md px-2.5 text-sm font-medium ring-offset-background transition-colors hover:bg-muted hover:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground;
+}

package/components/tooltip.css

@@ -0,0 +1,9 @@
+/* Tooltip Component Styles */
+
+[data-slot="tooltip-content"] {
+  @apply z-50 overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2;
+}
+
+[data-slot="tooltip-arrow"] {
+  @apply absolute h-2 w-2 rotate-45 border bg-popover shadow-sm;
+}

package/package.json

@@ -0,0 +1,85 @@
+{
+  "name": "@nexa-ui-kit/theme-default",
+  "version": "1.0.0",
+  "description": "Default theme for Nexa UI components",
+  "license": "MIT",
+  "type": "commonjs",
+  "publishConfig": {
+    "access": "public"
+  },
+  "main": "./tokens/index.css",
+  "exports": {
+    ".": "./tokens/index.css",
+    "./tokens": "./tokens/index.css",
+    "./tokens/index.css": "./tokens/index.css",
+    "./tokens/colors": "./tokens/colors.css",
+    "./tokens/typography": "./tokens/typography.css",
+    "./tokens/spacing": "./tokens/spacing.css",
+    "./components": "./components/index.css",
+    "./components/index.css": "./components/index.css",
+    "./components/accordion": "./components/accordion.css",
+    "./components/aspect-ratio": "./components/aspect-ratio.css",
+    "./components/avatar": "./components/avatar.css",
+    "./components/badge": "./components/badge.css",
+    "./components/button": "./components/button.css",
+    "./components/calendar": "./components/calendar.css",
+    "./components/card": "./components/card.css",
+    "./components/carousel": "./components/carousel.css",
+    "./components/chart": "./components/chart.css",
+    "./components/checkbox": "./components/checkbox.css",
+    "./components/collapsible": "./components/collapsible.css",
+    "./components/context-menu": "./components/context-menu.css",
+    "./components/dropdown-menu": "./components/dropdown-menu.css",
+    "./components/field": "./components/field.css",
+    "./components/form": "./components/form.css",
+    "./components/hover-card": "./components/hover-card.css",
+    "./components/input-group": "./components/input-group.css",
+    "./components/input": "./components/input.css",
+    "./components/item": "./components/item.css",
+    "./components/kbd": "./components/kbd.css",
+    "./components/label": "./components/label.css",
+    "./components/menubar": "./components/menubar.css",
+    "./components/navigation-menu": "./components/navigation-menu.css",
+    "./components/popover": "./components/popover.css",
+    "./components/progress": "./components/progress.css",
+    "./components/radio-group": "./components/radio-group.css",
+    "./components/separator": "./components/separator.css",
+    "./components/sidebar": "./components/sidebar.css",
+    "./components/skeleton": "./components/skeleton.css",
+    "./components/slider": "./components/slider.css",
+    "./components/spinner": "./components/spinner.css",
+    "./components/switch": "./components/switch.css",
+    "./components/tabs": "./components/tabs.css",
+    "./components/textarea": "./components/textarea.css",
+    "./components/toggle": "./components/toggle.css",
+    "./components/tooltip": "./components/tooltip.css",
+    "./tailwind": "./tailwind.config.mjs"
+  },
+  "files": [
+    "tokens",
+    "components",
+    "tailwind.config.mjs",
+    "README.md"
+  ],
+  "scripts": {
+    "build": "echo 'CSS-only package, no build needed'",
+    "clean": "echo 'Nothing to clean'",
+    "validate": "publint ."
+  },
+  "peerDependencies": {
+    "@nexa-ui-kit/core": "^1.0.0",
+    "tailwindcss": "^4.0.0"
+  },
+  "keywords": [
+    "nexa-ui-kit",
+    "theme",
+    "tailwind",
+    "css",
+    "design-tokens"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/nexa-opensource/nexa-ui-kit.git",
+    "directory": "packages/themes/default"
+  }
+}