kz-design-system 0.0.15 → 0.0.16

package/dist/index-BSUTucuB.d.ts

@@ -0,0 +1,33 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import React__default from 'react';
+import { g as KezelVariant, K as KezelMode, O as OverrideMode } from './enum-V2pNihYX.js';
+
+declare const TOKEN_KEYS: readonly ["color.brand.primary", "color.brand.primary.hover", "color.brand.primary.active", "color.brand.secondary", "color.brand.accent", "color.brand.accent.hover", "color.brand.accent.active", "color.brand.accent.dark", "color.brand.inverse", "color.surface.background", "color.surface.base", "color.surface.raised", "color.surface.sunken", "color.surface.overlay", "color.surface.glass", "color.surface.muted", "color.surface.inverse", "color.text.primary", "color.text.secondary", "color.text.tertiary", "color.text.muted", "color.text.disabled", "color.text.inverse", "color.text.link", "color.text.link.hover", "color.border.subtle", "color.border.default", "color.border.strong", "color.border.focus", "color.border.inverse", "color.status.success", "color.status.success.bg", "color.status.success.border", "color.status.warning", "color.status.warning.bg", "color.status.warning.border", "color.status.error", "color.status.error.bg", "color.status.error.border", "color.status.info", "color.status.info.bg", "color.status.info.border", "shadow.elevation.0", "shadow.elevation.1", "shadow.elevation.2", "shadow.elevation.3", "shadow.elevation.4", "shadow.elevation.5", "shadow.inset.1", "shadow.inset.2", "shadow.focus", "shadow.neumorphic.light", "shadow.neumorphic.dark", "shadow.neumorphic.raised.sm", "shadow.neumorphic.raised.md", "shadow.neumorphic.raised.lg", "shadow.neumorphic.inset.sm", "effect.blur.sm", "effect.blur.md", "effect.blur.lg", "effect.glass.opacity", "effect.glass.border.opacity", "radius.none", "radius.xs", "radius.sm", "radius.md", "radius.lg", "radius.xl", "radius.full", "space.0", "space.1", "space.2", "space.3", "space.4", "space.5", "space.6", "space.8", "space.10", "space.12", "space.16", "space.20", "space.24", "font.family.base", "font.family.mono", "font.size.xs", "font.size.sm", "font.size.md", "font.size.lg", "font.size.xl", "font.size.2xl", "font.size.3xl", "font.weight.regular", "font.weight.medium", "font.weight.semibold", "font.weight.bold", "line.height.sm", "line.height.md", "line.height.lg", "motion.duration.fast", "motion.duration.normal", "motion.duration.slow", "motion.easing.standard", "motion.easing.emphasized", "intent.interactive.bg", "intent.interactive.bg.hover", "intent.interactive.text", "intent.interactive.text.selected", "intent.interactive.shadow", "intent.interactive.shadow.active", "intent.interactive.border", "intent.interactive.radius", "intent.container.bg", "intent.container.border", "intent.container.shadow", "intent.container.radius", "component.sidebar.bg", "component.sidebar.border", "component.sidebar.item.bg", "component.sidebar.item.bg.hover", "component.sidebar.item.bg.active", "component.sidebar.item.text", "component.sidebar.item.text.active", "component.sidebar.indicator", "component.header.bg", "component.header.border", "component.header.text", "component.button.primary.bg", "component.button.primary.bg.hover", "component.button.primary.bg.active", "component.button.primary.text", "component.button.primary.shadow", "component.button.primary.shadow.hover", "component.button.secondary.bg", "component.button.secondary.bg.hover", "component.button.secondary.bg.active", "component.button.secondary.text", "component.button.secondary.shadow", "component.button.secondary.shadow.hover", "component.button.outline.bg", "component.button.outline.bg.hover", "component.button.outline.border", "component.button.outline.text", "component.button.outline.shadow", "component.button.outline.shadow.hover", "component.button.ghost.bg", "component.button.ghost.bg.hover", "component.button.ghost.text", "component.button.success.bg", "component.button.success.bg.hover", "component.button.success.text", "component.button.success.shadow", "component.button.success.shadow.hover", "component.button.warning.bg", "component.button.warning.bg.hover", "component.button.warning.text", "component.button.warning.shadow", "component.button.warning.shadow.hover", "component.button.error.bg", "component.button.error.bg.hover", "component.button.error.text", "component.button.error.shadow", "component.button.error.shadow.hover", "component.button.radius", "component.button.disabled.opacity", "component.button.loading.opacity", "component.toggle-button.default.bg", "component.toggle-button.default.bg.pressed", "component.toggle-button.default.text", "component.toggle-button.default.text.pressed", "component.toggle-button.primary.bg", "component.toggle-button.primary.bg.pressed", "component.toggle-button.primary.text", "component.toggle-button.primary.text.pressed", "component.toggle-button.container.bg", "component.toggle-button.container.bg.pressed", "component.toggle-button.container.text", "component.toggle-button.container.text.pressed", "component.toggle-button.pressed.shadow", "component.toggle-button.track.off.bg", "component.toggle-button.track.on.bg", "component.toggle-button.thumb.bg", "component.toggle-button.thumb.shadow", "component.checkbox.size.sm", "component.checkbox.size.md", "component.checkbox.size.lg", "component.checkbox.radius", "component.checkbox.off.bg", "component.checkbox.off.border", "component.checkbox.off.shadow", "component.checkbox.on.bg", "component.checkbox.on.border", "component.checkbox.on.shadow", "component.checkbox.icon.color", "component.checkbox.disabled.opacity", "component.radio.size.sm", "component.radio.size.md", "component.radio.size.lg", "component.radio.radius", "component.radio.off.bg", "component.radio.off.border", "component.radio.off.shadow", "component.radio.on.bg", "component.radio.on.border", "component.radio.on.shadow", "component.radio.dot.bg", "component.radio.dot.shadow", "component.radio.disabled.opacity", "component.tabs.list.bg", "component.tabs.list.radius", "component.tabs.list.shadow", "component.tabs.list.pill.bg", "component.tabs.trigger.text", "component.tabs.trigger.selected.text", "component.tabs.trigger.selected.underline", "component.tabs.trigger.selected.bg", "component.tabs.trigger.selected.shadow", "component.tabs.trigger.radius", "component.tabs.content.padding", "component.input.bg", "component.input.border", "component.input.border.focus", "component.input.border.disabled", "component.input.text", "component.input.placeholder", "component.input.icon", "component.input.shadow", "component.input.radius", "component.input.container.radius", "component.input.container.border", "component.dropdown.trigger.bg", "component.dropdown.trigger.border", "component.dropdown.trigger.border.open", "component.dropdown.trigger.text", "component.dropdown.trigger.text.selected", "component.dropdown.trigger.shadow", "component.dropdown.trigger.shadow.open", "component.dropdown.trigger.radius", "component.dropdown.trigger.focus.ring", "component.dropdown.content.bg", "component.dropdown.content.border", "component.dropdown.content.shadow", "component.dropdown.content.radius", "component.dropdown.item.text", "component.dropdown.item.text.selected", "component.dropdown.item.bg.hover", "component.nav-button.icon", "component.nav-button.text", "component.nav-button.gap", "component.nav-button.chevron", "component.nav-button.hover.bg", "component.nav-button.selected.bg", "component.nav-button.selected.shadow", "component.nav-button.selected.icon", "component.nav-button.selected.text", "component.nav-button.radius", "component.nav-dropdown.menu.bg", "component.nav-dropdown.menu.shadow", "component.nav-dropdown.menu.radius", "component.nav-dropdown.option.text", "component.nav-dropdown.option.hover.bg", "component.sidesheet.bg", "component.sidesheet.width", "component.sidesheet.border", "component.sidemenu.bg", "component.sidemenu.border", "component.sidemenu.shadow", "component.sidemenu.section.label.text", "component.sidemenu.item.text", "component.sidemenu.item.bg.hover", "component.sidemenu.item.bg.active", "component.sidemenu.item.active.text", "component.sidemenu.item.active.link.bg", "component.sidemenu.item.active.link.shadow", "component.sidemenu.group.indent.bg", "component.sidemenu.gap", "component.sidemenu.icon.gap", "component.tooltip.bg", "component.tooltip.text", "component.tooltip.border", "component.tooltip.shadow", "component.tooltip.radius", "component.tooltip.padding.sm", "component.tooltip.padding.md", "component.tooltip.padding.lg", "component.tooltip.maxWidth.sm", "component.tooltip.maxWidth.md", "component.tooltip.maxWidth.lg", "component.tooltip.inverse.bg", "component.tooltip.inverse.text", "component.tooltip.success.bg", "component.tooltip.success.text", "component.tooltip.warning.bg", "component.tooltip.warning.text", "component.tooltip.error.bg", "component.tooltip.error.text", "component.card.bg", "component.card.border", "component.card.shadow", "component.card.radius", "component.canvas.bg", "component.canvas.grid.line", "component.tile.bg", "component.tile.border", "component.tile.shadow", "component.tile.header.bg", "component.tile.header.text", "component.table.surface", "component.table.header.bg", "component.table.header.border", "component.table.row.border", "component.table.row.hover.bg", "component.table.sticky.row.top", "component.table.footer.bg", "component.table.pagination.bg", "component.table.pagination.active.bg", "component.table.pagination.active.shadow", "component.table.pagination.hover.shadow", "component.filter.panel.bg", "component.filter.panel.border", "component.filter.label.text", "component.filter.control.bg", "component.filter.control.border", "typography.error.color", "typography.success.color", "typography.warning.color"];
+type TokenKey = (typeof TOKEN_KEYS)[number];
+
+type TokenOverrides = Partial<Record<TokenKey, string>>;
+
+interface KezelThemeProviderProps {
+    children: React__default.ReactNode;
+    variant?: KezelVariant;
+    mode?: KezelMode;
+    /** Overrides applied to all variant+mode combinations */
+    tokens?: TokenOverrides;
+    /** Overrides applied only in light mode */
+    lightTokens?: TokenOverrides;
+    /** Overrides applied only in dark mode */
+    darkTokens?: TokenOverrides;
+    /** Overrides applied only when variant is standard */
+    standardTokens?: TokenOverrides;
+    /** Overrides applied only when variant is neumorphic */
+    neumorphicTokens?: TokenOverrides;
+    /**
+     * Overrides scoped to a specific variant+mode pair.
+     * e.g. { "standard.dark": { "color.surface.base": "#111" } }
+     */
+    variantModeTokens?: Partial<Record<`${KezelVariant}.${KezelMode}`, TokenOverrides>>;
+    validation?: OverrideMode;
+}
+declare function KezelThemeProvider({ children, variant, mode, tokens, lightTokens, darkTokens, standardTokens, neumorphicTokens, variantModeTokens, validation, }: KezelThemeProviderProps): react_jsx_runtime.JSX.Element;
+
+export { KezelThemeProvider as K, type TokenKey as T, type KezelThemeProviderProps as a, TOKEN_KEYS as b };

package/dist/index-Dsxf7W2Q.d.mts

@@ -0,0 +1,33 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import React__default from 'react';
+import { g as KezelVariant, K as KezelMode, O as OverrideMode } from './enum-V2pNihYX.mjs';
+
+declare const TOKEN_KEYS: readonly ["color.brand.primary", "color.brand.primary.hover", "color.brand.primary.active", "color.brand.secondary", "color.brand.accent", "color.brand.accent.hover", "color.brand.accent.active", "color.brand.accent.dark", "color.brand.inverse", "color.surface.background", "color.surface.base", "color.surface.raised", "color.surface.sunken", "color.surface.overlay", "color.surface.glass", "color.surface.muted", "color.surface.inverse", "color.text.primary", "color.text.secondary", "color.text.tertiary", "color.text.muted", "color.text.disabled", "color.text.inverse", "color.text.link", "color.text.link.hover", "color.border.subtle", "color.border.default", "color.border.strong", "color.border.focus", "color.border.inverse", "color.status.success", "color.status.success.bg", "color.status.success.border", "color.status.warning", "color.status.warning.bg", "color.status.warning.border", "color.status.error", "color.status.error.bg", "color.status.error.border", "color.status.info", "color.status.info.bg", "color.status.info.border", "shadow.elevation.0", "shadow.elevation.1", "shadow.elevation.2", "shadow.elevation.3", "shadow.elevation.4", "shadow.elevation.5", "shadow.inset.1", "shadow.inset.2", "shadow.focus", "shadow.neumorphic.light", "shadow.neumorphic.dark", "shadow.neumorphic.raised.sm", "shadow.neumorphic.raised.md", "shadow.neumorphic.raised.lg", "shadow.neumorphic.inset.sm", "effect.blur.sm", "effect.blur.md", "effect.blur.lg", "effect.glass.opacity", "effect.glass.border.opacity", "radius.none", "radius.xs", "radius.sm", "radius.md", "radius.lg", "radius.xl", "radius.full", "space.0", "space.1", "space.2", "space.3", "space.4", "space.5", "space.6", "space.8", "space.10", "space.12", "space.16", "space.20", "space.24", "font.family.base", "font.family.mono", "font.size.xs", "font.size.sm", "font.size.md", "font.size.lg", "font.size.xl", "font.size.2xl", "font.size.3xl", "font.weight.regular", "font.weight.medium", "font.weight.semibold", "font.weight.bold", "line.height.sm", "line.height.md", "line.height.lg", "motion.duration.fast", "motion.duration.normal", "motion.duration.slow", "motion.easing.standard", "motion.easing.emphasized", "intent.interactive.bg", "intent.interactive.bg.hover", "intent.interactive.text", "intent.interactive.text.selected", "intent.interactive.shadow", "intent.interactive.shadow.active", "intent.interactive.border", "intent.interactive.radius", "intent.container.bg", "intent.container.border", "intent.container.shadow", "intent.container.radius", "component.sidebar.bg", "component.sidebar.border", "component.sidebar.item.bg", "component.sidebar.item.bg.hover", "component.sidebar.item.bg.active", "component.sidebar.item.text", "component.sidebar.item.text.active", "component.sidebar.indicator", "component.header.bg", "component.header.border", "component.header.text", "component.button.primary.bg", "component.button.primary.bg.hover", "component.button.primary.bg.active", "component.button.primary.text", "component.button.primary.shadow", "component.button.primary.shadow.hover", "component.button.secondary.bg", "component.button.secondary.bg.hover", "component.button.secondary.bg.active", "component.button.secondary.text", "component.button.secondary.shadow", "component.button.secondary.shadow.hover", "component.button.outline.bg", "component.button.outline.bg.hover", "component.button.outline.border", "component.button.outline.text", "component.button.outline.shadow", "component.button.outline.shadow.hover", "component.button.ghost.bg", "component.button.ghost.bg.hover", "component.button.ghost.text", "component.button.success.bg", "component.button.success.bg.hover", "component.button.success.text", "component.button.success.shadow", "component.button.success.shadow.hover", "component.button.warning.bg", "component.button.warning.bg.hover", "component.button.warning.text", "component.button.warning.shadow", "component.button.warning.shadow.hover", "component.button.error.bg", "component.button.error.bg.hover", "component.button.error.text", "component.button.error.shadow", "component.button.error.shadow.hover", "component.button.radius", "component.button.disabled.opacity", "component.button.loading.opacity", "component.toggle-button.default.bg", "component.toggle-button.default.bg.pressed", "component.toggle-button.default.text", "component.toggle-button.default.text.pressed", "component.toggle-button.primary.bg", "component.toggle-button.primary.bg.pressed", "component.toggle-button.primary.text", "component.toggle-button.primary.text.pressed", "component.toggle-button.container.bg", "component.toggle-button.container.bg.pressed", "component.toggle-button.container.text", "component.toggle-button.container.text.pressed", "component.toggle-button.pressed.shadow", "component.toggle-button.track.off.bg", "component.toggle-button.track.on.bg", "component.toggle-button.thumb.bg", "component.toggle-button.thumb.shadow", "component.checkbox.size.sm", "component.checkbox.size.md", "component.checkbox.size.lg", "component.checkbox.radius", "component.checkbox.off.bg", "component.checkbox.off.border", "component.checkbox.off.shadow", "component.checkbox.on.bg", "component.checkbox.on.border", "component.checkbox.on.shadow", "component.checkbox.icon.color", "component.checkbox.disabled.opacity", "component.radio.size.sm", "component.radio.size.md", "component.radio.size.lg", "component.radio.radius", "component.radio.off.bg", "component.radio.off.border", "component.radio.off.shadow", "component.radio.on.bg", "component.radio.on.border", "component.radio.on.shadow", "component.radio.dot.bg", "component.radio.dot.shadow", "component.radio.disabled.opacity", "component.tabs.list.bg", "component.tabs.list.radius", "component.tabs.list.shadow", "component.tabs.list.pill.bg", "component.tabs.trigger.text", "component.tabs.trigger.selected.text", "component.tabs.trigger.selected.underline", "component.tabs.trigger.selected.bg", "component.tabs.trigger.selected.shadow", "component.tabs.trigger.radius", "component.tabs.content.padding", "component.input.bg", "component.input.border", "component.input.border.focus", "component.input.border.disabled", "component.input.text", "component.input.placeholder", "component.input.icon", "component.input.shadow", "component.input.radius", "component.input.container.radius", "component.input.container.border", "component.dropdown.trigger.bg", "component.dropdown.trigger.border", "component.dropdown.trigger.border.open", "component.dropdown.trigger.text", "component.dropdown.trigger.text.selected", "component.dropdown.trigger.shadow", "component.dropdown.trigger.shadow.open", "component.dropdown.trigger.radius", "component.dropdown.trigger.focus.ring", "component.dropdown.content.bg", "component.dropdown.content.border", "component.dropdown.content.shadow", "component.dropdown.content.radius", "component.dropdown.item.text", "component.dropdown.item.text.selected", "component.dropdown.item.bg.hover", "component.nav-button.icon", "component.nav-button.text", "component.nav-button.gap", "component.nav-button.chevron", "component.nav-button.hover.bg", "component.nav-button.selected.bg", "component.nav-button.selected.shadow", "component.nav-button.selected.icon", "component.nav-button.selected.text", "component.nav-button.radius", "component.nav-dropdown.menu.bg", "component.nav-dropdown.menu.shadow", "component.nav-dropdown.menu.radius", "component.nav-dropdown.option.text", "component.nav-dropdown.option.hover.bg", "component.sidesheet.bg", "component.sidesheet.width", "component.sidesheet.border", "component.sidemenu.bg", "component.sidemenu.border", "component.sidemenu.shadow", "component.sidemenu.section.label.text", "component.sidemenu.item.text", "component.sidemenu.item.bg.hover", "component.sidemenu.item.bg.active", "component.sidemenu.item.active.text", "component.sidemenu.item.active.link.bg", "component.sidemenu.item.active.link.shadow", "component.sidemenu.group.indent.bg", "component.sidemenu.gap", "component.sidemenu.icon.gap", "component.tooltip.bg", "component.tooltip.text", "component.tooltip.border", "component.tooltip.shadow", "component.tooltip.radius", "component.tooltip.padding.sm", "component.tooltip.padding.md", "component.tooltip.padding.lg", "component.tooltip.maxWidth.sm", "component.tooltip.maxWidth.md", "component.tooltip.maxWidth.lg", "component.tooltip.inverse.bg", "component.tooltip.inverse.text", "component.tooltip.success.bg", "component.tooltip.success.text", "component.tooltip.warning.bg", "component.tooltip.warning.text", "component.tooltip.error.bg", "component.tooltip.error.text", "component.card.bg", "component.card.border", "component.card.shadow", "component.card.radius", "component.canvas.bg", "component.canvas.grid.line", "component.tile.bg", "component.tile.border", "component.tile.shadow", "component.tile.header.bg", "component.tile.header.text", "component.table.surface", "component.table.header.bg", "component.table.header.border", "component.table.row.border", "component.table.row.hover.bg", "component.table.sticky.row.top", "component.table.footer.bg", "component.table.pagination.bg", "component.table.pagination.active.bg", "component.table.pagination.active.shadow", "component.table.pagination.hover.shadow", "component.filter.panel.bg", "component.filter.panel.border", "component.filter.label.text", "component.filter.control.bg", "component.filter.control.border", "typography.error.color", "typography.success.color", "typography.warning.color"];
+type TokenKey = (typeof TOKEN_KEYS)[number];
+
+type TokenOverrides = Partial<Record<TokenKey, string>>;
+
+interface KezelThemeProviderProps {
+    children: React__default.ReactNode;
+    variant?: KezelVariant;
+    mode?: KezelMode;
+    /** Overrides applied to all variant+mode combinations */
+    tokens?: TokenOverrides;
+    /** Overrides applied only in light mode */
+    lightTokens?: TokenOverrides;
+    /** Overrides applied only in dark mode */
+    darkTokens?: TokenOverrides;
+    /** Overrides applied only when variant is standard */
+    standardTokens?: TokenOverrides;
+    /** Overrides applied only when variant is neumorphic */
+    neumorphicTokens?: TokenOverrides;
+    /**
+     * Overrides scoped to a specific variant+mode pair.
+     * e.g. { "standard.dark": { "color.surface.base": "#111" } }
+     */
+    variantModeTokens?: Partial<Record<`${KezelVariant}.${KezelMode}`, TokenOverrides>>;
+    validation?: OverrideMode;
+}
+declare function KezelThemeProvider({ children, variant, mode, tokens, lightTokens, darkTokens, standardTokens, neumorphicTokens, variantModeTokens, validation, }: KezelThemeProviderProps): react_jsx_runtime.JSX.Element;
+
+export { KezelThemeProvider as K, type TokenKey as T, type KezelThemeProviderProps as a, TOKEN_KEYS as b };

package/dist/index.d.mts

@@ -10,13 +10,14 @@ export { NumberInput, NumberInputProps } from './number-input.mjs';
 export { Sidesheet, SidesheetProps } from './sidesheet.mjs';
 export { SideMenu, SideMenuFlyoutSide, SideMenuGroupItem, SideMenuGroupItemSubItem, SideMenuGroupNode, SideMenuLinkNode, SideMenuNavigatePayload, SideMenuNode, SideMenuProps, SideMenuSectionNode } from './sidemenu.mjs';
 export { Tooltip, TooltipProps } from './tooltip.mjs';
-export { Tabs, TabsContent, TabsContentProps, TabsList, TabsListProps, TabsProps, TabsSize, TabsTrigger, TabsTriggerProps, TabsVariant } from './tabs.mjs';
+export { SubTabOption, SubTabsTrigger, SubTabsTriggerProps, Tabs, TabsContent, TabsContentProps, TabsList, TabsListProps, TabsProps, TabsSize, TabsTrigger, TabsTriggerProps, TabsVariant } from './tabs.mjs';
 export { SortDirection, Table, TableAlign, TableCellChange, TableColumn, TablePaginationState, TableProps, TableSize, TableSortState } from './table.mjs';
+import * as React from 'react';
 export { Icon, IconProps, IconSizeKey, iconSize, iconSize as size } from './icon.mjs';
 export { Dropdown, DropdownButton, DropdownButtonItem, DropdownButtonProps, DropdownButtonTrigger, DropdownCheckboxItem, DropdownContent, DropdownItem, DropdownLabel, DropdownRadioGroup, DropdownRadioItem, DropdownSeparator, DropdownSub, DropdownSubContent, DropdownSubTrigger, DropdownTrigger, DropdownTriggerProps } from './dropdown.mjs';
 export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from './dialog.mjs';
-import { T as TokenKey } from './index-DtyyDD13.mjs';
-export { K as KezelThemeProvider, a as KezelThemeProviderProps, b as TOKEN_KEYS } from './index-DtyyDD13.mjs';
+import { T as TokenKey } from './index-Dsxf7W2Q.mjs';
+export { K as KezelThemeProvider, a as KezelThemeProviderProps, b as TOKEN_KEYS } from './index-Dsxf7W2Q.mjs';
 export { Avatar, AvatarProps, AvatarVariants, avatarVariants } from './avatar.mjs';
 export { Calendar, CalendarProps, DateTimePicker, DateTimePickerFormat, DateTimePickerMode, DateTimePickerProps, TimeSelector, TimeSelectorProps } from './date-time-picker.mjs';
 export { DateRange, DateRangePicker, DateRangePickerProps } from './date-range-picker.mjs';
@@ -31,8 +32,9 @@ export { ToastContextValue, ToastData, ToastProvider, Toaster, ToasterProps, use
 export { Card, CardPadding, CardProps, CardSize } from './card.mjs';
 export { SqlEditor, SqlEditorProps, SqlEditorQueryResult, SqlEditorSize } from './sql-editor.mjs';
 export { QrErrorCorrectionLevel, QrPatternStyle, QrRenderer, QrRendererDataProps, QrRendererDebugInfo, QrRendererImageProps, QrRendererProps } from './qr-renderer.mjs';
+export { Loader, LoaderProps, LoaderSize, LoaderVariant } from './loader.mjs';
+export { CardSkeleton, CardSkeletonLayout, CardSkeletonProps, Skeleton, SkeletonProps, SkeletonVariant, TableSkeleton, TableSkeletonProps, TableSkeletonSize } from './skeleton.mjs';
 export { I as IconName, i as iconRegistry } from './icon-registry-YZFYW-mt.mjs';
-import 'react';
 import 'class-variance-authority/types';
 import 'class-variance-authority';
 import '@radix-ui/react-tabs';
@@ -41,6 +43,27 @@ import 'react/jsx-runtime';
 import '@radix-ui/react-dialog';
 import 'lucide-react';
 
+interface PaginationProps {
+    /** Current active page (1-based). */
+    page: number;
+    /** Total number of items. */
+    total: number;
+    /** Items per page. */
+    pageSize: number;
+    /** Called when user changes page. */
+    onPageChange: (page: number) => void;
+    /** Called when user changes page size. */
+    onPageSizeChange?: (pageSize: number) => void;
+    /** Available page size options for the dropdown. */
+    pageSizeOptions?: number[];
+    /** Show the "X–Y of Z" item range text. @default true */
+    showItemRange?: boolean;
+    /** Additional className on the root element. */
+    className?: string;
+}
+
+declare const Pagination: React.ForwardRefExoticComponent<PaginationProps & React.RefAttributes<HTMLDivElement>>;
+
 declare const tokenToCssVar: Record<TokenKey, `--kz-${string}`>;
 
-export { TokenKey, tokenToCssVar };
+export { Pagination, type PaginationProps, TokenKey, tokenToCssVar };

package/dist/index.d.ts

@@ -10,13 +10,14 @@ export { NumberInput, NumberInputProps } from './number-input.js';
 export { Sidesheet, SidesheetProps } from './sidesheet.js';
 export { SideMenu, SideMenuFlyoutSide, SideMenuGroupItem, SideMenuGroupItemSubItem, SideMenuGroupNode, SideMenuLinkNode, SideMenuNavigatePayload, SideMenuNode, SideMenuProps, SideMenuSectionNode } from './sidemenu.js';
 export { Tooltip, TooltipProps } from './tooltip.js';
-export { Tabs, TabsContent, TabsContentProps, TabsList, TabsListProps, TabsProps, TabsSize, TabsTrigger, TabsTriggerProps, TabsVariant } from './tabs.js';
+export { SubTabOption, SubTabsTrigger, SubTabsTriggerProps, Tabs, TabsContent, TabsContentProps, TabsList, TabsListProps, TabsProps, TabsSize, TabsTrigger, TabsTriggerProps, TabsVariant } from './tabs.js';
 export { SortDirection, Table, TableAlign, TableCellChange, TableColumn, TablePaginationState, TableProps, TableSize, TableSortState } from './table.js';
+import * as React from 'react';
 export { Icon, IconProps, IconSizeKey, iconSize, iconSize as size } from './icon.js';
 export { Dropdown, DropdownButton, DropdownButtonItem, DropdownButtonProps, DropdownButtonTrigger, DropdownCheckboxItem, DropdownContent, DropdownItem, DropdownLabel, DropdownRadioGroup, DropdownRadioItem, DropdownSeparator, DropdownSub, DropdownSubContent, DropdownSubTrigger, DropdownTrigger, DropdownTriggerProps } from './dropdown.js';
 export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from './dialog.js';
-import { T as TokenKey } from './index-lDcCyLuv.js';
-export { K as KezelThemeProvider, a as KezelThemeProviderProps, b as TOKEN_KEYS } from './index-lDcCyLuv.js';
+import { T as TokenKey } from './index-BSUTucuB.js';
+export { K as KezelThemeProvider, a as KezelThemeProviderProps, b as TOKEN_KEYS } from './index-BSUTucuB.js';
 export { Avatar, AvatarProps, AvatarVariants, avatarVariants } from './avatar.js';
 export { Calendar, CalendarProps, DateTimePicker, DateTimePickerFormat, DateTimePickerMode, DateTimePickerProps, TimeSelector, TimeSelectorProps } from './date-time-picker.js';
 export { DateRange, DateRangePicker, DateRangePickerProps } from './date-range-picker.js';
@@ -31,8 +32,9 @@ export { ToastContextValue, ToastData, ToastProvider, Toaster, ToasterProps, use
 export { Card, CardPadding, CardProps, CardSize } from './card.js';
 export { SqlEditor, SqlEditorProps, SqlEditorQueryResult, SqlEditorSize } from './sql-editor.js';
 export { QrErrorCorrectionLevel, QrPatternStyle, QrRenderer, QrRendererDataProps, QrRendererDebugInfo, QrRendererImageProps, QrRendererProps } from './qr-renderer.js';
+export { Loader, LoaderProps, LoaderSize, LoaderVariant } from './loader.js';
+export { CardSkeleton, CardSkeletonLayout, CardSkeletonProps, Skeleton, SkeletonProps, SkeletonVariant, TableSkeleton, TableSkeletonProps, TableSkeletonSize } from './skeleton.js';
 export { I as IconName, i as iconRegistry } from './icon-registry-YZFYW-mt.js';
-import 'react';
 import 'class-variance-authority/types';
 import 'class-variance-authority';
 import '@radix-ui/react-tabs';
@@ -41,6 +43,27 @@ import 'react/jsx-runtime';
 import '@radix-ui/react-dialog';
 import 'lucide-react';
 
+interface PaginationProps {
+    /** Current active page (1-based). */
+    page: number;
+    /** Total number of items. */
+    total: number;
+    /** Items per page. */
+    pageSize: number;
+    /** Called when user changes page. */
+    onPageChange: (page: number) => void;
+    /** Called when user changes page size. */
+    onPageSizeChange?: (pageSize: number) => void;
+    /** Available page size options for the dropdown. */
+    pageSizeOptions?: number[];
+    /** Show the "X–Y of Z" item range text. @default true */
+    showItemRange?: boolean;
+    /** Additional className on the root element. */
+    className?: string;
+}
+
+declare const Pagination: React.ForwardRefExoticComponent<PaginationProps & React.RefAttributes<HTMLDivElement>>;
+
 declare const tokenToCssVar: Record<TokenKey, `--kz-${string}`>;
 
-export { TokenKey, tokenToCssVar };
+export { Pagination, type PaginationProps, TokenKey, tokenToCssVar };