@manafishrov/ui 1.0.5 → 1.1.0

package/dist/components/TagsInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"TagsInput.js","sources":["../../src/components/TagsInput.tsx"],"sourcesContent":["import { TagsInput as TagsInputPrimitive } from '@ark-ui/solid/tags-input';\nimport { type Component, splitProps } from 'solid-js';\nimport { cn } from 'tailwind-variants';\nimport OutlineCloseIcon from '~icons/ic/outline-close';\n\nexport const TagsInput = TagsInputPrimitive.Root;\nexport const TagsInputContext = TagsInputPrimitive.Context;\nexport const TagsInputHiddenInput = TagsInputPrimitive.HiddenInput;\nexport const TagsInputLabel: Component<TagsInputPrimitive.LabelProps> = (props) => {\n  const [local, others] = splitProps(props, ['class']);\n  return (\n    <TagsInputPrimitive.Label\n      class={cn(\n        'mb-1 gap-2 text-sm font-medium flex items-center leading-none select-none group-data-disabled:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50',\n        local.class,\n      )}\n      {...others}\n    />\n  );\n};\nexport const TagsInputControl: Component<TagsInputPrimitive.ControlProps> = (props) => {\n  const [local, others] = splitProps(props, ['class', 'children']);\n  return (\n    <TagsInputPrimitive.Control\n      class={cn(\n        'group relative min-h-10 py-1.5 pr-8 pl-2.5 text-sm [&_svg:not([class*=\"size-\"])]:size-4 gap-1 shadow-sm flex w-full flex-wrap items-center rounded-lg border border-input bg-transparent transition-colors outline-none disabled:cursor-not-allowed disabled:opacity-50 dark:bg-input/30 dark:hover:bg-input/50 [&_svg]:pointer-events-none [&_svg]:shrink-0',\n        'focus-within:border-ring focus-within:ring-[3px] focus-within:ring-ring/50',\n        'data-[invalid=true]:border-destructive data-[invalid=true]:ring-[3px] data-[invalid=true]:ring-destructive/20 dark:data-[invalid=true]:ring-destructive/40',\n        'data-[disabled=true]:bg-input/50 data-[disabled=true]:opacity-50 dark:data-[disabled=true]:bg-input/80',\n        'data-[readonly=true]:focus-within:border-input data-[readonly=true]:focus-within:ring-0',\n        local.class,\n      )}\n      {...others}\n    >\n      {local.children}\n    </TagsInputPrimitive.Control>\n  );\n};\n\nexport const TagsInputInput: Component<TagsInputPrimitive.InputProps> = (props) => {\n  const [local, others] = splitProps(props, ['class']);\n  return (\n    <TagsInputPrimitive.Input\n      class={cn(\n        'w-24 min-w-24 flex-none bg-transparent outline-none placeholder:text-muted-foreground',\n        'group-has-[div[data-slot=tags-input-item-preview]]:placeholder:text-transparent',\n        'max-w-full',\n        local.class,\n      )}\n      {...others}\n    />\n  );\n};\n\nexport const TagsInputClearTrigger: Component<TagsInputPrimitive.ClearTriggerProps> = (props) => {\n  const [local, others] = splitProps(props, ['class', 'children']);\n  return (\n    <TagsInputPrimitive.ClearTrigger\n      class={cn(\n        'right-2 top-1/2 p-0.5 absolute -translate-y-1/2 rounded-sm text-muted-foreground transition-colors hover:text-foreground',\n        local.class,\n      )}\n      {...others}\n    >\n      {local.children ?? <OutlineCloseIcon class='size-3.5 pointer-events-none' />}\n    </TagsInputPrimitive.ClearTrigger>\n  );\n};\n\nexport const TagsInputItem: Component<TagsInputPrimitive.ItemProps> = (props) => {\n  const [local, others] = splitProps(props, ['class', 'children']);\n  return (\n    <TagsInputPrimitive.Item\n      class={cn('inline-flex items-center outline-none cursor-default', local.class)}\n      {...others}\n    >\n      {local.children}\n    </TagsInputPrimitive.Item>\n  );\n};\n\nexport const TagsInputItemPreview: Component<TagsInputPrimitive.ItemPreviewProps> = (props) => {\n  const [local, others] = splitProps(props, ['class']);\n  return (\n    <TagsInputPrimitive.ItemPreview\n      data-slot='tags-input-item-preview'\n      class={cn(\n        'h-6 gap-1 px-1.5 text-xs font-medium border border-transparent has-data-[slot=tags-input-item-delete-trigger]:pr-0 inline-flex items-center justify-center rounded-md bg-muted whitespace-nowrap text-foreground transition-colors',\n        'data-highlighted:bg-accent data-highlighted:text-accent-foreground data-highlighted:border-ring',\n        'data-disabled:pointer-events-none data-[disabled=true]:cursor-not-allowed data-[disabled=true]:opacity-50',\n        local.class,\n      )}\n      {...others}\n    />\n  );\n};\n\nexport const TagsInputItemText: Component<TagsInputPrimitive.ItemTextProps> = (props) => {\n  const [local, others] = splitProps(props, ['class']);\n  return <TagsInputPrimitive.ItemText class={cn(local.class)} {...others} />;\n};\n\nexport const TagsInputItemInput: Component<TagsInputPrimitive.ItemInputProps> = (props) => {\n  const [local, others] = splitProps(props, ['class']);\n  return (\n    <TagsInputPrimitive.ItemInput\n      class={cn(\n        'py-0 px-1.5 h-6 text-xs rounded-md border border-input bg-background text-foreground outline-none',\n        'focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:border-ring',\n        local.class,\n      )}\n      {...others}\n    />\n  );\n};\n\nexport const TagsInputItemDeleteTrigger: Component<TagsInputPrimitive.ItemDeleteTriggerProps> = (\n  props,\n) => {\n  const [local, others] = splitProps(props, ['class', 'children']);\n  return (\n    <TagsInputPrimitive.ItemDeleteTrigger\n      data-slot='tags-input-item-delete-trigger'\n      class={cn(\n        '-ml-1 p-0.5 inline-flex items-center justify-center rounded-sm text-muted-foreground transition-colors hover:text-foreground',\n        local.class,\n      )}\n      {...others}\n    >\n      {local.children ?? <OutlineCloseIcon class='size-3 pointer-events-none' />}\n    </TagsInputPrimitive.ItemDeleteTrigger>\n  );\n};\n"],"names":["TagsInput","TagsInputPrimitive","Root","TagsInputContext","Context","TagsInputHiddenInput","HiddenInput","TagsInputLabel","props","local","others","splitProps","_$createComponent","Label","_$mergeProps","cn","class","TagsInputControl","Control","children","TagsInputInput","Input","TagsInputClearTrigger","ClearTrigger","OutlineCloseIcon","TagsInputItem","Item","TagsInputItemPreview","ItemPreview","TagsInputItemText","ItemText","TagsInputItemInput","ItemInput","TagsInputItemDeleteTrigger","ItemDeleteTrigger"],"mappings":"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"}
+{"version":3,"file":"TagsInput.js","sources":["../../src/components/TagsInput.tsx"],"sourcesContent":["import { TagsInput as TagsInputPrimitive } from '@ark-ui/solid/tags-input';\nimport { type Component, splitProps } from 'solid-js';\nimport { cn } from 'tailwind-variants';\nimport CloseIcon from '~icons/material-symbols/close';\n\nexport const TagsInput = TagsInputPrimitive.Root;\nexport const TagsInputContext = TagsInputPrimitive.Context;\nexport const TagsInputHiddenInput = TagsInputPrimitive.HiddenInput;\nexport const TagsInputLabel: Component<TagsInputPrimitive.LabelProps> = (props) => {\n  const [local, others] = splitProps(props, ['class']);\n  return (\n    <TagsInputPrimitive.Label\n      class={cn(\n        'mb-1 gap-2 text-sm font-medium flex items-center leading-none select-none group-data-disabled:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50',\n        local.class,\n      )}\n      {...others}\n    />\n  );\n};\nexport const TagsInputControl: Component<TagsInputPrimitive.ControlProps> = (props) => {\n  const [local, others] = splitProps(props, ['class', 'children']);\n  return (\n    <TagsInputPrimitive.Control\n      class={cn(\n        'group min-h-10 py-1.5 pr-8 pl-2.5 text-sm [&_svg:not([class*=\"size-\"])]:size-4 gap-1 shadow-sm relative flex w-full flex-wrap items-center rounded-lg border border-input bg-transparent transition-colors outline-none disabled:cursor-not-allowed disabled:opacity-50 dark:bg-input/30 dark:hover:bg-input/50 [&_svg]:pointer-events-none [&_svg]:shrink-0',\n        'focus-within:border-ring focus-within:ring-[3px] focus-within:ring-ring/50',\n        'data-[invalid=true]:border-destructive data-[invalid=true]:ring-[3px] data-[invalid=true]:ring-destructive/20 dark:data-[invalid=true]:ring-destructive/40',\n        'data-[disabled=true]:bg-input/50 data-[disabled=true]:opacity-50 dark:data-[disabled=true]:bg-input/80',\n        'data-[readonly=true]:focus-within:border-input data-[readonly=true]:focus-within:ring-0',\n        local.class,\n      )}\n      {...others}\n    >\n      {local.children}\n    </TagsInputPrimitive.Control>\n  );\n};\n\nexport const TagsInputInput: Component<TagsInputPrimitive.InputProps> = (props) => {\n  const [local, others] = splitProps(props, ['class']);\n  return (\n    <TagsInputPrimitive.Input\n      class={cn(\n        'w-24 min-w-24 flex-none bg-transparent outline-none placeholder:text-muted-foreground',\n        'group-has-[div[data-slot=tags-input-item-preview]]:placeholder:text-transparent',\n        'max-w-full',\n        local.class,\n      )}\n      {...others}\n    />\n  );\n};\n\nexport const TagsInputClearTrigger: Component<TagsInputPrimitive.ClearTriggerProps> = (props) => {\n  const [local, others] = splitProps(props, ['class', 'children']);\n  return (\n    <TagsInputPrimitive.ClearTrigger\n      class={cn(\n        'right-2 p-0.5 absolute top-1/2 -translate-y-1/2 rounded-sm text-muted-foreground transition-colors hover:text-foreground',\n        local.class,\n      )}\n      {...others}\n    >\n      {local.children ?? <CloseIcon class='size-3.5 pointer-events-none' />}\n    </TagsInputPrimitive.ClearTrigger>\n  );\n};\n\nexport const TagsInputItem: Component<TagsInputPrimitive.ItemProps> = (props) => {\n  const [local, others] = splitProps(props, ['class', 'children']);\n  return (\n    <TagsInputPrimitive.Item\n      class={cn('inline-flex cursor-default items-center outline-none', local.class)}\n      {...others}\n    >\n      {local.children}\n    </TagsInputPrimitive.Item>\n  );\n};\n\nexport const TagsInputItemPreview: Component<TagsInputPrimitive.ItemPreviewProps> = (props) => {\n  const [local, others] = splitProps(props, ['class']);\n  return (\n    <TagsInputPrimitive.ItemPreview\n      data-slot='tags-input-item-preview'\n      class={cn(\n        'h-6 gap-1 px-1.5 text-xs font-medium has-data-[slot=tags-input-item-delete-trigger]:pr-0 inline-flex items-center justify-center rounded-md border border-transparent bg-muted whitespace-nowrap text-foreground transition-colors',\n        'data-highlighted:border-ring data-highlighted:bg-accent data-highlighted:text-accent-foreground',\n        'data-disabled:pointer-events-none data-[disabled=true]:cursor-not-allowed data-[disabled=true]:opacity-50',\n        local.class,\n      )}\n      {...others}\n    />\n  );\n};\n\nexport const TagsInputItemText: Component<TagsInputPrimitive.ItemTextProps> = (props) => {\n  const [local, others] = splitProps(props, ['class']);\n  return <TagsInputPrimitive.ItemText class={cn(local.class)} {...others} />;\n};\n\nexport const TagsInputItemInput: Component<TagsInputPrimitive.ItemInputProps> = (props) => {\n  const [local, others] = splitProps(props, ['class']);\n  return (\n    <TagsInputPrimitive.ItemInput\n      class={cn(\n        'py-0 px-1.5 h-6 text-xs rounded-md border border-input bg-background text-foreground outline-none',\n        'focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50',\n        local.class,\n      )}\n      {...others}\n    />\n  );\n};\n\nexport const TagsInputItemDeleteTrigger: Component<TagsInputPrimitive.ItemDeleteTriggerProps> = (\n  props,\n) => {\n  const [local, others] = splitProps(props, ['class', 'children']);\n  return (\n    <TagsInputPrimitive.ItemDeleteTrigger\n      data-slot='tags-input-item-delete-trigger'\n      class={cn(\n        '-ml-1 p-0.5 inline-flex items-center justify-center rounded-sm text-muted-foreground transition-colors hover:text-foreground',\n        local.class,\n      )}\n      {...others}\n    >\n      {local.children ?? <CloseIcon class='size-3 pointer-events-none' />}\n    </TagsInputPrimitive.ItemDeleteTrigger>\n  );\n};\n"],"names":["TagsInput","TagsInputPrimitive","Root","TagsInputContext","Context","TagsInputHiddenInput","HiddenInput","TagsInputLabel","props","local","others","splitProps","_$createComponent","Label","_$mergeProps","cn","class","TagsInputControl","Control","children","TagsInputInput","Input","TagsInputClearTrigger","ClearTrigger","CloseIcon","TagsInputItem","Item","TagsInputItemPreview","ItemPreview","TagsInputItemText","ItemText","TagsInputItemInput","ItemInput","TagsInputItemDeleteTrigger","ItemDeleteTrigger"],"mappings":";;;;;AAKO,MAAMA,IAAYC,EAAmBC,MAC/BC,IAAmBF,EAAmBG,SACtCC,IAAuBJ,EAAmBK,aAC1CC,IAA4DC,CAAAA,MAAU;AACjF,QAAM,CAACC,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CAAC,OAAO,CAAC;AACnD,SAAAI,EACGX,EAAmBY,OAAKC,EAAA;AAAA,IAAA,IAAA,QAAA;AAAA,aAChBC,EACL,qNACAN,EAAMO,KACR;AAAA,IAAC;AAAA,EAAA,GACGN,CAAM,CAAA;AAGhB,GACaO,IAAgET,CAAAA,MAAU;AACrF,QAAM,CAACC,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CAAC,SAAS,UAAU,CAAC;AAC/D,SAAAI,EACGX,EAAmBiB,SAAOJ,EAAA;AAAA,IAAA,IAAA,QAAA;AAAA,aAClBC,EACL,gWACA,8EACA,8JACA,0GACA,2FACAN,EAAMO,KACR;AAAA,IAAC;AAAA,EAAA,GACGN,GAAM;AAAA,IAAA,IAAAS,WAAA;AAAA,aAETV,EAAMU;AAAAA,IAAQ;AAAA,EAAA,CAAA,CAAA;AAGrB,GAEaC,IAA4DZ,CAAAA,MAAU;AACjF,QAAM,CAACC,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CAAC,OAAO,CAAC;AACnD,SAAAI,EACGX,EAAmBoB,OAAKP,EAAA;AAAA,IAAA,IAAA,QAAA;AAAA,aAChBC,EACL,yFACA,mFACA,cACAN,EAAMO,KACR;AAAA,IAAC;AAAA,EAAA,GACGN,CAAM,CAAA;AAGhB,GAEaY,IAA0Ed,CAAAA,MAAU;AAC/F,QAAM,CAACC,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CAAC,SAAS,UAAU,CAAC;AAC/D,SAAAI,EACGX,EAAmBsB,cAAYT,EAAA;AAAA,IAAA,IAAA,QAAA;AAAA,aACvBC,EACL,4HACAN,EAAMO,KACR;AAAA,IAAC;AAAA,EAAA,GACGN,GAAM;AAAA,IAAA,IAAAS,WAAA;AAAA,aAETV,EAAMU,YAAQP,EAAKY,GAAS;AAAA,QAAA,OAAA;AAAA,MAAA,CAAA;AAAA,IAAwC;AAAA,EAAA,CAAA,CAAA;AAG3E,GAEaC,IAA0DjB,CAAAA,MAAU;AAC/E,QAAM,CAACC,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CAAC,SAAS,UAAU,CAAC;AAC/D,SAAAI,EACGX,EAAmByB,MAAIZ,EAAA;AAAA,IAAA,IAAA,QAAA;AAAA,aACfC,EAAG,wDAAwDN,EAAMO,KAAK;AAAA,IAAC;AAAA,EAAA,GAC1EN,GAAM;AAAA,IAAA,IAAAS,WAAA;AAAA,aAETV,EAAMU;AAAAA,IAAQ;AAAA,EAAA,CAAA,CAAA;AAGrB,GAEaQ,IAAwEnB,CAAAA,MAAU;AAC7F,QAAM,CAACC,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CAAC,OAAO,CAAC;AACnD,SAAAI,EACGX,EAAmB2B,aAAWd,EAAA;AAAA,IAAA,aAAA;AAAA,IAAA,IAAA,QAAA;AAAA,aAEtBC,EACL,sOACA,mGACA,6GACAN,EAAMO,KACR;AAAA,IAAC;AAAA,EAAA,GACGN,CAAM,CAAA;AAGhB,GAEamB,IAAkErB,CAAAA,MAAU;AACvF,QAAM,CAACC,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CAAC,OAAO,CAAC;AACnD,SAAAI,EAAQX,EAAmB6B,UAAQhB,EAAA;AAAA,IAAA,IAAA,QAAA;AAAA,aAAQC,EAAGN,EAAMO,KAAK;AAAA,IAAC;AAAA,EAAA,GAAMN,CAAM,CAAA;AACxE,GAEaqB,IAAoEvB,CAAAA,MAAU;AACzF,QAAM,CAACC,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CAAC,OAAO,CAAC;AACnD,SAAAI,EACGX,EAAmB+B,WAASlB,EAAA;AAAA,IAAA,IAAA,QAAA;AAAA,aACpBC,EACL,qGACA,iFACAN,EAAMO,KACR;AAAA,IAAC;AAAA,EAAA,GACGN,CAAM,CAAA;AAGhB,GAEauB,IACXzB,CAAAA,MACG;AACH,QAAM,CAACC,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CAAC,SAAS,UAAU,CAAC;AAC/D,SAAAI,EACGX,EAAmBiC,mBAAiBpB,EAAA;AAAA,IAAA,aAAA;AAAA,IAAA,IAAA,QAAA;AAAA,aAE5BC,EACL,gIACAN,EAAMO,KACR;AAAA,IAAC;AAAA,EAAA,GACGN,GAAM;AAAA,IAAA,IAAAS,WAAA;AAAA,aAETV,EAAMU,YAAQP,EAAKY,GAAS;AAAA,QAAA,OAAA;AAAA,MAAA,CAAA;AAAA,IAAsC;AAAA,EAAA,CAAA,CAAA;AAGzE;"}

package/dist/components/TreeView.js

@@ -3,7 +3,7 @@ import { tree_view_exports as t } from "../node_modules/.bun/@ark-ui_solid@5.34.
 import { createTreeCollection as I } from "../node_modules/.bun/@ark-ui_solid@5.34.0_95b571dd5236cc92/node_modules/@ark-ui/solid/dist/chunk/EFII6TXL.js";
 import { splitProps as s, Show as l } from "solid-js";
 import { cn as i } from "../node_modules/.bun/tailwind-variants@3.2.2_e7cab99c1b720a38/node_modules/tailwind-variants/dist/index.js";
-import a from "../_virtual/outline-chevron-right.js";
+import a from "../_virtual/chevron-right.js";
 const f = t.Root, m = t.Label, b = t.NodeProvider, v = (n) => {
   const [e, o] = s(n, ["class"]);
   return r(t.Tree, c({

package/dist/components/TreeView.js.map

@@ -1 +1 @@
-{"version":3,"file":"TreeView.js","sources":["../../src/components/TreeView.tsx"],"sourcesContent":["import { TreeView as TreeViewPrimitive, createTreeCollection } from '@ark-ui/solid/tree-view';\nimport { Show, splitProps, type Component } from 'solid-js';\nimport { cn } from 'tailwind-variants';\nimport OutlineChevronRightIcon from '~icons/ic/outline-chevron-right';\n\nexport const TreeView = TreeViewPrimitive.Root;\nexport const TreeViewLabel = TreeViewPrimitive.Label;\nexport const TreeViewNodeProvider = TreeViewPrimitive.NodeProvider;\nexport { createTreeCollection };\n\nexport const TreeViewTree: Component<TreeViewPrimitive.TreeProps> = (props) => {\n  const [local, others] = splitProps(props, ['class']);\n  return <TreeViewPrimitive.Tree class={cn('gap-1 flex flex-col', local.class)} {...others} />;\n};\n\nexport const TreeViewItem: Component<TreeViewPrimitive.ItemProps> = (props) => {\n  const [local, others] = splitProps(props, ['class', 'children']);\n  return (\n    <TreeViewPrimitive.Item\n      class={cn(\n        'gap-2 px-2 py-1.5 text-sm relative flex cursor-pointer items-center rounded-md transition-colors outline-none select-none hover:bg-accent/50 hover:text-accent-foreground/50 focus-visible:bg-accent focus-visible:text-accent-foreground focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 data-selected:bg-accent data-selected:text-accent-foreground',\n        local.class,\n      )}\n      {...others}\n    >\n      <Show when={local.children} fallback={<TreeViewPrimitive.ItemText />}>\n        {local.children}\n      </Show>\n    </TreeViewPrimitive.Item>\n  );\n};\n\nexport const TreeViewBranch: Component<TreeViewPrimitive.BranchProps> = (props) => {\n  const [local, others] = splitProps(props, ['class']);\n  return <TreeViewPrimitive.Branch class={cn('relative', local.class)} {...others} />;\n};\n\nexport const TreeViewBranchControl: Component<TreeViewPrimitive.BranchControlProps> = (props) => {\n  const [local, others] = splitProps(props, ['class', 'children']);\n  return (\n    <TreeViewPrimitive.BranchControl\n      class={cn(\n        'gap-2 px-2 py-1.5 text-sm flex cursor-pointer items-center rounded-md transition-colors outline-none select-none hover:bg-accent/50 hover:text-accent-foreground/50 focus-visible:bg-accent focus-visible:text-accent-foreground focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50',\n        local.class,\n      )}\n      {...others}\n    >\n      <TreeViewPrimitive.BranchIndicator class='text-muted-foreground transition-transform data-[state=open]:rotate-90'>\n        <OutlineChevronRightIcon class='size-4' />\n      </TreeViewPrimitive.BranchIndicator>\n      <Show when={local.children} fallback={<TreeViewPrimitive.BranchText />}>\n        {local.children}\n      </Show>\n    </TreeViewPrimitive.BranchControl>\n  );\n};\n\nexport const TreeViewBranchContent: Component<TreeViewPrimitive.BranchContentProps> = (props) => {\n  const [local, others] = splitProps(props, ['class']);\n  return (\n    <TreeViewPrimitive.BranchContent\n      class={cn('pl-4 relative duration-200', local.class)}\n      {...others}\n    />\n  );\n};\n"],"names":["TreeView","TreeViewPrimitive","Root","TreeViewLabel","Label","TreeViewNodeProvider","NodeProvider","TreeViewTree","props","local","others","splitProps","_$createComponent","Tree","_$mergeProps","cn","class","TreeViewItem","Item","children","Show","when","fallback","ItemText","TreeViewBranch","Branch","TreeViewBranchControl","BranchControl","BranchIndicator","OutlineChevronRightIcon","BranchText","TreeViewBranchContent","BranchContent"],"mappings":";;;;;;AAKO,MAAMA,IAAWC,EAAkBC,MAC7BC,IAAgBF,EAAkBG,OAClCC,IAAuBJ,EAAkBK,cAGzCC,IAAwDC,CAAAA,MAAU;AAC7E,QAAM,CAACC,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CAAC,OAAO,CAAC;AACnD,SAAAI,EAAQX,EAAkBY,MAAIC,EAAA;AAAA,IAAA,IAAA,QAAA;AAAA,aAAQC,EAAG,uBAAuBN,EAAMO,KAAK;AAAA,IAAC;AAAA,EAAA,GAAMN,CAAM,CAAA;AAC1F,GAEaO,IAAwDT,CAAAA,MAAU;AAC7E,QAAM,CAACC,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CAAC,SAAS,UAAU,CAAC;AAC/D,SAAAI,EACGX,EAAkBiB,MAAIJ,EAAA;AAAA,IAAA,IAAA,QAAA;AAAA,aACdC,EACL,+YACAN,EAAMO,KACR;AAAA,IAAC;AAAA,EAAA,GACGN,GAAM;AAAA,IAAA,IAAAS,WAAA;AAAA,aAAAP,EAETQ,GAAI;AAAA,QAAA,IAACC,OAAI;AAAA,iBAAEZ,EAAMU;AAAAA,QAAQ;AAAA,QAAA,IAAEG,WAAQ;AAAA,iBAAAV,EAAGX,EAAkBsB,UAAQ,EAAA;AAAA,QAAA;AAAA,QAAA,IAAAJ,WAAA;AAAA,iBAC9DV,EAAMU;AAAAA,QAAQ;AAAA,MAAA,CAAA;AAAA,IAAA;AAAA,EAAA,CAAA,CAAA;AAIvB,GAEaK,IAA4DhB,CAAAA,MAAU;AACjF,QAAM,CAACC,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CAAC,OAAO,CAAC;AACnD,SAAAI,EAAQX,EAAkBwB,QAAMX,EAAA;AAAA,IAAA,IAAA,QAAA;AAAA,aAAQC,EAAG,YAAYN,EAAMO,KAAK;AAAA,IAAC;AAAA,EAAA,GAAMN,CAAM,CAAA;AACjF,GAEagB,IAA0ElB,CAAAA,MAAU;AAC/F,QAAM,CAACC,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CAAC,SAAS,UAAU,CAAC;AAC/D,SAAAI,EACGX,EAAkB0B,eAAab,EAAA;AAAA,IAAA,IAAA,QAAA;AAAA,aACvBC,EACL,yUACAN,EAAMO,KACR;AAAA,IAAC;AAAA,EAAA,GACGN,GAAM;AAAA,IAAA,IAAAS,WAAA;AAAA,aAAA,CAAAP,EAETX,EAAkB2B,iBAAe;AAAA,QAAA,OAAA;AAAA,QAAA,IAAAT,WAAA;AAAA,iBAAAP,EAC/BiB,GAAuB;AAAA,YAAA,OAAA;AAAA,UAAA,CAAA;AAAA,QAAA;AAAA,MAAA,CAAA,GAAAjB,EAEzBQ,GAAI;AAAA,QAAA,IAACC,OAAI;AAAA,iBAAEZ,EAAMU;AAAAA,QAAQ;AAAA,QAAA,IAAEG,WAAQ;AAAA,iBAAAV,EAAGX,EAAkB6B,YAAU,EAAA;AAAA,QAAA;AAAA,QAAA,IAAAX,WAAA;AAAA,iBAChEV,EAAMU;AAAAA,QAAQ;AAAA,MAAA,CAAA,CAAA;AAAA,IAAA;AAAA,EAAA,CAAA,CAAA;AAIvB,GAEaY,IAA0EvB,CAAAA,MAAU;AAC/F,QAAM,CAACC,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CAAC,OAAO,CAAC;AACnD,SAAAI,EACGX,EAAkB+B,eAAalB,EAAA;AAAA,IAAA,IAAA,QAAA;AAAA,aACvBC,EAAG,8BAA8BN,EAAMO,KAAK;AAAA,IAAC;AAAA,EAAA,GAChDN,CAAM,CAAA;AAGhB;"}
+{"version":3,"file":"TreeView.js","sources":["../../src/components/TreeView.tsx"],"sourcesContent":["import { TreeView as TreeViewPrimitive, createTreeCollection } from '@ark-ui/solid/tree-view';\nimport { Show, splitProps, type Component } from 'solid-js';\nimport { cn } from 'tailwind-variants';\nimport ChevronRightIcon from '~icons/material-symbols/chevron-right';\n\nexport const TreeView = TreeViewPrimitive.Root;\nexport const TreeViewLabel = TreeViewPrimitive.Label;\nexport const TreeViewNodeProvider = TreeViewPrimitive.NodeProvider;\nexport { createTreeCollection };\n\nexport const TreeViewTree: Component<TreeViewPrimitive.TreeProps> = (props) => {\n  const [local, others] = splitProps(props, ['class']);\n  return <TreeViewPrimitive.Tree class={cn('gap-1 flex flex-col', local.class)} {...others} />;\n};\n\nexport const TreeViewItem: Component<TreeViewPrimitive.ItemProps> = (props) => {\n  const [local, others] = splitProps(props, ['class', 'children']);\n  return (\n    <TreeViewPrimitive.Item\n      class={cn(\n        'gap-2 px-2 py-1.5 text-sm relative flex cursor-pointer items-center rounded-md transition-colors outline-none select-none hover:bg-accent/50 hover:text-accent-foreground/50 focus-visible:bg-accent focus-visible:text-accent-foreground focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 data-selected:bg-accent data-selected:text-accent-foreground',\n        local.class,\n      )}\n      {...others}\n    >\n      <Show when={local.children} fallback={<TreeViewPrimitive.ItemText />}>\n        {local.children}\n      </Show>\n    </TreeViewPrimitive.Item>\n  );\n};\n\nexport const TreeViewBranch: Component<TreeViewPrimitive.BranchProps> = (props) => {\n  const [local, others] = splitProps(props, ['class']);\n  return <TreeViewPrimitive.Branch class={cn('relative', local.class)} {...others} />;\n};\n\nexport const TreeViewBranchControl: Component<TreeViewPrimitive.BranchControlProps> = (props) => {\n  const [local, others] = splitProps(props, ['class', 'children']);\n  return (\n    <TreeViewPrimitive.BranchControl\n      class={cn(\n        'gap-2 px-2 py-1.5 text-sm flex cursor-pointer items-center rounded-md transition-colors outline-none select-none hover:bg-accent/50 hover:text-accent-foreground/50 focus-visible:bg-accent focus-visible:text-accent-foreground focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50',\n        local.class,\n      )}\n      {...others}\n    >\n      <TreeViewPrimitive.BranchIndicator class='text-muted-foreground transition-transform data-[state=open]:rotate-90'>\n        <ChevronRightIcon class='size-4' />\n      </TreeViewPrimitive.BranchIndicator>\n      <Show when={local.children} fallback={<TreeViewPrimitive.BranchText />}>\n        {local.children}\n      </Show>\n    </TreeViewPrimitive.BranchControl>\n  );\n};\n\nexport const TreeViewBranchContent: Component<TreeViewPrimitive.BranchContentProps> = (props) => {\n  const [local, others] = splitProps(props, ['class']);\n  return (\n    <TreeViewPrimitive.BranchContent\n      class={cn('pl-4 relative duration-200', local.class)}\n      {...others}\n    />\n  );\n};\n"],"names":["TreeView","TreeViewPrimitive","Root","TreeViewLabel","Label","TreeViewNodeProvider","NodeProvider","TreeViewTree","props","local","others","splitProps","_$createComponent","Tree","_$mergeProps","cn","class","TreeViewItem","Item","children","Show","when","fallback","ItemText","TreeViewBranch","Branch","TreeViewBranchControl","BranchControl","BranchIndicator","ChevronRightIcon","BranchText","TreeViewBranchContent","BranchContent"],"mappings":";;;;;;AAKO,MAAMA,IAAWC,EAAkBC,MAC7BC,IAAgBF,EAAkBG,OAClCC,IAAuBJ,EAAkBK,cAGzCC,IAAwDC,CAAAA,MAAU;AAC7E,QAAM,CAACC,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CAAC,OAAO,CAAC;AACnD,SAAAI,EAAQX,EAAkBY,MAAIC,EAAA;AAAA,IAAA,IAAA,QAAA;AAAA,aAAQC,EAAG,uBAAuBN,EAAMO,KAAK;AAAA,IAAC;AAAA,EAAA,GAAMN,CAAM,CAAA;AAC1F,GAEaO,IAAwDT,CAAAA,MAAU;AAC7E,QAAM,CAACC,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CAAC,SAAS,UAAU,CAAC;AAC/D,SAAAI,EACGX,EAAkBiB,MAAIJ,EAAA;AAAA,IAAA,IAAA,QAAA;AAAA,aACdC,EACL,+YACAN,EAAMO,KACR;AAAA,IAAC;AAAA,EAAA,GACGN,GAAM;AAAA,IAAA,IAAAS,WAAA;AAAA,aAAAP,EAETQ,GAAI;AAAA,QAAA,IAACC,OAAI;AAAA,iBAAEZ,EAAMU;AAAAA,QAAQ;AAAA,QAAA,IAAEG,WAAQ;AAAA,iBAAAV,EAAGX,EAAkBsB,UAAQ,EAAA;AAAA,QAAA;AAAA,QAAA,IAAAJ,WAAA;AAAA,iBAC9DV,EAAMU;AAAAA,QAAQ;AAAA,MAAA,CAAA;AAAA,IAAA;AAAA,EAAA,CAAA,CAAA;AAIvB,GAEaK,IAA4DhB,CAAAA,MAAU;AACjF,QAAM,CAACC,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CAAC,OAAO,CAAC;AACnD,SAAAI,EAAQX,EAAkBwB,QAAMX,EAAA;AAAA,IAAA,IAAA,QAAA;AAAA,aAAQC,EAAG,YAAYN,EAAMO,KAAK;AAAA,IAAC;AAAA,EAAA,GAAMN,CAAM,CAAA;AACjF,GAEagB,IAA0ElB,CAAAA,MAAU;AAC/F,QAAM,CAACC,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CAAC,SAAS,UAAU,CAAC;AAC/D,SAAAI,EACGX,EAAkB0B,eAAab,EAAA;AAAA,IAAA,IAAA,QAAA;AAAA,aACvBC,EACL,yUACAN,EAAMO,KACR;AAAA,IAAC;AAAA,EAAA,GACGN,GAAM;AAAA,IAAA,IAAAS,WAAA;AAAA,aAAA,CAAAP,EAETX,EAAkB2B,iBAAe;AAAA,QAAA,OAAA;AAAA,QAAA,IAAAT,WAAA;AAAA,iBAAAP,EAC/BiB,GAAgB;AAAA,YAAA,OAAA;AAAA,UAAA,CAAA;AAAA,QAAA;AAAA,MAAA,CAAA,GAAAjB,EAElBQ,GAAI;AAAA,QAAA,IAACC,OAAI;AAAA,iBAAEZ,EAAMU;AAAAA,QAAQ;AAAA,QAAA,IAAEG,WAAQ;AAAA,iBAAAV,EAAGX,EAAkB6B,YAAU,EAAA;AAAA,QAAA;AAAA,QAAA,IAAAX,WAAA;AAAA,iBAChEV,EAAMU;AAAAA,QAAQ;AAAA,MAAA,CAAA,CAAA;AAAA,IAAA;AAAA,EAAA,CAAA,CAAA;AAIvB,GAEaY,IAA0EvB,CAAAA,MAAU;AAC/F,QAAM,CAACC,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CAAC,OAAO,CAAC;AACnD,SAAAI,EACGX,EAAkB+B,eAAalB,EAAA;AAAA,IAAA,IAAA,QAAA;AAAA,aACvBC,EAAG,8BAA8BN,EAAMO,KAAK;AAAA,IAAC;AAAA,EAAA,GAChDN,CAAM,CAAA;AAGhB;"}

package/dist/components/sidebar/Sidebar.d.ts

@@ -3,5 +3,6 @@ export type SidebarProps = ComponentProps<'div'> & {
     side?: 'left' | 'right';
     variant?: 'sidebar' | 'floating' | 'inset';
     collapsible?: 'offcanvas' | 'icon' | 'none';
+    disableMobileSidebar?: boolean;
 };
 export declare const Sidebar: Component<SidebarProps>;

package/dist/components/sidebar/Sidebar.js

@@ -1,36 +1,43 @@
-import { createComponent as r, Show as t } from "solid-js/web";
-import { createEffect as c } from "solid-js";
-import { useSidebar as a } from "./context.js";
-import { SidebarDesktop as f } from "./SidebarDesktop.js";
-import { SidebarMobile as m } from "./SidebarMobile.js";
-const S = (e) => {
+import { createComponent as i, Show as r } from "solid-js/web";
+import { onCleanup as s, createEffect as o } from "solid-js";
+import { createMediaQuery as f } from "../../primitives/createMediaQuery.js";
+import { useSidebar as m } from "./context.js";
+import { SidebarDesktop as u } from "./SidebarDesktop.js";
+import { SidebarMobile as S } from "./SidebarMobile.js";
+const D = (e) => {
   const {
-    isMobile: o,
-    setSide: n
-  } = a();
-  return c(() => {
-    const i = e.side ?? "left";
-    n(i);
-  }), r(t, {
+    isMobile: l,
+    setMobileDisabled: t,
+    setOpen: n,
+    setSide: a
+  } = m(), b = f("(max-width: 768px)");
+  return s(() => {
+    t(!1);
+  }), o(() => {
+    const c = e.side ?? "left", d = e.disableMobileSidebar ?? !1;
+    a(c), t(d);
+  }), o(() => {
+    e.disableMobileSidebar === !0 && e.collapsible === "icon" && n(!b());
+  }), i(r, {
     get when() {
-      return !o();
+      return !l();
     },
     get fallback() {
-      return r(t, {
+      return i(r, {
         get when() {
           return (e.collapsible ?? "offcanvas") !== "none";
         },
         get children() {
-          return r(m, e);
+          return i(S, e);
         }
       });
     },
     get children() {
-      return r(f, e);
+      return i(u, e);
     }
   });
 };
 export {
-  S as Sidebar
+  D as Sidebar
 };
 //# sourceMappingURL=Sidebar.js.map

package/dist/components/sidebar/Sidebar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Sidebar.js","sources":["../../../src/components/sidebar/Sidebar.tsx"],"sourcesContent":["import { type Component, type ComponentProps, createEffect } from 'solid-js';\n\nimport { useSidebar } from './context';\nimport { SidebarDesktop } from './SidebarDesktop';\nimport { SidebarMobile } from './SidebarMobile';\n\nexport type SidebarProps = ComponentProps<'div'> & {\n  side?: 'left' | 'right';\n  variant?: 'sidebar' | 'floating' | 'inset';\n  collapsible?: 'offcanvas' | 'icon' | 'none';\n};\n\nexport const Sidebar: Component<SidebarProps> = (props) => {\n  const { isMobile, setSide } = useSidebar();\n\n  // Set side on initial render and track changes\n  createEffect(() => {\n    const currentSide = props.side ?? 'left';\n    setSide(currentSide);\n  });\n  return (\n    <Show\n      when={!isMobile()}\n      fallback={\n        <Show when={(props.collapsible ?? 'offcanvas') !== 'none'}>\n          <SidebarMobile {...props} />\n        </Show>\n      }\n    >\n      <SidebarDesktop {...props} />\n    </Show>\n  );\n};\n"],"names":["Sidebar","props","isMobile","setSide","useSidebar","createEffect","currentSide","side","_$createComponent","_$Show","when","fallback","collapsible","children","SidebarMobile","SidebarDesktop"],"mappings":";;;;;AAYO,MAAMA,IAAoCC,CAAAA,MAAU;AACzD,QAAM;AAAA,IAAEC,UAAAA;AAAAA,IAAUC,SAAAA;AAAAA,EAAAA,IAAYC,EAAAA;AAG9BC,SAAAA,EAAa,MAAM;AACjB,UAAMC,IAAcL,EAAMM,QAAQ;AAClCJ,IAAAA,EAAQG,CAAW;AAAA,EACrB,CAAC,GACDE,EACGC,GAAI;AAAA,IAAA,IACHC,OAAI;AAAA,aAAE,CAACR,EAAAA;AAAAA,IAAU;AAAA,IAAA,IACjBS,WAAQ;AAAA,aAAAH,EACLC,GAAI;AAAA,QAAA,IAACC,OAAI;AAAA,kBAAGT,EAAMW,eAAe,iBAAiB;AAAA,QAAM;AAAA,QAAA,IAAAC,WAAA;AAAA,iBAAAL,EACtDM,GAAkBb,CAAK;AAAA,QAAA;AAAA,MAAA,CAAA;AAAA,IAAA;AAAA,IAAA,IAAAY,WAAA;AAAA,aAAAL,EAI3BO,GAAmBd,CAAK;AAAA,IAAA;AAAA,EAAA,CAAA;AAG/B;"}
+{"version":3,"file":"Sidebar.js","sources":["../../../src/components/sidebar/Sidebar.tsx"],"sourcesContent":["import { type Component, type ComponentProps, createEffect, onCleanup } from 'solid-js';\n\nimport { createMediaQuery } from '@/primitives/createMediaQuery';\n\nimport { useSidebar } from './context';\nimport { SidebarDesktop } from './SidebarDesktop';\nimport { SidebarMobile } from './SidebarMobile';\n\nexport type SidebarProps = ComponentProps<'div'> & {\n  side?: 'left' | 'right';\n  variant?: 'sidebar' | 'floating' | 'inset';\n  collapsible?: 'offcanvas' | 'icon' | 'none';\n  disableMobileSidebar?: boolean;\n};\n\nexport const Sidebar: Component<SidebarProps> = (props) => {\n  const { isMobile, setMobileDisabled, setOpen, setSide } = useSidebar();\n  const isViewportMobile = createMediaQuery('(max-width: 768px)');\n\n  onCleanup(() => {\n    setMobileDisabled(false);\n  });\n\n  createEffect(() => {\n    const currentSide = props.side ?? 'left';\n    const mobileDisabled = props.disableMobileSidebar ?? false;\n    setSide(currentSide);\n    setMobileDisabled(mobileDisabled);\n  });\n\n  createEffect(() => {\n    if (props.disableMobileSidebar === true && props.collapsible === 'icon') {\n      setOpen(!isViewportMobile());\n    }\n  });\n\n  return (\n    <Show\n      when={!isMobile()}\n      fallback={\n        <Show when={(props.collapsible ?? 'offcanvas') !== 'none'}>\n          <SidebarMobile {...props} />\n        </Show>\n      }\n    >\n      <SidebarDesktop {...props} />\n    </Show>\n  );\n};\n"],"names":["Sidebar","props","isMobile","setMobileDisabled","setOpen","setSide","useSidebar","isViewportMobile","createMediaQuery","onCleanup","createEffect","currentSide","side","mobileDisabled","disableMobileSidebar","collapsible","_$createComponent","_$Show","when","fallback","children","SidebarMobile","SidebarDesktop"],"mappings":";;;;;;AAeO,MAAMA,IAAoCC,CAAAA,MAAU;AACzD,QAAM;AAAA,IAAEC,UAAAA;AAAAA,IAAUC,mBAAAA;AAAAA,IAAmBC,SAAAA;AAAAA,IAASC,SAAAA;AAAAA,EAAAA,IAAYC,EAAAA,GACpDC,IAAmBC,EAAiB,oBAAoB;AAE9DC,SAAAA,EAAU,MAAM;AACdN,IAAAA,EAAkB,EAAK;AAAA,EACzB,CAAC,GAEDO,EAAa,MAAM;AACjB,UAAMC,IAAcV,EAAMW,QAAQ,QAC5BC,IAAiBZ,EAAMa,wBAAwB;AACrDT,IAAAA,EAAQM,CAAW,GACnBR,EAAkBU,CAAc;AAAA,EAClC,CAAC,GAEDH,EAAa,MAAM;AACjB,IAAIT,EAAMa,yBAAyB,MAAQb,EAAMc,gBAAgB,UAC/DX,EAAQ,CAACG,GAAkB;AAAA,EAE/B,CAAC,GAEDS,EACGC,GAAI;AAAA,IAAA,IACHC,OAAI;AAAA,aAAE,CAAChB,EAAAA;AAAAA,IAAU;AAAA,IAAA,IACjBiB,WAAQ;AAAA,aAAAH,EACLC,GAAI;AAAA,QAAA,IAACC,OAAI;AAAA,kBAAGjB,EAAMc,eAAe,iBAAiB;AAAA,QAAM;AAAA,QAAA,IAAAK,WAAA;AAAA,iBAAAJ,EACtDK,GAAkBpB,CAAK;AAAA,QAAA;AAAA,MAAA,CAAA;AAAA,IAAA;AAAA,IAAA,IAAAmB,WAAA;AAAA,aAAAJ,EAI3BM,GAAmBrB,CAAK;AAAA,IAAA;AAAA,EAAA,CAAA;AAG/B;"}

package/dist/components/sidebar/SidebarDesktop.js

@@ -1,25 +1,25 @@
-import { template as b, insert as g, createComponent as m, mergeProps as f, effect as w, setAttribute as d, className as x, spread as C } from "solid-js/web";
-import { cn as p } from "../../node_modules/.bun/tailwind-variants@3.2.2_e7cab99c1b720a38/node_modules/tailwind-variants/dist/index.js";
-import { useSidebar as k } from "./context.js";
-import { splitProps as u } from "solid-js";
-var S = /* @__PURE__ */ b('<div data-slot=sidebar-container><div data-sidebar=sidebar data-slot=sidebar-inner class="group-data-[variant=floating]:shadow-sm flex size-full flex-col bg-sidebar group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:ring-1 group-data-[variant=floating]:ring-sidebar-border">'), z = /* @__PURE__ */ b('<div class="group peer md:block hidden text-sidebar-foreground"data-slot=sidebar><div data-slot=sidebar-gap>');
-const D = (s) => {
-  const [e, a] = u(s, ["variant", "side", "class", "children"]);
+import { template as u, insert as p, createComponent as x, mergeProps as h, effect as S, className as f, setAttribute as d, spread as k } from "solid-js/web";
+import { cn as l } from "../../node_modules/.bun/tailwind-variants@3.2.2_e7cab99c1b720a38/node_modules/tailwind-variants/dist/index.js";
+import { useSidebar as C } from "./context.js";
+import { splitProps as m } from "solid-js";
+var M = /* @__PURE__ */ u('<div data-slot=sidebar-container><div data-sidebar=sidebar data-slot=sidebar-inner class="group-data-[variant=floating]:shadow-sm flex size-full flex-col bg-sidebar group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:ring-1 group-data-[variant=floating]:ring-sidebar-border">'), z = /* @__PURE__ */ u("<div data-slot=sidebar><div data-slot=sidebar-gap>");
+const D = (o) => {
+  const [i, a] = m(o, ["variant", "side", "class", "children"]);
   return (() => {
-    var i = S(), r = i.firstChild;
-    return C(i, f({
+    var t = M(), r = t.firstChild;
+    return k(t, h({
       get class() {
-        return p("inset-y-0 md:flex fixed z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear", e.side === "left" ? "left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]" : "right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]", e.variant === "floating" || e.variant === "inset" ? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+1rem+2px)]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l", e.class);
+        return l("inset-y-0 md:flex fixed z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear", i.side === "left" ? "left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]" : "right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]", i.variant === "floating" || i.variant === "inset" ? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+1rem+2px)]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l", i.class);
       }
-    }, a), !1, !0), g(r, () => e.children), i;
+    }, a), !1, !0), p(r, () => i.children), t;
   })();
-}, _ = (s) => {
+}, j = (o) => {
   const {
-    state: e
-  } = k(), [a, i] = u(s, ["side", "variant", "collapsible", "class", "children"]);
+    state: i
+  } = C(), [a, t] = m(o, ["side", "variant", "collapsible", "disableMobileSidebar", "class", "children"]);
   return (() => {
-    var r = z(), h = r.firstChild;
-    return g(r, m(D, f({
+    var r = z(), w = r.firstChild;
+    return p(r, x(D, h({
       get variant() {
         return a.variant ?? "sidebar";
       },
@@ -27,25 +27,26 @@ const D = (s) => {
         return a.side ?? "left";
       },
       get class() {
-        return a.class;
+        return l(a.disableMobileSidebar === !0 ? "flex" : "md:flex hidden", a.class);
       }
-    }, i, {
+    }, t, {
       get children() {
         return a.children;
       }
-    })), null), w((t) => {
-      var l = e(), o = e() === "collapsed" ? a.collapsible ?? "offcanvas" : "", n = a.variant ?? "sidebar", c = a.side ?? "left", v = p("relative w-(--sidebar-width) bg-transparent transition-[width] duration-200 ease-linear", "group-data-[collapsible=offcanvas]:w-0", "group-data-[side=right]:rotate-180", a.variant === "floating" || a.variant === "inset" ? "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+1rem)]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon)");
-      return l !== t.e && d(r, "data-state", t.e = l), o !== t.t && d(r, "data-collapsible", t.t = o), n !== t.a && d(r, "data-variant", t.a = n), c !== t.o && d(r, "data-side", t.o = c), v !== t.i && x(h, t.i = v), t;
+    })), null), S((e) => {
+      var s = l(a.disableMobileSidebar === !0 ? "group peer block text-sidebar-foreground" : "group peer md:block hidden text-sidebar-foreground"), n = i(), c = i() === "collapsed" ? a.collapsible ?? "offcanvas" : "", b = a.variant ?? "sidebar", v = a.side ?? "left", g = l("relative w-(--sidebar-width) bg-transparent transition-[width] duration-200 ease-linear", "group-data-[collapsible=offcanvas]:w-0", "group-data-[side=right]:rotate-180", a.variant === "floating" || a.variant === "inset" ? "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+1rem)]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon)");
+      return s !== e.e && f(r, e.e = s), n !== e.t && d(r, "data-state", e.t = n), c !== e.a && d(r, "data-collapsible", e.a = c), b !== e.o && d(r, "data-variant", e.o = b), v !== e.i && d(r, "data-side", e.i = v), g !== e.n && f(w, e.n = g), e;
     }, {
       e: void 0,
       t: void 0,
       a: void 0,
       o: void 0,
-      i: void 0
+      i: void 0,
+      n: void 0
     }), r;
   })();
 };
 export {
-  _ as SidebarDesktop
+  j as SidebarDesktop
 };
 //# sourceMappingURL=SidebarDesktop.js.map

package/dist/components/sidebar/SidebarDesktop.js.map

@@ -1 +1 @@
-{"version":3,"file":"SidebarDesktop.js","sources":["../../../src/components/sidebar/SidebarDesktop.tsx"],"sourcesContent":["import type { Component, ComponentProps, JSXElement } from 'solid-js';\n\nimport { cn } from 'tailwind-variants';\n\nimport type { SidebarProps } from './Sidebar';\n\nimport { useSidebar } from './context';\n\ntype SidebarDesktopContainerProps = ComponentProps<'div'> & {\n  variant: string;\n  side: string;\n  children: JSXElement;\n};\n\nconst SidebarDesktopContainer: Component<SidebarDesktopContainerProps> = (props) => {\n  const [local, others] = splitProps(props, ['variant', 'side', 'class', 'children']);\n  return (\n    <div\n      data-slot='sidebar-container'\n      class={cn(\n        'inset-y-0 md:flex fixed z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear',\n        local.side === 'left'\n          ? 'left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]'\n          : 'right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]',\n        local.variant === 'floating' || local.variant === 'inset'\n          ? 'p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+1rem+2px)]'\n          : 'group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l',\n        local.class,\n      )}\n      {...others}\n    >\n      <div\n        data-sidebar='sidebar'\n        data-slot='sidebar-inner'\n        class='group-data-[variant=floating]:shadow-sm flex size-full flex-col bg-sidebar group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:ring-1 group-data-[variant=floating]:ring-sidebar-border'\n      >\n        {local.children}\n      </div>\n    </div>\n  );\n};\n\nexport const SidebarDesktop: Component<SidebarProps> = (props) => {\n  const { state } = useSidebar();\n  const [local, others] = splitProps(props, [\n    'side',\n    'variant',\n    'collapsible',\n    'class',\n    'children',\n  ]);\n\n  return (\n    <div\n      class='group peer md:block hidden text-sidebar-foreground'\n      data-state={state()}\n      data-collapsible={state() === 'collapsed' ? (local.collapsible ?? 'offcanvas') : ''}\n      data-variant={local.variant ?? 'sidebar'}\n      data-side={local.side ?? 'left'}\n      data-slot='sidebar'\n    >\n      <div\n        data-slot='sidebar-gap'\n        class={cn(\n          'relative w-(--sidebar-width) bg-transparent transition-[width] duration-200 ease-linear',\n          'group-data-[collapsible=offcanvas]:w-0',\n          'group-data-[side=right]:rotate-180',\n          local.variant === 'floating' || local.variant === 'inset'\n            ? 'group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+1rem)]'\n            : 'group-data-[collapsible=icon]:w-(--sidebar-width-icon)',\n        )}\n      />\n      <SidebarDesktopContainer\n        variant={local.variant ?? 'sidebar'}\n        side={local.side ?? 'left'}\n        class={local.class}\n        {...others}\n      >\n        {local.children}\n      </SidebarDesktopContainer>\n    </div>\n  );\n};\n"],"names":["SidebarDesktopContainer","props","local","others","splitProps","_el$","_tmpl$","_el$2","firstChild","_$spread","_$mergeProps","cn","side","variant","class","_$insert","children","SidebarDesktop","state","useSidebar","_el$3","_tmpl$2","_el$4","_$createComponent","_$effect","_p$","_v$","_v$2","collapsible","_v$3","_v$4","_v$5","e","_$setAttribute","t","a","o","i","_$className","undefined"],"mappings":";;;;;AAcA,MAAMA,IAAoEC,CAAAA,MAAU;AAClF,QAAM,CAACC,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CAAC,WAAW,QAAQ,SAAS,UAAU,CAAC;AAClF,UAAA,MAAA;AAAA,QAAAI,IAAAC,EAAAA,GAAAC,IAAAF,EAAAG;AAAAC,WAAAA,EAAAJ,GAAAK,EAAA;AAAA,MAAA,IAAA,QAAA;AAAA,eAGWC,EACL,wHACAT,EAAMU,SAAS,SACX,mFACA,oFACJV,EAAMW,YAAY,cAAcX,EAAMW,YAAY,UAC9C,mFACA,2HACJX,EAAMY,KACR;AAAA,MAAC;AAAA,IAAA,GACGX,CAAM,GAAA,IAAA,EAAA,GAAAY,EAAAR,GAAA,MAOPL,EAAMc,QAAQ,GAAAX;AAAAA,EAAA,GAAA;AAIvB,GAEaY,IAA2ChB,CAAAA,MAAU;AAChE,QAAM;AAAA,IAAEiB,OAAAA;AAAAA,EAAAA,IAAUC,EAAAA,GACZ,CAACjB,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CACxC,QACA,WACA,eACA,SACA,UAAU,CACX;AAED,UAAA,MAAA;AAAA,QAAAmB,IAAAC,EAAAA,GAAAC,IAAAF,EAAAZ;AAAAO,WAAAA,EAAAK,GAAAG,EAoBKvB,GAAuBU,EAAA;AAAA,MAAA,IACtBG,UAAO;AAAA,eAAEX,EAAMW,WAAW;AAAA,MAAS;AAAA,MAAA,IACnCD,OAAI;AAAA,eAAEV,EAAMU,QAAQ;AAAA,MAAM;AAAA,MAAA,IAAA,QAAA;AAAA,eACnBV,EAAMY;AAAAA,MAAK;AAAA,IAAA,GACdX,GAAM;AAAA,MAAA,IAAAa,WAAA;AAAA,eAETd,EAAMc;AAAAA,MAAQ;AAAA,IAAA,CAAA,CAAA,GAAA,IAAA,GAAAQ,EAAAC,CAAAA,MAAA;AAAA,UAAAC,IAvBLR,EAAAA,GAAOS,IACDT,EAAAA,MAAY,cAAehB,EAAM0B,eAAe,cAAe,IAAEC,IACrE3B,EAAMW,WAAW,WAASiB,IAC7B5B,EAAMU,QAAQ,QAAMmB,IAKtBpB,EACL,2FACA,0CACA,sCACAT,EAAMW,YAAY,cAAcX,EAAMW,YAAY,UAC9C,2EACA,wDACN;AAACa,aAAAA,MAAAD,EAAAO,KAAAC,EAAAb,GAAA,cAAAK,EAAAO,IAAAN,CAAA,GAAAC,MAAAF,EAAAS,KAAAD,EAAAb,GAAA,oBAAAK,EAAAS,IAAAP,CAAA,GAAAE,MAAAJ,EAAAU,KAAAF,EAAAb,GAAA,gBAAAK,EAAAU,IAAAN,CAAA,GAAAC,MAAAL,EAAAW,KAAAH,EAAAb,GAAA,aAAAK,EAAAW,IAAAN,CAAA,GAAAC,MAAAN,EAAAY,KAAAC,EAAAhB,GAAAG,EAAAY,IAAAN,CAAA,GAAAN;AAAAA,IAAA,GAAA;AAAA,MAAAO,GAAAO;AAAAA,MAAAL,GAAAK;AAAAA,MAAAJ,GAAAI;AAAAA,MAAAH,GAAAG;AAAAA,MAAAF,GAAAE;AAAAA,IAAAA,CAAA,GAAAnB;AAAAA,EAAA,GAAA;AAYT;"}
+{"version":3,"file":"SidebarDesktop.js","sources":["../../../src/components/sidebar/SidebarDesktop.tsx"],"sourcesContent":["import type { Component, ComponentProps, JSXElement } from 'solid-js';\n\nimport { cn } from 'tailwind-variants';\n\nimport type { SidebarProps } from './Sidebar';\n\nimport { useSidebar } from './context';\n\ntype SidebarDesktopContainerProps = ComponentProps<'div'> & {\n  variant: string;\n  side: string;\n  children: JSXElement;\n};\n\nconst SidebarDesktopContainer: Component<SidebarDesktopContainerProps> = (props) => {\n  const [local, others] = splitProps(props, ['variant', 'side', 'class', 'children']);\n  return (\n    <div\n      data-slot='sidebar-container'\n      class={cn(\n        'inset-y-0 md:flex fixed z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear',\n        local.side === 'left'\n          ? 'left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]'\n          : 'right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]',\n        local.variant === 'floating' || local.variant === 'inset'\n          ? 'p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+1rem+2px)]'\n          : 'group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l',\n        local.class,\n      )}\n      {...others}\n    >\n      <div\n        data-sidebar='sidebar'\n        data-slot='sidebar-inner'\n        class='group-data-[variant=floating]:shadow-sm flex size-full flex-col bg-sidebar group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:ring-1 group-data-[variant=floating]:ring-sidebar-border'\n      >\n        {local.children}\n      </div>\n    </div>\n  );\n};\n\nexport const SidebarDesktop: Component<SidebarProps> = (props) => {\n  const { state } = useSidebar();\n  const [local, others] = splitProps(props, [\n    'side',\n    'variant',\n    'collapsible',\n    'disableMobileSidebar',\n    'class',\n    'children',\n  ]);\n\n  return (\n    <div\n      class={cn(\n        local.disableMobileSidebar === true\n          ? 'group peer block text-sidebar-foreground'\n          : 'group peer md:block hidden text-sidebar-foreground',\n      )}\n      data-state={state()}\n      data-collapsible={state() === 'collapsed' ? (local.collapsible ?? 'offcanvas') : ''}\n      data-variant={local.variant ?? 'sidebar'}\n      data-side={local.side ?? 'left'}\n      data-slot='sidebar'\n    >\n      <div\n        data-slot='sidebar-gap'\n        class={cn(\n          'relative w-(--sidebar-width) bg-transparent transition-[width] duration-200 ease-linear',\n          'group-data-[collapsible=offcanvas]:w-0',\n          'group-data-[side=right]:rotate-180',\n          local.variant === 'floating' || local.variant === 'inset'\n            ? 'group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+1rem)]'\n            : 'group-data-[collapsible=icon]:w-(--sidebar-width-icon)',\n        )}\n      />\n      <SidebarDesktopContainer\n        variant={local.variant ?? 'sidebar'}\n        side={local.side ?? 'left'}\n        class={cn(local.disableMobileSidebar === true ? 'flex' : 'md:flex hidden', local.class)}\n        {...others}\n      >\n        {local.children}\n      </SidebarDesktopContainer>\n    </div>\n  );\n};\n"],"names":["SidebarDesktopContainer","props","local","others","splitProps","_el$","_tmpl$","_el$2","firstChild","_$spread","_$mergeProps","cn","side","variant","class","_$insert","children","SidebarDesktop","state","useSidebar","_el$3","_tmpl$2","_el$4","_$createComponent","disableMobileSidebar","_$effect","_p$","_v$","_v$2","_v$3","collapsible","_v$4","_v$5","_v$6","e","_$className","t","_$setAttribute","a","o","i","n","undefined"],"mappings":";;;;;AAcA,MAAMA,IAAoEC,CAAAA,MAAU;AAClF,QAAM,CAACC,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CAAC,WAAW,QAAQ,SAAS,UAAU,CAAC;AAClF,UAAA,MAAA;AAAA,QAAAI,IAAAC,EAAAA,GAAAC,IAAAF,EAAAG;AAAAC,WAAAA,EAAAJ,GAAAK,EAAA;AAAA,MAAA,IAAA,QAAA;AAAA,eAGWC,EACL,wHACAT,EAAMU,SAAS,SACX,mFACA,oFACJV,EAAMW,YAAY,cAAcX,EAAMW,YAAY,UAC9C,mFACA,2HACJX,EAAMY,KACR;AAAA,MAAC;AAAA,IAAA,GACGX,CAAM,GAAA,IAAA,EAAA,GAAAY,EAAAR,GAAA,MAOPL,EAAMc,QAAQ,GAAAX;AAAAA,EAAA,GAAA;AAIvB,GAEaY,IAA2ChB,CAAAA,MAAU;AAChE,QAAM;AAAA,IAAEiB,OAAAA;AAAAA,EAAAA,IAAUC,EAAAA,GACZ,CAACjB,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CACxC,QACA,WACA,eACA,wBACA,SACA,UAAU,CACX;AAED,UAAA,MAAA;AAAA,QAAAmB,IAAAC,EAAAA,GAAAC,IAAAF,EAAAZ;AAAAO,WAAAA,EAAAK,GAAAG,EAwBKvB,GAAuBU,EAAA;AAAA,MAAA,IACtBG,UAAO;AAAA,eAAEX,EAAMW,WAAW;AAAA,MAAS;AAAA,MAAA,IACnCD,OAAI;AAAA,eAAEV,EAAMU,QAAQ;AAAA,MAAM;AAAA,MAAA,IAAA,QAAA;AAAA,eACnBD,EAAGT,EAAMsB,yBAAyB,KAAO,SAAS,kBAAkBtB,EAAMY,KAAK;AAAA,MAAC;AAAA,IAAA,GACnFX,GAAM;AAAA,MAAA,IAAAa,WAAA;AAAA,eAETd,EAAMc;AAAAA,MAAQ;AAAA,IAAA,CAAA,CAAA,GAAA,IAAA,GAAAS,EAAAC,CAAAA,MAAA;AAAA,UAAAC,IA5BVhB,EACLT,EAAMsB,yBAAyB,KAC3B,6CACA,oDACN,GAACI,IACWV,EAAAA,GAAOW,IACDX,EAAAA,MAAY,cAAehB,EAAM4B,eAAe,cAAe,IAAEC,IACrE7B,EAAMW,WAAW,WAASmB,IAC7B9B,EAAMU,QAAQ,QAAMqB,IAKtBtB,EACL,2FACA,0CACA,sCACAT,EAAMW,YAAY,cAAcX,EAAMW,YAAY,UAC9C,2EACA,wDACN;AAACc,aAAAA,MAAAD,EAAAQ,KAAAC,EAAAf,GAAAM,EAAAQ,IAAAP,CAAA,GAAAC,MAAAF,EAAAU,KAAAC,EAAAjB,GAAA,cAAAM,EAAAU,IAAAR,CAAA,GAAAC,MAAAH,EAAAY,KAAAD,EAAAjB,GAAA,oBAAAM,EAAAY,IAAAT,CAAA,GAAAE,MAAAL,EAAAa,KAAAF,EAAAjB,GAAA,gBAAAM,EAAAa,IAAAR,CAAA,GAAAC,MAAAN,EAAAc,KAAAH,EAAAjB,GAAA,aAAAM,EAAAc,IAAAR,CAAA,GAAAC,MAAAP,EAAAe,KAAAN,EAAAb,GAAAI,EAAAe,IAAAR,CAAA,GAAAP;AAAAA,IAAA,GAAA;AAAA,MAAAQ,GAAAQ;AAAAA,MAAAN,GAAAM;AAAAA,MAAAJ,GAAAI;AAAAA,MAAAH,GAAAG;AAAAA,MAAAF,GAAAE;AAAAA,MAAAD,GAAAC;AAAAA,IAAAA,CAAA,GAAAtB;AAAAA,EAAA,GAAA;AAYT;"}

package/dist/components/sidebar/SidebarMenu.d.ts

@@ -1,3 +1,4 @@
+import { ark } from '@ark-ui/solid/factory';
 import { Component, ComponentProps } from 'solid-js';
 import { VariantProps } from 'tailwind-variants';
 import { TooltipContent } from '../Tooltip';
@@ -34,7 +35,9 @@ export declare const sidebarMenuButtonVariants: import('tailwind-variants').TVRe
         lg: string;
     };
 }, undefined, "gap-2 p-2 text-sm group-has-data-sidebar-menu-action/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! data-active:font-medium peer/menu-button group/menu-button [&_svg]:size-4 flex w-full items-center overflow-hidden rounded-md text-left ring-sidebar-ring outline-hidden transition-[width,height,padding] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground [&_svg]:shrink-0 [&>span:last-child]:truncate", unknown, unknown, undefined>>;
-export type SidebarMenuButtonProps = ComponentProps<'button'> & VariantProps<typeof sidebarMenuButtonVariants> & {
+type SidebarMenuButtonAsChild = ComponentProps<typeof ark.button>['asChild'];
+export type SidebarMenuButtonProps = Omit<ComponentProps<'button'>, 'asChild'> & VariantProps<typeof sidebarMenuButtonVariants> & {
+    asChild?: SidebarMenuButtonAsChild;
     isActive?: boolean;
     tooltip?: string | ComponentProps<typeof TooltipContent>;
 };
@@ -55,3 +58,4 @@ export type SidebarMenuSubButtonProps = ComponentProps<'a'> & {
     isActive?: boolean;
 };
 export declare const SidebarMenuSubButton: Component<SidebarMenuSubButtonProps>;
+export {};

package/dist/components/sidebar/SidebarMenu.js

@@ -1,32 +1,33 @@
-import { template as o, spread as i, mergeProps as n, createComponent as s, Show as g, Portal as x, memo as _, insert as m } from "solid-js/web";
-import { splitProps as d, createMemo as f } from "solid-js";
-import { tv as w, cn as l } from "../../node_modules/.bun/tailwind-variants@3.2.2_e7cab99c1b720a38/node_modules/tailwind-variants/dist/index.js";
+import { template as i, spread as d, mergeProps as s, createComponent as n, Show as h, Portal as _, memo as w, insert as m } from "solid-js/web";
+import { ark as z } from "../../node_modules/.bun/@ark-ui_solid@5.34.0_95b571dd5236cc92/node_modules/@ark-ui/solid/dist/chunk/UFYZ7HLU.js";
+import { splitProps as o, createMemo as c } from "solid-js";
+import { tv as S, cn as l } from "../../node_modules/.bun/tailwind-variants@3.2.2_e7cab99c1b720a38/node_modules/tailwind-variants/dist/index.js";
 import { Skeleton as p } from "../Skeleton.js";
-import { Tooltip as z, TooltipTrigger as $, TooltipPositioner as S, TooltipContent as M, TooltipArrow as y } from "../Tooltip.js";
-import { RANDOM_WIDTH_RANGE as k, RANDOM_WIDTH_BASE as A } from "./constants.js";
-import { useSidebar as T } from "./context.js";
-var P = /* @__PURE__ */ o("<ul data-slot=sidebar-menu data-sidebar=menu>"), I = /* @__PURE__ */ o("<li data-slot=sidebar-menu-item data-sidebar=menu-item>"), B = /* @__PURE__ */ o("<button>"), D = /* @__PURE__ */ o("<button data-slot=sidebar-menu-action data-sidebar=menu-action>"), C = /* @__PURE__ */ o("<div data-slot=sidebar-menu-badge data-sidebar=menu-badge>"), H = /* @__PURE__ */ o("<div data-slot=sidebar-menu-skeleton data-sidebar=menu-skeleton>"), O = /* @__PURE__ */ o("<ul data-slot=sidebar-menu-sub data-sidebar=menu-sub>"), N = /* @__PURE__ */ o("<li data-slot=sidebar-menu-sub-item data-sidebar=menu-sub-item>"), R = /* @__PURE__ */ o("<a data-slot=sidebar-menu-sub-button data-sidebar=menu-sub-button>");
-const Q = (t) => {
-  const [e, r] = d(t, ["class"]);
+import { Tooltip as M, TooltipTrigger as $, TooltipPositioner as y, TooltipContent as k, TooltipArrow as A } from "../Tooltip.js";
+import { RANDOM_WIDTH_RANGE as T, RANDOM_WIDTH_BASE as P } from "./constants.js";
+import { useSidebar as B } from "./context.js";
+var C = /* @__PURE__ */ i("<ul data-slot=sidebar-menu data-sidebar=menu>"), D = /* @__PURE__ */ i("<li data-slot=sidebar-menu-item data-sidebar=menu-item>"), I = /* @__PURE__ */ i("<button data-slot=sidebar-menu-action data-sidebar=menu-action>"), H = /* @__PURE__ */ i("<div data-slot=sidebar-menu-badge data-sidebar=menu-badge>"), O = /* @__PURE__ */ i("<div data-slot=sidebar-menu-skeleton data-sidebar=menu-skeleton>"), N = /* @__PURE__ */ i("<ul data-slot=sidebar-menu-sub data-sidebar=menu-sub>"), R = /* @__PURE__ */ i("<li data-slot=sidebar-menu-sub-item data-sidebar=menu-sub-item>"), j = /* @__PURE__ */ i("<a data-slot=sidebar-menu-sub-button data-sidebar=menu-sub-button>");
+const Z = (e) => {
+  const [t, r] = o(e, ["class"]);
   return (() => {
-    var a = P();
-    return i(a, n({
+    var a = C();
+    return d(a, s({
       get class() {
-        return l("gap-0 min-w-0 flex w-full flex-col", e.class);
+        return l("gap-0 min-w-0 flex w-full flex-col", t.class);
       }
     }, r), !1, !1), a;
   })();
-}, U = (t) => {
-  const [e, r] = d(t, ["class"]);
+}, ee = (e) => {
+  const [t, r] = o(e, ["class"]);
   return (() => {
-    var a = I();
-    return i(a, n({
+    var a = D();
+    return d(a, s({
       get class() {
-        return l("group/menu-item relative", e.class);
+        return l("group/menu-item relative", t.class);
       }
     }, r), !1, !1), a;
   })();
-}, j = w({
+}, E = S({
   base: "gap-2 p-2 text-sm group-has-data-sidebar-menu-action/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! data-active:font-medium peer/menu-button group/menu-button [&_svg]:size-4 flex w-full items-center overflow-hidden rounded-md text-left ring-sidebar-ring outline-hidden transition-[width,height,padding] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground [&_svg]:shrink-0 [&>span:last-child]:truncate",
   variants: {
     variant: {
@@ -43,34 +44,38 @@ const Q = (t) => {
     variant: "default",
     size: "default"
   }
-}), E = (t) => typeof t == "string" || !t ? {} : t, V = (t) => typeof t == "string" ? t : t ? t.children : "", X = (t) => {
-  const [e, r] = d(t, ["isActive", "variant", "size", "tooltip", "class"]), {
+}), V = (e) => typeof e == "string" || !e ? {} : e, W = (e) => typeof e == "string" ? e : e ? e.children : "", q = (e) => ({
+  "data-slot": "sidebar-menu-button",
+  "data-sidebar": "menu-button",
+  "data-size": e.size ?? "default",
+  "data-active": e.isActive,
+  class: E({
+    variant: e.variant,
+    size: e.size,
+    class: e.class
+  })
+}), G = (e) => e ? {
+  asChild: e
+} : {}, g = (e, t, r) => n(z.button, s(t, () => G(e), {
+  children: r
+})), te = (e) => {
+  const [t, r] = o(e, ["asChild", "children", "isActive", "variant", "size", "tooltip", "class"]), {
     isMobile: a,
     state: u,
-    side: h
-  } = T(), v = f(() => h() === "left" ? "right" : "left"), c = () => ({
-    "data-slot": "sidebar-menu-button",
-    "data-sidebar": "menu-button",
-    "data-size": e.size ?? "default",
-    "data-active": e.isActive,
-    class: j({
-      variant: e.variant,
-      size: e.size,
-      class: e.class
-    })
-  });
-  return s(g, {
+    side: f
+  } = B(), v = c(() => f() === "left" ? "right" : "left"), b = c(() => q(t));
+  return n(h, {
     get when() {
-      return e.tooltip;
+      return t.tooltip;
     },
     get fallback() {
-      return (() => {
-        var b = B();
-        return i(b, n(c, r), !1, !1), b;
-      })();
+      return g(t.asChild, {
+        ...b(),
+        ...r
+      }, t.children);
     },
     get children() {
-      return s(z, {
+      return n(M, {
         get positioning() {
           return {
             placement: v()
@@ -81,13 +86,15 @@ const Q = (t) => {
           return u() !== "collapsed" || a();
         },
         get children() {
-          return [s($, n(c, r)), s(x, {
+          return [n($, s(b, r, {
+            asChild: (x) => g(t.asChild, x(), t.children)
+          })), n(_, {
             get children() {
-              return s(S, {
+              return n(y, {
                 get children() {
-                  return s(M, n(() => E(e.tooltip), {
+                  return n(k, s(() => V(t.tooltip), {
                     get children() {
-                      return [s(y, {}), _(() => V(e.tooltip))];
+                      return [n(A, {}), w(() => W(t.tooltip))];
                     }
                   }));
                 }
@@ -98,45 +105,45 @@ const Q = (t) => {
       });
     }
   });
-}, Y = (t) => {
-  const [e, r] = d(t, ["class", "showOnHover"]);
+}, ae = (e) => {
+  const [t, r] = o(e, ["class", "showOnHover"]);
   return (() => {
-    var a = D();
-    return i(a, n({
+    var a = I();
+    return d(a, s({
       get class() {
-        return l("top-1.5 right-1 w-5 p-0 peer-data-[size=default]/menu-button:top-1.5 peer-data-[size=lg]/menu-button:top-2.5 peer-data-[size=sm]/menu-button:top-1 [&>svg]:size-4 after:-inset-2 md:after:hidden absolute flex aspect-square items-center justify-center rounded-md text-sidebar-foreground ring-sidebar-ring outline-hidden transition-transform group-data-[collapsible=icon]:hidden peer-hover/menu-button:text-sidebar-accent-foreground after:absolute hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 [&>svg]:shrink-0", e.showOnHover === !0 && "md:opacity-0 group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 peer-data-active/menu-button:text-sidebar-accent-foreground data-open:opacity-100", e.class);
+        return l("top-1.5 right-1 w-5 p-0 peer-data-[size=default]/menu-button:top-1.5 peer-data-[size=lg]/menu-button:top-2.5 peer-data-[size=sm]/menu-button:top-1 [&>svg]:size-4 after:-inset-2 md:after:hidden absolute flex aspect-square items-center justify-center rounded-md text-sidebar-foreground ring-sidebar-ring outline-hidden transition-transform group-data-[collapsible=icon]:hidden peer-hover/menu-button:text-sidebar-accent-foreground after:absolute hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 [&>svg]:shrink-0", t.showOnHover === !0 && "md:opacity-0 group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 peer-data-active/menu-button:text-sidebar-accent-foreground data-open:opacity-100", t.class);
       }
     }, r), !1, !1), a;
   })();
-}, Z = (t) => {
-  const [e, r] = d(t, ["class"]);
+}, re = (e) => {
+  const [t, r] = o(e, ["class"]);
   return (() => {
-    var a = C();
-    return i(a, n({
+    var a = H();
+    return d(a, s({
       get class() {
-        return l("right-1 h-5 min-w-5 px-1 text-xs font-medium peer-data-[size=default]/menu-button:top-1.5 peer-data-[size=lg]/menu-button:top-2.5 peer-data-[size=sm]/menu-button:top-1 pointer-events-none absolute flex items-center justify-center rounded-md text-sidebar-foreground tabular-nums select-none group-data-[collapsible=icon]:hidden peer-hover/menu-button:text-sidebar-accent-foreground peer-data-active/menu-button:text-sidebar-accent-foreground", e.class);
+        return l("right-1 h-5 min-w-5 px-1 text-xs font-medium peer-data-[size=default]/menu-button:top-1.5 peer-data-[size=lg]/menu-button:top-2.5 peer-data-[size=sm]/menu-button:top-1 pointer-events-none absolute flex items-center justify-center rounded-md text-sidebar-foreground tabular-nums select-none group-data-[collapsible=icon]:hidden peer-hover/menu-button:text-sidebar-accent-foreground peer-data-active/menu-button:text-sidebar-accent-foreground", t.class);
       }
     }, r), !1, !1), a;
   })();
-}, ee = (t) => {
-  const [e, r] = d(t, ["class", "showIcon"]), a = f(() => `${Math.floor(Math.random() * k) + A}%`);
+}, ne = (e) => {
+  const [t, r] = o(e, ["class", "showIcon"]), a = c(() => `${Math.floor(Math.random() * T) + P}%`);
   return (() => {
-    var u = H();
-    return i(u, n({
+    var u = O();
+    return d(u, s({
       get class() {
-        return l("h-8 gap-2 px-2 flex items-center rounded-md", e.class);
+        return l("h-8 gap-2 px-2 flex items-center rounded-md", t.class);
       }
-    }, r), !1, !0), m(u, s(g, {
+    }, r), !1, !0), m(u, n(h, {
       get when() {
-        return e.showIcon;
+        return t.showIcon;
       },
       get children() {
-        return s(p, {
+        return n(p, {
           class: "size-4 rounded-md",
           "data-sidebar": "menu-skeleton-icon"
         });
       }
-    }), null), m(u, s(p, {
+    }), null), m(u, n(p, {
       class: "h-4 max-w-(--skeleton-width) flex-1",
       "data-sidebar": "menu-skeleton-text",
       get style() {
@@ -146,53 +153,53 @@ const Q = (t) => {
       }
     }), null), u;
   })();
-}, te = (t) => {
-  const [e, r] = d(t, ["class"]);
+}, se = (e) => {
+  const [t, r] = o(e, ["class"]);
   return (() => {
-    var a = O();
-    return i(a, n({
+    var a = N();
+    return d(a, s({
       get class() {
-        return l("mx-3.5 gap-1 px-2.5 py-0.5 min-w-0 flex translate-x-px flex-col border-l border-sidebar-border group-data-[collapsible=icon]:hidden", e.class);
+        return l("mx-3.5 gap-1 px-2.5 py-0.5 min-w-0 flex translate-x-px flex-col border-l border-sidebar-border group-data-[collapsible=icon]:hidden", t.class);
       }
     }, r), !1, !1), a;
   })();
-}, ae = (t) => {
-  const [e, r] = d(t, ["class"]);
+}, oe = (e) => {
+  const [t, r] = o(e, ["class"]);
   return (() => {
-    var a = N();
-    return i(a, n({
+    var a = R();
+    return d(a, s({
       get class() {
-        return l("group/menu-sub-item relative", e.class);
+        return l("group/menu-sub-item relative", t.class);
       }
     }, r), !1, !1), a;
   })();
-}, re = (t) => {
-  const [e, r] = d(t, ["class", "size", "isActive"]);
+}, ie = (e) => {
+  const [t, r] = o(e, ["class", "size", "isActive"]);
   return (() => {
-    var a = R();
-    return i(a, n({
+    var a = j();
+    return d(a, s({
       get "data-size"() {
-        return e.size ?? "md";
+        return t.size ?? "md";
       },
       get "data-active"() {
-        return e.isActive;
+        return t.isActive;
       },
       get class() {
-        return l("h-7 gap-2 px-2 data-[size=md]:text-sm data-[size=sm]:text-xs [&>svg]:size-4 min-w-0 flex -translate-x-px items-center overflow-hidden rounded-md text-sidebar-foreground ring-sidebar-ring outline-hidden group-data-[collapsible=icon]:hidden hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground [&>span:last-child]:truncate [&>svg]:shrink-0 [&>svg]:text-sidebar-accent-foreground", e.class);
+        return l("h-7 gap-2 px-2 data-[size=md]:text-sm data-[size=sm]:text-xs [&>svg]:size-4 min-w-0 flex -translate-x-px items-center overflow-hidden rounded-md text-sidebar-foreground ring-sidebar-ring outline-hidden group-data-[collapsible=icon]:hidden hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground [&>span:last-child]:truncate [&>svg]:shrink-0 [&>svg]:text-sidebar-accent-foreground", t.class);
       }
     }, r), !1, !1), a;
   })();
 };
 export {
-  Q as SidebarMenu,
-  Y as SidebarMenuAction,
-  Z as SidebarMenuBadge,
-  X as SidebarMenuButton,
-  U as SidebarMenuItem,
-  ee as SidebarMenuSkeleton,
-  te as SidebarMenuSub,
-  re as SidebarMenuSubButton,
-  ae as SidebarMenuSubItem,
-  j as sidebarMenuButtonVariants
+  Z as SidebarMenu,
+  ae as SidebarMenuAction,
+  re as SidebarMenuBadge,
+  te as SidebarMenuButton,
+  ee as SidebarMenuItem,
+  ne as SidebarMenuSkeleton,
+  se as SidebarMenuSub,
+  ie as SidebarMenuSubButton,
+  oe as SidebarMenuSubItem,
+  E as sidebarMenuButtonVariants
 };
 //# sourceMappingURL=SidebarMenu.js.map