@vertz/theme-shadcn 0.2.38 → 0.2.42

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/base.d.ts CHANGED
@@ -17,12 +17,11 @@ interface ThemeConfig {
17
17
  radius?: "sm" | "md" | "lg";
18
18
  /** Visual style preset. Default: 'nova'. */
19
19
  style?: ThemeStyle;
20
- /** Token overrides — deep-merged into the selected palette. */
21
- overrides?: {
22
- tokens?: {
23
- colors?: Record<string, Record<string, string> | undefined>;
24
- };
25
- };
20
+ /**
21
+ * Color token overrides — deep-merged into the selected palette.
22
+ * @example colors: { primary: { DEFAULT: 'oklch(0.55 0.2 260)', _dark: 'oklch(0.65 0.25 260)' } }
23
+ */
24
+ colors?: Record<string, Record<string, string> | undefined>;
26
25
  }
27
26
  /** Return type of configureThemeBase(). */
28
27
  interface ResolvedThemeBase {
package/dist/base.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  RADIUS_VALUES,
3
3
  configureThemeBase
4
- } from "./shared/chunk-f0wk9320.js";
4
+ } from "./shared/chunk-58ghrcqw.js";
5
5
  export {
6
6
  configureThemeBase,
7
7
  RADIUS_VALUES
package/dist/index.d.ts CHANGED
@@ -20,12 +20,11 @@ interface ThemeConfig {
20
20
  radius?: "sm" | "md" | "lg";
21
21
  /** Visual style preset. Default: 'nova'. */
22
22
  style?: ThemeStyle;
23
- /** Token overrides — deep-merged into the selected palette. */
24
- overrides?: {
25
- tokens?: {
26
- colors?: Record<string, Record<string, string> | undefined>;
27
- };
28
- };
23
+ /**
24
+ * Color token overrides — deep-merged into the selected palette.
25
+ * @example colors: { primary: { DEFAULT: 'oklch(0.55 0.2 260)', _dark: 'oklch(0.65 0.25 260)' } }
26
+ */
27
+ colors?: Record<string, Record<string, string> | undefined>;
29
28
  }
30
29
  /** Return type of configureThemeBase(). */
31
30
  interface ResolvedThemeBase {
@@ -1212,7 +1211,7 @@ interface ResolvedTheme extends ResolvedThemeBase {
1212
1211
  /**
1213
1212
  * Configure the shadcn theme.
1214
1213
  *
1215
- * Single entry point — selects palette, applies overrides, builds globals, styles, and components.
1214
+ * Single entry point — selects palette, applies color overrides, builds globals, styles, and components.
1216
1215
  *
1217
1216
  * For a lightweight alternative that only returns `{ theme, globals }` without
1218
1217
  * component styles, use `configureThemeBase()` from `@vertz/theme-shadcn/base`.
package/dist/index.js CHANGED
@@ -10,7 +10,7 @@ import {
10
10
  RADIUS_VALUES,
11
11
  configureThemeBase,
12
12
  palettes
13
- } from "./shared/chunk-f0wk9320.js";
13
+ } from "./shared/chunk-58ghrcqw.js";
14
14
  // src/configure.ts
15
15
  import { injectCSS as injectCSS2 } from "@vertz/ui";
16
16
  import {
@@ -266,7 +266,7 @@ function createThemedDialog() {
266
266
  }
267
267
 
268
268
  // src/components/primitives/drawer.tsx
269
- import { __discardMountFrame, __element, __enterChildren, __exitChildren, __flushMountFrame, __insert, __pushMountFrame } from "@vertz/ui/internals";
269
+ import { jsxDEV as jsxDEV_7x81h0kn } from "@vertz/ui/jsx-dev-runtime";
270
270
  import { resolveChildren } from "@vertz/ui";
271
271
  import { ComposedSheet } from "@vertz/ui-primitives";
272
272
  var PANEL_CLASS_MAP = {
@@ -276,86 +276,59 @@ var PANEL_CLASS_MAP = {
276
276
  bottom: "panelBottom"
277
277
  };
278
278
  function createThemedDrawer(styles) {
279
- const __mfDepth = __pushMountFrame();
280
- try {
281
- let DrawerRoot = function({ children, side, onOpenChange }) {
282
- const resolvedSide = side ?? "bottom";
283
- const panelClass = styles[PANEL_CLASS_MAP[resolvedSide]];
284
- return ComposedSheet({
285
- children,
286
- side: resolvedSide,
287
- onOpenChange,
288
- classes: {
289
- overlay: styles.overlay,
290
- content: panelClass,
291
- title: styles.title,
292
- description: styles.description,
293
- close: styles.close
294
- }
295
- });
296
- }, DrawerHeader = function({ children, className: cls, class: classProp }) {
297
- const effectiveCls = cls ?? classProp;
298
- const combined = [styles.header, effectiveCls].filter(Boolean).join(" ");
299
- const resolved = resolveChildren(children);
300
- return (() => {
301
- const __el0 = __element("div");
302
- __el0.setAttribute("data-slot", "drawer-header");
303
- {
304
- const __v = combined;
305
- if (__v != null && __v !== false)
306
- __el0.setAttribute("class", __v === true ? "" : __v);
307
- }
308
- __enterChildren(__el0);
309
- __insert(__el0, resolved);
310
- __exitChildren();
311
- return __el0;
312
- })();
313
- }, DrawerFooter = function({ children, className: cls, class: classProp }) {
314
- const effectiveCls = cls ?? classProp;
315
- const combined = [styles.footer, effectiveCls].filter(Boolean).join(" ");
316
- const resolved = resolveChildren(children);
317
- return (() => {
318
- const __el1 = __element("div");
319
- __el1.setAttribute("data-slot", "drawer-footer");
320
- {
321
- const __v = combined;
322
- if (__v != null && __v !== false)
323
- __el1.setAttribute("class", __v === true ? "" : __v);
324
- }
325
- __enterChildren(__el1);
326
- __insert(__el1, resolved);
327
- __exitChildren();
328
- return __el1;
329
- })();
330
- }, DrawerHandle = function({ className: cls, class: classProp }) {
331
- const effectiveCls = cls ?? classProp;
332
- const combined = [styles.handle, effectiveCls].filter(Boolean).join(" ");
333
- return (() => {
334
- const __el2 = __element("div");
335
- __el2.setAttribute("data-slot", "drawer-handle");
336
- {
337
- const __v = combined;
338
- if (__v != null && __v !== false)
339
- __el2.setAttribute("class", __v === true ? "" : __v);
340
- }
341
- return __el2;
342
- })();
343
- };
344
- const __mfResult0 = Object.assign(DrawerRoot, {
345
- Trigger: ComposedSheet.Trigger,
346
- Content: ComposedSheet.Content,
347
- Header: DrawerHeader,
348
- Title: ComposedSheet.Title,
349
- Description: ComposedSheet.Description,
350
- Footer: DrawerFooter,
351
- Handle: DrawerHandle
279
+ function DrawerRoot({ children, side, onOpenChange }) {
280
+ const resolvedSide = side ?? "bottom";
281
+ const panelClass = styles[PANEL_CLASS_MAP[resolvedSide]];
282
+ return ComposedSheet({
283
+ children,
284
+ side: resolvedSide,
285
+ onOpenChange,
286
+ classes: {
287
+ overlay: styles.overlay,
288
+ content: panelClass,
289
+ title: styles.title,
290
+ description: styles.description,
291
+ close: styles.close
292
+ }
352
293
  });
353
- __flushMountFrame();
354
- return __mfResult0;
355
- } catch (__mfErr) {
356
- __discardMountFrame(__mfDepth);
357
- throw __mfErr;
358
294
  }
295
+ function DrawerHeader({ children, className: cls, class: classProp }) {
296
+ const effectiveCls = cls ?? classProp;
297
+ const combined = [styles.header, effectiveCls].filter(Boolean).join(" ");
298
+ const resolved = resolveChildren(children);
299
+ return jsxDEV_7x81h0kn("div", {
300
+ "data-slot": "drawer-header",
301
+ class: combined,
302
+ children: [...resolved]
303
+ }, undefined, true, undefined, this);
304
+ }
305
+ function DrawerFooter({ children, className: cls, class: classProp }) {
306
+ const effectiveCls = cls ?? classProp;
307
+ const combined = [styles.footer, effectiveCls].filter(Boolean).join(" ");
308
+ const resolved = resolveChildren(children);
309
+ return jsxDEV_7x81h0kn("div", {
310
+ "data-slot": "drawer-footer",
311
+ class: combined,
312
+ children: [...resolved]
313
+ }, undefined, true, undefined, this);
314
+ }
315
+ function DrawerHandle({ className: cls, class: classProp }) {
316
+ const effectiveCls = cls ?? classProp;
317
+ const combined = [styles.handle, effectiveCls].filter(Boolean).join(" ");
318
+ return jsxDEV_7x81h0kn("div", {
319
+ "data-slot": "drawer-handle",
320
+ class: combined
321
+ }, undefined, false, undefined, this);
322
+ }
323
+ return Object.assign(DrawerRoot, {
324
+ Trigger: ComposedSheet.Trigger,
325
+ Content: ComposedSheet.Content,
326
+ Header: DrawerHeader,
327
+ Title: ComposedSheet.Title,
328
+ Description: ComposedSheet.Description,
329
+ Footer: DrawerFooter,
330
+ Handle: DrawerHandle
331
+ });
359
332
  }
360
333
 
361
334
  // src/components/primitives/dropdown-menu.ts
@@ -3864,11 +3837,11 @@ function configureTheme(config) {
3864
3837
  function defineLazyStyle(key, factory) {
3865
3838
  Object.defineProperty(styles, key, {
3866
3839
  get() {
3867
- const result2 = getOrInit(key, factory);
3868
- const cssText = result2.css;
3840
+ const result = getOrInit(key, factory);
3841
+ const cssText = result.css;
3869
3842
  if (cssText)
3870
3843
  injectCSS2(cssText);
3871
- return result2;
3844
+ return result;
3872
3845
  },
3873
3846
  enumerable: true,
3874
3847
  configurable: true
@@ -3919,56 +3892,21 @@ function configureTheme(config) {
3919
3892
  defineLazyStyle("scrollArea", createScrollAreaStyles);
3920
3893
  defineLazyStyle("toggle", createToggleStyles);
3921
3894
  defineLazyStyle("toggleGroup", createToggleGroupStyles);
3922
- let cachedComponents;
3923
- function buildComponents() {
3924
- const alertS = getOrInit("alert", createAlertStyles);
3925
- const buttonS = getOrInit("button", createButton);
3926
- const badgeS = getOrInit("badge", createBadge);
3927
- const cardS = getOrInit("card", createCard);
3928
- const inputS = getOrInit("input", createInput);
3929
- const textareaS = getOrInit("textarea", createTextarea);
3930
- const labelS = getOrInit("label", createLabel);
3931
- const separatorS = getOrInit("separator", createSeparator);
3932
- const formGroupS = getOrInit("formGroup", createFormGroup);
3933
- const breadcrumbS = getOrInit("breadcrumb", createBreadcrumbStyles);
3934
- const paginationS = getOrInit("pagination", createPaginationStyles);
3935
- const avatarS = getOrInit("avatar", createAvatarStyles);
3936
- const emptyStateS = getOrInit("emptyState", createEmptyStateStyles);
3937
- const skeletonS = getOrInit("skeleton", createSkeletonStyles);
3938
- const tableS = getOrInit("table", createTableStyles);
3939
- const dropdownMenuS = getOrInit("dropdownMenu", createDropdownMenuStyles);
3940
- const selectS = getOrInit("select", createSelectStyles);
3941
- const tabsS = getOrInit("tabs", createTabsStyles);
3942
- const checkboxS = getOrInit("checkbox", createCheckboxStyles);
3943
- const switchS = getOrInit("switch", createSwitchStyles);
3944
- const popoverS = getOrInit("popover", createPopoverStyles);
3945
- const progressS = getOrInit("progress", createProgressStyles);
3946
- const radioGroupS = getOrInit("radioGroup", createRadioGroupStyles);
3947
- const sliderS = getOrInit("slider", createSliderStyles);
3948
- const accordionS = getOrInit("accordion", createAccordionStyles);
3949
- const toastS = getOrInit("toast", createToastStyles);
3950
- const tooltipS = getOrInit("tooltip", createTooltipStyles);
3951
- const sheetS = getOrInit("sheet", createSheetStyles);
3952
- const calendarS = getOrInit("calendar", createCalendarStyles);
3953
- const carouselS = getOrInit("carousel", createCarouselStyles);
3954
- const collapsibleS = getOrInit("collapsible", createCollapsibleStyles);
3955
- const commandS = getOrInit("command", createCommandStyles);
3956
- const contextMenuS = getOrInit("contextMenu", createContextMenuStyles);
3957
- const datePickerS = getOrInit("datePicker", createDatePickerStyles);
3958
- const drawerS = getOrInit("drawer", createDrawerStyles);
3959
- const hoverCardS = getOrInit("hoverCard", createHoverCardStyles);
3960
- const listS = getOrInit("list", createListStyles);
3961
- const menubarS = getOrInit("menubar", createMenubarStyles);
3962
- const navigationMenuS = getOrInit("navigationMenu", createNavigationMenuStyles);
3963
- const resizablePanelS = getOrInit("resizablePanel", createResizablePanelStyles);
3964
- const scrollAreaS = getOrInit("scrollArea", createScrollAreaStyles);
3965
- const toggleS = getOrInit("toggle", createToggleStyles);
3966
- const toggleGroupS = getOrInit("toggleGroup", createToggleGroupStyles);
3967
- const badgeColorInlineStyles = {
3968
- blue: { backgroundColor: "oklch(0.55 0.15 250)", color: "#fff" },
3969
- green: { backgroundColor: "oklch(0.55 0.15 155)", color: "#fff" },
3970
- yellow: { backgroundColor: "oklch(0.75 0.15 85)", color: "oklch(0.25 0.05 85)" }
3971
- };
3895
+ const components = {};
3896
+ function lazyComp(key, factory) {
3897
+ let cached;
3898
+ Object.defineProperty(components, key, {
3899
+ get() {
3900
+ if (cached === undefined)
3901
+ cached = factory();
3902
+ return cached;
3903
+ },
3904
+ enumerable: true,
3905
+ configurable: true
3906
+ });
3907
+ }
3908
+ lazyComp("Alert", () => {
3909
+ const alertS = styles.alert;
3972
3910
  const DefaultAlert = withStyles19(ComposedAlert, {
3973
3911
  root: alertS.root,
3974
3912
  title: alertS.title,
@@ -3982,137 +3920,168 @@ function configureTheme(config) {
3982
3920
  function ThemedAlert({ variant, ...rest }) {
3983
3921
  return (variant === "destructive" ? DestructiveAlert : DefaultAlert)(rest);
3984
3922
  }
3985
- const Alert = Object.assign(ThemedAlert, {
3923
+ return Object.assign(ThemedAlert, {
3986
3924
  Title: ComposedAlert.Title,
3987
3925
  Description: ComposedAlert.Description
3988
3926
  });
3989
- return {
3990
- Alert,
3991
- Button: ({ intent, size, ...rest }) => ComposedButton({ ...rest, classes: { base: buttonS({ intent, size }) } }),
3992
- Badge: ({ color, ...rest }) => {
3993
- const style = color ? badgeColorInlineStyles[color] : undefined;
3994
- return ComposedBadge({ ...rest, classes: { base: badgeS({ color }) }, style });
3995
- },
3996
- Breadcrumb: withStyles19(ComposedBreadcrumb, {
3997
- nav: breadcrumbS.nav,
3998
- list: breadcrumbS.list,
3999
- item: breadcrumbS.item,
4000
- link: breadcrumbS.link,
4001
- page: breadcrumbS.page,
4002
- separator: breadcrumbS.separator
4003
- }),
4004
- Card: withStyles19(ComposedCard, {
4005
- root: cardS.root,
4006
- header: cardS.header,
4007
- title: cardS.title,
4008
- description: cardS.description,
4009
- content: cardS.content,
4010
- footer: cardS.footer,
4011
- action: cardS.action
4012
- }),
4013
- Input: withStyles19(ComposedInput, { base: inputS.base }),
4014
- Textarea: withStyles19(ComposedTextarea, { base: textareaS.base }),
4015
- Label: withStyles19(ComposedLabel, { base: labelS.base }),
4016
- Pagination: (props) => ComposedPagination({
4017
- ...props,
4018
- classes: {
4019
- nav: paginationS.nav,
4020
- list: paginationS.list,
4021
- item: paginationS.item,
4022
- link: paginationS.link,
4023
- linkActive: paginationS.linkActive,
4024
- navButton: paginationS.navButton,
4025
- ellipsis: paginationS.ellipsis
4026
- }
4027
- }),
4028
- Separator: withStyles19(ComposedSeparator, {
4029
- base: separatorS.base,
4030
- horizontal: separatorS.horizontal,
4031
- vertical: separatorS.vertical
4032
- }),
4033
- FormGroup: withStyles19(ComposedFormGroup, {
4034
- base: formGroupS.base,
4035
- error: formGroupS.error
4036
- }),
4037
- Avatar: withStyles19(ComposedAvatar, {
4038
- root: avatarS.root,
4039
- image: avatarS.image,
4040
- fallback: avatarS.fallback
4041
- }),
4042
- EmptyState: withStyles19(ComposedEmptyState, {
4043
- root: emptyStateS.root,
4044
- icon: emptyStateS.icon,
4045
- title: emptyStateS.title,
4046
- description: emptyStateS.description,
4047
- action: emptyStateS.action
4048
- }),
4049
- Skeleton: Object.assign(withStyles19(ComposedSkeleton, { root: skeletonS.root }), {
4050
- Text: withStyles19(ComposedSkeleton.Text, {
4051
- root: skeletonS.textRoot,
4052
- line: skeletonS.textLine
4053
- }),
4054
- Circle: withStyles19(ComposedSkeleton.Circle, {
4055
- root: skeletonS.circleRoot
4056
- })
4057
- }),
4058
- Table: withStyles19(ComposedTable, {
4059
- root: tableS.root,
4060
- header: tableS.header,
4061
- body: tableS.body,
4062
- row: tableS.row,
4063
- head: tableS.head,
4064
- cell: tableS.cell,
4065
- caption: tableS.caption,
4066
- footer: tableS.footer
4067
- }),
4068
- primitives: {
4069
- Dialog: createThemedDialog(),
4070
- DropdownMenu: createThemedDropdownMenu(dropdownMenuS),
4071
- Select: createThemedSelect(selectS),
4072
- Tabs: createThemedTabs(tabsS),
4073
- Checkbox: createThemedCheckbox(checkboxS),
4074
- Switch: createThemedSwitch(switchS),
4075
- Popover: createThemedPopover(popoverS),
4076
- Progress: createThemedProgress(progressS),
4077
- RadioGroup: createThemedRadioGroup(radioGroupS),
4078
- Slider: createThemedSlider(sliderS),
4079
- Accordion: createThemedAccordion(accordionS),
4080
- Toast: createThemedToast(toastS),
4081
- Tooltip: createThemedTooltip(tooltipS),
4082
- Sheet: createThemedSheet(sheetS),
4083
- Calendar: createThemedCalendar(calendarS),
4084
- Carousel: createThemedCarousel(carouselS),
4085
- Collapsible: createThemedCollapsible(collapsibleS),
4086
- Command: createThemedCommand(commandS),
4087
- ContextMenu: createThemedContextMenu(contextMenuS),
4088
- DatePicker: createThemedDatePicker(datePickerS, {
4089
- ...calendarS,
4090
- root: calendarS.rootNoBorder
4091
- }),
4092
- Drawer: createThemedDrawer(drawerS),
4093
- HoverCard: createThemedHoverCard(hoverCardS),
4094
- List: createThemedList(listS),
4095
- Menubar: createThemedMenubar(menubarS),
4096
- NavigationMenu: createThemedNavigationMenu(navigationMenuS),
4097
- ResizablePanel: createThemedResizablePanel(resizablePanelS),
4098
- ScrollArea: createThemedScrollArea(scrollAreaS),
4099
- Toggle: createThemedToggle(toggleS),
4100
- ToggleGroup: createThemedToggleGroup(toggleGroupS)
4101
- }
3927
+ });
3928
+ lazyComp("Button", () => {
3929
+ const buttonS = styles.button;
3930
+ return ({ intent, size, ...rest }) => ComposedButton({ ...rest, classes: { base: buttonS({ intent, size }) } });
3931
+ });
3932
+ lazyComp("Badge", () => {
3933
+ const badgeS = styles.badge;
3934
+ const badgeColorInlineStyles = {
3935
+ blue: { backgroundColor: "oklch(0.55 0.15 250)", color: "#fff" },
3936
+ green: { backgroundColor: "oklch(0.55 0.15 155)", color: "#fff" },
3937
+ yellow: { backgroundColor: "oklch(0.75 0.15 85)", color: "oklch(0.25 0.05 85)" }
4102
3938
  };
4103
- }
4104
- const result = { theme, globals, styles };
4105
- Object.defineProperty(result, "components", {
4106
- get() {
4107
- if (cachedComponents === undefined) {
4108
- cachedComponents = buildComponents();
3939
+ return ({ color, ...rest }) => {
3940
+ const style = color ? badgeColorInlineStyles[color] : undefined;
3941
+ return ComposedBadge({ ...rest, classes: { base: badgeS({ color }) }, style });
3942
+ };
3943
+ });
3944
+ lazyComp("Breadcrumb", () => {
3945
+ const s = styles.breadcrumb;
3946
+ return withStyles19(ComposedBreadcrumb, {
3947
+ nav: s.nav,
3948
+ list: s.list,
3949
+ item: s.item,
3950
+ link: s.link,
3951
+ page: s.page,
3952
+ separator: s.separator
3953
+ });
3954
+ });
3955
+ lazyComp("Card", () => {
3956
+ const s = styles.card;
3957
+ return withStyles19(ComposedCard, {
3958
+ root: s.root,
3959
+ header: s.header,
3960
+ title: s.title,
3961
+ description: s.description,
3962
+ content: s.content,
3963
+ footer: s.footer,
3964
+ action: s.action
3965
+ });
3966
+ });
3967
+ lazyComp("Input", () => withStyles19(ComposedInput, { base: styles.input.base }));
3968
+ lazyComp("Textarea", () => withStyles19(ComposedTextarea, { base: styles.textarea.base }));
3969
+ lazyComp("Label", () => withStyles19(ComposedLabel, { base: styles.label.base }));
3970
+ lazyComp("Pagination", () => {
3971
+ const s = styles.pagination;
3972
+ return (props) => ComposedPagination({
3973
+ ...props,
3974
+ classes: {
3975
+ nav: s.nav,
3976
+ list: s.list,
3977
+ item: s.item,
3978
+ link: s.link,
3979
+ linkActive: s.linkActive,
3980
+ navButton: s.navButton,
3981
+ ellipsis: s.ellipsis
4109
3982
  }
4110
- return cachedComponents;
4111
- },
3983
+ });
3984
+ });
3985
+ lazyComp("Separator", () => {
3986
+ const s = styles.separator;
3987
+ return withStyles19(ComposedSeparator, {
3988
+ base: s.base,
3989
+ horizontal: s.horizontal,
3990
+ vertical: s.vertical
3991
+ });
3992
+ });
3993
+ lazyComp("FormGroup", () => {
3994
+ const s = styles.formGroup;
3995
+ return withStyles19(ComposedFormGroup, { base: s.base, error: s.error });
3996
+ });
3997
+ lazyComp("Avatar", () => {
3998
+ const s = styles.avatar;
3999
+ return withStyles19(ComposedAvatar, { root: s.root, image: s.image, fallback: s.fallback });
4000
+ });
4001
+ lazyComp("EmptyState", () => {
4002
+ const s = styles.emptyState;
4003
+ return withStyles19(ComposedEmptyState, {
4004
+ root: s.root,
4005
+ icon: s.icon,
4006
+ title: s.title,
4007
+ description: s.description,
4008
+ action: s.action
4009
+ });
4010
+ });
4011
+ lazyComp("Skeleton", () => {
4012
+ const s = styles.skeleton;
4013
+ return Object.assign(withStyles19(ComposedSkeleton, { root: s.root }), {
4014
+ Text: withStyles19(ComposedSkeleton.Text, { root: s.textRoot, line: s.textLine }),
4015
+ Circle: withStyles19(ComposedSkeleton.Circle, { root: s.circleRoot })
4016
+ });
4017
+ });
4018
+ lazyComp("Table", () => {
4019
+ const s = styles.table;
4020
+ return withStyles19(ComposedTable, {
4021
+ root: s.root,
4022
+ header: s.header,
4023
+ body: s.body,
4024
+ row: s.row,
4025
+ head: s.head,
4026
+ cell: s.cell,
4027
+ caption: s.caption,
4028
+ footer: s.footer
4029
+ });
4030
+ });
4031
+ const primitives = {};
4032
+ function lazyPrim(key, factory) {
4033
+ let cached;
4034
+ Object.defineProperty(primitives, key, {
4035
+ get() {
4036
+ if (cached === undefined)
4037
+ cached = factory();
4038
+ return cached;
4039
+ },
4040
+ enumerable: true,
4041
+ configurable: true
4042
+ });
4043
+ }
4044
+ lazyPrim("Dialog", () => createThemedDialog());
4045
+ lazyPrim("DropdownMenu", () => createThemedDropdownMenu(styles.dropdownMenu));
4046
+ lazyPrim("Select", () => createThemedSelect(styles.select));
4047
+ lazyPrim("Tabs", () => createThemedTabs(styles.tabs));
4048
+ lazyPrim("Checkbox", () => createThemedCheckbox(styles.checkbox));
4049
+ lazyPrim("Switch", () => createThemedSwitch(styles.switch));
4050
+ lazyPrim("Popover", () => createThemedPopover(styles.popover));
4051
+ lazyPrim("Progress", () => createThemedProgress(styles.progress));
4052
+ lazyPrim("RadioGroup", () => createThemedRadioGroup(styles.radioGroup));
4053
+ lazyPrim("Slider", () => createThemedSlider(styles.slider));
4054
+ lazyPrim("Accordion", () => createThemedAccordion(styles.accordion));
4055
+ lazyPrim("Toast", () => createThemedToast(styles.toast));
4056
+ lazyPrim("Tooltip", () => createThemedTooltip(styles.tooltip));
4057
+ lazyPrim("Sheet", () => createThemedSheet(styles.sheet));
4058
+ lazyPrim("Calendar", () => createThemedCalendar(styles.calendar));
4059
+ lazyPrim("Carousel", () => createThemedCarousel(styles.carousel));
4060
+ lazyPrim("Collapsible", () => createThemedCollapsible(styles.collapsible));
4061
+ lazyPrim("Command", () => createThemedCommand(styles.command));
4062
+ lazyPrim("ContextMenu", () => createThemedContextMenu(styles.contextMenu));
4063
+ lazyPrim("DatePicker", () => {
4064
+ const calendarS = styles.calendar;
4065
+ return createThemedDatePicker(styles.datePicker, {
4066
+ ...calendarS,
4067
+ root: calendarS.rootNoBorder
4068
+ });
4069
+ });
4070
+ lazyPrim("Drawer", () => createThemedDrawer(styles.drawer));
4071
+ lazyPrim("HoverCard", () => createThemedHoverCard(styles.hoverCard));
4072
+ lazyPrim("List", () => createThemedList(styles.list));
4073
+ lazyPrim("Menubar", () => createThemedMenubar(styles.menubar));
4074
+ lazyPrim("NavigationMenu", () => createThemedNavigationMenu(styles.navigationMenu));
4075
+ lazyPrim("ResizablePanel", () => createThemedResizablePanel(styles.resizablePanel));
4076
+ lazyPrim("ScrollArea", () => createThemedScrollArea(styles.scrollArea));
4077
+ lazyPrim("Toggle", () => createThemedToggle(styles.toggle));
4078
+ lazyPrim("ToggleGroup", () => createThemedToggleGroup(styles.toggleGroup));
4079
+ Object.defineProperty(components, "primitives", {
4080
+ value: primitives,
4112
4081
  enumerable: true,
4113
4082
  configurable: true
4114
4083
  });
4115
- return result;
4084
+ return { theme, globals, styles, components };
4116
4085
  }
4117
4086
  export {
4118
4087
  palettes,
@@ -2,17 +2,17 @@
2
2
  import { defineTheme, globalCss } from "@vertz/ui";
3
3
 
4
4
  // src/merge.ts
5
- function deepMergeTokens(base, overrides) {
5
+ function deepMergeTokens(base, colors) {
6
6
  const result = {};
7
7
  for (const [key, values] of Object.entries(base)) {
8
- const override = overrides[key];
8
+ const override = colors[key];
9
9
  if (override) {
10
10
  result[key] = { ...values, ...override };
11
11
  } else {
12
12
  result[key] = { ...values };
13
13
  }
14
14
  }
15
- for (const [key, values] of Object.entries(overrides)) {
15
+ for (const [key, values] of Object.entries(colors)) {
16
16
  if (!(key in result) && values) {
17
17
  result[key] = { ...values };
18
18
  }
@@ -356,7 +356,7 @@ function configureThemeBase(config) {
356
356
  const palette = config?.palette ?? "zinc";
357
357
  const radius = config?.radius ?? "md";
358
358
  const baseTokens = palettes[palette];
359
- const colorOverrides = config?.overrides?.tokens?.colors ?? {};
359
+ const colorOverrides = config?.colors ?? {};
360
360
  const mergedTokens = deepMergeTokens(baseTokens, colorOverrides);
361
361
  const theme = defineTheme({ colors: mergedTokens });
362
362
  const globals = globalCss({
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vertz/theme-shadcn",
3
- "version": "0.2.38",
3
+ "version": "0.2.42",
4
4
  "description": "Shadcn-inspired theme for Vertz — pre-built style definitions using variants() and css()",
5
5
  "license": "MIT",
6
6
  "repository": {
@@ -40,12 +40,12 @@
40
40
  "typecheck": "tsc --noEmit"
41
41
  },
42
42
  "dependencies": {
43
- "@vertz/ui": "^0.2.35",
44
- "@vertz/ui-primitives": "^0.2.35"
43
+ "@vertz/ui": "^0.2.41",
44
+ "@vertz/ui-primitives": "^0.2.41"
45
45
  },
46
46
  "devDependencies": {
47
47
  "@happy-dom/global-registrator": "^20.7.0",
48
- "@vertz/ui-compiler": "^0.2.35",
48
+ "@vertz/ui-server": "^0.2.41",
49
49
  "bunup": "^0.16.31",
50
50
  "happy-dom": "^20.7.0",
51
51
  "typescript": "^5.7.0"