@skeletonlabs/skeleton-common 4.0.0-next.24 → 4.0.0-next.26

package/dist/classes/combobox.js

@@ -9,7 +9,7 @@ const classesCombobox = {
 	"content": "skb:card skb:bg-surface-50-950 skb:border skb:border-surface-200-800 skb:p-2 skb:flex skb:flex-col skb:gap-2",
 	"itemGroup": "",
 	"itemGroupLabel": "skb:text-surface-600-400 skb:text-xs skb:px-2 skb:py-1",
-	"item": "skb:flex skb:justify-between skb:items-center skb:px-2 skb:py-1 skb:rounded skb:cursor-pointer skb:data-highlighted:outline-2 skb:data-highlighted:outline-offset-1 skb:data-highlighted:outline-surface-950-50 skb:data-disabled:pointer-events-none skb:data-disabled:opacity-50",
+	"item": "skb:flex skb:justify-between skb:items-center skb:px-2 skb:py-1 skb:rounded skb:cursor-pointer skb:data-[state=checked]:preset-filled skb:data-highlighted:outline-2 skb:data-highlighted:outline-offset-1 skb:data-highlighted:outline-surface-950-50 skb:data-highlighted:preset-tonal skb:data-disabled:pointer-events-none skb:data-disabled:opacity-50",
 	"itemText": "",
 	"itemIndicator": ""
 };

package/dist/classes/combobox.js.map

@@ -1 +1 @@
-{"version":3,"file":"combobox.js","names":[],"sources":["../../src/classes/combobox.ts"],"sourcesContent":["import { defineSkeletonClasses } from '../internal/define-skeleton-classes.js' with { type: 'macro' };\n\nexport const classesCombobox = defineSkeletonClasses({\n\troot: 'flex flex-col gap-2',\n\tlabel: 'label-text',\n\tcontrol: 'relative',\n\tinput: 'input',\n\ttrigger: 'btn-icon btn-icon-sm preset-tonal absolute end-1.5 top-1/2 -translate-y-1/2',\n\tpositioner: '',\n\tcontent: 'card bg-surface-50-950 border border-surface-200-800 p-2 flex flex-col gap-2',\n\titemGroup: '',\n\titemGroupLabel: 'text-surface-600-400 text-xs px-2 py-1',\n\titem: [\n\t\t'flex justify-between items-center px-2 py-1 rounded cursor-pointer',\n\t\t'data-highlighted:outline-2 data-highlighted:outline-offset-1 data-highlighted:outline-surface-950-50',\n\t\t'data-disabled:pointer-events-none data-disabled:opacity-50',\n\t],\n\titemText: '',\n\titemIndicator: '',\n});\n"],"mappings":";AAEA,MAAa,kBAAkB;CAAA,QAAA;CAAA,SAAA;CAAA,WAAA;CAAA,SAAA;CAAA,WAAA;CAAA,cAAA;CAAA,WAAA;CAAA,aAAA;CAAA,kBAAA;CAAA,QAAA;CAAA,YAAA;CAAA,iBAAA;CAiB7B"}
+{"version":3,"file":"combobox.js","names":[],"sources":["../../src/classes/combobox.ts"],"sourcesContent":["import { defineSkeletonClasses } from '../internal/define-skeleton-classes.js' with { type: 'macro' };\n\nexport const classesCombobox = defineSkeletonClasses({\n\troot: 'flex flex-col gap-2',\n\tlabel: 'label-text',\n\tcontrol: 'relative',\n\tinput: 'input',\n\ttrigger: 'btn-icon btn-icon-sm preset-tonal absolute end-1.5 top-1/2 -translate-y-1/2',\n\tpositioner: '',\n\tcontent: 'card bg-surface-50-950 border border-surface-200-800 p-2 flex flex-col gap-2',\n\titemGroup: '',\n\titemGroupLabel: 'text-surface-600-400 text-xs px-2 py-1',\n\titem: [\n\t\t'flex justify-between items-center px-2 py-1 rounded cursor-pointer',\n\t\t'data-[state=checked]:preset-filled',\n\t\t'data-highlighted:outline-2 data-highlighted:outline-offset-1 data-highlighted:outline-surface-950-50 data-highlighted:preset-tonal',\n\t\t'data-disabled:pointer-events-none data-disabled:opacity-50',\n\t],\n\titemText: '',\n\titemIndicator: '',\n});\n"],"mappings":";AAEA,MAAa,kBAAkB;CAAA,QAAA;CAAA,SAAA;CAAA,WAAA;CAAA,SAAA;CAAA,WAAA;CAAA,cAAA;CAAA,WAAA;CAAA,aAAA;CAAA,kBAAA;CAAA,QAAA;CAAA,YAAA;CAAA,iBAAA;CAkB7B"}

package/dist/classes/listbox.d.ts

@@ -0,0 +1,15 @@
+//#region src/classes/listbox.d.ts
+declare const classesListbox: {
+  root: string;
+  label: string;
+  input: string;
+  content: string;
+  itemGroup: string;
+  itemGroupLabel: string;
+  item: string;
+  itemText: string;
+  itemIndicator: string;
+};
+//#endregion
+export { classesListbox };
+//# sourceMappingURL=listbox.d.ts.map

package/dist/classes/listbox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"listbox.d.ts","names":[],"sources":["../../src/classes/listbox.ts"],"sourcesContent":[],"mappings":";cAEa;EAAA,IAAA,EAAA,MAAA"}

package/dist/classes/listbox.js

@@ -0,0 +1,16 @@
+//#region src/classes/listbox.ts
+const classesListbox = {
+	"root": "skb:flex skb:flex-col skb:gap-2",
+	"label": "skb:label-text",
+	"input": "skb:input",
+	"content": "skb:card skb:bg-surface-50-950 skb:border skb:border-surface-200-800 skb:p-2 skb:flex skb:flex-col skb:gap-2",
+	"itemGroup": "",
+	"itemGroupLabel": "skb:text-surface-600-400 skb:text-xs skb:px-2 skb:py-1",
+	"item": "skb:flex skb:justify-between skb:items-center skb:px-2 skb:py-1 skb:rounded skb:cursor-pointer skb:hover:preset-tonal skb:data-selected:preset-filled skb:data-highlighted:outline-2 skb:data-highlighted:outline-offset-1 skb:data-highlighted:outline-surface-950-50 skb:data-highlighted:preset-tonal skb:data-disabled:pointer-events-none skb:data-disabled:opacity-50",
+	"itemText": "",
+	"itemIndicator": ""
+};
+
+//#endregion
+export { classesListbox };
+//# sourceMappingURL=listbox.js.map

package/dist/classes/listbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"listbox.js","names":[],"sources":["../../src/classes/listbox.ts"],"sourcesContent":["import { defineSkeletonClasses } from '../internal/define-skeleton-classes.js' with { type: 'macro' };\n\nexport const classesListbox = defineSkeletonClasses({\n\troot: 'flex flex-col gap-2',\n\tlabel: 'label-text',\n\tinput: 'input',\n\tcontent: 'card bg-surface-50-950 border border-surface-200-800 p-2 flex flex-col gap-2',\n\titemGroup: '',\n\titemGroupLabel: 'text-surface-600-400 text-xs px-2 py-1',\n\titem: [\n\t\t'flex justify-between items-center px-2 py-1 rounded cursor-pointer hover:preset-tonal',\n\t\t'data-selected:preset-filled',\n\t\t'data-highlighted:outline-2 data-highlighted:outline-offset-1 data-highlighted:outline-surface-950-50 data-highlighted:preset-tonal',\n\t\t'data-disabled:pointer-events-none data-disabled:opacity-50',\n\t],\n\titemText: '',\n\titemIndicator: '',\n});\n"],"mappings":";AAEA,MAAa,iBAAiB;CAAA,QAAA;CAAA,SAAA;CAAA,SAAA;CAAA,WAAA;CAAA,aAAA;CAAA,kBAAA;CAAA,QAAA;CAAA,YAAA;CAAA,iBAAA;CAe5B"}

package/dist/classes/tree-view.d.ts

@@ -0,0 +1,16 @@
+//#region src/classes/tree-view.d.ts
+declare const classesTreeView: {
+  root: string;
+  tree: string;
+  label: string;
+  item: string;
+  branch: string;
+  branchControl: string;
+  branchIndicator: string;
+  branchText: string;
+  branchContent: string;
+  branchIndentGuide: string;
+};
+//#endregion
+export { classesTreeView };
+//# sourceMappingURL=tree-view.d.ts.map

package/dist/classes/tree-view.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tree-view.d.ts","names":[],"sources":["../../src/classes/tree-view.ts"],"sourcesContent":[],"mappings":";cAEa;EAAA,IAAA,EAAA,MAAA"}

package/dist/classes/tree-view.js

@@ -0,0 +1,17 @@
+//#region src/classes/tree-view.ts
+const classesTreeView = {
+	"root": "skb:w-full skb:space-y-2 skb:select-none",
+	"tree": "skb:space-y-1",
+	"label": "skb:label-text",
+	"item": "skb:flex skb:items-center skb:gap-2 skb:pe-4 skb:py-2 skb:rounded-base skb:hover:preset-tonal skb:data-selected:preset-filled skb:ps-[calc(var(--depth)*var(--spacing)*6+var(--spacing)*4)]",
+	"branch": "skb:space-y-1",
+	"branchControl": "skb:flex skb:items-center skb:gap-2 skb:pe-4 skb:py-2 skb:rounded-base skb:hover:preset-tonal skb:data-selected:preset-filled skb:ps-[calc(var(--depth)*var(--spacing)*6-var(--spacing)*2)]",
+	"branchIndicator": "skb:data-[state=open]:rotate-90",
+	"branchText": "skb:flex skb:items-center skb:gap-2",
+	"branchContent": "skb:space-y-1 skb:relative",
+	"branchIndentGuide": "skb:absolute skb:bg-surface-500/50 skb:w-0.5 skb:h-full skb:rounded-base skb:left-[calc(var(--depth)*var(--spacing)*6)] skb:-translate-x-1/2"
+};
+
+//#endregion
+export { classesTreeView };
+//# sourceMappingURL=tree-view.js.map

package/dist/classes/tree-view.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tree-view.js","names":[],"sources":["../../src/classes/tree-view.ts"],"sourcesContent":["import { defineSkeletonClasses } from '../internal/define-skeleton-classes' with { type: 'macro' };\n\nexport const classesTreeView = defineSkeletonClasses({\n\troot: 'w-full space-y-2 select-none',\n\ttree: 'space-y-1',\n\tlabel: 'label-text',\n\titem: [\n\t\t'flex items-center gap-2 pe-4 py-2 rounded-base',\n\t\t// Hover and selection states\n\t\t'hover:preset-tonal data-selected:preset-filled',\n\t\t// Left side overlap effect\n\t\t'ps-[calc(var(--depth)*var(--spacing)*6+var(--spacing)*4)]',\n\t],\n\tbranch: 'space-y-1',\n\tbranchControl: [\n\t\t'flex items-center gap-2 pe-4 py-2 rounded-base',\n\t\t// Hover and selection states\n\t\t'hover:preset-tonal data-selected:preset-filled',\n\t\t// Left side overlap effect\n\t\t'ps-[calc(var(--depth)*var(--spacing)*6-var(--spacing)*2)]',\n\t],\n\tbranchIndicator: 'data-[state=open]:rotate-90',\n\tbranchText: 'flex items-center gap-2',\n\tbranchContent: 'space-y-1 relative',\n\tbranchIndentGuide: [\n\t\t'absolute bg-surface-500/50 w-0.5 h-full rounded-base',\n\t\t// Left side overlap effect\n\t\t'left-[calc(var(--depth)*var(--spacing)*6)] -translate-x-1/2',\n\t],\n});\n"],"mappings":";AAEA,MAAa,kBAAkB;CAAA,QAAA;CAAA,QAAA;CAAA,SAAA;CAAA,QAAA;CAAA,UAAA;CAAA,iBAAA;CAAA,mBAAA;CAAA,cAAA;CAAA,iBAAA;CAAA,qBAAA;CA2B7B"}

package/dist/index.d.ts

@@ -5,6 +5,7 @@ import { classesCombobox } from "./classes/combobox.js";
 import { classesDatePicker } from "./classes/date-picker.js";
 import { classesDialog } from "./classes/dialog.js";
 import { classesFileUpload } from "./classes/file-upload.js";
+import { classesListbox } from "./classes/listbox.js";
 import { classesNavigation } from "./classes/navigation.js";
 import { classesPagination } from "./classes/pagination.js";
 import { classesPopover } from "./classes/popover.js";
@@ -17,5 +18,6 @@ import { classesTabs } from "./classes/tabs.js";
 import { classesTagsInput } from "./classes/tags-input.js";
 import { classesToast } from "./classes/toast.js";
 import { classesTooltip } from "./classes/tooltip.js";
+import { classesTreeView } from "./classes/tree-view.js";
 import { Theme, themes } from "./themes.js";
-export { Theme, classesAccordion, classesAppBar, classesAvatar, classesCombobox, classesDatePicker, classesDialog, classesFileUpload, classesNavigation, classesPagination, classesPopover, classesProgress, classesRatingGroup, classesSegmentedControl, classesSlider, classesSwitch, classesTabs, classesTagsInput, classesToast, classesTooltip, themes };
+export { Theme, classesAccordion, classesAppBar, classesAvatar, classesCombobox, classesDatePicker, classesDialog, classesFileUpload, classesListbox, classesNavigation, classesPagination, classesPopover, classesProgress, classesRatingGroup, classesSegmentedControl, classesSlider, classesSwitch, classesTabs, classesTagsInput, classesToast, classesTooltip, classesTreeView, themes };

package/dist/index.js

@@ -5,6 +5,7 @@ import { classesCombobox } from "./classes/combobox.js";
 import { classesDatePicker } from "./classes/date-picker.js";
 import { classesDialog } from "./classes/dialog.js";
 import { classesFileUpload } from "./classes/file-upload.js";
+import { classesListbox } from "./classes/listbox.js";
 import { classesNavigation } from "./classes/navigation.js";
 import { classesPagination } from "./classes/pagination.js";
 import { classesPopover } from "./classes/popover.js";
@@ -17,6 +18,7 @@ import { classesTabs } from "./classes/tabs.js";
 import { classesTagsInput } from "./classes/tags-input.js";
 import { classesToast } from "./classes/toast.js";
 import { classesTooltip } from "./classes/tooltip.js";
+import { classesTreeView } from "./classes/tree-view.js";
 import { themes } from "./themes.js";
 
-export { classesAccordion, classesAppBar, classesAvatar, classesCombobox, classesDatePicker, classesDialog, classesFileUpload, classesNavigation, classesPagination, classesPopover, classesProgress, classesRatingGroup, classesSegmentedControl, classesSlider, classesSwitch, classesTabs, classesTagsInput, classesToast, classesTooltip, themes };
+export { classesAccordion, classesAppBar, classesAvatar, classesCombobox, classesDatePicker, classesDialog, classesFileUpload, classesListbox, classesNavigation, classesPagination, classesPopover, classesProgress, classesRatingGroup, classesSegmentedControl, classesSlider, classesSwitch, classesTabs, classesTagsInput, classesToast, classesTooltip, classesTreeView, themes };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@skeletonlabs/skeleton-common",
-  "version": "4.0.0-next.24",
+  "version": "4.0.0-next.26",
   "description": "The common package for Skeleton.",
   "author": "endigo9740 <chris@skeletonlabs.dev>",
   "repository": {
@@ -24,7 +24,7 @@
     "typescript": "5.9.3",
     "unplugin-macros": "0.18.2",
     "unplugin-raw": "0.6.3",
-    "@skeletonlabs/skeleton": "4.0.0-next.24"
+    "@skeletonlabs/skeleton": "4.0.0-next.26"
   },
   "license": "MIT",
   "type": "module",