@hoardodile/ui 0.1.6 → 0.1.8

package/dist/components/slider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/lib/merge-config.ts","../../src/lib/utils.ts","../../src/components/slider.tsx"],"names":["SliderPrimitive"],"mappings":";;;;;;AAQO,IAAM,UAAA,GAAa;AAAA,EACzB,MAAM,CAAC,MAAA,EAAQ,MAAM,KAAA,EAAO,WAAA,EAAa,eAAe,OAAO,CAAA;AAAA,EAC/D,SAAS,CAAC,MAAA,EAAQ,SAAA,EAAW,KAAA,EAAO,WAAW,OAAO,CAAA;AAAA,EACtD,QAAA,EAAU,CAAC,OAAO,CAAA;AAAA,EAClB,MAAA,EAAQ,CAAC,MAAA,EAAQ,QAAQ,CAAA;AAAA,EACzB,SAAA,EAAW,CAAC,SAAA,EAAW,QAAA,EAAU,SAAS,CAAA;AAAA,EAC1C,IAAA,EAAM,CAAC,KAAA,EAAO,SAAS,CAAA;AAAA,EACvB,IAAA,EAAM,CAAC,UAAU,CAAA;AAAA,EACjB,OAAA,EAAS,CAAC,MAAA,EAAQ,KAAK;AACxB,CAAA;AAEO,IAAM,UAAU,mBAAA,CAAoB;AAAA,EAC1C,MAAA,EAAQ,EAAE,KAAA,EAAO,UAAA;AAClB,CAAC,CAAA;;;AClBM,SAAS,MAAM,MAAA,EAAsB;AAC3C,EAAA,OAAO,OAAA,CAAQ,IAAA,CAAK,MAAM,CAAC,CAAA;AAC5B;ACDA,SAAS,MAAA,CAAO;AAAA,EACd,SAAA;AAAA,EACA,YAAA;AAAA,EACA,KAAA;AAAA,EACA,GAAA,GAAM,CAAA;AAAA,EACN,GAAA,GAAM,GAAA;AAAA,EACN,GAAG;AACL,CAAA,EAA+B;AAC7B,EAAA,MAAM,OAAA,GAAU,KAAA,CAAM,OAAA,CAAQ,KAAK,CAAA,GAC/B,KAAA,GACA,KAAA,CAAM,OAAA,CAAQ,YAAY,CAAA,GACxB,YAAA,GACA,CAAC,KAAK,GAAG,CAAA;AAEf,EAAA,uBACE,GAAA;AAAA,IAACA,QAAA,CAAgB,IAAA;AAAA,IAAhB;AAAA,MACC,SAAA,EAAW,EAAA,CAAG,6CAAA,EAA+C,SAAS,CAAA;AAAA,MACtE,WAAA,EAAU,QAAA;AAAA,MACV,YAAA;AAAA,MACA,KAAA;AAAA,MACA,GAAA;AAAA,MACA,GAAA;AAAA,MACA,cAAA,EAAe,MAAA;AAAA,MACd,GAAG,KAAA;AAAA,MAEJ,QAAA,kBAAA,IAAA,CAACA,QAAA,CAAgB,OAAA,EAAhB,EAAwB,WAAU,2KAAA,EACjC,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAACA,QAAA,CAAgB,KAAA;AAAA,UAAhB;AAAA,YACC,WAAA,EAAU,cAAA;AAAA,YACV,SAAA,EAAU,uJAAA;AAAA,YAEV,QAAA,kBAAA,GAAA;AAAA,cAACA,QAAA,CAAgB,SAAA;AAAA,cAAhB;AAAA,gBACC,WAAA,EAAU,cAAA;AAAA,gBACV,SAAA,EAAU;AAAA;AAAA;AACZ;AAAA,SACF;AAAA,QACC,KAAA,CAAM,KAAK,EAAE,MAAA,EAAQ,QAAQ,MAAA,EAAO,EAAG,CAAC,CAAA,EAAG,KAAA,qBAC1C,GAAA;AAAA,UAACA,QAAA,CAAgB,KAAA;AAAA,UAAhB;AAAA,YACC,WAAA,EAAU,cAAA;AAAA,YAEV,SAAA,EAAU;AAAA,WAAA;AAAA,UADL;AAAA,SAGR;AAAA,OAAA,EACH;AAAA;AAAA,GACF;AAEJ","file":"slider.js","sourcesContent":["import { extendTailwindMerge } from \"tailwind-merge\"\n\n// The app's `@theme inline` tokens (theme.css) generate utility names\n// tailwind-merge doesn't know, so it misclassifies them — e.g. `text-ui` is\n// parsed as a text color and dropped next to any `text-*` color. The default\n// class groups are theme-backed, so extending the theme (keys mirror the v4\n// token namespaces one-to-one) registers every custom utility with correct\n// conflict semantics. merge-config.test.ts pins this list against theme.css.\nexport const mergeTheme = {\n\ttext: [\"tiny\", \"ui\", \"doc\", \"doc-title\", \"doc-heading\", \"quote\"],\n\tspacing: [\"chip\", \"control\", \"nav\", \"sidebar\", \"panel\"],\n\ttracking: [\"label\"],\n\tshadow: [\"card\", \"dialog\"],\n\tcontainer: [\"reading\", \"medium\", \"content\"],\n\tfont: [\"doc\", \"heading\"],\n\tease: [\"standard\"],\n\tanimate: [\"skel\", \"pop\"],\n} as const\n\nexport const twMerge = extendTailwindMerge({\n\textend: { theme: mergeTheme },\n})\n","import { type ClassValue, clsx } from \"clsx\"\nimport { twMerge } from \"./merge-config\"\n\nexport function cn(...inputs: ClassValue[]) {\n\treturn twMerge(clsx(inputs))\n}\n","import { Slider as SliderPrimitive } from \"@base-ui/react/slider\"\n\nimport { cn } from \"@hoardodile/ui/lib/utils\"\n\nfunction Slider({\n  className,\n  defaultValue,\n  value,\n  min = 0,\n  max = 100,\n  ...props\n}: SliderPrimitive.Root.Props) {\n  const _values = Array.isArray(value)\n    ? value\n    : Array.isArray(defaultValue)\n      ? defaultValue\n      : [min, max]\n\n  return (\n    <SliderPrimitive.Root\n      className={cn(\"data-horizontal:w-full data-vertical:h-full\", className)}\n      data-slot=\"slider\"\n      defaultValue={defaultValue}\n      value={value}\n      min={min}\n      max={max}\n      thumbAlignment=\"edge\"\n      {...props}\n    >\n      <SliderPrimitive.Control className=\"relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-vertical:h-full data-vertical:min-h-40 data-vertical:w-auto data-vertical:flex-col\">\n        <SliderPrimitive.Track\n          data-slot=\"slider-track\"\n          className=\"relative grow overflow-hidden rounded-full bg-muted select-none data-horizontal:h-1.5 data-horizontal:w-full data-vertical:h-full data-vertical:w-1.5\"\n        >\n          <SliderPrimitive.Indicator\n            data-slot=\"slider-range\"\n            className=\"bg-primary select-none data-horizontal:h-full data-vertical:w-full\"\n          />\n        </SliderPrimitive.Track>\n        {Array.from({ length: _values.length }, (_, index) => (\n          <SliderPrimitive.Thumb\n            data-slot=\"slider-thumb\"\n            key={index}\n            className=\"block size-4 shrink-0 rounded-full border border-primary bg-white shadow-sm ring-ring/50 transition-[color,box-shadow] select-none hover:ring-4 focus-visible:ring-4 focus-visible:outline-hidden disabled:pointer-events-none disabled:opacity-50\"\n          />\n        ))}\n      </SliderPrimitive.Control>\n    </SliderPrimitive.Root>\n  )\n}\n\nexport { Slider }\n"]}
+{"version":3,"sources":["../../src/components/slider.tsx"],"names":["SliderPrimitive"],"mappings":";;;;;AAIA,SAAS,MAAA,CAAO;AAAA,EACd,SAAA;AAAA,EACA,YAAA;AAAA,EACA,KAAA;AAAA,EACA,GAAA,GAAM,CAAA;AAAA,EACN,GAAA,GAAM,GAAA;AAAA,EACN,GAAG;AACL,CAAA,EAA+B;AAC7B,EAAA,MAAM,OAAA,GAAU,KAAA,CAAM,OAAA,CAAQ,KAAK,CAAA,GAC/B,KAAA,GACA,KAAA,CAAM,OAAA,CAAQ,YAAY,CAAA,GACxB,YAAA,GACA,CAAC,KAAK,GAAG,CAAA;AAEf,EAAA,uBACE,GAAA;AAAA,IAACA,QAAA,CAAgB,IAAA;AAAA,IAAhB;AAAA,MACC,SAAA,EAAW,EAAA,CAAG,6CAAA,EAA+C,SAAS,CAAA;AAAA,MACtE,WAAA,EAAU,QAAA;AAAA,MACV,YAAA;AAAA,MACA,KAAA;AAAA,MACA,GAAA;AAAA,MACA,GAAA;AAAA,MACA,cAAA,EAAe,MAAA;AAAA,MACd,GAAG,KAAA;AAAA,MAEJ,QAAA,kBAAA,IAAA,CAACA,QAAA,CAAgB,OAAA,EAAhB,EAAwB,WAAU,2KAAA,EACjC,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAACA,QAAA,CAAgB,KAAA;AAAA,UAAhB;AAAA,YACC,WAAA,EAAU,cAAA;AAAA,YACV,SAAA,EAAU,uJAAA;AAAA,YAEV,QAAA,kBAAA,GAAA;AAAA,cAACA,QAAA,CAAgB,SAAA;AAAA,cAAhB;AAAA,gBACC,WAAA,EAAU,cAAA;AAAA,gBACV,SAAA,EAAU;AAAA;AAAA;AACZ;AAAA,SACF;AAAA,QACC,KAAA,CAAM,KAAK,EAAE,MAAA,EAAQ,QAAQ,MAAA,EAAO,EAAG,CAAC,CAAA,EAAG,KAAA,qBAC1C,GAAA;AAAA,UAACA,QAAA,CAAgB,KAAA;AAAA,UAAhB;AAAA,YACC,WAAA,EAAU,cAAA;AAAA,YAEV,SAAA,EAAU;AAAA,WAAA;AAAA,UADL;AAAA,SAGR;AAAA,OAAA,EACH;AAAA;AAAA,GACF;AAEJ","file":"slider.js","sourcesContent":["import { Slider as SliderPrimitive } from \"@base-ui/react/slider\"\n\nimport { cn } from \"@hoardodile/ui/lib/utils\"\n\nfunction Slider({\n  className,\n  defaultValue,\n  value,\n  min = 0,\n  max = 100,\n  ...props\n}: SliderPrimitive.Root.Props) {\n  const _values = Array.isArray(value)\n    ? value\n    : Array.isArray(defaultValue)\n      ? defaultValue\n      : [min, max]\n\n  return (\n    <SliderPrimitive.Root\n      className={cn(\"data-horizontal:w-full data-vertical:h-full\", className)}\n      data-slot=\"slider\"\n      defaultValue={defaultValue}\n      value={value}\n      min={min}\n      max={max}\n      thumbAlignment=\"edge\"\n      {...props}\n    >\n      <SliderPrimitive.Control className=\"relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-vertical:h-full data-vertical:min-h-40 data-vertical:w-auto data-vertical:flex-col\">\n        <SliderPrimitive.Track\n          data-slot=\"slider-track\"\n          className=\"relative grow overflow-hidden rounded-full bg-muted select-none data-horizontal:h-1.5 data-horizontal:w-full data-vertical:h-full data-vertical:w-1.5\"\n        >\n          <SliderPrimitive.Indicator\n            data-slot=\"slider-range\"\n            className=\"bg-primary select-none data-horizontal:h-full data-vertical:w-full\"\n          />\n        </SliderPrimitive.Track>\n        {Array.from({ length: _values.length }, (_, index) => (\n          <SliderPrimitive.Thumb\n            data-slot=\"slider-thumb\"\n            key={index}\n            className=\"block size-4 shrink-0 rounded-full border border-primary bg-white shadow-sm ring-ring/50 transition-[color,box-shadow] select-none hover:ring-4 focus-visible:ring-4 focus-visible:outline-hidden disabled:pointer-events-none disabled:opacity-50\"\n          />\n        ))}\n      </SliderPrimitive.Control>\n    </SliderPrimitive.Root>\n  )\n}\n\nexport { Slider }\n"]}

package/dist/components/sortable-chip-list.js

@@ -1,28 +1,9 @@
+import { cn } from '../chunk-M5OJN54O.js';
+import '../chunk-2HWSCY4T.js';
 import { DndContext, closestCorners } from '@dnd-kit/core';
 import { SortableContext, rectSortingStrategy } from '@dnd-kit/sortable';
-import { clsx } from 'clsx';
-import { extendTailwindMerge } from 'tailwind-merge';
 import { jsx } from 'react/jsx-runtime';
 
-// src/components/sortable-chip-list.tsx
-var mergeTheme = {
-  text: ["tiny", "ui", "doc", "doc-title", "doc-heading", "quote"],
-  spacing: ["chip", "control", "nav", "sidebar", "panel"],
-  tracking: ["label"],
-  shadow: ["card", "dialog"],
-  container: ["reading", "medium", "content"],
-  font: ["doc", "heading"],
-  ease: ["standard"],
-  animate: ["skel", "pop"]
-};
-var twMerge = extendTailwindMerge({
-  extend: { theme: mergeTheme }
-});
-
-// src/lib/utils.ts
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
 function SortableChipList(props) {
   if (props.items.length === 0) {
     return props.empty ?? null;

package/dist/components/sortable-chip-list.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/lib/merge-config.ts","../../src/lib/utils.ts","../../src/components/sortable-chip-list.tsx"],"names":[],"mappings":";;;;;;;AAQO,IAAM,UAAA,GAAa;AAAA,EACzB,MAAM,CAAC,MAAA,EAAQ,MAAM,KAAA,EAAO,WAAA,EAAa,eAAe,OAAO,CAAA;AAAA,EAC/D,SAAS,CAAC,MAAA,EAAQ,SAAA,EAAW,KAAA,EAAO,WAAW,OAAO,CAAA;AAAA,EACtD,QAAA,EAAU,CAAC,OAAO,CAAA;AAAA,EAClB,MAAA,EAAQ,CAAC,MAAA,EAAQ,QAAQ,CAAA;AAAA,EACzB,SAAA,EAAW,CAAC,SAAA,EAAW,QAAA,EAAU,SAAS,CAAA;AAAA,EAC1C,IAAA,EAAM,CAAC,KAAA,EAAO,SAAS,CAAA;AAAA,EACvB,IAAA,EAAM,CAAC,UAAU,CAAA;AAAA,EACjB,OAAA,EAAS,CAAC,MAAA,EAAQ,KAAK;AACxB,CAAA;AAEO,IAAM,UAAU,mBAAA,CAAoB;AAAA,EAC1C,MAAA,EAAQ,EAAE,KAAA,EAAO,UAAA;AAClB,CAAC,CAAA;;;AClBM,SAAS,MAAM,MAAA,EAAsB;AAC3C,EAAA,OAAO,OAAA,CAAQ,IAAA,CAAK,MAAM,CAAC,CAAA;AAC5B;ACoBO,SAAS,iBACf,KAAA,EACY;AACZ,EAAA,IAAI,KAAA,CAAM,KAAA,CAAM,MAAA,KAAW,CAAA,EAAG;AAC7B,IAAA,OAAO,MAAM,KAAA,IAAS,IAAA;AAAA,EACvB;AAEA,EAAA,uBACC,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,KAAA,CAAM,SAAA,EACrB,QAAA,kBAAA,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACA,SAAS,KAAA,CAAM,OAAA;AAAA,MACf,kBAAA,EAAoB,cAAA;AAAA,MACpB,WAAW,KAAA,CAAM,SAAA;AAAA,MAEjB,QAAA,kBAAA,GAAA;AAAA,QAAC,eAAA;AAAA,QAAA;AAAA,UACA,OAAO,KAAA,CAAM,KAAA,CAAM,IAAI,CAAC,IAAA,KAAS,KAAK,EAAE,CAAA;AAAA,UACxC,QAAA,EAAU,MAAM,QAAA,IAAY,mBAAA;AAAA,UAE5B,QAAA,kBAAA,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACA,SAAA,EAAW,EAAA;AAAA,gBACV,qCAAA;AAAA,gBACA,KAAA,CAAM;AAAA,eACP;AAAA,cAEC,QAAA,EAAA,KAAA,CAAM,MAAM,GAAA,CAAI,CAAC,SAAS,KAAA,CAAM,UAAA,CAAW,IAAI,CAAC;AAAA;AAAA;AAClD;AAAA;AACD;AAAA,GACD,EACD,CAAA;AAEF","file":"sortable-chip-list.js","sourcesContent":["import { extendTailwindMerge } from \"tailwind-merge\"\n\n// The app's `@theme inline` tokens (theme.css) generate utility names\n// tailwind-merge doesn't know, so it misclassifies them — e.g. `text-ui` is\n// parsed as a text color and dropped next to any `text-*` color. The default\n// class groups are theme-backed, so extending the theme (keys mirror the v4\n// token namespaces one-to-one) registers every custom utility with correct\n// conflict semantics. merge-config.test.ts pins this list against theme.css.\nexport const mergeTheme = {\n\ttext: [\"tiny\", \"ui\", \"doc\", \"doc-title\", \"doc-heading\", \"quote\"],\n\tspacing: [\"chip\", \"control\", \"nav\", \"sidebar\", \"panel\"],\n\ttracking: [\"label\"],\n\tshadow: [\"card\", \"dialog\"],\n\tcontainer: [\"reading\", \"medium\", \"content\"],\n\tfont: [\"doc\", \"heading\"],\n\tease: [\"standard\"],\n\tanimate: [\"skel\", \"pop\"],\n} as const\n\nexport const twMerge = extendTailwindMerge({\n\textend: { theme: mergeTheme },\n})\n","import { type ClassValue, clsx } from \"clsx\"\nimport { twMerge } from \"./merge-config\"\n\nexport function cn(...inputs: ClassValue[]) {\n\treturn twMerge(clsx(inputs))\n}\n","import { closestCorners, DndContext } from \"@dnd-kit/core\"\nimport {\n\trectSortingStrategy,\n\tSortableContext,\n\ttype SortingStrategy,\n} from \"@dnd-kit/sortable\"\nimport { cn } from \"@hoardodile/ui/lib/utils\"\nimport type { ReactNode } from \"react\"\n\nexport type SortableChipListProps<T extends { readonly id: string }> = {\n\treadonly items: readonly T[]\n\treadonly renderItem: (item: T) => ReactNode\n\treadonly sensors: ReturnType<typeof import(\"@dnd-kit/core\").useSensors>\n\treadonly onDragEnd: (event: import(\"@dnd-kit/core\").DragEndEvent) => void\n\treadonly strategy?: SortingStrategy\n\treadonly empty?: ReactNode\n\treadonly className?: string\n\treadonly listClassName?: string\n}\n\n/**\n * Encapsulates the canonical DnD chip list used by management panels:\n * `DndContext` + `SortableContext` with `closestCorners` and\n * `rectSortingStrategy`.\n */\nexport function SortableChipList<T extends { readonly id: string }>(\n\tprops: SortableChipListProps<T>,\n): ReactNode {\n\tif (props.items.length === 0) {\n\t\treturn props.empty ?? null\n\t}\n\n\treturn (\n\t\t<div className={props.className}>\n\t\t\t<DndContext\n\t\t\t\tsensors={props.sensors}\n\t\t\t\tcollisionDetection={closestCorners}\n\t\t\t\tonDragEnd={props.onDragEnd}\n\t\t\t>\n\t\t\t\t<SortableContext\n\t\t\t\t\titems={props.items.map((item) => item.id)}\n\t\t\t\t\tstrategy={props.strategy ?? rectSortingStrategy}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\"flex flex-wrap items-center gap-1.5\",\n\t\t\t\t\t\t\tprops.listClassName,\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{props.items.map((item) => props.renderItem(item))}\n\t\t\t\t\t</div>\n\t\t\t\t</SortableContext>\n\t\t\t</DndContext>\n\t\t</div>\n\t)\n}\n"]}
+{"version":3,"sources":["../../src/components/sortable-chip-list.tsx"],"names":[],"mappings":";;;;;;AAyBO,SAAS,iBACf,KAAA,EACY;AACZ,EAAA,IAAI,KAAA,CAAM,KAAA,CAAM,MAAA,KAAW,CAAA,EAAG;AAC7B,IAAA,OAAO,MAAM,KAAA,IAAS,IAAA;AAAA,EACvB;AAEA,EAAA,uBACC,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,KAAA,CAAM,SAAA,EACrB,QAAA,kBAAA,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACA,SAAS,KAAA,CAAM,OAAA;AAAA,MACf,kBAAA,EAAoB,cAAA;AAAA,MACpB,WAAW,KAAA,CAAM,SAAA;AAAA,MAEjB,QAAA,kBAAA,GAAA;AAAA,QAAC,eAAA;AAAA,QAAA;AAAA,UACA,OAAO,KAAA,CAAM,KAAA,CAAM,IAAI,CAAC,IAAA,KAAS,KAAK,EAAE,CAAA;AAAA,UACxC,QAAA,EAAU,MAAM,QAAA,IAAY,mBAAA;AAAA,UAE5B,QAAA,kBAAA,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACA,SAAA,EAAW,EAAA;AAAA,gBACV,qCAAA;AAAA,gBACA,KAAA,CAAM;AAAA,eACP;AAAA,cAEC,QAAA,EAAA,KAAA,CAAM,MAAM,GAAA,CAAI,CAAC,SAAS,KAAA,CAAM,UAAA,CAAW,IAAI,CAAC;AAAA;AAAA;AAClD;AAAA;AACD;AAAA,GACD,EACD,CAAA;AAEF","file":"sortable-chip-list.js","sourcesContent":["import { closestCorners, DndContext } from \"@dnd-kit/core\"\nimport {\n\trectSortingStrategy,\n\tSortableContext,\n\ttype SortingStrategy,\n} from \"@dnd-kit/sortable\"\nimport { cn } from \"@hoardodile/ui/lib/utils\"\nimport type { ReactNode } from \"react\"\n\nexport type SortableChipListProps<T extends { readonly id: string }> = {\n\treadonly items: readonly T[]\n\treadonly renderItem: (item: T) => ReactNode\n\treadonly sensors: ReturnType<typeof import(\"@dnd-kit/core\").useSensors>\n\treadonly onDragEnd: (event: import(\"@dnd-kit/core\").DragEndEvent) => void\n\treadonly strategy?: SortingStrategy\n\treadonly empty?: ReactNode\n\treadonly className?: string\n\treadonly listClassName?: string\n}\n\n/**\n * Encapsulates the canonical DnD chip list used by management panels:\n * `DndContext` + `SortableContext` with `closestCorners` and\n * `rectSortingStrategy`.\n */\nexport function SortableChipList<T extends { readonly id: string }>(\n\tprops: SortableChipListProps<T>,\n): ReactNode {\n\tif (props.items.length === 0) {\n\t\treturn props.empty ?? null\n\t}\n\n\treturn (\n\t\t<div className={props.className}>\n\t\t\t<DndContext\n\t\t\t\tsensors={props.sensors}\n\t\t\t\tcollisionDetection={closestCorners}\n\t\t\t\tonDragEnd={props.onDragEnd}\n\t\t\t>\n\t\t\t\t<SortableContext\n\t\t\t\t\titems={props.items.map((item) => item.id)}\n\t\t\t\t\tstrategy={props.strategy ?? rectSortingStrategy}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\"flex flex-wrap items-center gap-1.5\",\n\t\t\t\t\t\t\tprops.listClassName,\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{props.items.map((item) => props.renderItem(item))}\n\t\t\t\t\t</div>\n\t\t\t\t</SortableContext>\n\t\t\t</DndContext>\n\t\t</div>\n\t)\n}\n"]}

package/dist/components/special-tag-surface.js

@@ -1,533 +1,5 @@
-import { clsx } from 'clsx';
-import { extendTailwindMerge } from 'tailwind-merge';
-import { useId } from 'react';
-import { jsx, jsxs } from 'react/jsx-runtime';
-
-// src/lib/utils.ts
-var mergeTheme = {
-  text: ["tiny", "ui", "doc", "doc-title", "doc-heading", "quote"],
-  spacing: ["chip", "control", "nav", "sidebar", "panel"],
-  tracking: ["label"],
-  shadow: ["card", "dialog"],
-  container: ["reading", "medium", "content"],
-  font: ["doc", "heading"],
-  ease: ["standard"],
-  animate: ["skel", "pop"]
-};
-var twMerge = extendTailwindMerge({
-  extend: { theme: mergeTheme }
-});
-
-// src/lib/utils.ts
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-function GoldSurface({
-  id,
-  active
-}) {
-  const gradientId = `${id}-gold-gradient`;
-  return /* @__PURE__ */ jsxs(
-    "svg",
-    {
-      className: cn(
-        "size-full",
-        !active && "[filter:brightness(1.1)] group-hover:[filter:brightness(1.16)]"
-      ),
-      width: "100%",
-      height: "100%",
-      viewBox: "0 0 100 100",
-      preserveAspectRatio: "none",
-      children: [
-        /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs(
-          "linearGradient",
-          {
-            id: gradientId,
-            x1: "0%",
-            y1: "0%",
-            x2: "100%",
-            y2: "0%",
-            gradientTransform: "rotate(30, 0.5, 0.5)",
-            children: [
-              /* @__PURE__ */ jsx("stop", { offset: "10%", stopColor: "#daa520" }),
-              /* @__PURE__ */ jsx("stop", { offset: "30%", stopColor: "#ffd700" }),
-              /* @__PURE__ */ jsx("stop", { offset: "50%", stopColor: "#f0e68c" }),
-              /* @__PURE__ */ jsx("stop", { offset: "70%", stopColor: "#ffd700" }),
-              /* @__PURE__ */ jsx("stop", { offset: "90%", stopColor: "#daa520" })
-            ]
-          }
-        ) }),
-        /* @__PURE__ */ jsx(
-          "rect",
-          {
-            width: "100",
-            height: "100",
-            fill: active ? "#8a6d1f" : `url(#${gradientId})`
-          }
-        ),
-        !active && /* @__PURE__ */ jsx(
-          "rect",
-          {
-            x: "0",
-            y: "0",
-            width: "100",
-            height: "8",
-            fill: "#ffffff",
-            opacity: "0.12"
-          }
-        )
-      ]
-    }
-  );
-}
-var goldConfig = {
-  render: GoldSurface,
-  default: {
-    style: {
-      color: "#725603",
-      boxShadow: "inset 0 0 0 1px rgba(114, 86, 3, 0.2)"
-    }
-  },
-  active: {
-    style: {
-      color: "#ffffff"
-    }
-  }
-};
-function KintsugiSurface({
-  id,
-  active
-}) {
-  if (active) {
-    return /* @__PURE__ */ jsx(
-      "svg",
-      {
-        className: cn(
-          "size-full",
-          !active && "[filter:brightness(1.02)] group-hover:[filter:brightness(1.06)]"
-        ),
-        width: "100%",
-        height: "100%",
-        viewBox: "0 0 100 100",
-        preserveAspectRatio: "none",
-        children: /* @__PURE__ */ jsx("rect", { width: "100", height: "100", fill: "#9a9a8a" })
-      }
-    );
-  }
-  const goldGradientId = `${id}-kintsugi-gold`;
-  return /* @__PURE__ */ jsxs(
-    "svg",
-    {
-      className: cn(
-        "size-full",
-        !active && "[filter:brightness(1.02)] group-hover:[filter:brightness(1.06)]"
-      ),
-      width: "100%",
-      height: "100%",
-      viewBox: "0 0 100 100",
-      preserveAspectRatio: "none",
-      children: [
-        /* @__PURE__ */ jsx("style", { children: `
-				@keyframes ${id}-gold-shimmer {
-					0% { stroke-dashoffset: 60; }
-					100% { stroke-dashoffset: 0; }
-				}
-				.${id}-gold-vein {
-					stroke-dasharray: 30 30;
-					animation: ${id}-gold-shimmer 5s linear infinite;
-				}
-				@media (prefers-reduced-motion: reduce) {
-					.${id}-gold-vein {
-						animation: none;
-					}
-				}
-			` }),
-        /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("linearGradient", { id: goldGradientId, x1: "0%", y1: "0%", x2: "100%", y2: "100%", children: [
-          /* @__PURE__ */ jsx("stop", { offset: "0%", stopColor: "#b8860b" }),
-          /* @__PURE__ */ jsx("stop", { offset: "35%", stopColor: "#ffd700" }),
-          /* @__PURE__ */ jsx("stop", { offset: "50%", stopColor: "#fffacd" }),
-          /* @__PURE__ */ jsx("stop", { offset: "65%", stopColor: "#ffd700" }),
-          /* @__PURE__ */ jsx("stop", { offset: "100%", stopColor: "#b8860b" })
-        ] }) }),
-        /* @__PURE__ */ jsx("rect", { width: "100", height: "100", fill: "#d8d4c5" }),
-        /* @__PURE__ */ jsx("rect", { width: "100", height: "100", fill: "#b8c4b8", opacity: "0.35" }),
-        /* @__PURE__ */ jsx("ellipse", { cx: "30", cy: "25", rx: "40", ry: "25", fill: "#ffffff", opacity: "0.08" }),
-        /* @__PURE__ */ jsx("ellipse", { cx: "75", cy: "70", rx: "35", ry: "28", fill: "#000000", opacity: "0.04" }),
-        /* @__PURE__ */ jsx(
-          "path",
-          {
-            d: "M 5 20 Q 25 22 35 45 T 60 80",
-            fill: "none",
-            stroke: "#5a5650",
-            strokeWidth: "0.7",
-            opacity: "0.45"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "path",
-          {
-            d: "M 80 10 Q 70 35 85 55 T 55 95",
-            fill: "none",
-            stroke: "#5a5650",
-            strokeWidth: "0.6",
-            opacity: "0.40"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "path",
-          {
-            d: "M 10 70 Q 30 68 45 55 T 75 45",
-            fill: "none",
-            stroke: "#5a5650",
-            strokeWidth: "0.5",
-            opacity: "0.38"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "path",
-          {
-            className: `${id}-gold-vein`,
-            d: "M 4 18 Q 24 20 34 43 T 58 78",
-            fill: "none",
-            stroke: `url(#${goldGradientId})`,
-            strokeWidth: "1.4",
-            strokeLinecap: "round"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "path",
-          {
-            className: `${id}-gold-vein`,
-            d: "M 82 8 Q 72 33 87 53 T 53 93",
-            fill: "none",
-            stroke: `url(#${goldGradientId})`,
-            strokeWidth: "1.2",
-            strokeLinecap: "round"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "path",
-          {
-            className: `${id}-gold-vein`,
-            d: "M 8 68 Q 28 66 43 53 T 73 43",
-            fill: "none",
-            stroke: `url(#${goldGradientId})`,
-            strokeWidth: "1.0",
-            strokeLinecap: "round"
-          }
-        )
-      ]
-    }
-  );
-}
-var kintsugiConfig = {
-  render: KintsugiSurface,
-  default: {
-    style: {
-      color: "#4a4030",
-      boxShadow: "inset 0 0 0 1px rgba(74, 64, 48, 0.12)"
-    }
-  },
-  active: {
-    style: {
-      color: "#ffffff"
-    }
-  }
-};
-function OilslickSurface({
-  id,
-  active
-}) {
-  if (active) {
-    return /* @__PURE__ */ jsx(
-      "svg",
-      {
-        className: cn(
-          "size-full",
-          !active && "[filter:saturate(1.15)] group-hover:[filter:saturate(1.3)_brightness(1.08)]"
-        ),
-        width: "100%",
-        height: "100%",
-        viewBox: "0 0 100 100",
-        preserveAspectRatio: "none",
-        children: /* @__PURE__ */ jsx("rect", { width: "100", height: "100", fill: "#1a1a2e" })
-      }
-    );
-  }
-  const gradientA = `${id}-oilslick-a`;
-  const gradientB = `${id}-oilslick-b`;
-  const gradientC = `${id}-oilslick-c`;
-  return /* @__PURE__ */ jsxs(
-    "svg",
-    {
-      className: cn(
-        "size-full",
-        !active && "[filter:saturate(1.15)] group-hover:[filter:saturate(1.3)_brightness(1.08)]"
-      ),
-      width: "100%",
-      height: "100%",
-      viewBox: "0 0 100 100",
-      preserveAspectRatio: "none",
-      children: [
-        /* @__PURE__ */ jsxs("defs", { children: [
-          /* @__PURE__ */ jsxs("radialGradient", { id: gradientA, cx: "30%", cy: "30%", r: "70%", children: [
-            /* @__PURE__ */ jsx("stop", { offset: "0%", stopColor: "#8b5cf6", children: /* @__PURE__ */ jsx(
-              "animate",
-              {
-                attributeName: "stop-color",
-                values: "#8b5cf6;#06b6d4;#8b5cf6",
-                dur: "8s",
-                repeatCount: "indefinite"
-              }
-            ) }),
-            /* @__PURE__ */ jsx("stop", { offset: "60%", stopColor: "#1e1b4b", stopOpacity: "0.9" }),
-            /* @__PURE__ */ jsx("stop", { offset: "100%", stopColor: "#0f0f1a", stopOpacity: "0" })
-          ] }),
-          /* @__PURE__ */ jsxs("radialGradient", { id: gradientB, cx: "70%", cy: "60%", r: "60%", children: [
-            /* @__PURE__ */ jsx("stop", { offset: "0%", stopColor: "#10b981", children: /* @__PURE__ */ jsx(
-              "animate",
-              {
-                attributeName: "stop-color",
-                values: "#10b981;#f59e0b;#ec4899;#10b981",
-                dur: "10s",
-                repeatCount: "indefinite"
-              }
-            ) }),
-            /* @__PURE__ */ jsx("stop", { offset: "55%", stopColor: "#1e1b4b", stopOpacity: "0.8" }),
-            /* @__PURE__ */ jsx("stop", { offset: "100%", stopColor: "#0f0f1a", stopOpacity: "0" })
-          ] }),
-          /* @__PURE__ */ jsxs("radialGradient", { id: gradientC, cx: "50%", cy: "80%", r: "55%", children: [
-            /* @__PURE__ */ jsx("stop", { offset: "0%", stopColor: "#ec4899", children: /* @__PURE__ */ jsx(
-              "animate",
-              {
-                attributeName: "stop-color",
-                values: "#ec4899;#8b5cf6;#06b6d4;#ec4899",
-                dur: "7s",
-                repeatCount: "indefinite"
-              }
-            ) }),
-            /* @__PURE__ */ jsx("stop", { offset: "50%", stopColor: "#1e1b4b", stopOpacity: "0.7" }),
-            /* @__PURE__ */ jsx("stop", { offset: "100%", stopColor: "#0f0f1a", stopOpacity: "0" })
-          ] })
-        ] }),
-        /* @__PURE__ */ jsx("rect", { width: "100", height: "100", fill: "#0a0a12" }),
-        /* @__PURE__ */ jsx(
-          "rect",
-          {
-            width: "100",
-            height: "100",
-            fill: `url(#${gradientA})`,
-            opacity: "0.85"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "rect",
-          {
-            width: "100",
-            height: "100",
-            fill: `url(#${gradientB})`,
-            opacity: "0.75"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "rect",
-          {
-            width: "100",
-            height: "100",
-            fill: `url(#${gradientC})`,
-            opacity: "0.70"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "path",
-          {
-            d: "M -10 60 Q 25 45 50 60 T 110 55",
-            fill: "none",
-            stroke: "#ffffff",
-            strokeWidth: "0.8",
-            opacity: "0.12",
-            children: /* @__PURE__ */ jsx(
-              "animate",
-              {
-                attributeName: "d",
-                values: "M -10 60 Q 25 45 50 60 T 110 55;M -10 55 Q 30 70 55 50 T 110 65;M -10 60 Q 25 45 50 60 T 110 55",
-                dur: "12s",
-                repeatCount: "indefinite"
-              }
-            )
-          }
-        )
-      ]
-    }
-  );
-}
-var oilslickConfig = {
-  render: OilslickSurface,
-  default: {
-    style: {
-      color: "#ffffff",
-      boxShadow: "inset 0 0 0 1px rgba(255, 255, 255, 0.08), 0 0 10px rgba(139, 92, 246, 0.20)"
-    }
-  },
-  active: {
-    style: {
-      color: "#ffffff"
-    }
-  }
-};
-function RainbowSurface({
-  id,
-  active
-}) {
-  const gradientId = `${id}-rainbow-gradient`;
-  return /* @__PURE__ */ jsxs(
-    "svg",
-    {
-      className: cn(
-        "size-full",
-        !active && "group-hover:[filter:brightness(1.08)]"
-      ),
-      width: "100%",
-      height: "100%",
-      viewBox: "0 0 100 100",
-      preserveAspectRatio: "none",
-      children: [
-        /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs(
-          "linearGradient",
-          {
-            id: gradientId,
-            x1: "0%",
-            y1: "0%",
-            x2: "100%",
-            y2: "0%",
-            gradientTransform: "rotate(30, 0.5, 0.5)",
-            children: [
-              /* @__PURE__ */ jsx("stop", { offset: "0%", stopColor: "#fbffca" }),
-              /* @__PURE__ */ jsx("stop", { offset: "33%", stopColor: "#baffbf" }),
-              /* @__PURE__ */ jsx("stop", { offset: "66%", stopColor: "#a7efff" }),
-              /* @__PURE__ */ jsx("stop", { offset: "100%", stopColor: "#ffabff" })
-            ]
-          }
-        ) }),
-        /* @__PURE__ */ jsx(
-          "rect",
-          {
-            width: "100",
-            height: "100",
-            fill: active ? "#005458" : `url(#${gradientId})`
-          }
-        )
-      ]
-    }
-  );
-}
-var rainbowConfig = {
-  render: RainbowSurface,
-  default: {
-    className: "font-bold dark:[text-shadow:0_0_5px_rgba(0,0,0,0.5)]",
-    style: {
-      color: "#ffffff",
-      textShadow: "0 0 5px rgba(0, 0, 0, 0.2)",
-      boxShadow: "inset 0 0 0 1px rgba(0, 247, 255, 0.1)"
-    }
-  },
-  active: {
-    style: {
-      color: "#ffffff"
-    }
-  }
-};
-function SilverSurface({
-  id,
-  active
-}) {
-  const gradientId = `${id}-silver-gradient`;
-  return /* @__PURE__ */ jsxs(
-    "svg",
-    {
-      className: cn(
-        "size-full",
-        !active && "[filter:brightness(1.1)] group-hover:[filter:brightness(1.16)]"
-      ),
-      width: "100%",
-      height: "100%",
-      viewBox: "0 0 100 100",
-      preserveAspectRatio: "none",
-      children: [
-        /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs(
-          "linearGradient",
-          {
-            id: gradientId,
-            x1: "0%",
-            y1: "0%",
-            x2: "100%",
-            y2: "0%",
-            gradientTransform: "rotate(30, 0.5, 0.5)",
-            children: [
-              /* @__PURE__ */ jsx("stop", { offset: "10%", stopColor: "#afaeae" }),
-              /* @__PURE__ */ jsx("stop", { offset: "30%", stopColor: "#d6d6d6" }),
-              /* @__PURE__ */ jsx("stop", { offset: "50%", stopColor: "#eeeeee" }),
-              /* @__PURE__ */ jsx("stop", { offset: "70%", stopColor: "#d6d6d6" }),
-              /* @__PURE__ */ jsx("stop", { offset: "90%", stopColor: "#afaeae" })
-            ]
-          }
-        ) }),
-        /* @__PURE__ */ jsx(
-          "rect",
-          {
-            width: "100",
-            height: "100",
-            fill: active ? "#5a5a5a" : `url(#${gradientId})`
-          }
-        ),
-        !active && /* @__PURE__ */ jsx(
-          "rect",
-          {
-            x: "0",
-            y: "0",
-            width: "100",
-            height: "8",
-            fill: "#ffffff",
-            opacity: "0.16"
-          }
-        )
-      ]
-    }
-  );
-}
-var silverConfig = {
-  render: SilverSurface,
-  default: {
-    style: {
-      color: "#2a2a2a",
-      boxShadow: "inset 0 0 0 1px rgba(0, 0, 0, 0.08)"
-    }
-  },
-  active: {
-    style: {
-      color: "#ffffff"
-    }
-  }
-};
-var SPECIAL_TAG_CONFIG = {
-  silver: silverConfig,
-  gold: goldConfig,
-  rainbow: rainbowConfig,
-  oilslick: oilslickConfig,
-  kintsugi: kintsugiConfig
-};
-function getSpecialTagStyleConfig(style) {
-  return SPECIAL_TAG_CONFIG[style];
-}
-function SpecialTagSurface(props) {
-  const { style, active, className } = props;
-  const config = SPECIAL_TAG_CONFIG[style];
-  const Renderer = config.render;
-  const reactId = useId();
-  const safeId = reactId.replace(/:/g, "-");
-  return /* @__PURE__ */ jsx("span", { className: cn(className), "aria-hidden": "true", children: /* @__PURE__ */ jsx(Renderer, { id: safeId, active }) });
-}
-
-export { SpecialTagSurface, getSpecialTagStyleConfig };
+export { SpecialTagSurface, getSpecialTagStyleConfig } from '../chunk-GKSX5ULZ.js';
+import '../chunk-M5OJN54O.js';
+import '../chunk-2HWSCY4T.js';
 //# sourceMappingURL=special-tag-surface.js.map
 //# sourceMappingURL=special-tag-surface.js.map