@uselets/ui 1.18.0 → 1.18.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{combobox-fNAIovsN.js → combobox-oMHLoLqV.js} +2 -2
- package/dist/{combobox-fNAIovsN.js.map → combobox-oMHLoLqV.js.map} +1 -1
- package/dist/{command-0wTb46Ym.js → command-Ce8Ojl-B.js} +2 -2
- package/dist/{command-0wTb46Ym.js.map → command-Ce8Ojl-B.js.map} +1 -1
- package/dist/components/combobox.js +1 -1
- package/dist/components/combobox.spec.js +1 -1
- package/dist/components/command.js +1 -1
- package/dist/components/command.spec.js +1 -1
- package/dist/components/data-table.js +1 -1
- package/dist/components/data-table.spec.js +1 -1
- package/dist/components/date-range-picker.js +1 -1
- package/dist/components/date-range-picker.spec.js +1 -1
- package/dist/components/field.spec.js +1 -1
- package/dist/components/input-group.js +1 -1
- package/dist/components/input-group.spec.js +1 -1
- package/dist/components/input.js +1 -1
- package/dist/components/input.spec.js +1 -1
- package/dist/components/mask-input.js +1 -1
- package/dist/components/mask-input.spec.js +1 -1
- package/dist/components/phone-input.js +1 -1
- package/dist/components/phone-input.spec.js +1 -1
- package/dist/components/sidebar.js +1 -1
- package/dist/components/sidebar.spec.js +1 -1
- package/dist/{data-table-DcyKClKz.js → data-table-B0h5peCQ.js} +2 -2
- package/dist/{data-table-DcyKClKz.js.map → data-table-B0h5peCQ.js.map} +1 -1
- package/dist/{date-range-picker-CJVpTZdT.js → date-range-picker-w3ZVRIII.js} +2 -2
- package/dist/{date-range-picker-CJVpTZdT.js.map → date-range-picker-w3ZVRIII.js.map} +1 -1
- package/dist/index.js +1 -1
- package/dist/{input-Cmjl8YdK.js → input-BhEEV_nn.js} +2 -2
- package/dist/{input-Cmjl8YdK.js.map → input-BhEEV_nn.js.map} +1 -1
- package/dist/{input-group-DsO2W3Lw.js → input-group-BUTp8vYe.js} +2 -2
- package/dist/{input-group-DsO2W3Lw.js.map → input-group-BUTp8vYe.js.map} +1 -1
- package/dist/{mask-input-ssK7U_Pl.js → mask-input-BnifHAsJ.js} +2 -2
- package/dist/{mask-input-ssK7U_Pl.js.map → mask-input-BnifHAsJ.js.map} +1 -1
- package/dist/{phone-input-D72tVPWH.js → phone-input-ambhiSLO.js} +2 -2
- package/dist/{phone-input-D72tVPWH.js.map → phone-input-ambhiSLO.js.map} +1 -1
- package/dist/{sidebar-B5bEgDy5.js → sidebar-f9maf3VF.js} +2 -2
- package/dist/{sidebar-B5bEgDy5.js.map → sidebar-f9maf3VF.js.map} +1 -1
- package/dist/styles/base.css +5 -0
- package/package.json +6 -6
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import"./rolldown-runtime-Bdj-bS2b.js";import{t as e}from"./utils-DP9KtG7I.js";import{t}from"./button-oI3hbOgp.js";import{d as n}from"./field-DzR-XrO7.js";import{i as r,n as i,r as a,t as o}from"./input-group-
|
|
2
|
-
//# sourceMappingURL=combobox-
|
|
1
|
+
import"./rolldown-runtime-Bdj-bS2b.js";import{t as e}from"./utils-DP9KtG7I.js";import{t}from"./button-oI3hbOgp.js";import{d as n}from"./field-DzR-XrO7.js";import{i as r,n as i,r as a,t as o}from"./input-group-BUTp8vYe.js";import{IconCheck as s,IconSelector as c,IconX as l}from"@tabler/icons-react";import{jsx as u,jsxs as d}from"react/jsx-runtime";import*as f from"react";import{Combobox as p}from"@base-ui/react";const m=p.Root;function ComboboxValue({...e}){return u(p.Value,{"data-slot":`combobox-value`,...e})}function ComboboxTrigger({className:t,children:n,icon:r=u(c,{className:`pointer-events-none size-4 text-muted-foreground`}),...i}){return d(p.Trigger,{"data-slot":`combobox-trigger`,className:e(`[&_svg:not([class*='size-'])]:size-4`,t),...i,children:[n,r]})}function ComboboxClear({className:t,...n}){return u(p.Clear,{"data-slot":`combobox-clear`,render:u(a,{variant:`ghost`,size:`icon-xs`}),className:e(t),...n,children:u(l,{className:`pointer-events-none`})})}function ComboboxInput({className:t,children:s,disabled:c=!1,icon:l,id:f,showTrigger:m=!0,showClear:h=!1,triggerIcon:g,..._}){let v=n(f);return d(o,{className:e(`w-auto`,t),children:[l&&u(i,{align:`inline-start`,children:l}),u(p.Input,{id:v,render:u(r,{disabled:c}),..._}),d(i,{align:`inline-end`,children:[m&&u(a,{size:`icon-xs`,variant:`ghost`,asChild:!0,"data-slot":`input-group-button`,className:`group-has-data-[slot=combobox-clear]/input-group:hidden data-pressed:bg-transparent`,disabled:c,children:u(ComboboxTrigger,{icon:g})}),h&&u(ComboboxClear,{disabled:c})]}),s]})}function ComboboxContent({className:t,side:n=`bottom`,sideOffset:r=6,align:i=`start`,alignOffset:a=0,anchor:o,container:s,...c}){return u(p.Portal,{container:s,className:`absolute`,children:u(p.Positioner,{side:n,sideOffset:r,align:i,alignOffset:a,anchor:o,className:`isolate z-50`,children:u(p.Popup,{"data-slot":`combobox-content`,"data-chips":!!o,className:e(`group/combobox-content max-h-(--available-height) w-(--anchor-width) max-w-(--available-width) min-w-[calc(var(--anchor-width)+(--spacing(7)))] origin-(--transform-origin) overflow-hidden rounded-lg text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-[chips=true]:min-w-(--anchor-width) data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 *:data-[slot=input-group]:m-1 *:data-[slot=input-group]:mb-0 *:data-[slot=input-group]:h-8 *:data-[slot=input-group]:border-input/30 *:data-[slot=input-group]:bg-input/30 *:data-[slot=input-group]:shadow-none data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95 animate-none! relative bg-popover/70 before:pointer-events-none before:absolute before:inset-0 before:-z-1 before:rounded-[inherit] before:backdrop-blur-2xl before:backdrop-saturate-150 **:data-[slot$=-item]:focus:bg-foreground/10 **:data-[slot$=-item]:data-highlighted:bg-foreground/10 **:data-[slot$=-separator]:bg-foreground/5 **:data-[slot$=-trigger]:focus:bg-foreground/10 **:data-[slot$=-trigger]:aria-expanded:bg-foreground/10! **:data-[variant=destructive]:focus:bg-foreground/10! **:data-[variant=destructive]:text-accent-foreground! **:data-[variant=destructive]:**:text-accent-foreground!`,t),...c})})})}function ComboboxList({className:t,...n}){return u(p.List,{"data-slot":`combobox-list`,className:e(`no-scrollbar max-h-[min(calc(--spacing(72)-(--spacing(9))),calc(var(--available-height)-(--spacing(9))))] scroll-py-1 overflow-y-auto overscroll-contain p-1 data-empty:p-0`,t),...n})}function ComboboxItem({className:t,children:n,...r}){return d(p.Item,{"data-slot":`combobox-item`,className:e(`relative flex w-full cursor-default items-center gap-2 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none data-highlighted:bg-accent data-highlighted:text-accent-foreground not-data-[variant=destructive]:data-highlighted:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4`,t),...r,children:[n,u(p.ItemIndicator,{render:u(`span`,{className:`pointer-events-none absolute right-2 flex size-4 items-center justify-center`}),children:u(s,{className:`pointer-events-none`})})]})}function ComboboxGroup({className:t,...n}){return u(p.Group,{"data-slot":`combobox-group`,className:e(t),...n})}function ComboboxLabel({className:t,...n}){return u(p.GroupLabel,{"data-slot":`combobox-label`,className:e(`px-2 py-1.5 text-xs text-muted-foreground`,t),...n})}function ComboboxCollection({...e}){return u(p.Collection,{"data-slot":`combobox-collection`,...e})}function ComboboxEmpty({className:t,...n}){return u(p.Empty,{"data-slot":`combobox-empty`,className:e(`hidden w-full justify-center py-2 text-center text-sm text-muted-foreground group-data-empty/combobox-content:flex`,t),...n})}function ComboboxSeparator({className:t,...n}){return u(p.Separator,{"data-slot":`combobox-separator`,className:e(`-mx-1 my-1 h-px bg-border`,t),...n})}function ComboboxChips({className:n,children:r,showClear:i=!1,...a}){return d(p.Chips,{"data-slot":`combobox-chips`,className:e(`flex min-h-8 overflow-hidden flex-wrap items-center gap-1 rounded-lg border border-input bg-transparent bg-clip-padding px-2.5 py-1 text-sm transition-colors focus-within:border-ring focus-within:ring-3 focus-within:ring-ring/50 has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive/20 has-data-[slot=combobox-chip]:px-1 dark:bg-input/30 dark:has-aria-invalid:border-destructive/50 dark:has-aria-invalid:ring-destructive/40`,n),...a,children:[r,i&&u(p.Clear,{"data-slot":`combobox-chips-clear`,render:u(t,{variant:`ghost`,color:`zinc`,size:`icon-xs`}),className:`shrink-0 self-center size-5`,children:u(l,{className:`pointer-events-none`})})]})}function ComboboxChip({className:n,children:r,showRemove:i=!0,...a}){return d(p.Chip,{"data-slot":`combobox-chip`,className:e(`flex h-[calc(--spacing(5.25))] w-fit text-left max-w-full items-center justify-start gap-1 rounded-sm bg-muted px-1.5 text-xs font-medium whitespace-nowrap text-foreground has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-disabled:opacity-50 has-data-[slot=combobox-chip-remove]:pr-0`,n),...a,children:[u(`span`,{className:`flex-1 truncate`,children:r}),i&&u(p.ChipRemove,{render:u(t,{variant:`ghost`,color:`zinc`,size:`icon-xs`}),className:`-ml-1 opacity-50 shrink-0 hover:opacity-100`,"data-slot":`combobox-chip-remove`,children:u(l,{className:`pointer-events-none`})})]})}function ComboboxChipsInput({className:t,id:r,...i}){let a=n(r);return u(p.Input,{id:a,"data-slot":`combobox-chip-input`,className:e(`min-w-16 flex-1 outline-none`,t),...i})}function useComboboxAnchor(){return f.useRef(null)}export{useComboboxAnchor as _,ComboboxClear as a,ComboboxEmpty as c,ComboboxItem as d,ComboboxLabel as f,ComboboxValue as g,ComboboxTrigger as h,ComboboxChipsInput as i,ComboboxGroup as l,ComboboxSeparator as m,ComboboxChip as n,ComboboxCollection as o,ComboboxList as p,ComboboxChips as r,ComboboxContent as s,m as t,ComboboxInput as u};
|
|
2
|
+
//# sourceMappingURL=combobox-oMHLoLqV.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"combobox-fNAIovsN.js","names":["Combobox","ComboboxPrimitive"],"sources":["../src/components/combobox.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Combobox as ComboboxPrimitive } from '@base-ui/react'\nimport { IconCheck, IconSelector, IconX } from '@tabler/icons-react'\n\nimport { cn } from '../lib/utils'\nimport { Button } from './button'\nimport { useFieldControlId } from './field'\nimport { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput } from './input-group'\n\nexport type ComboboxProps = React.ComponentProps<typeof ComboboxPrimitive.Root>\n\nexport type ComboboxValueProps = ComboboxPrimitive.Value.Props\n\nexport type ComboboxTriggerProps = ComboboxPrimitive.Trigger.Props & {\n icon?: React.ReactNode\n}\n\nexport type ComboboxClearProps = ComboboxPrimitive.Clear.Props\n\nexport type ComboboxInputProps = ComboboxPrimitive.Input.Props & {\n icon?: React.ReactNode\n triggerIcon?: React.ReactNode\n showTrigger?: boolean\n showClear?: boolean\n}\n\nexport type ComboboxContentProps = ComboboxPrimitive.Popup.Props &\n Pick<ComboboxPrimitive.Positioner.Props, 'side' | 'align' | 'sideOffset' | 'alignOffset' | 'anchor'> &\n Pick<ComboboxPrimitive.Portal.Props, 'container'>\n\nexport type ComboboxListProps = ComboboxPrimitive.List.Props\n\nexport type ComboboxItemProps = ComboboxPrimitive.Item.Props\n\nexport type ComboboxGroupProps = ComboboxPrimitive.Group.Props\n\nexport type ComboboxLabelProps = ComboboxPrimitive.GroupLabel.Props\n\nexport type ComboboxCollectionProps = ComboboxPrimitive.Collection.Props\n\nexport type ComboboxEmptyProps = ComboboxPrimitive.Empty.Props\n\nexport type ComboboxSeparatorProps = ComboboxPrimitive.Separator.Props\n\nexport type ComboboxChipsProps = React.ComponentPropsWithRef<typeof ComboboxPrimitive.Chips> &\n ComboboxPrimitive.Chips.Props & {\n showClear?: boolean\n }\n\nexport type ComboboxChipProps = ComboboxPrimitive.Chip.Props & {\n showRemove?: boolean\n}\n\nexport type ComboboxChipsInputProps = ComboboxPrimitive.Input.Props\n\nconst Combobox = ComboboxPrimitive.Root\n\nfunction ComboboxValue({ ...props }: ComboboxValueProps) {\n return <ComboboxPrimitive.Value data-slot=\"combobox-value\" {...props} />\n}\n\nfunction ComboboxTrigger({\n className,\n children,\n icon = <IconSelector className=\"pointer-events-none size-4 text-muted-foreground\" />,\n ...props\n}: ComboboxTriggerProps) {\n return (\n <ComboboxPrimitive.Trigger\n data-slot=\"combobox-trigger\"\n className={cn(\"[&_svg:not([class*='size-'])]:size-4\", className)}\n {...props}\n >\n {children}\n {icon}\n </ComboboxPrimitive.Trigger>\n )\n}\n\nfunction ComboboxClear({ className, ...props }: ComboboxClearProps) {\n return (\n <ComboboxPrimitive.Clear\n data-slot=\"combobox-clear\"\n render={<InputGroupButton variant=\"ghost\" size=\"icon-xs\" />}\n className={cn(className)}\n {...props}\n >\n <IconX className=\"pointer-events-none\" />\n </ComboboxPrimitive.Clear>\n )\n}\n\nfunction ComboboxInput({\n className,\n children,\n disabled = false,\n icon,\n id,\n showTrigger = true,\n showClear = false,\n triggerIcon,\n ...props\n}: ComboboxInputProps) {\n const fieldControlId = useFieldControlId(id)\n\n return (\n <InputGroup className={cn('w-auto', className)}>\n {icon && <InputGroupAddon align=\"inline-start\">{icon}</InputGroupAddon>}\n <ComboboxPrimitive.Input id={fieldControlId} render={<InputGroupInput disabled={disabled} />} {...props} />\n <InputGroupAddon align=\"inline-end\">\n {showTrigger && (\n <InputGroupButton\n size=\"icon-xs\"\n variant=\"ghost\"\n asChild\n data-slot=\"input-group-button\"\n className=\"group-has-data-[slot=combobox-clear]/input-group:hidden data-pressed:bg-transparent\"\n disabled={disabled}\n >\n <ComboboxTrigger icon={triggerIcon} />\n </InputGroupButton>\n )}\n {showClear && <ComboboxClear disabled={disabled} />}\n </InputGroupAddon>\n {children}\n </InputGroup>\n )\n}\n\nfunction ComboboxContent({\n className,\n side = 'bottom',\n sideOffset = 6,\n align = 'start',\n alignOffset = 0,\n anchor,\n container,\n ...props\n}: ComboboxContentProps) {\n return (\n <ComboboxPrimitive.Portal container={container} className=\"absolute\">\n <ComboboxPrimitive.Positioner\n side={side}\n sideOffset={sideOffset}\n align={align}\n alignOffset={alignOffset}\n anchor={anchor}\n className=\"isolate z-50\"\n >\n <ComboboxPrimitive.Popup\n data-slot=\"combobox-content\"\n data-chips={!!anchor}\n className={cn(\n 'group/combobox-content max-h-(--available-height) w-(--anchor-width) max-w-(--available-width) min-w-[calc(var(--anchor-width)+(--spacing(7)))] origin-(--transform-origin) overflow-hidden rounded-lg text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-[chips=true]:min-w-(--anchor-width) data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 *:data-[slot=input-group]:m-1 *:data-[slot=input-group]:mb-0 *:data-[slot=input-group]:h-8 *:data-[slot=input-group]:border-input/30 *:data-[slot=input-group]:bg-input/30 *:data-[slot=input-group]:shadow-none data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95 animate-none! relative bg-popover/70 before:pointer-events-none before:absolute before:inset-0 before:-z-1 before:rounded-[inherit] before:backdrop-blur-2xl before:backdrop-saturate-150 **:data-[slot$=-item]:focus:bg-foreground/10 **:data-[slot$=-item]:data-highlighted:bg-foreground/10 **:data-[slot$=-separator]:bg-foreground/5 **:data-[slot$=-trigger]:focus:bg-foreground/10 **:data-[slot$=-trigger]:aria-expanded:bg-foreground/10! **:data-[variant=destructive]:focus:bg-foreground/10! **:data-[variant=destructive]:text-accent-foreground! **:data-[variant=destructive]:**:text-accent-foreground!',\n className\n )}\n {...props}\n />\n </ComboboxPrimitive.Positioner>\n </ComboboxPrimitive.Portal>\n )\n}\n\nfunction ComboboxList({ className, ...props }: ComboboxListProps) {\n return (\n <ComboboxPrimitive.List\n data-slot=\"combobox-list\"\n className={cn(\n 'no-scrollbar max-h-[min(calc(--spacing(72)-(--spacing(9))),calc(var(--available-height)-(--spacing(9))))] scroll-py-1 overflow-y-auto overscroll-contain p-1 data-empty:p-0',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction ComboboxItem({ className, children, ...props }: ComboboxItemProps) {\n return (\n <ComboboxPrimitive.Item\n data-slot=\"combobox-item\"\n className={cn(\n \"relative flex w-full cursor-default items-center gap-2 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none data-highlighted:bg-accent data-highlighted:text-accent-foreground not-data-[variant=destructive]:data-highlighted:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className\n )}\n {...props}\n >\n {children}\n <ComboboxPrimitive.ItemIndicator\n render={<span className=\"pointer-events-none absolute right-2 flex size-4 items-center justify-center\" />}\n >\n <IconCheck className=\"pointer-events-none\" />\n </ComboboxPrimitive.ItemIndicator>\n </ComboboxPrimitive.Item>\n )\n}\n\nfunction ComboboxGroup({ className, ...props }: ComboboxGroupProps) {\n return <ComboboxPrimitive.Group data-slot=\"combobox-group\" className={cn(className)} {...props} />\n}\n\nfunction ComboboxLabel({ className, ...props }: ComboboxLabelProps) {\n return (\n <ComboboxPrimitive.GroupLabel\n data-slot=\"combobox-label\"\n className={cn('px-2 py-1.5 text-xs text-muted-foreground', className)}\n {...props}\n />\n )\n}\n\nfunction ComboboxCollection({ ...props }: ComboboxCollectionProps) {\n return <ComboboxPrimitive.Collection data-slot=\"combobox-collection\" {...props} />\n}\n\nfunction ComboboxEmpty({ className, ...props }: ComboboxEmptyProps) {\n return (\n <ComboboxPrimitive.Empty\n data-slot=\"combobox-empty\"\n className={cn(\n 'hidden w-full justify-center py-2 text-center text-sm text-muted-foreground group-data-empty/combobox-content:flex',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction ComboboxSeparator({ className, ...props }: ComboboxSeparatorProps) {\n return (\n <ComboboxPrimitive.Separator\n data-slot=\"combobox-separator\"\n className={cn('-mx-1 my-1 h-px bg-border', className)}\n {...props}\n />\n )\n}\n\nfunction ComboboxChips({ className, children, showClear = false, ...props }: ComboboxChipsProps) {\n return (\n <ComboboxPrimitive.Chips\n data-slot=\"combobox-chips\"\n className={cn(\n 'flex min-h-8 overflow-hidden flex-wrap items-center gap-1 rounded-lg border border-input bg-transparent bg-clip-padding px-2.5 py-1 text-sm transition-colors focus-within:border-ring focus-within:ring-3 focus-within:ring-ring/50 has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive/20 has-data-[slot=combobox-chip]:px-1 dark:bg-input/30 dark:has-aria-invalid:border-destructive/50 dark:has-aria-invalid:ring-destructive/40',\n className\n )}\n {...props}\n >\n {children}\n {showClear && (\n <ComboboxPrimitive.Clear\n data-slot=\"combobox-chips-clear\"\n render={<Button variant=\"ghost\" color=\"zinc\" size=\"icon-xs\" />}\n className=\"shrink-0 self-center size-5\"\n >\n <IconX className=\"pointer-events-none\" />\n </ComboboxPrimitive.Clear>\n )}\n </ComboboxPrimitive.Chips>\n )\n}\n\nfunction ComboboxChip({ className, children, showRemove = true, ...props }: ComboboxChipProps) {\n return (\n <ComboboxPrimitive.Chip\n data-slot=\"combobox-chip\"\n className={cn(\n 'flex h-[calc(--spacing(5.25))] w-fit text-left max-w-full items-center justify-start gap-1 rounded-sm bg-muted px-1.5 text-xs font-medium whitespace-nowrap text-foreground has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-disabled:opacity-50 has-data-[slot=combobox-chip-remove]:pr-0',\n className\n )}\n {...props}\n >\n <span className=\"flex-1 truncate\">{children}</span>\n {showRemove && (\n <ComboboxPrimitive.ChipRemove\n render={<Button variant=\"ghost\" color=\"zinc\" size=\"icon-xs\" />}\n className=\"-ml-1 opacity-50 shrink-0 hover:opacity-100\"\n data-slot=\"combobox-chip-remove\"\n >\n <IconX className=\"pointer-events-none\" />\n </ComboboxPrimitive.ChipRemove>\n )}\n </ComboboxPrimitive.Chip>\n )\n}\n\nfunction ComboboxChipsInput({ className, id, ...props }: ComboboxChipsInputProps) {\n const fieldControlId = useFieldControlId(id)\n\n return (\n <ComboboxPrimitive.Input\n id={fieldControlId}\n data-slot=\"combobox-chip-input\"\n className={cn('min-w-16 flex-1 outline-none', className)}\n {...props}\n />\n )\n}\n\nfunction useComboboxAnchor() {\n return React.useRef<HTMLDivElement | null>(null)\n}\n\nexport {\n Combobox,\n ComboboxChip,\n ComboboxChips,\n ComboboxChipsInput,\n ComboboxClear,\n ComboboxCollection,\n ComboboxContent,\n ComboboxEmpty,\n ComboboxGroup,\n ComboboxInput,\n ComboboxItem,\n ComboboxLabel,\n ComboboxList,\n ComboboxSeparator,\n ComboboxTrigger,\n ComboboxValue,\n useComboboxAnchor\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"combobox-oMHLoLqV.js","names":["Combobox","ComboboxPrimitive"],"sources":["../src/components/combobox.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Combobox as ComboboxPrimitive } from '@base-ui/react'\nimport { IconCheck, IconSelector, IconX } from '@tabler/icons-react'\n\nimport { cn } from '../lib/utils'\nimport { Button } from './button'\nimport { useFieldControlId } from './field'\nimport { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput } from './input-group'\n\nexport type ComboboxProps = React.ComponentProps<typeof ComboboxPrimitive.Root>\n\nexport type ComboboxValueProps = ComboboxPrimitive.Value.Props\n\nexport type ComboboxTriggerProps = ComboboxPrimitive.Trigger.Props & {\n icon?: React.ReactNode\n}\n\nexport type ComboboxClearProps = ComboboxPrimitive.Clear.Props\n\nexport type ComboboxInputProps = ComboboxPrimitive.Input.Props & {\n icon?: React.ReactNode\n triggerIcon?: React.ReactNode\n showTrigger?: boolean\n showClear?: boolean\n}\n\nexport type ComboboxContentProps = ComboboxPrimitive.Popup.Props &\n Pick<ComboboxPrimitive.Positioner.Props, 'side' | 'align' | 'sideOffset' | 'alignOffset' | 'anchor'> &\n Pick<ComboboxPrimitive.Portal.Props, 'container'>\n\nexport type ComboboxListProps = ComboboxPrimitive.List.Props\n\nexport type ComboboxItemProps = ComboboxPrimitive.Item.Props\n\nexport type ComboboxGroupProps = ComboboxPrimitive.Group.Props\n\nexport type ComboboxLabelProps = ComboboxPrimitive.GroupLabel.Props\n\nexport type ComboboxCollectionProps = ComboboxPrimitive.Collection.Props\n\nexport type ComboboxEmptyProps = ComboboxPrimitive.Empty.Props\n\nexport type ComboboxSeparatorProps = ComboboxPrimitive.Separator.Props\n\nexport type ComboboxChipsProps = React.ComponentPropsWithRef<typeof ComboboxPrimitive.Chips> &\n ComboboxPrimitive.Chips.Props & {\n showClear?: boolean\n }\n\nexport type ComboboxChipProps = ComboboxPrimitive.Chip.Props & {\n showRemove?: boolean\n}\n\nexport type ComboboxChipsInputProps = ComboboxPrimitive.Input.Props\n\nconst Combobox = ComboboxPrimitive.Root\n\nfunction ComboboxValue({ ...props }: ComboboxValueProps) {\n return <ComboboxPrimitive.Value data-slot=\"combobox-value\" {...props} />\n}\n\nfunction ComboboxTrigger({\n className,\n children,\n icon = <IconSelector className=\"pointer-events-none size-4 text-muted-foreground\" />,\n ...props\n}: ComboboxTriggerProps) {\n return (\n <ComboboxPrimitive.Trigger\n data-slot=\"combobox-trigger\"\n className={cn(\"[&_svg:not([class*='size-'])]:size-4\", className)}\n {...props}\n >\n {children}\n {icon}\n </ComboboxPrimitive.Trigger>\n )\n}\n\nfunction ComboboxClear({ className, ...props }: ComboboxClearProps) {\n return (\n <ComboboxPrimitive.Clear\n data-slot=\"combobox-clear\"\n render={<InputGroupButton variant=\"ghost\" size=\"icon-xs\" />}\n className={cn(className)}\n {...props}\n >\n <IconX className=\"pointer-events-none\" />\n </ComboboxPrimitive.Clear>\n )\n}\n\nfunction ComboboxInput({\n className,\n children,\n disabled = false,\n icon,\n id,\n showTrigger = true,\n showClear = false,\n triggerIcon,\n ...props\n}: ComboboxInputProps) {\n const fieldControlId = useFieldControlId(id)\n\n return (\n <InputGroup className={cn('w-auto', className)}>\n {icon && <InputGroupAddon align=\"inline-start\">{icon}</InputGroupAddon>}\n <ComboboxPrimitive.Input id={fieldControlId} render={<InputGroupInput disabled={disabled} />} {...props} />\n <InputGroupAddon align=\"inline-end\">\n {showTrigger && (\n <InputGroupButton\n size=\"icon-xs\"\n variant=\"ghost\"\n asChild\n data-slot=\"input-group-button\"\n className=\"group-has-data-[slot=combobox-clear]/input-group:hidden data-pressed:bg-transparent\"\n disabled={disabled}\n >\n <ComboboxTrigger icon={triggerIcon} />\n </InputGroupButton>\n )}\n {showClear && <ComboboxClear disabled={disabled} />}\n </InputGroupAddon>\n {children}\n </InputGroup>\n )\n}\n\nfunction ComboboxContent({\n className,\n side = 'bottom',\n sideOffset = 6,\n align = 'start',\n alignOffset = 0,\n anchor,\n container,\n ...props\n}: ComboboxContentProps) {\n return (\n <ComboboxPrimitive.Portal container={container} className=\"absolute\">\n <ComboboxPrimitive.Positioner\n side={side}\n sideOffset={sideOffset}\n align={align}\n alignOffset={alignOffset}\n anchor={anchor}\n className=\"isolate z-50\"\n >\n <ComboboxPrimitive.Popup\n data-slot=\"combobox-content\"\n data-chips={!!anchor}\n className={cn(\n 'group/combobox-content max-h-(--available-height) w-(--anchor-width) max-w-(--available-width) min-w-[calc(var(--anchor-width)+(--spacing(7)))] origin-(--transform-origin) overflow-hidden rounded-lg text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-[chips=true]:min-w-(--anchor-width) data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 *:data-[slot=input-group]:m-1 *:data-[slot=input-group]:mb-0 *:data-[slot=input-group]:h-8 *:data-[slot=input-group]:border-input/30 *:data-[slot=input-group]:bg-input/30 *:data-[slot=input-group]:shadow-none data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95 animate-none! relative bg-popover/70 before:pointer-events-none before:absolute before:inset-0 before:-z-1 before:rounded-[inherit] before:backdrop-blur-2xl before:backdrop-saturate-150 **:data-[slot$=-item]:focus:bg-foreground/10 **:data-[slot$=-item]:data-highlighted:bg-foreground/10 **:data-[slot$=-separator]:bg-foreground/5 **:data-[slot$=-trigger]:focus:bg-foreground/10 **:data-[slot$=-trigger]:aria-expanded:bg-foreground/10! **:data-[variant=destructive]:focus:bg-foreground/10! **:data-[variant=destructive]:text-accent-foreground! **:data-[variant=destructive]:**:text-accent-foreground!',\n className\n )}\n {...props}\n />\n </ComboboxPrimitive.Positioner>\n </ComboboxPrimitive.Portal>\n )\n}\n\nfunction ComboboxList({ className, ...props }: ComboboxListProps) {\n return (\n <ComboboxPrimitive.List\n data-slot=\"combobox-list\"\n className={cn(\n 'no-scrollbar max-h-[min(calc(--spacing(72)-(--spacing(9))),calc(var(--available-height)-(--spacing(9))))] scroll-py-1 overflow-y-auto overscroll-contain p-1 data-empty:p-0',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction ComboboxItem({ className, children, ...props }: ComboboxItemProps) {\n return (\n <ComboboxPrimitive.Item\n data-slot=\"combobox-item\"\n className={cn(\n \"relative flex w-full cursor-default items-center gap-2 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none data-highlighted:bg-accent data-highlighted:text-accent-foreground not-data-[variant=destructive]:data-highlighted:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className\n )}\n {...props}\n >\n {children}\n <ComboboxPrimitive.ItemIndicator\n render={<span className=\"pointer-events-none absolute right-2 flex size-4 items-center justify-center\" />}\n >\n <IconCheck className=\"pointer-events-none\" />\n </ComboboxPrimitive.ItemIndicator>\n </ComboboxPrimitive.Item>\n )\n}\n\nfunction ComboboxGroup({ className, ...props }: ComboboxGroupProps) {\n return <ComboboxPrimitive.Group data-slot=\"combobox-group\" className={cn(className)} {...props} />\n}\n\nfunction ComboboxLabel({ className, ...props }: ComboboxLabelProps) {\n return (\n <ComboboxPrimitive.GroupLabel\n data-slot=\"combobox-label\"\n className={cn('px-2 py-1.5 text-xs text-muted-foreground', className)}\n {...props}\n />\n )\n}\n\nfunction ComboboxCollection({ ...props }: ComboboxCollectionProps) {\n return <ComboboxPrimitive.Collection data-slot=\"combobox-collection\" {...props} />\n}\n\nfunction ComboboxEmpty({ className, ...props }: ComboboxEmptyProps) {\n return (\n <ComboboxPrimitive.Empty\n data-slot=\"combobox-empty\"\n className={cn(\n 'hidden w-full justify-center py-2 text-center text-sm text-muted-foreground group-data-empty/combobox-content:flex',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction ComboboxSeparator({ className, ...props }: ComboboxSeparatorProps) {\n return (\n <ComboboxPrimitive.Separator\n data-slot=\"combobox-separator\"\n className={cn('-mx-1 my-1 h-px bg-border', className)}\n {...props}\n />\n )\n}\n\nfunction ComboboxChips({ className, children, showClear = false, ...props }: ComboboxChipsProps) {\n return (\n <ComboboxPrimitive.Chips\n data-slot=\"combobox-chips\"\n className={cn(\n 'flex min-h-8 overflow-hidden flex-wrap items-center gap-1 rounded-lg border border-input bg-transparent bg-clip-padding px-2.5 py-1 text-sm transition-colors focus-within:border-ring focus-within:ring-3 focus-within:ring-ring/50 has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive/20 has-data-[slot=combobox-chip]:px-1 dark:bg-input/30 dark:has-aria-invalid:border-destructive/50 dark:has-aria-invalid:ring-destructive/40',\n className\n )}\n {...props}\n >\n {children}\n {showClear && (\n <ComboboxPrimitive.Clear\n data-slot=\"combobox-chips-clear\"\n render={<Button variant=\"ghost\" color=\"zinc\" size=\"icon-xs\" />}\n className=\"shrink-0 self-center size-5\"\n >\n <IconX className=\"pointer-events-none\" />\n </ComboboxPrimitive.Clear>\n )}\n </ComboboxPrimitive.Chips>\n )\n}\n\nfunction ComboboxChip({ className, children, showRemove = true, ...props }: ComboboxChipProps) {\n return (\n <ComboboxPrimitive.Chip\n data-slot=\"combobox-chip\"\n className={cn(\n 'flex h-[calc(--spacing(5.25))] w-fit text-left max-w-full items-center justify-start gap-1 rounded-sm bg-muted px-1.5 text-xs font-medium whitespace-nowrap text-foreground has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-disabled:opacity-50 has-data-[slot=combobox-chip-remove]:pr-0',\n className\n )}\n {...props}\n >\n <span className=\"flex-1 truncate\">{children}</span>\n {showRemove && (\n <ComboboxPrimitive.ChipRemove\n render={<Button variant=\"ghost\" color=\"zinc\" size=\"icon-xs\" />}\n className=\"-ml-1 opacity-50 shrink-0 hover:opacity-100\"\n data-slot=\"combobox-chip-remove\"\n >\n <IconX className=\"pointer-events-none\" />\n </ComboboxPrimitive.ChipRemove>\n )}\n </ComboboxPrimitive.Chip>\n )\n}\n\nfunction ComboboxChipsInput({ className, id, ...props }: ComboboxChipsInputProps) {\n const fieldControlId = useFieldControlId(id)\n\n return (\n <ComboboxPrimitive.Input\n id={fieldControlId}\n data-slot=\"combobox-chip-input\"\n className={cn('min-w-16 flex-1 outline-none', className)}\n {...props}\n />\n )\n}\n\nfunction useComboboxAnchor() {\n return React.useRef<HTMLDivElement | null>(null)\n}\n\nexport {\n Combobox,\n ComboboxChip,\n ComboboxChips,\n ComboboxChipsInput,\n ComboboxClear,\n ComboboxCollection,\n ComboboxContent,\n ComboboxEmpty,\n ComboboxGroup,\n ComboboxInput,\n ComboboxItem,\n ComboboxLabel,\n ComboboxList,\n ComboboxSeparator,\n ComboboxTrigger,\n ComboboxValue,\n useComboboxAnchor\n}\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{n as e}from"./rolldown-runtime-Bdj-bS2b.js";import{t}from"./utils-DP9KtG7I.js";import{d as n}from"./field-DzR-XrO7.js";import{n as r,t as i}from"./input-group-
|
|
2
|
-
//# sourceMappingURL=command-
|
|
1
|
+
import{n as e}from"./rolldown-runtime-Bdj-bS2b.js";import{t}from"./utils-DP9KtG7I.js";import{d as n}from"./field-DzR-XrO7.js";import{n as r,t as i}from"./input-group-BUTp8vYe.js";import{a,i as o,s,t as c,u as l}from"./dialog-B7I4Ky1i.js";import{IconCheck as u,IconSearch as d}from"@tabler/icons-react";import{jsx as f,jsxs as p}from"react/jsx-runtime";import{Command as m}from"cmdk";function Command$1({className:e,...n}){return f(m,{"data-slot":`command`,className:t(`flex size-full flex-col overflow-hidden rounded-xl! bg-popover p-1 text-popover-foreground`,e),...n})}e(Command$1,`Command`);function CommandDialog({title:e=`Command Palette`,description:n=`Search for a command to run...`,children:r,className:i,showCloseButton:u=!1,...d}){return p(c,{...d,children:[p(s,{className:`sr-only`,children:[f(l,{children:e}),f(a,{children:n})]}),f(o,{className:t(`top-1/3 translate-y-0 overflow-hidden rounded-xl! p-0`,i),showCloseButton:u,children:r})]})}function CommandInput({className:e,id:a,...o}){let s=n(a);return f(`div`,{"data-slot":`command-input-wrapper`,className:`p-1 pb-0`,children:p(i,{className:t(`h-8! rounded-lg! border-input/30 bg-input/30 shadow-none!`,`*:data-[slot=input-group-addon]:pl-2!`),children:[f(m.Input,{id:s,"data-slot":`command-input`,className:t(`w-full text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50`,e),...o}),f(r,{children:f(d,{className:`size-4 shrink-0 opacity-50`})})]})})}function CommandList({className:e,...n}){return f(m.List,{"data-slot":`command-list`,className:t(`no-scrollbar max-h-72 scroll-py-1 overflow-x-hidden overflow-y-auto outline-none`,e),...n})}function CommandEmpty({className:e,...n}){return f(m.Empty,{"data-slot":`command-empty`,className:t(`py-6 text-center text-sm`,e),...n})}function CommandGroup({className:e,...n}){return f(m.Group,{"data-slot":`command-group`,className:t(`overflow-hidden p-1 text-foreground`,`**:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:py-1.5`,`**:[[cmdk-group-heading]]:text-xs **:[[cmdk-group-heading]]:font-medium`,`**:[[cmdk-group-heading]]:text-muted-foreground`,e),...n})}function CommandSeparator({className:e,...n}){return f(m.Separator,{"data-slot":`command-separator`,className:t(`-mx-1 h-px bg-border`,e),...n})}function CommandItem({className:e,children:n,...r}){return p(m.Item,{"data-slot":`command-item`,className:t(`group/command-item relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none`,`in-data-[slot=dialog-content]:rounded-lg!`,`data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50`,`data-selected:bg-muted data-selected:text-foreground data-selected:*:[svg]:text-foreground`,`[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4`,e),...r,children:[n,f(u,{className:t(`ml-auto opacity-0`,`group-has-data-[slot=command-shortcut]/command-item:hidden`,`group-data-[checked=true]/command-item:opacity-100`)})]})}function CommandShortcut({className:e,...n}){return f(`span`,{"data-slot":`command-shortcut`,className:t(`ml-auto text-xs tracking-widest text-muted-foreground group-data-selected/command-item:text-foreground`,e),...n})}export{CommandInput as a,CommandSeparator as c,CommandGroup as i,CommandShortcut as l,CommandDialog as n,CommandItem as o,CommandEmpty as r,CommandList as s,Command$1 as t};
|
|
2
|
+
//# sourceMappingURL=command-Ce8Ojl-B.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"command-
|
|
1
|
+
{"version":3,"file":"command-Ce8Ojl-B.js","names":["Command","CommandPrimitive"],"sources":["../src/components/command.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { IconCheck, IconSearch } from '@tabler/icons-react'\nimport { Command as CommandPrimitive } from 'cmdk'\n\nimport { cn } from '../lib/utils'\nimport { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from './dialog'\nimport { useFieldControlId } from './field'\nimport { InputGroup, InputGroupAddon } from './input-group'\n\nexport type CommandProps = React.ComponentProps<typeof CommandPrimitive>\n\nexport type CommandDialogProps = React.ComponentProps<typeof Dialog> & {\n title?: string\n description?: string\n className?: string\n showCloseButton?: boolean\n}\n\nexport type CommandInputProps = React.ComponentProps<typeof CommandPrimitive.Input>\n\nexport type CommandListProps = React.ComponentProps<typeof CommandPrimitive.List>\n\nexport type CommandEmptyProps = React.ComponentProps<typeof CommandPrimitive.Empty>\n\nexport type CommandGroupProps = React.ComponentProps<typeof CommandPrimitive.Group>\n\nexport type CommandSeparatorProps = React.ComponentProps<typeof CommandPrimitive.Separator>\n\nexport type CommandItemProps = React.ComponentProps<typeof CommandPrimitive.Item>\n\nexport type CommandShortcutProps = React.ComponentProps<'span'>\n\nfunction Command({ className, ...props }: CommandProps) {\n return (\n <CommandPrimitive\n data-slot=\"command\"\n className={cn(\n 'flex size-full flex-col overflow-hidden rounded-xl! bg-popover p-1 text-popover-foreground',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction CommandDialog({\n title = 'Command Palette',\n description = 'Search for a command to run...',\n children,\n className,\n showCloseButton = false,\n ...props\n}: CommandDialogProps) {\n return (\n <Dialog {...props}>\n <DialogHeader className=\"sr-only\">\n <DialogTitle>{title}</DialogTitle>\n <DialogDescription>{description}</DialogDescription>\n </DialogHeader>\n <DialogContent\n className={cn('top-1/3 translate-y-0 overflow-hidden rounded-xl! p-0', className)}\n showCloseButton={showCloseButton}\n >\n {children}\n </DialogContent>\n </Dialog>\n )\n}\n\nfunction CommandInput({ className, id, ...props }: CommandInputProps) {\n const fieldControlId = useFieldControlId(id)\n\n return (\n <div data-slot=\"command-input-wrapper\" className=\"p-1 pb-0\">\n <InputGroup\n className={cn(\n 'h-8! rounded-lg! border-input/30 bg-input/30 shadow-none!',\n '*:data-[slot=input-group-addon]:pl-2!'\n )}\n >\n <CommandPrimitive.Input\n id={fieldControlId}\n data-slot=\"command-input\"\n className={cn('w-full text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50', className)}\n {...props}\n />\n <InputGroupAddon>\n <IconSearch className=\"size-4 shrink-0 opacity-50\" />\n </InputGroupAddon>\n </InputGroup>\n </div>\n )\n}\n\nfunction CommandList({ className, ...props }: CommandListProps) {\n return (\n <CommandPrimitive.List\n data-slot=\"command-list\"\n className={cn('no-scrollbar max-h-72 scroll-py-1 overflow-x-hidden overflow-y-auto outline-none', className)}\n {...props}\n />\n )\n}\n\nfunction CommandEmpty({ className, ...props }: CommandEmptyProps) {\n return (\n <CommandPrimitive.Empty\n data-slot=\"command-empty\"\n className={cn('py-6 text-center text-sm', className)}\n {...props}\n />\n )\n}\n\nfunction CommandGroup({ className, ...props }: CommandGroupProps) {\n return (\n <CommandPrimitive.Group\n data-slot=\"command-group\"\n className={cn(\n 'overflow-hidden p-1 text-foreground',\n '**:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:py-1.5',\n '**:[[cmdk-group-heading]]:text-xs **:[[cmdk-group-heading]]:font-medium',\n '**:[[cmdk-group-heading]]:text-muted-foreground',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction CommandSeparator({ className, ...props }: CommandSeparatorProps) {\n return (\n <CommandPrimitive.Separator\n data-slot=\"command-separator\"\n className={cn('-mx-1 h-px bg-border', className)}\n {...props}\n />\n )\n}\n\nfunction CommandItem({ className, children, ...props }: CommandItemProps) {\n return (\n <CommandPrimitive.Item\n data-slot=\"command-item\"\n className={cn(\n 'group/command-item relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none',\n 'in-data-[slot=dialog-content]:rounded-lg!',\n 'data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50',\n 'data-selected:bg-muted data-selected:text-foreground data-selected:*:[svg]:text-foreground',\n \"[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className\n )}\n {...props}\n >\n {children}\n <IconCheck\n className={cn(\n 'ml-auto opacity-0',\n 'group-has-data-[slot=command-shortcut]/command-item:hidden',\n 'group-data-[checked=true]/command-item:opacity-100'\n )}\n />\n </CommandPrimitive.Item>\n )\n}\n\nfunction CommandShortcut({ className, ...props }: CommandShortcutProps) {\n return (\n <span\n data-slot=\"command-shortcut\"\n className={cn(\n 'ml-auto text-xs tracking-widest text-muted-foreground group-data-selected/command-item:text-foreground',\n className\n )}\n {...props}\n />\n )\n}\n\nexport {\n Command,\n CommandDialog,\n CommandEmpty,\n CommandGroup,\n CommandInput,\n CommandItem,\n CommandList,\n CommandSeparator,\n CommandShortcut\n}\n"],"mappings":"+XAiCA,SAASA,UAAQ,CAAE,YAAW,GAAG,GAAuB,CACtD,OACE,EAACC,EAAD,CACE,YAAU,UACV,UAAW,EACT,6FACA,CACF,EACA,GAAI,CACL,CAAA,CAEL,wBAEA,SAAS,cAAc,CACrB,QAAQ,kBACR,cAAc,iCACd,WACA,YACA,kBAAkB,GAClB,GAAG,GACkB,CACrB,OACE,EAAC,EAAD,CAAQ,GAAI,EAAZ,SAAA,CACE,EAAC,EAAD,CAAc,UAAU,UAAxB,SAAA,CACE,EAAC,EAAD,CAAA,SAAc,CAAmB,CAAA,EACjC,EAAC,EAAD,CAAA,SAAoB,CAA+B,CAAA,CACvC,CACd,CAAA,EAAA,EAAC,EAAD,CACE,UAAW,EAAG,wDAAyD,CAAS,EAC/D,kBAEhB,UACY,CAAA,CACT,GAEZ,CAEA,SAAS,aAAa,CAAE,YAAW,KAAI,GAAG,GAA4B,CACpE,IAAM,EAAiB,EAAkB,CAAE,EAE3C,OACE,EAAC,MAAD,CAAK,YAAU,wBAAwB,UAAU,WAC/C,SAAA,EAAC,EAAD,CACE,UAAW,EACT,4DACA,uCACF,EAJF,SAAA,CAME,EAACA,EAAiB,MAAlB,CACE,GAAI,EACJ,YAAU,gBACV,UAAW,EAAG,gFAAiF,CAAS,EACxG,GAAI,CACL,CAAA,EACD,EAAC,EAAD,CAAA,SACE,EAAC,EAAD,CAAY,UAAU,4BAA8B,CAAA,CACrC,CAAA,CACP,GACT,CAAA,CAET,CAEA,SAAS,YAAY,CAAE,YAAW,GAAG,GAA2B,CAC9D,OACE,EAACA,EAAiB,KAAlB,CACE,YAAU,eACV,UAAW,EAAG,mFAAoF,CAAS,EAC3G,GAAI,CACL,CAAA,CAEL,CAEA,SAAS,aAAa,CAAE,YAAW,GAAG,GAA4B,CAChE,OACE,EAACA,EAAiB,MAAlB,CACE,YAAU,gBACV,UAAW,EAAG,2BAA4B,CAAS,EACnD,GAAI,CACL,CAAA,CAEL,CAEA,SAAS,aAAa,CAAE,YAAW,GAAG,GAA4B,CAChE,OACE,EAACA,EAAiB,MAAlB,CACE,YAAU,gBACV,UAAW,EACT,sCACA,kEACA,0EACA,kDACA,CACF,EACA,GAAI,CACL,CAAA,CAEL,CAEA,SAAS,iBAAiB,CAAE,YAAW,GAAG,GAAgC,CACxE,OACE,EAACA,EAAiB,UAAlB,CACE,YAAU,oBACV,UAAW,EAAG,uBAAwB,CAAS,EAC/C,GAAI,CACL,CAAA,CAEL,CAEA,SAAS,YAAY,CAAE,YAAW,WAAU,GAAG,GAA2B,CACxE,OACE,EAACA,EAAiB,KAAlB,CACE,YAAU,eACV,UAAW,EACT,+HACA,4CACA,2EACA,6FACA,oFACA,CACF,EACA,GAAI,EAVN,SAAA,CAYG,EACD,EAAC,EAAD,CACE,UAAW,EACT,oBACA,6DACA,oDACF,CACD,CAAA,CACoB,GAE3B,CAEA,SAAS,gBAAgB,CAAE,YAAW,GAAG,GAA+B,CACtE,OACE,EAAC,OAAD,CACE,YAAU,mBACV,UAAW,EACT,yGACA,CACF,EACA,GAAI,CACL,CAAA,CAEL"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{_ as e,a as t,c as n,d as r,f as i,g as a,h as o,i as s,l as c,m as l,n as u,o as d,p as f,r as p,s as m,t as h,u as g}from"../combobox-
|
|
1
|
+
import{_ as e,a as t,c as n,d as r,f as i,g as a,h as o,i as s,l as c,m as l,n as u,o as d,p as f,r as p,s as m,t as h,u as g}from"../combobox-oMHLoLqV.js";export{h as Combobox,u as ComboboxChip,p as ComboboxChips,s as ComboboxChipsInput,t as ComboboxClear,d as ComboboxCollection,m as ComboboxContent,n as ComboboxEmpty,c as ComboboxGroup,g as ComboboxInput,r as ComboboxItem,i as ComboboxLabel,f as ComboboxList,l as ComboboxSeparator,o as ComboboxTrigger,a as ComboboxValue,e as useComboboxAnchor};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import"../rolldown-runtime-Bdj-bS2b.js";import{c as e,d as t,h as n,i as r,n as i,o as a,p as o,r as s,s as c,t as l,u}from"../combobox-
|
|
1
|
+
import"../rolldown-runtime-Bdj-bS2b.js";import{c as e,d as t,h as n,i as r,n as i,o as a,p as o,r as s,s as c,t as l,u}from"../combobox-oMHLoLqV.js";import{a as d,n as f,o as p,r as m}from"../react.esm-BkhVXJ8s.js";import{jsx as h,jsxs as g}from"react/jsx-runtime";import{useState as _}from"react";const v=[{value:`react`,label:`React`},{value:`vue`,label:`Vue`},{value:`svelte`,label:`Svelte`}];function SingleCombobox(){let[n,r]=_(null);return g(l,{items:v,value:n,onValueChange:r,children:[h(u,{placeholder:`Select a framework`,showClear:!0}),h(c,{children:g(o,{children:[h(e,{children:`No results found.`}),h(a,{children:e=>h(t,{value:e,children:e.label},e.value)})]})})]})}function MultipleCombobox(){let[n,u]=_([v[0]]);return g(l,{multiple:!0,items:v,value:n,onValueChange:u,children:[g(s,{showClear:!0,children:[n.map(e=>h(i,{children:e.label},e.value)),h(r,{placeholder:`Add a framework`})]}),h(c,{children:g(o,{children:[h(e,{children:`No results found.`}),h(a,{children:e=>h(t,{value:e,children:e.label},e.value)})]})})]})}describe(`Combobox`,()=>{describe(`ComboboxTrigger`,()=>{it(`renders with data-slot="combobox-trigger" and a default select icon when used standalone`,()=>{let{container:e}=m(h(l,{items:v,children:h(n,{})})),t=e.querySelector(`[data-slot="combobox-trigger"]`);expect(t).not.toBeNull(),expect(t?.querySelector(`svg`)).not.toBeNull()})}),it(`renders a trigger button and the placeholder text inside the input group`,()=>{m(h(SingleCombobox,{})),expect(d.getByRole(`button`)).not.toBeNull(),expect(d.getByPlaceholderText(`Select a framework`)).not.toBeNull()}),it(`opens the popup and lists every item when the trigger is clicked`,async()=>{m(h(SingleCombobox,{})),f.click(d.getByRole(`button`)),expect(await d.findByText(`React`)).not.toBeNull(),expect(d.getByText(`Vue`)).not.toBeNull(),expect(d.getByText(`Svelte`)).not.toBeNull()}),it(`selects an item on click and fills the input with its label`,async()=>{m(h(SingleCombobox,{}));let e=d.getByPlaceholderText(`Select a framework`);f.click(d.getByRole(`button`)),f.click(await d.findByText(`Vue`)),await p(()=>expect(e.value).toBe(`Vue`))}),it(`shows the clear button once a value is selected and clears it when clicked`,async()=>{let{container:e}=m(h(SingleCombobox,{}));expect(e.querySelector(`[data-slot="combobox-clear"]`)).toBeNull();let t=d.getByPlaceholderText(`Select a framework`);f.click(d.getByRole(`button`)),f.click(await d.findByText(`React`)),await p(()=>expect(t.value).toBe(`React`));let n=await p(()=>{let t=e.querySelector(`[data-slot="combobox-clear"]`);return expect(t).not.toBeNull(),t});f.click(n),await p(()=>expect(t.value).toBe(``))}),it(`shows the empty state when the filter query matches nothing`,async()=>{m(h(SingleCombobox,{}));let e=d.getByPlaceholderText(`Select a framework`);f.click(d.getByRole(`button`)),f.change(e,{target:{value:`nonexistent framework`}}),expect(await d.findByText(`No results found.`)).not.toBeNull()}),describe(`multiple selection`,()=>{it(`renders a chip per selected value and an input for adding more`,()=>{let{container:e}=m(h(MultipleCombobox,{}));expect(e.querySelector(`[data-slot="combobox-chips"]`)).not.toBeNull(),expect(e.querySelectorAll(`[data-slot="combobox-chip"]`)).toHaveLength(1),expect(d.getByText(`React`)).not.toBeNull(),expect(d.getByPlaceholderText(`Add a framework`)).not.toBeNull()}),it(`removes a chip when its remove button is clicked`,()=>{let{container:e}=m(h(MultipleCombobox,{})),t=e.querySelector(`[data-slot="combobox-chip"]`).querySelector(`[data-slot="combobox-chip-remove"]`);f.click(t),expect(e.querySelectorAll(`[data-slot="combobox-chip"]`)).toHaveLength(0)})})});
|
|
2
2
|
//# sourceMappingURL=combobox.spec.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a as e,c as t,i as n,l as r,n as i,o as a,r as o,s,t as c}from"../command-
|
|
1
|
+
import{a as e,c as t,i as n,l as r,n as i,o as a,r as o,s,t as c}from"../command-Ce8Ojl-B.js";export{c as Command,i as CommandDialog,o as CommandEmpty,n as CommandGroup,e as CommandInput,a as CommandItem,s as CommandList,t as CommandSeparator,r as CommandShortcut};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import"../rolldown-runtime-Bdj-bS2b.js";import{a as e,c as t,i as n,l as r,n as i,o as a,r as o,s,t as c}from"../command-
|
|
1
|
+
import"../rolldown-runtime-Bdj-bS2b.js";import{a as e,c as t,i as n,l as r,n as i,o as a,r as o,s,t as c}from"../command-Ce8Ojl-B.js";import{a as l,n as u,o as d,r as f}from"../react.esm-BkhVXJ8s.js";import{jsx as p,jsxs as m}from"react/jsx-runtime";import{useState as h}from"react";var MockResizeObserver=class{observe(){}unobserve(){}disconnect(){}};beforeAll(()=>{Element.prototype.scrollIntoView=vi.fn(),global.ResizeObserver=MockResizeObserver});function BasicCommand(){return m(c,{children:[p(e,{placeholder:`Search actions...`}),m(s,{children:[p(o,{children:`Nothing found.`}),m(n,{heading:`Shortcuts`,children:[m(a,{value:`changelog`,children:[`Open changelog`,p(r,{children:`G C`})]}),p(a,{value:`release`,children:`Generate release`})]}),p(t,{}),p(n,{heading:`Docs`,children:p(a,{value:`components`,children:`Components`})})]})]})}describe(`Command`,()=>{it(`renders the search input inside its wrapper with a search icon addon`,()=>{let{container:e}=f(p(BasicCommand,{}));expect(e.querySelector(`[data-slot="command-input-wrapper"]`)).not.toBeNull(),expect(e.querySelector(`[data-slot="command-input"]`)).not.toBeNull(),expect(l.getByPlaceholderText(`Search actions...`)).not.toBeNull()}),it(`renders groups, items, a separator and the shortcut hint`,()=>{let{container:e}=f(p(BasicCommand,{}));expect(l.getByText(`Shortcuts`)).not.toBeNull(),expect(l.getByText(`Docs`)).not.toBeNull(),expect(l.getByText(`Open changelog`)).not.toBeNull(),expect(l.getByText(`G C`)).not.toBeNull(),expect(e.querySelector(`[data-slot="command-separator"]`)).not.toBeNull()}),it(`filters items based on the input value and shows CommandEmpty when nothing matches`,()=>{f(p(BasicCommand,{}));let e=l.getByPlaceholderText(`Search actions...`);u.change(e,{target:{value:`components`}}),expect(l.queryByText(`Open changelog`)).toBeNull(),expect(l.getByText(`Components`)).not.toBeNull(),u.change(e,{target:{value:`this matches nothing`}}),expect(l.getByText(`Nothing found.`)).not.toBeNull()}),describe(`CommandItem`,()=>{it(`marks an item selected on pointer move via aria-selected and data-selected`,()=>{f(p(BasicCommand,{}));let e=l.getByText(`Components`).closest(`[data-slot="command-item"]`);u.pointerMove(e),expect(e.getAttribute(`aria-selected`)).toBe(`true`),expect(e.getAttribute(`data-selected`)).toBe(`true`)})})}),describe(`CommandDialog`,()=>{it(`renders the command palette inside a dialog and closes on Escape`,async()=>{function Wrapper(){let[t,n]=h(!0);return p(i,{open:t,onOpenChange:n,children:m(c,{children:[p(e,{placeholder:`Search actions...`}),m(s,{children:[p(o,{children:`Nothing found.`}),p(a,{value:`new-story`,children:`New story`})]})]})})}f(p(Wrapper,{})),expect(await l.findByRole(`dialog`)).not.toBeNull(),expect(l.getByText(`New story`)).not.toBeNull(),u.keyDown(document,{key:`Escape`,code:`Escape`}),await d(()=>expect(l.queryByRole(`dialog`)).toBeNull())}),it(`uses the provided title and description for the accessible header`,async()=>{f(p(i,{defaultOpen:!0,title:`Quick actions`,description:`Search and run a command`,children:p(c,{children:p(s,{children:p(a,{value:`only-item`,children:`Only item`})})})})),await l.findByRole(`dialog`),expect(l.getByText(`Quick actions`)).not.toBeNull(),expect(l.getByText(`Search and run a command`)).not.toBeNull()})});
|
|
2
2
|
//# sourceMappingURL=command.spec.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a as e,c as t,d as n,f as r,i,l as a,n as o,o as s,r as c,s as l,t as u,u as d}from"../data-table-
|
|
1
|
+
import{a as e,c as t,d as n,f as r,i,l as a,n as o,o as s,r as c,s as l,t as u,u as d}from"../data-table-B0h5peCQ.js";export{u as DataTable,o as DataTableBody,c as DataTableColumnHeader,i as DataTableHeader,e as DataTablePagination,s as DataTableRoot,l as DataTableToolbar,t as DataTableViewOptions,a as createDataTableSelectColumn,d as defaultDataTableLabels,n as useDataTable,r as useDataTableContext};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import"../rolldown-runtime-Bdj-bS2b.js";import{t as e}from"../table-CuE0Aenj.js";import{a as t,c as n,d as r,f as i,i as a,l as o,n as s,o as c,r as l,t as u,u as d}from"../data-table-DcyKClKz.js";import{a as f,n as p,r as m}from"../react.esm-BkhVXJ8s.js";import{jsx as h,jsxs as g}from"react/jsx-runtime";const _=[{id:`1`,name:`Ada Lovelace`,email:`ada@example.com`,age:36},{id:`2`,name:`Grace Hopper`,email:`grace@example.com`,age:85},{id:`3`,name:`Alan Turing`,email:`alan@example.com`,age:41},{id:`4`,name:`Katherine Johnson`,email:`katherine@example.com`,age:101},{id:`5`,name:`Margaret Hamilton`,email:`margaret@example.com`,age:89}],v=[{accessorKey:`name`,header:({column:e})=>h(l,{column:e,title:`Name`}),cell:({row:e})=>e.getValue(`name`)},{accessorKey:`email`,header:`Email`,cell:({row:e})=>e.getValue(`email`)},{accessorKey:`age`,header:`Age`,cell:({row:e})=>e.getValue(`age`)}];function getBodyRowNames(e){return Array.from(e.querySelectorAll(`[data-slot="table-body"] [data-slot="table-row"]`)).map(e=>e.querySelector(`[data-slot="table-cell"]`)?.textContent)}describe(`DataTable`,()=>{it(`renders a header cell per column and a body row per data item`,()=>{let{container:e}=m(h(u,{columns:v,data:_}));expect(f.getByRole(`columnheader`,{name:`Email`})).not.toBeNull(),expect(f.getByRole(`columnheader`,{name:`Age`})).not.toBeNull(),expect(e.querySelectorAll(`[data-slot="table-body"] [data-slot="table-row"]`)).toHaveLength(_.length),expect(f.getByText(`Ada Lovelace`)).not.toBeNull(),expect(f.getByText(`katherine@example.com`)).not.toBeNull()}),it(`renders the default empty-state message spanning all columns when data is empty`,()=>{let{container:e}=m(h(u,{columns:v,data:[]})),t=e.querySelector(`[data-slot="table-body"] [data-slot="table-cell"]`);expect(f.getByText(d.emptyMessage)).not.toBeNull(),expect(t?.getAttribute(`colspan`)).toBe(String(v.length))}),it(`renders a custom empty message provided via labels`,()=>{m(h(u,{columns:v,data:[],labels:{emptyMessage:`No people found`}})),expect(f.getByText(`No people found`)).not.toBeNull(),expect(f.queryByText(d.emptyMessage)).toBeNull()}),it(`sorts rows ascending, then descending, then clears sorting on repeated header clicks`,()=>{let{container:e}=m(h(u,{columns:v,data:_,enableSorting:!0})),t=f.getByRole(`button`);p.click(t),expect(getBodyRowNames(e)).toEqual([`Ada Lovelace`,`Alan Turing`,`Grace Hopper`,`Katherine Johnson`,`Margaret Hamilton`]),p.click(t),expect(getBodyRowNames(e)).toEqual([`Margaret Hamilton`,`Katherine Johnson`,`Grace Hopper`,`Alan Turing`,`Ada Lovelace`]),p.click(t),expect(getBodyRowNames(e)).toEqual(_.map(e=>e.name))}),it(`does not render a sort toggle when sorting is disabled at the table level`,()=>{m(h(u,{columns:v,data:_})),expect(f.queryByRole(`button`)).toBeNull()}),it(`supports row selection with header select-all and per-row checkboxes`,()=>{m(h(u,{columns:v,data:_,enableRowSelection:!0}));let e=f.getByRole(`checkbox`,{name:d.selectAllRows}),t=f.getAllByRole(`checkbox`,{name:d.selectRow});expect(t).toHaveLength(_.length),expect(e.getAttribute(`data-state`)).toBe(`unchecked`),p.click(t[0]),expect(t[0].getAttribute(`data-state`)).toBe(`checked`),expect(e.getAttribute(`data-state`)).toBe(`indeterminate`),p.click(e);for(let e of f.getAllByRole(`checkbox`,{name:d.selectRow}))expect(e.getAttribute(`data-state`)).toBe(`checked`);expect(e.getAttribute(`data-state`)).toBe(`checked`)}),it(`does not prepend a second select column when the columns already define one`,()=>{let e=[{id:`select`,header:()=>`S`,cell:()=>`x`},...v];m(h(u,{columns:e,data:_,enableRowSelection:!0})),expect(f.getAllByRole(`columnheader`)).toHaveLength(e.length)})}),describe(`DataTableToolbar`,()=>{it(`renders no toolbar content when there is no filter, no toolbarActions, and column visibility is off`,()=>{let{container:e}=m(h(u,{columns:v,data:_}));expect(e.querySelector(`[data-slot="input"]`)).toBeNull(),expect(f.queryByRole(`button`,{name:d.columnsButton})).toBeNull()}),it(`filters rows by a single column via the toolbar input`,()=>{let{container:e}=m(h(u,{columns:v,data:_,filterColumns:`name`})),t=f.getByPlaceholderText(d.filterPlaceholder);p.change(t,{target:{value:`ada`}}),expect(getBodyRowNames(e)).toEqual([`Ada Lovelace`])}),it(`lets the active filter column be switched and resets the previous filter value`,()=>{let{container:e}=m(h(u,{columns:v,data:_,filterColumns:[`name`,`email`]})),t=f.getByLabelText(d.filterColumnSelectorLabel),n=f.getByPlaceholderText(d.filterPlaceholder);p.change(n,{target:{value:`ada`}}),expect(getBodyRowNames(e)).toEqual([`Ada Lovelace`]),p.change(t,{target:{value:`email`}}),expect(getBodyRowNames(e)).toEqual(_.map(e=>e.name)),p.change(n,{target:{value:`grace@`}}),expect(getBodyRowNames(e)).toEqual([`Grace Hopper`])}),it(`renders static toolbarActions content`,()=>{m(h(u,{columns:v,data:_,toolbarActions:h(`button`,{type:`button`,children:`Export`})})),expect(f.getByRole(`button`,{name:`Export`})).not.toBeNull()}),it(`renders function toolbarActions with access to the live table instance`,()=>{m(h(u,{columns:v,data:_,toolbarActions:e=>g(`span`,{children:[e.getRowModel().rows.length,` rows`]})})),expect(f.getByText(`${_.length} rows`)).not.toBeNull()}),it(`renders the column-visibility button when showColumnVisibility is set`,()=>{m(h(u,{columns:v,data:_,showColumnVisibility:!0})),expect(f.getByRole(`button`,{name:d.columnsButton})).not.toBeNull()})}),describe(`DataTableColumnHeader`,()=>{function fakeColumn(e){return{getCanSort:e.getCanSort??(()=>!0),getIsSorted:e.getIsSorted??(()=>!1),toggleSorting:e.toggleSorting??(()=>{}),clearSorting:e.clearSorting??(()=>{})}}it(`renders only the title, with no sort control, when the column cannot sort`,()=>{let{container:e}=m(h(l,{column:fakeColumn({getCanSort:()=>!1}),title:`Name`}));expect(f.getByText(`Name`)).not.toBeNull(),expect(e.querySelector(`button`)).toBeNull()}),it(`toggles to ascending sort when clicked while unsorted`,()=>{let e=vi.fn(),{container:t}=m(h(l,{column:fakeColumn({getIsSorted:()=>!1,toggleSorting:e}),title:`Name`}));p.click(t.querySelector(`button`)),expect(e).toHaveBeenCalledWith(!1)}),it(`toggles to descending sort when clicked while sorted ascending`,()=>{let e=vi.fn(),{container:t}=m(h(l,{column:fakeColumn({getIsSorted:()=>`asc`,toggleSorting:e}),title:`Name`}));p.click(t.querySelector(`button`)),expect(e).toHaveBeenCalledWith(!0)}),it(`clears sorting when clicked while sorted descending`,()=>{let e=vi.fn(),{container:t}=m(h(l,{column:fakeColumn({getIsSorted:()=>`desc`,clearSorting:e}),title:`Name`}));p.click(t.querySelector(`button`)),expect(e).toHaveBeenCalledTimes(1)})}),describe(`DataTablePagination`,()=>{it(`throws when rendered without a table prop or DataTableRoot context`,()=>{expect(()=>m(h(t,{}))).toThrow("DataTablePagination requires a `table` prop or to be rendered within <DataTableRoot>")}),it(`paginates rows and updates page/button state when navigating first/next/last/previous`,()=>{let{container:n}=m(g(c,{columns:v,data:_,enablePagination:!0,pageSize:2,children:[g(e,{children:[h(a,{}),h(s,{})]}),h(t,{})]}));expect(getBodyRowNames(n)).toEqual([`Ada Lovelace`,`Grace Hopper`]),expect(f.getByText(d.pageOf(1,3))).not.toBeNull(),expect(f.getByRole(`button`,{name:d.goToPreviousPage}).disabled).toBe(!0),p.click(f.getByRole(`button`,{name:d.goToNextPage})),expect(getBodyRowNames(n)).toEqual([`Alan Turing`,`Katherine Johnson`]),expect(f.getByText(d.pageOf(2,3))).not.toBeNull(),p.click(f.getByRole(`button`,{name:d.goToLastPage})),expect(getBodyRowNames(n)).toEqual([`Margaret Hamilton`]),expect(f.getByRole(`button`,{name:d.goToNextPage}).disabled).toBe(!0),p.click(f.getByRole(`button`,{name:d.goToFirstPage})),expect(getBodyRowNames(n)).toEqual([`Ada Lovelace`,`Grace Hopper`]),p.click(f.getByRole(`button`,{name:d.goToNextPage})),p.click(f.getByRole(`button`,{name:d.goToPreviousPage})),expect(getBodyRowNames(n)).toEqual([`Ada Lovelace`,`Grace Hopper`])})}),describe(`DataTableViewOptions`,()=>{it(`throws when rendered without a table prop or DataTableRoot context`,()=>{expect(()=>m(h(n,{}))).toThrow("DataTableViewOptions requires a `table` prop or to be rendered within <DataTableRoot>")}),it(`renders nothing when there are no hideable columns`,()=>{let{container:e}=m(h(n,{table:{getAllColumns:()=>[]}}));expect(e.firstChild).toBeNull()}),it(`opens the dropdown and hides a column when its checkbox item is toggled off`,()=>{let{container:e}=m(h(u,{columns:v,data:_,showColumnVisibility:!0})),t=f.getByRole(`button`,{name:d.columnsButton});p.pointerDown(t,{button:0,pointerId:1}),p.pointerUp(t,{button:0,pointerId:1});let n=f.getByRole(`menuitemcheckbox`,{name:`email`});p.pointerDown(n,{button:0,pointerId:1}),p.pointerUp(n,{button:0,pointerId:1}),p.click(n),expect(f.queryByRole(`columnheader`,{name:`Email`})).toBeNull(),expect(e.querySelector(`[data-slot="table-container"]`)).not.toBeNull()})}),describe(`createDataTableSelectColumn`,()=>{it(`returns a non-sortable, non-hideable select column definition`,()=>{let e=o();expect(e.id).toBe(`select`),expect(e.enableSorting).toBe(!1),expect(e.enableHiding).toBe(!1),expect(typeof e.header).toBe(`function`),expect(typeof e.cell).toBe(`function`)}),it(`uses custom select-all and select-row labels when the table provides them`,()=>{m(h(u,{columns:v,data:_,enableRowSelection:!0,labels:{selectAllRows:`Pick all`,selectRow:`Pick one`}})),expect(f.getByRole(`checkbox`,{name:`Pick all`})).not.toBeNull(),expect(f.getAllByRole(`checkbox`,{name:`Pick one`})).toHaveLength(_.length)})}),describe(`useDataTable`,()=>{function Harness(e){return h(`span`,{"data-testid":`column-count`,children:r(e).getAllColumns().length})}it(`does not add a select column when row selection is disabled`,()=>{m(h(Harness,{columns:v,data:_})),expect(f.getByTestId(`column-count`).textContent).toBe(String(v.length))}),it(`prepends a select column when row selection is enabled`,()=>{m(h(Harness,{columns:v,data:_,enableRowSelection:!0})),expect(f.getByTestId(`column-count`).textContent).toBe(String(v.length+1))})}),describe(`DataTableRoot`,()=>{it(`renders children within context when given an externally created table (controlled mode)`,()=>{function Wrapper(){return h(c,{table:r({columns:v,data:_}),children:g(e,{children:[h(a,{}),h(s,{})]})})}let{container:t}=m(h(Wrapper,{}));expect(t.querySelectorAll(`[data-slot="table-body"] [data-slot="table-row"]`)).toHaveLength(_.length)}),it(`builds its own table from columns and data when no table prop is given (uncontrolled mode)`,()=>{let{container:t}=m(h(c,{columns:v,data:_,children:g(e,{children:[h(a,{}),h(s,{})]})}));expect(t.querySelectorAll(`[data-slot="table-body"] [data-slot="table-row"]`)).toHaveLength(_.length)}),it(`applies the className to the wrapping element`,()=>{let{container:t}=m(h(c,{columns:v,data:_,className:`custom-root`,children:h(e,{children:h(a,{})})}));expect(t.firstChild.className).toContain(`custom-root`)})}),describe(`useDataTableContext`,()=>{it(`throws a descriptive error when called outside of DataTableRoot`,()=>{function Consumer(){return i(),null}expect(()=>m(h(Consumer,{}))).toThrow(`useDataTableContext must be used within <DataTableRoot>`)})});
|
|
1
|
+
import"../rolldown-runtime-Bdj-bS2b.js";import{t as e}from"../table-CuE0Aenj.js";import{a as t,c as n,d as r,f as i,i as a,l as o,n as s,o as c,r as l,t as u,u as d}from"../data-table-B0h5peCQ.js";import{a as f,n as p,r as m}from"../react.esm-BkhVXJ8s.js";import{jsx as h,jsxs as g}from"react/jsx-runtime";const _=[{id:`1`,name:`Ada Lovelace`,email:`ada@example.com`,age:36},{id:`2`,name:`Grace Hopper`,email:`grace@example.com`,age:85},{id:`3`,name:`Alan Turing`,email:`alan@example.com`,age:41},{id:`4`,name:`Katherine Johnson`,email:`katherine@example.com`,age:101},{id:`5`,name:`Margaret Hamilton`,email:`margaret@example.com`,age:89}],v=[{accessorKey:`name`,header:({column:e})=>h(l,{column:e,title:`Name`}),cell:({row:e})=>e.getValue(`name`)},{accessorKey:`email`,header:`Email`,cell:({row:e})=>e.getValue(`email`)},{accessorKey:`age`,header:`Age`,cell:({row:e})=>e.getValue(`age`)}];function getBodyRowNames(e){return Array.from(e.querySelectorAll(`[data-slot="table-body"] [data-slot="table-row"]`)).map(e=>e.querySelector(`[data-slot="table-cell"]`)?.textContent)}describe(`DataTable`,()=>{it(`renders a header cell per column and a body row per data item`,()=>{let{container:e}=m(h(u,{columns:v,data:_}));expect(f.getByRole(`columnheader`,{name:`Email`})).not.toBeNull(),expect(f.getByRole(`columnheader`,{name:`Age`})).not.toBeNull(),expect(e.querySelectorAll(`[data-slot="table-body"] [data-slot="table-row"]`)).toHaveLength(_.length),expect(f.getByText(`Ada Lovelace`)).not.toBeNull(),expect(f.getByText(`katherine@example.com`)).not.toBeNull()}),it(`renders the default empty-state message spanning all columns when data is empty`,()=>{let{container:e}=m(h(u,{columns:v,data:[]})),t=e.querySelector(`[data-slot="table-body"] [data-slot="table-cell"]`);expect(f.getByText(d.emptyMessage)).not.toBeNull(),expect(t?.getAttribute(`colspan`)).toBe(String(v.length))}),it(`renders a custom empty message provided via labels`,()=>{m(h(u,{columns:v,data:[],labels:{emptyMessage:`No people found`}})),expect(f.getByText(`No people found`)).not.toBeNull(),expect(f.queryByText(d.emptyMessage)).toBeNull()}),it(`sorts rows ascending, then descending, then clears sorting on repeated header clicks`,()=>{let{container:e}=m(h(u,{columns:v,data:_,enableSorting:!0})),t=f.getByRole(`button`);p.click(t),expect(getBodyRowNames(e)).toEqual([`Ada Lovelace`,`Alan Turing`,`Grace Hopper`,`Katherine Johnson`,`Margaret Hamilton`]),p.click(t),expect(getBodyRowNames(e)).toEqual([`Margaret Hamilton`,`Katherine Johnson`,`Grace Hopper`,`Alan Turing`,`Ada Lovelace`]),p.click(t),expect(getBodyRowNames(e)).toEqual(_.map(e=>e.name))}),it(`does not render a sort toggle when sorting is disabled at the table level`,()=>{m(h(u,{columns:v,data:_})),expect(f.queryByRole(`button`)).toBeNull()}),it(`supports row selection with header select-all and per-row checkboxes`,()=>{m(h(u,{columns:v,data:_,enableRowSelection:!0}));let e=f.getByRole(`checkbox`,{name:d.selectAllRows}),t=f.getAllByRole(`checkbox`,{name:d.selectRow});expect(t).toHaveLength(_.length),expect(e.getAttribute(`data-state`)).toBe(`unchecked`),p.click(t[0]),expect(t[0].getAttribute(`data-state`)).toBe(`checked`),expect(e.getAttribute(`data-state`)).toBe(`indeterminate`),p.click(e);for(let e of f.getAllByRole(`checkbox`,{name:d.selectRow}))expect(e.getAttribute(`data-state`)).toBe(`checked`);expect(e.getAttribute(`data-state`)).toBe(`checked`)}),it(`does not prepend a second select column when the columns already define one`,()=>{let e=[{id:`select`,header:()=>`S`,cell:()=>`x`},...v];m(h(u,{columns:e,data:_,enableRowSelection:!0})),expect(f.getAllByRole(`columnheader`)).toHaveLength(e.length)})}),describe(`DataTableToolbar`,()=>{it(`renders no toolbar content when there is no filter, no toolbarActions, and column visibility is off`,()=>{let{container:e}=m(h(u,{columns:v,data:_}));expect(e.querySelector(`[data-slot="input"]`)).toBeNull(),expect(f.queryByRole(`button`,{name:d.columnsButton})).toBeNull()}),it(`filters rows by a single column via the toolbar input`,()=>{let{container:e}=m(h(u,{columns:v,data:_,filterColumns:`name`})),t=f.getByPlaceholderText(d.filterPlaceholder);p.change(t,{target:{value:`ada`}}),expect(getBodyRowNames(e)).toEqual([`Ada Lovelace`])}),it(`lets the active filter column be switched and resets the previous filter value`,()=>{let{container:e}=m(h(u,{columns:v,data:_,filterColumns:[`name`,`email`]})),t=f.getByLabelText(d.filterColumnSelectorLabel),n=f.getByPlaceholderText(d.filterPlaceholder);p.change(n,{target:{value:`ada`}}),expect(getBodyRowNames(e)).toEqual([`Ada Lovelace`]),p.change(t,{target:{value:`email`}}),expect(getBodyRowNames(e)).toEqual(_.map(e=>e.name)),p.change(n,{target:{value:`grace@`}}),expect(getBodyRowNames(e)).toEqual([`Grace Hopper`])}),it(`renders static toolbarActions content`,()=>{m(h(u,{columns:v,data:_,toolbarActions:h(`button`,{type:`button`,children:`Export`})})),expect(f.getByRole(`button`,{name:`Export`})).not.toBeNull()}),it(`renders function toolbarActions with access to the live table instance`,()=>{m(h(u,{columns:v,data:_,toolbarActions:e=>g(`span`,{children:[e.getRowModel().rows.length,` rows`]})})),expect(f.getByText(`${_.length} rows`)).not.toBeNull()}),it(`renders the column-visibility button when showColumnVisibility is set`,()=>{m(h(u,{columns:v,data:_,showColumnVisibility:!0})),expect(f.getByRole(`button`,{name:d.columnsButton})).not.toBeNull()})}),describe(`DataTableColumnHeader`,()=>{function fakeColumn(e){return{getCanSort:e.getCanSort??(()=>!0),getIsSorted:e.getIsSorted??(()=>!1),toggleSorting:e.toggleSorting??(()=>{}),clearSorting:e.clearSorting??(()=>{})}}it(`renders only the title, with no sort control, when the column cannot sort`,()=>{let{container:e}=m(h(l,{column:fakeColumn({getCanSort:()=>!1}),title:`Name`}));expect(f.getByText(`Name`)).not.toBeNull(),expect(e.querySelector(`button`)).toBeNull()}),it(`toggles to ascending sort when clicked while unsorted`,()=>{let e=vi.fn(),{container:t}=m(h(l,{column:fakeColumn({getIsSorted:()=>!1,toggleSorting:e}),title:`Name`}));p.click(t.querySelector(`button`)),expect(e).toHaveBeenCalledWith(!1)}),it(`toggles to descending sort when clicked while sorted ascending`,()=>{let e=vi.fn(),{container:t}=m(h(l,{column:fakeColumn({getIsSorted:()=>`asc`,toggleSorting:e}),title:`Name`}));p.click(t.querySelector(`button`)),expect(e).toHaveBeenCalledWith(!0)}),it(`clears sorting when clicked while sorted descending`,()=>{let e=vi.fn(),{container:t}=m(h(l,{column:fakeColumn({getIsSorted:()=>`desc`,clearSorting:e}),title:`Name`}));p.click(t.querySelector(`button`)),expect(e).toHaveBeenCalledTimes(1)})}),describe(`DataTablePagination`,()=>{it(`throws when rendered without a table prop or DataTableRoot context`,()=>{expect(()=>m(h(t,{}))).toThrow("DataTablePagination requires a `table` prop or to be rendered within <DataTableRoot>")}),it(`paginates rows and updates page/button state when navigating first/next/last/previous`,()=>{let{container:n}=m(g(c,{columns:v,data:_,enablePagination:!0,pageSize:2,children:[g(e,{children:[h(a,{}),h(s,{})]}),h(t,{})]}));expect(getBodyRowNames(n)).toEqual([`Ada Lovelace`,`Grace Hopper`]),expect(f.getByText(d.pageOf(1,3))).not.toBeNull(),expect(f.getByRole(`button`,{name:d.goToPreviousPage}).disabled).toBe(!0),p.click(f.getByRole(`button`,{name:d.goToNextPage})),expect(getBodyRowNames(n)).toEqual([`Alan Turing`,`Katherine Johnson`]),expect(f.getByText(d.pageOf(2,3))).not.toBeNull(),p.click(f.getByRole(`button`,{name:d.goToLastPage})),expect(getBodyRowNames(n)).toEqual([`Margaret Hamilton`]),expect(f.getByRole(`button`,{name:d.goToNextPage}).disabled).toBe(!0),p.click(f.getByRole(`button`,{name:d.goToFirstPage})),expect(getBodyRowNames(n)).toEqual([`Ada Lovelace`,`Grace Hopper`]),p.click(f.getByRole(`button`,{name:d.goToNextPage})),p.click(f.getByRole(`button`,{name:d.goToPreviousPage})),expect(getBodyRowNames(n)).toEqual([`Ada Lovelace`,`Grace Hopper`])})}),describe(`DataTableViewOptions`,()=>{it(`throws when rendered without a table prop or DataTableRoot context`,()=>{expect(()=>m(h(n,{}))).toThrow("DataTableViewOptions requires a `table` prop or to be rendered within <DataTableRoot>")}),it(`renders nothing when there are no hideable columns`,()=>{let{container:e}=m(h(n,{table:{getAllColumns:()=>[]}}));expect(e.firstChild).toBeNull()}),it(`opens the dropdown and hides a column when its checkbox item is toggled off`,()=>{let{container:e}=m(h(u,{columns:v,data:_,showColumnVisibility:!0})),t=f.getByRole(`button`,{name:d.columnsButton});p.pointerDown(t,{button:0,pointerId:1}),p.pointerUp(t,{button:0,pointerId:1});let n=f.getByRole(`menuitemcheckbox`,{name:`email`});p.pointerDown(n,{button:0,pointerId:1}),p.pointerUp(n,{button:0,pointerId:1}),p.click(n),expect(f.queryByRole(`columnheader`,{name:`Email`})).toBeNull(),expect(e.querySelector(`[data-slot="table-container"]`)).not.toBeNull()})}),describe(`createDataTableSelectColumn`,()=>{it(`returns a non-sortable, non-hideable select column definition`,()=>{let e=o();expect(e.id).toBe(`select`),expect(e.enableSorting).toBe(!1),expect(e.enableHiding).toBe(!1),expect(typeof e.header).toBe(`function`),expect(typeof e.cell).toBe(`function`)}),it(`uses custom select-all and select-row labels when the table provides them`,()=>{m(h(u,{columns:v,data:_,enableRowSelection:!0,labels:{selectAllRows:`Pick all`,selectRow:`Pick one`}})),expect(f.getByRole(`checkbox`,{name:`Pick all`})).not.toBeNull(),expect(f.getAllByRole(`checkbox`,{name:`Pick one`})).toHaveLength(_.length)})}),describe(`useDataTable`,()=>{function Harness(e){return h(`span`,{"data-testid":`column-count`,children:r(e).getAllColumns().length})}it(`does not add a select column when row selection is disabled`,()=>{m(h(Harness,{columns:v,data:_})),expect(f.getByTestId(`column-count`).textContent).toBe(String(v.length))}),it(`prepends a select column when row selection is enabled`,()=>{m(h(Harness,{columns:v,data:_,enableRowSelection:!0})),expect(f.getByTestId(`column-count`).textContent).toBe(String(v.length+1))})}),describe(`DataTableRoot`,()=>{it(`renders children within context when given an externally created table (controlled mode)`,()=>{function Wrapper(){return h(c,{table:r({columns:v,data:_}),children:g(e,{children:[h(a,{}),h(s,{})]})})}let{container:t}=m(h(Wrapper,{}));expect(t.querySelectorAll(`[data-slot="table-body"] [data-slot="table-row"]`)).toHaveLength(_.length)}),it(`builds its own table from columns and data when no table prop is given (uncontrolled mode)`,()=>{let{container:t}=m(h(c,{columns:v,data:_,children:g(e,{children:[h(a,{}),h(s,{})]})}));expect(t.querySelectorAll(`[data-slot="table-body"] [data-slot="table-row"]`)).toHaveLength(_.length)}),it(`applies the className to the wrapping element`,()=>{let{container:t}=m(h(c,{columns:v,data:_,className:`custom-root`,children:h(e,{children:h(a,{})})}));expect(t.firstChild.className).toContain(`custom-root`)})}),describe(`useDataTableContext`,()=>{it(`throws a descriptive error when called outside of DataTableRoot`,()=>{function Consumer(){return i(),null}expect(()=>m(h(Consumer,{}))).toThrow(`useDataTableContext must be used within <DataTableRoot>`)})});
|
|
2
2
|
//# sourceMappingURL=data-table.spec.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a as e,c as t,d as n,i as r,l as i,n as a,o,r as s,s as c,t as l,u}from"../date-range-picker-
|
|
1
|
+
import{a as e,c as t,d as n,i as r,l as i,n as a,o,r as s,s as c,t as l,u}from"../date-range-picker-w3ZVRIII.js";export{l as DateRangePicker,a as DateRangePickerActions,s as DateRangePickerApply,r as DateRangePickerCalendar,e as DateRangePickerContent,o as DateRangePickerDateFields,c as DateRangePickerPreset,t as DateRangePickerPresets,i as DateRangePickerReset,u as DateRangePickerTrigger,n as DateRangePickerValue};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import"../rolldown-runtime-Bdj-bS2b.js";import{a as e,d as t,i as n,t as r,u as i}from"../date-range-picker-
|
|
1
|
+
import"../rolldown-runtime-Bdj-bS2b.js";import{a as e,d as t,i as n,t as r,u as i}from"../date-range-picker-w3ZVRIII.js";import{a,n as o,r as s}from"../react.esm-BkhVXJ8s.js";import{jsx as c,jsxs as l}from"react/jsx-runtime";function startOfDay(e){return new Date(e.getFullYear(),e.getMonth(),e.getDate())}function addDays(e,t){let n=startOfDay(e);return n.setDate(n.getDate()+t),n}function isoDate(e){return`${e.getFullYear()}-${String(e.getMonth()+1).padStart(2,`0`)}-${String(e.getDate()).padStart(2,`0`)}`}function formatPtBr(e){return new Intl.DateTimeFormat(`pt-BR`,{day:`2-digit`,month:`2-digit`,year:`numeric`}).format(e)}function getTriggerValueText(e){return e.querySelector(`[data-slot="date-range-picker-value"]`)?.textContent}function openPicker(e){let t=e.querySelector(`button`);o.click(t)}describe(`DateRangePicker`,()=>{it(`shows the default placeholder on the trigger when no range is selected`,()=>{let{container:e}=s(c(r,{}));expect(getTriggerValueText(e)).toBe(`Selecione um período`)}),it(`shows a custom placeholder on the trigger when provided`,()=>{let{container:e}=s(c(r,{placeholder:`Escolha o período`}));expect(getTriggerValueText(e)).toBe(`Escolha o período`)}),it(`opens the popover content when the trigger is clicked`,async()=>{let{container:e}=s(c(r,{}));expect(a.queryByRole(`grid`)).toBeNull(),openPicker(e),expect(await a.findAllByRole(`grid`)).toHaveLength(2),expect(a.getByRole(`button`,{name:`Aplicar`})).not.toBeNull(),expect(a.getByRole(`button`,{name:`Resetar`})).not.toBeNull()}),it(`selects a start and end date from the calendar and commits the range on apply`,async()=>{let e=vi.fn(),t=vi.fn(),{container:n}=s(c(r,{onValueChange:e,onApply:t}));openPicker(n),await a.findAllByRole(`grid`);let i=startOfDay(new Date),l=addDays(i,2),u=document.querySelector(`[data-day="${isoDate(i)}"] button`);expect(u).not.toBeNull(),o.click(u);let d=document.querySelector(`[data-day="${isoDate(l)}"] button`);expect(d).not.toBeNull(),o.click(d),o.click(a.getByRole(`button`,{name:`Aplicar`})),expect(e).toHaveBeenCalledWith({from:i,to:l}),expect(t).toHaveBeenCalledWith({from:i,to:l}),expect(a.queryByRole(`grid`)).toBeNull(),expect(getTriggerValueText(n)).toBe(`${formatPtBr(i)} - ${formatPtBr(l)}`)}),it(`applies a preset range when a preset option is clicked`,async()=>{let e=vi.fn(),{container:t}=s(c(r,{onValueChange:e}));openPicker(t),await a.findAllByRole(`grid`);let n=startOfDay(new Date),i=addDays(n,-7);o.click(a.getByRole(`button`,{name:`Últimos 7 dias`})),o.click(a.getByRole(`button`,{name:`Aplicar`})),expect(e).toHaveBeenCalledWith({from:i,to:n}),expect(getTriggerValueText(t)).toBe(`${formatPtBr(i)} - ${formatPtBr(n)}`)}),it(`does not open the popover and stays inert when the trigger is disabled`,()=>{let e=vi.fn(),{container:t}=s(c(r,{onOpenChange:e,children:c(i,{disabled:!0})})),n=t.querySelector(`button`);expect(n.disabled).toBe(!0),o.click(n),expect(e).not.toHaveBeenCalled(),expect(a.queryByRole(`grid`)).toBeNull()}),it(`reflects a controlled value prop in the trigger label`,()=>{let e={from:new Date(2024,0,5),to:new Date(2024,0,20)},{container:t}=s(c(r,{value:e,onValueChange:vi.fn()}));expect(getTriggerValueText(t)).toBe(`${formatPtBr(e.from)} - ${formatPtBr(e.to)}`)}),it(`formats the controlled value using the provided locale`,()=>{let e={from:new Date(2024,0,5),to:new Date(2024,0,20)},{container:t}=s(c(r,{value:e,onValueChange:vi.fn(),locale:{code:`en-US`}})),n=new Intl.DateTimeFormat(`en-US`,{day:`2-digit`,month:`2-digit`,year:`numeric`});expect(getTriggerValueText(t)).toBe(`${n.format(e.from)} - ${n.format(e.to)}`)}),it(`resets the draft and commits a null value when reset is clicked`,async()=>{let e=vi.fn(),t=vi.fn(),{container:n}=s(c(r,{value:{from:new Date(2024,0,5),to:new Date(2024,0,20)},onValueChange:e,onReset:t}));openPicker(n),await a.findAllByRole(`grid`),o.click(a.getByRole(`button`,{name:`Resetar`})),expect(e).toHaveBeenCalledWith(null),expect(t).toHaveBeenCalledTimes(1),expect(a.queryByRole(`grid`)).toBeNull()}),it(`keeps the popover open when open is controlled and still notifies onOpenChange`,async()=>{let e=vi.fn();s(c(r,{open:!0,onOpenChange:e})),expect(await a.findAllByRole(`grid`)).toHaveLength(2),o.click(a.getByRole(`button`,{name:`Resetar`})),expect(e).toHaveBeenCalledWith(!1),expect(a.getAllByRole(`grid`)).toHaveLength(2)}),describe(`useDateRangePicker guard`,()=>{it(`throws when a subcomponent renders outside DateRangePicker`,()=>{expect(()=>s(c(t,{}))).toThrow(`DateRangePicker components must be used within DateRangePicker.`)})}),describe(`DateRangePickerTrigger asChild`,()=>{it(`renders the supplied child in place of the default markup, and it still opens the popover`,async()=>{let{container:t}=s(l(r,{children:[c(i,{asChild:!0,children:c(`button`,{type:`button`,children:`Abrir período`})}),c(e,{children:c(n,{})})]}));expect(t.querySelector(`[data-slot="date-range-picker-value"]`)).toBeNull(),o.click(a.getByRole(`button`,{name:`Abrir período`})),expect(await a.findAllByRole(`grid`)).toHaveLength(2)})}),describe(`DateRangePickerDateFields`,()=>{function getDateInputs(){return document.querySelectorAll(`input[type="date"]`)}it(`commits a range and shows a single formatted date when only the from field is filled`,async()=>{let e=vi.fn(),{container:t}=s(c(r,{onValueChange:e}));openPicker(t),await a.findAllByRole(`grid`);let n=new Date(2024,0,10),[i]=getDateInputs();o.change(i,{target:{value:isoDate(n)}}),o.click(a.getByRole(`button`,{name:`Aplicar`})),expect(e).toHaveBeenCalledWith({from:n,to:void 0}),expect(getTriggerValueText(t)).toBe(formatPtBr(n))}),it(`commits a range and shows a single formatted date when only the to field is filled`,async()=>{let e=vi.fn(),{container:t}=s(c(r,{onValueChange:e}));openPicker(t),await a.findAllByRole(`grid`);let n=new Date(2024,0,10),[,i]=getDateInputs();o.change(i,{target:{value:isoDate(n)}}),o.click(a.getByRole(`button`,{name:`Aplicar`})),expect(e).toHaveBeenCalledWith({from:void 0,to:n}),expect(getTriggerValueText(t)).toBe(formatPtBr(n))}),it(`clears the draft when a filled field is emptied`,async()=>{let e=vi.fn(),{container:t}=s(c(r,{onValueChange:e}));openPicker(t),await a.findAllByRole(`grid`);let[n]=getDateInputs();o.change(n,{target:{value:isoDate(new Date(2024,0,10))}}),o.change(n,{target:{value:``}}),o.click(a.getByRole(`button`,{name:`Aplicar`})),expect(e).toHaveBeenCalledWith(null)}),it(`swaps from/to when a to-date earlier than the existing from-date is entered`,async()=>{let e=vi.fn(),{container:t}=s(c(r,{onValueChange:e}));openPicker(t),await a.findAllByRole(`grid`);let n=new Date(2024,0,5),i=new Date(2024,0,20),[l,u]=getDateInputs();o.change(l,{target:{value:isoDate(i)}}),o.change(u,{target:{value:isoDate(n)}}),o.click(a.getByRole(`button`,{name:`Aplicar`})),expect(e).toHaveBeenCalledWith({from:n,to:i})}),it(`swaps from/to when a from-date later than the existing to-date is entered`,async()=>{let e=vi.fn(),{container:t}=s(c(r,{onValueChange:e}));openPicker(t),await a.findAllByRole(`grid`);let n=new Date(2024,0,5),i=new Date(2024,0,20),[l,u]=getDateInputs();o.change(u,{target:{value:isoDate(n)}}),o.change(l,{target:{value:isoDate(i)}}),o.click(a.getByRole(`button`,{name:`Aplicar`})),expect(e).toHaveBeenCalledWith({from:n,to:i})})}),describe(`DateRangePickerPresets relative fields`,()=>{it(`commits a range ending yesterday when a day-count is entered into "Dias até hoje"`,async()=>{let e=vi.fn(),{container:t}=s(c(r,{onValueChange:e}));openPicker(t),await a.findAllByRole(`grid`);let n=addDays(startOfDay(new Date),-1);o.change(a.getByLabelText(`Dias até hoje`),{target:{value:`7`}}),o.click(a.getByRole(`button`,{name:`Aplicar`})),expect(e).toHaveBeenCalledWith({from:addDays(n,-6),to:n})}),it(`derives its displayed value from the draft and clears itself once the draft no longer matches`,async()=>{let{container:e}=s(c(r,{onValueChange:vi.fn()}));openPicker(e),await a.findAllByRole(`grid`);let t=a.getByLabelText(`Dias até hoje`);o.change(t,{target:{value:`7`}}),expect(t.value).toBe(`7`),o.click(a.getByRole(`button`,{name:`Últimos 30 dias`})),expect(t.value).toBe(``)}),it(`ignores non-positive or non-numeric input without changing the draft`,async()=>{let e=vi.fn(),{container:t}=s(c(r,{onValueChange:e}));openPicker(t),await a.findAllByRole(`grid`);let n=a.getByLabelText(`Dias até hoje`);o.change(n,{target:{value:`0`}}),o.change(n,{target:{value:`abc`}}),o.click(a.getByRole(`button`,{name:`Aplicar`})),expect(e).toHaveBeenCalledWith(null)})}),describe(`DateRangePickerCalendar`,()=>{it(`fires onMonthChange and advances the shared month when navigating to the next month`,async()=>{let t=vi.fn(),{container:u}=s(l(r,{children:[c(i,{}),c(e,{children:c(n,{onMonthChange:t})})]}));openPicker(u),await a.findAllByRole(`grid`),o.click(a.getByRole(`button`,{name:`Go to the Next Month`})),expect(t).toHaveBeenCalledTimes(1),expect(t).toHaveBeenCalledWith(expect.any(Date))})})});
|
|
2
2
|
//# sourceMappingURL=date-range-picker.spec.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import"../rolldown-runtime-Bdj-bS2b.js";import{a as e,c as t,i as n,l as r,n as i,o as a,r as o,s,t as c,u as l}from"../field-DzR-XrO7.js";import{t as u}from"../checkbox-DPvW_m7k.js";import{t as d}from"../input-
|
|
1
|
+
import"../rolldown-runtime-Bdj-bS2b.js";import{a as e,c as t,i as n,l as r,n as i,o as a,r as o,s,t as c,u as l}from"../field-DzR-XrO7.js";import{t as u}from"../checkbox-DPvW_m7k.js";import{t as d}from"../input-BhEEV_nn.js";import{t as f}from"../textarea-C8zrf9Rz.js";import{l as p,t as m,u as h}from"../select-C3QYNv4t.js";import{r as g,t as _}from"../native-select-DZW3Y7nq.js";import{a as v,r as y}from"../react.esm-BkhVXJ8s.js";import{Fragment as b,jsx as x,jsxs as S}from"react/jsx-runtime";describe(`Field`,()=>{it(`renders with the default vertical orientation`,()=>{let{container:e}=y(x(c,{children:`content`})),t=e.querySelector(`[data-slot="field"]`);expect(t.getAttribute(`data-orientation`)).toBe(`vertical`),expect(t.className).toContain(`flex-col`)}),it(`renders horizontal and responsive orientations`,()=>{let{container:e}=y(x(c,{orientation:`horizontal`,children:`content`})),{container:t}=y(x(c,{orientation:`responsive`,children:`content`})),n=e.querySelector(`[data-slot="field"]`),r=t.querySelector(`[data-slot="field"]`);expect(n.getAttribute(`data-orientation`)).toBe(`horizontal`),expect(n.className).toContain(`flex-row`),expect(r.getAttribute(`data-orientation`)).toBe(`responsive`),expect(r.className).toContain(`@md/field-group:flex-row`)}),it(`merges a custom className with its variant classes`,()=>{let{container:e}=y(x(c,{className:`custom-field`,children:`content`}));expect(e.querySelector(`[data-slot="field"]`)?.className).toContain(`custom-field`)}),describe(`automatic control id wiring`,()=>{it(`wires FieldLabel and Input with a generated id when ids are omitted`,()=>{y(S(c,{children:[x(a,{children:`Email`}),x(d,{})]}));let e=v.getByLabelText(`Email`),t=v.getByText(`Email`);expect(e.getAttribute(`id`)).toBeTruthy(),expect(t.getAttribute(`for`)).toBe(e.getAttribute(`id`))}),it(`preserves explicit input ids and label htmlFor values`,()=>{y(S(c,{children:[x(a,{htmlFor:`explicit-label-target`,children:`Email`}),x(d,{id:`explicit-input`})]})),expect(v.getByText(`Email`).getAttribute(`for`)).toBe(`explicit-label-target`),expect(document.getElementById(`explicit-input`)).not.toBeNull()}),it(`does not assign ids or throw outside Field`,()=>{let{container:e}=y(S(b,{children:[x(a,{children:`Email`}),x(d,{})]}));expect(e.querySelector(`[data-slot="field-label"]`)?.getAttribute(`for`)).toBeNull(),expect(e.querySelector(`[data-slot="input"]`)?.getAttribute(`id`)).toBeNull()}),it(`wires representative controls to the generated Field id`,()=>{y(S(b,{children:[S(c,{children:[x(a,{children:`Message`}),x(f,{})]}),S(c,{children:[x(a,{children:`Framework`}),x(_,{children:x(g,{value:`react`,children:`React`})})]}),S(c,{children:[x(a,{children:`Category`}),x(m,{children:x(p,{children:x(h,{placeholder:`Select a category`})})})]}),S(c,{children:[x(a,{children:`Terms`}),x(u,{})]})]}));for(let e of[`Message`,`Framework`,`Category`,`Terms`]){let t=v.getByText(e).getAttribute(`for`);expect(t).toBeTruthy(),expect(document.getElementById(t??``)).not.toBeNull()}})}),describe(`FieldSet`,()=>{it(`renders a fieldset with the expected data-slot and base classes`,()=>{let{container:e}=y(x(r,{children:`content`})),t=e.querySelector(`[data-slot="field-set"]`);expect(t?.tagName).toBe(`FIELDSET`),expect(t?.className).toContain(`flex-col`)})}),describe(`FieldLegend`,()=>{it(`defaults to the legend variant`,()=>{let{container:e}=y(x(s,{children:`Legend`})),t=e.querySelector(`[data-slot="field-legend"]`);expect(t?.getAttribute(`data-variant`)).toBe(`legend`)}),it(`supports the label variant`,()=>{let{container:e}=y(x(s,{variant:`label`,children:`Legend`}));expect(e.querySelector(`[data-slot="field-legend"]`)?.getAttribute(`data-variant`)).toBe(`label`)})}),describe(`FieldGroup`,()=>{it(`renders with the group data-slot and base classes`,()=>{let{container:t}=y(x(e,{children:`content`}));expect(t.querySelector(`[data-slot="field-group"]`)?.className).toContain(`flex-col`)})}),describe(`FieldContent`,()=>{it(`renders with the field-content data-slot`,()=>{let{container:e}=y(x(i,{children:`content`}));expect(e.querySelector(`[data-slot="field-content"]`)).not.toBeNull()})}),describe(`FieldTitle`,()=>{it(`renders as a div with the field-label data-slot`,()=>{let{container:e}=y(x(l,{children:`Title`})),t=e.querySelector(`[data-slot="field-label"]`);expect(t?.tagName).toBe(`DIV`),expect(t?.textContent).toBe(`Title`)})}),describe(`FieldDescription`,()=>{it(`renders as a paragraph with the field-description data-slot`,()=>{let{container:e}=y(x(o,{children:`Helper text`})),t=e.querySelector(`[data-slot="field-description"]`);expect(t?.tagName).toBe(`P`),expect(t?.textContent).toBe(`Helper text`)})}),describe(`FieldSeparator`,()=>{it(`marks data-content as false and renders no content span when childless`,()=>{let{container:e}=y(x(t,{})),n=e.querySelector(`[data-slot="field-separator"]`);expect(n?.getAttribute(`data-content`)).toBe(`false`),expect(e.querySelector(`[data-slot="field-separator-content"]`)).toBeNull()}),it(`marks data-content as true and renders the children in a content span`,()=>{let{container:e}=y(x(t,{children:`or`})),n=e.querySelector(`[data-slot="field-separator"]`),r=e.querySelector(`[data-slot="field-separator-content"]`);expect(n?.getAttribute(`data-content`)).toBe(`true`),expect(r?.textContent).toBe(`or`)})}),describe(`FieldError`,()=>{it(`renders nothing when there are no children and no errors`,()=>{let{container:e}=y(x(n,{}));expect(e.querySelector(`[data-slot="field-error"]`)).toBeNull()}),it(`renders explicit children even when errors are also provided`,()=>{y(x(n,{errors:[{message:`Ignored`}],children:`Custom message`})),expect(v.getByRole(`alert`).textContent).toBe(`Custom message`)}),it(`renders a single error message directly`,()=>{y(x(n,{errors:[{message:`Required`}]})),expect(v.getByRole(`alert`).textContent).toBe(`Required`)}),it(`renders multiple unique error messages as a list`,()=>{y(x(n,{errors:[{message:`Required`},{message:`Too short`}]}));let e=v.getByRole(`alert`).querySelectorAll(`li`);expect(e).toHaveLength(2),expect(e[0]?.textContent).toBe(`Required`),expect(e[1]?.textContent).toBe(`Too short`)}),it(`deduplicates errors sharing the same message`,()=>{y(x(n,{errors:[{message:`Required`},{message:`Required`}]}));let e=v.getByRole(`alert`);expect(e.querySelectorAll(`li`)).toHaveLength(0),expect(e.textContent).toBe(`Required`)}),it(`ignores errors without a message and undefined entries`,()=>{y(x(n,{errors:[void 0,{message:void 0}]})),expect(v.queryByRole(`alert`)).toBeNull()})})});
|
|
2
2
|
//# sourceMappingURL=field.spec.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a as e,i as t,n,o as r,r as i,t as a}from"../input-group-
|
|
1
|
+
import{a as e,i as t,n,o as r,r as i,t as a}from"../input-group-BUTp8vYe.js";export{a as InputGroup,n as InputGroupAddon,i as InputGroupButton,t as InputGroupInput,e as InputGroupText,r as InputGroupTextarea};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import"../rolldown-runtime-Bdj-bS2b.js";import{o as e,t}from"../field-DzR-XrO7.js";import{a as n,i as r,n as i,o as a,r as o,t as s}from"../input-group-
|
|
1
|
+
import"../rolldown-runtime-Bdj-bS2b.js";import{o as e,t}from"../field-DzR-XrO7.js";import{a as n,i as r,n as i,o as a,r as o,t as s}from"../input-group-BUTp8vYe.js";import{a as c,n as l,r as u}from"../react.esm-BkhVXJ8s.js";import{jsx as d,jsxs as f}from"react/jsx-runtime";describe(`InputGroup`,()=>{it(`renders the root container with its data-slot and base classes`,()=>{let{container:e}=u(d(s,{children:`content`})),t=e.querySelector(`[data-slot="input-group"]`);expect(t).not.toBeNull(),expect(t?.className).toContain(`rounded-lg`),expect(t?.className).toContain(`border`)}),describe(`InputGroupAddon`,()=>{it(`defaults to the inline-start alignment`,()=>{let{container:e}=u(d(i,{children:`$`})),t=e.querySelector(`[data-slot="input-group-addon"]`);expect(t?.getAttribute(`data-align`)).toBe(`inline-start`),expect(t?.className).toContain(`order-first`)}),it(`applies the inline-end alignment classes`,()=>{let{container:e}=u(d(i,{align:`inline-end`,children:`USD`})),t=e.querySelector(`[data-slot="input-group-addon"]`);expect(t?.getAttribute(`data-align`)).toBe(`inline-end`),expect(t?.className).toContain(`order-last`)})}),describe(`InputGroupButton`,()=>{it(`renders as a button with the forwarded variant, color and custom size attributes`,()=>{let e=vi.fn();u(d(o,{size:`icon-sm`,color:`primary`,onClick:e,children:`Action`}));let t=c.getByRole(`button`,{name:`Action`});expect(t.getAttribute(`type`)).toBe(`button`),expect(t.getAttribute(`data-variant`)).toBe(`ghost`),expect(t.getAttribute(`data-color`)).toBe(`primary`),expect(t.getAttribute(`data-size`)).toBe(`icon-sm`),expect(t.className).toContain(`size-8`),l.click(t),expect(e).toHaveBeenCalledTimes(1)}),it(`defaults to the xs size classes`,()=>{u(d(o,{children:`Small`}));let e=c.getByRole(`button`,{name:`Small`});expect(e.getAttribute(`data-size`)).toBe(`xs`),expect(e.className).toContain(`h-6`)})}),it(`renders InputGroupText with its icon-adjacent typography classes`,()=>{u(d(n,{children:`Hint`}));let e=c.getByText(`Hint`);expect(e.tagName).toBe(`SPAN`),expect(e.className).toContain(`text-muted-foreground`)}),describe(`InputGroupInput`,()=>{it(`renders with the input-group-control data-slot and accepts typed input`,()=>{let{container:e}=u(d(r,{placeholder:`Email`})),t=e.querySelector(`[data-slot="input-group-control"]`);expect(t).not.toBeNull(),expect(t.tagName).toBe(`INPUT`),expect(t.className).toContain(`border-0`),l.change(t,{target:{value:`hello@example.com`}}),expect(t.value).toBe(`hello@example.com`)}),it(`reads the Field control id when rendered inside a Field`,()=>{u(f(t,{children:[d(e,{children:`Email`}),d(s,{children:d(r,{})})]}));let n=c.getByLabelText(`Email`),i=c.getByText(`Email`);expect(n.getAttribute(`id`)).toBeTruthy(),expect(i.getAttribute(`for`)).toBe(n.getAttribute(`id`))})}),describe(`InputGroupTextarea`,()=>{it(`renders with the input-group-control data-slot and accepts typed input`,()=>{let{container:e}=u(d(a,{placeholder:`Message`})),t=e.querySelector(`[data-slot="input-group-control"]`);expect(t).not.toBeNull(),expect(t.tagName).toBe(`TEXTAREA`),expect(t.className).toContain(`resize-none`),l.change(t,{target:{value:`Hello there`}}),expect(t.value).toBe(`Hello there`)})}),it(`composes an addon, input and button together`,()=>{let{container:e}=u(f(s,{children:[d(i,{children:d(n,{children:`$`})}),d(r,{placeholder:`Amount`}),d(i,{align:`inline-end`,children:d(o,{children:`Clear`})})]})),t=e.querySelector(`[data-slot="input-group"]`);expect(t?.querySelector(`[data-slot="input-group-addon"]`)).not.toBeNull(),expect(t?.querySelector(`[data-slot="input-group-control"]`)).not.toBeNull(),expect(c.getByRole(`button`,{name:`Clear`})).not.toBeNull()})});
|
|
2
2
|
//# sourceMappingURL=input-group.spec.js.map
|
package/dist/components/input.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as e}from"../input-
|
|
1
|
+
import{t as e}from"../input-BhEEV_nn.js";export{e as Input};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import"../rolldown-runtime-Bdj-bS2b.js";import{o as e,t}from"../field-DzR-XrO7.js";import{t as n}from"../input-
|
|
1
|
+
import"../rolldown-runtime-Bdj-bS2b.js";import{o as e,t}from"../field-DzR-XrO7.js";import{t as n}from"../input-BhEEV_nn.js";import{a as r,n as i,r as a}from"../react.esm-BkhVXJ8s.js";import{jsx as o,jsxs as s}from"react/jsx-runtime";describe(`Input`,()=>{it(`renders an input with the input data-slot and base classes`,()=>{let{container:e}=a(o(n,{placeholder:`Email`})),t=e.querySelector(`[data-slot="input"]`);expect(t?.tagName).toBe(`INPUT`),expect(t?.className).toContain(`rounded-lg`),expect(t?.getAttribute(`placeholder`)).toBe(`Email`)}),it(`does not assign an id when rendered outside a Field and no id is given`,()=>{let{container:e}=a(o(n,{}));expect(e.querySelector(`[data-slot="input"]`)?.getAttribute(`id`)).toBeNull()}),it(`adopts the Field generated control id when no explicit id is provided`,()=>{a(s(t,{children:[o(e,{children:`Email`}),o(n,{})]}));let i=r.getByLabelText(`Email`);expect(i.getAttribute(`id`)).toBeTruthy()}),it(`keeps an explicit id even when rendered inside a Field`,()=>{let{container:e}=a(o(t,{children:o(n,{id:`explicit-input`})}));expect(e.querySelector(`[data-slot="input"]`)?.getAttribute(`id`)).toBe(`explicit-input`)}),it(`fires onChange with the typed value`,()=>{let e=vi.fn();a(o(n,{onChange:e})),i.change(r.getByRole(`textbox`),{target:{value:`hello`}}),expect(e).toHaveBeenCalledTimes(1),expect(r.getByRole(`textbox`).value).toBe(`hello`)}),it(`forwards a ref to the underlying input element`,()=>{let e={current:null};a(o(n,{ref:e})),expect(e.current).toBeInstanceOf(HTMLInputElement)})});
|
|
2
2
|
//# sourceMappingURL=input.spec.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as e}from"../mask-input-
|
|
1
|
+
import{t as e}from"../mask-input-BnifHAsJ.js";export{e as MaskInput};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import"../rolldown-runtime-Bdj-bS2b.js";import{t as e}from"../use-mask-DBvFShXA.js";import{t}from"../mask-input-
|
|
1
|
+
import"../rolldown-runtime-Bdj-bS2b.js";import{t as e}from"../use-mask-DBvFShXA.js";import{t}from"../mask-input-BnifHAsJ.js";import{r as n}from"../react.esm-BkhVXJ8s.js";import{jsx as r}from"react/jsx-runtime";const i=vi.hoisted(()=>({ref:vi.fn(),useMask:vi.fn()}));vi.mock(`../hooks/use-mask`,()=>({useMask:i.useMask})),describe(`MaskInput`,()=>{beforeEach(()=>{i.useMask.mockReturnValue(i.ref)}),it(`renders an input with the mask-input data-slot`,()=>{let{container:e}=n(r(t,{mask:`___-___`}));expect(e.querySelector(`[data-slot="mask-input"]`)).not.toBeNull()}),it(`wires the mask hook with the mask prop and related options`,()=>{n(r(t,{mask:`(___) ___-____`,replacement:{_:/\d/},showMask:!0,separate:!0})),expect(e).toHaveBeenCalledWith({mask:`(___) ___-____`,replacement:{_:/\d/},showMask:!0,separate:!0,track:void 0,modify:void 0})}),it(`attaches the mask ref returned by the hook to the rendered input element`,()=>{let{container:e}=n(r(t,{mask:`___-___`})),a=e.querySelector(`[data-slot="mask-input"]`);expect(i.ref).toHaveBeenCalledWith(a)}),it(`forwards standard input props such as placeholder and disabled`,()=>{let{container:e}=n(r(t,{mask:`___-___`,placeholder:`Enter code`,disabled:!0})),i=e.querySelector(`[data-slot="mask-input"]`);expect(i.placeholder).toBe(`Enter code`),expect(i.disabled).toBe(!0)}),it(`forwards an external ref alongside the mask ref`,()=>{let e={current:null},{container:i}=n(r(t,{mask:`___-___`,ref:e}));expect(e.current).toBe(i.querySelector(`[data-slot="mask-input"]`))})});
|
|
2
2
|
//# sourceMappingURL=mask-input.spec.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as e}from"../phone-input-
|
|
1
|
+
import{t as e}from"../phone-input-ambhiSLO.js";export{e as PhoneInput};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import"../rolldown-runtime-Bdj-bS2b.js";import{t as e}from"../phone-input-
|
|
1
|
+
import"../rolldown-runtime-Bdj-bS2b.js";import{t as e}from"../phone-input-ambhiSLO.js";import{n as t,r as n}from"../react.esm-BkhVXJ8s.js";import{jsx as r}from"react/jsx-runtime";describe(`PhoneInput`,()=>{it(`renders a tel input defaulting to Brazil as the selected country`,()=>{let{container:t}=n(r(e,{})),i=t.querySelector(`input[type="tel"]`),a=t.querySelector(`[data-slot="combobox-trigger"]`);expect(i).not.toBeNull(),expect(i.value).toBe(``),expect(a.textContent).toContain(`Brazil`),expect(a.querySelector(`title`)?.textContent).toBe(`BR`)}),it(`renders the underlying input with the shared input styles and no rounded start`,()=>{let{container:t}=n(r(e,{})),i=t.querySelector(`[data-slot="input"]`);expect(i.className).toContain(`rounded-s-none`),expect(i.className).toContain(`focus:z-1`)}),it(`formats a typed number and reports the E.164 value through onChange`,()=>{let i=vi.fn(),{container:a}=n(r(e,{onChange:i})),o=a.querySelector(`input[type="tel"]`);t.change(o,{target:{value:`11987654321`}}),expect(o.value).toBe(`(11) 98765-4321`),expect(i).toHaveBeenCalledWith(`+5511987654321`)}),it(`renders a controlled value formatted for display`,()=>{let{container:t}=n(r(e,{value:`+5511987654321`})),i=t.querySelector(`input[type="tel"]`);expect(i.value).toBe(`+55 11 98765 4321`)}),it(`calls onChange with an empty string when the value is cleared`,()=>{let i=vi.fn(),{container:a}=n(r(e,{value:`+5511987654321`,onChange:i})),o=a.querySelector(`input[type="tel"]`);t.change(o,{target:{value:``}}),expect(i).toHaveBeenCalledWith(``)}),it(`propagates aria-invalid to the wrapper so the nested combobox trigger gets destructive styling`,()=>{let{container:t}=n(r(e,{"aria-invalid":!0})),i=t.firstElementChild,a=t.querySelector(`input[type="tel"]`);expect(i.className).toContain(`[&_*[data-slot=combobox-trigger]]:border-destructive`),expect(i.className).toContain(`[&_*[data-slot=combobox-trigger]]:ring-destructive/50`),expect(a.getAttribute(`aria-invalid`)).toBe(`true`)}),it(`does not add destructive wrapper classes when aria-invalid is absent`,()=>{let{container:t}=n(r(e,{})),i=t.firstElementChild;expect(i.className).not.toContain(`border-destructive`)}),it(`opens the country popup when the trigger is clicked and lists country options with dial codes`,()=>{let{container:i}=n(r(e,{})),a=i.querySelector(`[data-slot="combobox-trigger"]`);t.click(a),expect(a.getAttribute(`aria-expanded`)).toBe(`true`);let o=document.querySelector(`[data-slot="combobox-content"]`);expect(o).not.toBeNull();let s=document.querySelectorAll(`[data-slot="combobox-item"]`);expect(s.length).toBeGreaterThan(1);let c=Array.from(s).find(e=>e.textContent?.includes(`United States`));expect(c?.textContent).toContain(`+1`)}),it(`selecting a country updates the trigger flag/name and closes the popup`,()=>{let{container:i}=n(r(e,{})),a=i.querySelector(`[data-slot="combobox-trigger"]`);t.click(a);let o=document.querySelectorAll(`[data-slot="combobox-item"]`),s=Array.from(o).find(e=>e.textContent?.includes(`United States`));t.click(s),expect(a.getAttribute(`aria-expanded`)).toBe(`false`),expect(a.textContent).toContain(`United States`),expect(a.querySelector(`title`)?.textContent).toBe(`US`)}),it(`selecting a different country changes the dial-code prefix applied to typed numbers`,()=>{let i=vi.fn(),{container:a}=n(r(e,{onChange:i})),o=a.querySelector(`[data-slot="combobox-trigger"]`);t.click(o);let s=document.querySelectorAll(`[data-slot="combobox-item"]`),c=Array.from(s).find(e=>e.textContent?.includes(`United States`));t.click(c);let l=a.querySelector(`input[type="tel"]`);t.change(l,{target:{value:`2015550123`}}),expect(i).toHaveBeenCalledWith(`+12015550123`)}),it(`filters the country list using the popup search input`,()=>{let{container:i}=n(r(e,{})),a=i.querySelector(`[data-slot="combobox-trigger"]`);t.click(a);let o=document.querySelector(`input[placeholder="e.g. United States"]`);t.change(o,{target:{value:`Portugal`}});let s=document.querySelectorAll(`[data-slot="combobox-item"]`);expect(s.length).toBe(1),expect(s[0]?.textContent).toContain(`Portugal`)}),it(`shows the empty state message when no country matches the search`,()=>{let{container:i}=n(r(e,{})),a=i.querySelector(`[data-slot="combobox-trigger"]`);t.click(a);let o=document.querySelector(`input[placeholder="e.g. United States"]`);t.change(o,{target:{value:`not-a-real-country`}}),expect(document.querySelector(`[data-slot="combobox-empty"]`)?.textContent).toBe(`Nenhum país encontrado.`)}),it(`forwards a custom popupClassName to the popup content`,()=>{let{container:i}=n(r(e,{popupClassName:`my-popup-class`})),a=i.querySelector(`[data-slot="combobox-trigger"]`);t.click(a);let o=document.querySelector(`[data-slot="combobox-content"]`);expect(o.className).toContain(`my-popup-class`)})});
|
|
2
2
|
//# sourceMappingURL=phone-input.spec.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{C as e,S as t,_ as n,a as r,b as i,c as a,d as o,f as s,g as c,h as l,i as u,l as d,m as f,n as p,o as m,p as h,r as g,s as _,t as v,u as y,v as b,w as x,x as S,y as C}from"../sidebar-
|
|
1
|
+
import{C as e,S as t,_ as n,a as r,b as i,c as a,d as o,f as s,g as c,h as l,i as u,l as d,m as f,n as p,o as m,p as h,r as g,s as _,t as v,u as y,v as b,w as x,x as S,y as C}from"../sidebar-f9maf3VF.js";export{v as Sidebar,p as SidebarContent,g as SidebarFooter,u as SidebarGroup,r as SidebarGroupAction,m as SidebarGroupContent,_ as SidebarGroupLabel,a as SidebarHeader,d as SidebarInput,y as SidebarInset,o as SidebarMenu,s as SidebarMenuAction,h as SidebarMenuBadge,f as SidebarMenuButton,l as SidebarMenuItem,c as SidebarMenuSkeleton,n as SidebarMenuSub,b as SidebarMenuSubButton,C as SidebarMenuSubItem,i as SidebarProvider,S as SidebarRail,t as SidebarSeparator,e as SidebarTrigger,x as useSidebar};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import"../rolldown-runtime-Bdj-bS2b.js";import{r as e}from"../tooltip-CNUNWZvs.js";import{C as t,S as n,_ as r,a as i,b as a,c as o,d as s,f as c,g as l,h as u,i as d,l as f,m as p,n as m,o as h,p as g,r as _,s as v,t as y,u as b,v as x,w as S,x as C,y as w}from"../sidebar-B5bEgDy5.js";import{a as T,i as E,n as D,r as O,t as k}from"../react.esm-BkhVXJ8s.js";import{Fragment as A,jsx as j,jsxs as M}from"react/jsx-runtime";import*as N from"react";if(globalThis.ResizeObserver===void 0){class ResizeObserverStub{observe(){}unobserve(){}disconnect(){}}globalThis.ResizeObserver=ResizeObserverStub}function clearSidebarCookie(){document.cookie=`sidebar_state=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/`}function readSidebarCookie(){return document.cookie.split(`; `).find(e=>e.startsWith(`sidebar_state=`))?.split(`=`)[1]}function SidebarStateProbe(){let{state:e,open:t,isMobile:n,openMobile:r}=S();return j(`div`,{"data-testid":`probe`,"data-state":e,"data-open":t,"data-mobile":n,"data-open-mobile":r})}beforeEach(()=>{clearSidebarCookie()}),describe(`SidebarProvider`,()=>{it(`renders its children`,()=>{O(j(a,{children:j(`div`,{children:`sidebar content`})})),expect(T.getByText(`sidebar content`)).not.toBeNull()}),it(`renders a wrapper exposing the sidebar css variables and merges custom style/className`,()=>{let{container:e}=O(j(a,{className:`custom-wrapper`,style:{"--custom":`1px`},children:j(`div`,{children:`content`})})),t=e.querySelector(`[data-slot="sidebar-wrapper"]`);expect(t).not.toBeNull(),expect(t.className).toContain(`custom-wrapper`),expect(t.style.getPropertyValue(`--sidebar-width`)).toBe(`16rem`),expect(t.style.getPropertyValue(`--sidebar-width-icon`)).toBe(`3rem`),expect(t.style.getPropertyValue(`--custom`)).toBe(`1px`)}),it(`defaults to an expanded/open state`,()=>{O(j(a,{children:j(SidebarStateProbe,{})}));let e=T.getByTestId(`probe`);expect(e.getAttribute(`data-state`)).toBe(`expanded`),expect(e.getAttribute(`data-open`)).toBe(`true`)}),it(`honors defaultOpen={false}`,()=>{O(j(a,{defaultOpen:!1,children:j(SidebarStateProbe,{})})),expect(T.getByTestId(`probe`).getAttribute(`data-state`)).toBe(`collapsed`)}),it(`toggles open state via the trigger and persists it to the sidebar_state cookie`,()=>{O(M(a,{children:[j(SidebarStateProbe,{}),j(t,{})]})),expect(T.getByTestId(`probe`).getAttribute(`data-state`)).toBe(`expanded`),D.click(T.getByRole(`button`)),expect(T.getByTestId(`probe`).getAttribute(`data-state`)).toBe(`collapsed`),expect(readSidebarCookie()).toBe(`false`),D.click(T.getByRole(`button`)),expect(T.getByTestId(`probe`).getAttribute(`data-state`)).toBe(`expanded`),expect(readSidebarCookie()).toBe(`true`)}),it(`supports a controlled open state via open/onOpenChange`,()=>{let e=vi.fn();function Controlled(){let[n,r]=N.useState(!1);return M(a,{open:n,onOpenChange:t=>{r(t),e(t)},children:[j(SidebarStateProbe,{}),j(t,{})]})}O(j(Controlled,{})),expect(T.getByTestId(`probe`).getAttribute(`data-state`)).toBe(`collapsed`),D.click(T.getByRole(`button`)),expect(e).toHaveBeenCalledWith(!0),expect(T.getByTestId(`probe`).getAttribute(`data-state`)).toBe(`expanded`),expect(readSidebarCookie()).toBe(`true`)}),it(`toggles the sidebar with the Cmd/Ctrl+B keyboard shortcut`,()=>{O(j(a,{children:j(SidebarStateProbe,{})})),D.keyDown(window,{key:`b`,metaKey:!0}),expect(T.getByTestId(`probe`).getAttribute(`data-state`)).toBe(`collapsed`),D.keyDown(window,{key:`b`,ctrlKey:!0}),expect(T.getByTestId(`probe`).getAttribute(`data-state`)).toBe(`expanded`)}),it(`ignores the shortcut key without a meta/ctrl modifier`,()=>{O(j(a,{children:j(SidebarStateProbe,{})})),D.keyDown(window,{key:`b`}),expect(T.getByTestId(`probe`).getAttribute(`data-state`)).toBe(`expanded`)}),it(`reports isMobile from the current viewport width`,()=>{setTestViewportWidth(500),O(j(a,{children:j(SidebarStateProbe,{})}));let e=T.getByTestId(`probe`);expect(e.getAttribute(`data-mobile`)).toBe(`true`),expect(e.getAttribute(`data-open-mobile`)).toBe(`false`)}),it(`toggles openMobile instead of open on a mobile viewport, without writing the cookie`,()=>{setTestViewportWidth(500),O(M(a,{children:[j(SidebarStateProbe,{}),j(t,{})]})),D.click(T.getByRole(`button`));let e=T.getByTestId(`probe`);expect(e.getAttribute(`data-open-mobile`)).toBe(`true`),expect(e.getAttribute(`data-open`)).toBe(`true`),expect(readSidebarCookie()).toBeUndefined()})}),describe(`useSidebar`,()=>{it(`throws when used outside of a SidebarProvider`,()=>{expect(()=>E(()=>S())).toThrow(`useSidebar must be used within a SidebarProvider.`)}),it(`exposes state, open, isMobile, openMobile and toggleSidebar to consumers`,()=>{let{result:e}=E(()=>S(),{wrapper:({children:e})=>j(a,{children:e})});expect(e.current.state).toBe(`expanded`),expect(e.current.open).toBe(!0),expect(e.current.isMobile).toBe(!1),expect(e.current.openMobile).toBe(!1),k(()=>{e.current.toggleSidebar()}),expect(e.current.open).toBe(!1),expect(e.current.state).toBe(`collapsed`)})}),describe(`Sidebar`,()=>{it(`renders a plain wrapper when collapsible="none"`,()=>{let{container:e}=O(j(a,{children:j(y,{collapsible:`none`,children:`plain content`})})),t=e.querySelector(`[data-slot="sidebar"]`);expect(t).not.toBeNull(),expect(t.className).toContain(`w-(--sidebar-width)`),expect(t.getAttribute(`data-state`)).toBeNull(),expect(T.getByText(`plain content`)).not.toBeNull()}),it(`renders the desktop layout with gap/container/inner elements reflecting side/variant/state`,()=>{let{container:e}=O(j(a,{defaultOpen:!1,children:j(y,{side:`right`,variant:`floating`,collapsible:`icon`,children:`desktop content`})})),t=e.querySelector(`[data-slot="sidebar"]`);expect(t.getAttribute(`data-state`)).toBe(`collapsed`),expect(t.getAttribute(`data-collapsible`)).toBe(`icon`),expect(t.getAttribute(`data-variant`)).toBe(`floating`),expect(t.getAttribute(`data-side`)).toBe(`right`),expect(e.querySelector(`[data-slot="sidebar-gap"]`)).not.toBeNull(),expect(e.querySelector(`[data-slot="sidebar-container"]`)).not.toBeNull(),expect(e.querySelector(`[data-slot="sidebar-inner"]`)).not.toBeNull()}),it(`clears data-collapsible while expanded`,()=>{let{container:e}=O(j(a,{children:j(y,{collapsible:`icon`,children:`content`})}));expect(e.querySelector(`[data-slot="sidebar"]`)?.getAttribute(`data-collapsible`)).toBe(``)}),it(`is not rendered on mobile until openMobile is toggled, then renders inside a Drawer`,()=>{setTestViewportWidth(500);let{container:e,baseElement:n}=O(M(a,{children:[j(y,{children:j(`span`,{children:`mobile content`})}),j(t,{})]}));expect(e.querySelector(`[data-slot="sidebar"]`)).toBeNull(),expect(n.querySelector(`[data-slot="sidebar"]`)).toBeNull(),D.click(T.getByRole(`button`));let r=n.querySelector(`[data-slot="sidebar"]`);expect(r).not.toBeNull(),expect(r.getAttribute(`data-mobile`)).toBe(`true`),expect(T.getByText(`mobile content`)).not.toBeNull()})}),describe(`SidebarTrigger`,()=>{it(`renders with the sidebar-trigger slot and an accessible label`,()=>{let{container:e}=O(j(a,{children:j(t,{})}));expect(e.querySelector(`[data-slot="sidebar-trigger"]`)).not.toBeNull(),expect(T.getByRole(`button`,{name:`Toggle Sidebar`})).not.toBeNull()}),it(`calls a provided onClick handler in addition to toggling the sidebar`,()=>{let e=vi.fn();O(M(a,{children:[j(SidebarStateProbe,{}),j(t,{onClick:e})]})),D.click(T.getByRole(`button`)),expect(e).toHaveBeenCalledTimes(1),expect(T.getByTestId(`probe`).getAttribute(`data-state`)).toBe(`collapsed`)})}),describe(`SidebarRail`,()=>{it(`renders a rail button with the expected slot, label and tabIndex`,()=>{let{container:e}=O(j(a,{children:j(C,{})})),t=e.querySelector(`[data-slot="sidebar-rail"]`);expect(t).not.toBeNull(),expect(t.getAttribute(`aria-label`)).toBe(`Toggle Sidebar`),expect(t.getAttribute(`tabIndex`)).toBe(`-1`)}),it(`toggles the sidebar when clicked`,()=>{O(M(a,{children:[j(SidebarStateProbe,{}),j(C,{})]})),D.click(T.getByTitle(`Toggle Sidebar`)),expect(T.getByTestId(`probe`).getAttribute(`data-state`)).toBe(`collapsed`)})}),describe(`static layout subcomponents`,()=>{it(`renders SidebarInset as a main element`,()=>{let{container:e}=O(j(b,{children:`inset content`}));expect(e.querySelector(`[data-slot="sidebar-inset"]`)?.tagName).toBe(`MAIN`)}),it(`renders SidebarInput as a styled text input`,()=>{O(j(f,{placeholder:`Search`}));let e=T.getByPlaceholderText(`Search`);expect(e.getAttribute(`data-slot`)).toBe(`sidebar-input`),expect(e.className).toContain(`h-8`)}),it(`renders SidebarHeader, SidebarFooter, SidebarSeparator and SidebarContent with their slots`,()=>{let{container:e}=O(M(A,{children:[j(o,{children:`header`}),j(_,{children:`footer`}),j(n,{}),j(m,{children:`content`})]}));expect(e.querySelector(`[data-slot="sidebar-header"]`)).not.toBeNull(),expect(e.querySelector(`[data-slot="sidebar-footer"]`)).not.toBeNull(),expect(e.querySelector(`[data-slot="sidebar-separator"]`)).not.toBeNull(),expect(e.querySelector(`[data-slot="sidebar-content"]`)).not.toBeNull()}),it(`renders SidebarGroup, SidebarGroupContent, SidebarMenu, SidebarMenuItem, SidebarMenuBadge, SidebarMenuSub and SidebarMenuSubItem with their slots`,()=>{let{container:e}=O(j(d,{children:j(h,{children:j(s,{children:M(u,{children:[`item`,j(g,{children:`1`}),j(r,{children:j(w,{children:`sub item`})})]})})})}));expect(e.querySelector(`[data-slot="sidebar-group"]`)).not.toBeNull(),expect(e.querySelector(`[data-slot="sidebar-group-content"]`)).not.toBeNull(),expect(e.querySelector(`[data-slot="sidebar-menu"]`)?.tagName).toBe(`UL`),expect(e.querySelector(`[data-slot="sidebar-menu-item"]`)?.tagName).toBe(`LI`),expect(e.querySelector(`[data-slot="sidebar-menu-badge"]`)).not.toBeNull(),expect(e.querySelector(`[data-slot="sidebar-menu-sub"]`)?.tagName).toBe(`UL`),expect(e.querySelector(`[data-slot="sidebar-menu-sub-item"]`)?.tagName).toBe(`LI`)})}),describe(`SidebarGroupLabel`,()=>{it(`renders as a div by default`,()=>{let{container:e}=O(j(v,{children:`Label`}));expect(e.querySelector(`[data-slot="sidebar-group-label"]`)?.tagName).toBe(`DIV`)}),it(`renders as the child element when asChild is set`,()=>{let{container:e}=O(j(v,{asChild:!0,children:j(`span`,{children:`Label`})}));expect(e.querySelector(`[data-slot="sidebar-group-label"]`)?.tagName).toBe(`SPAN`)})}),describe(`SidebarGroupAction`,()=>{it(`renders as a button by default`,()=>{let{container:e}=O(j(i,{children:`Add`}));expect(e.querySelector(`[data-slot="sidebar-group-action"]`)?.tagName).toBe(`BUTTON`)}),it(`renders as the child element when asChild is set and forwards click handlers`,()=>{let e=vi.fn();O(j(i,{asChild:!0,onClick:e,children:j(`a`,{href:`#action`,children:`Add`})}));let t=T.getByText(`Add`);expect(t.tagName).toBe(`A`),D.click(t),expect(e).toHaveBeenCalledTimes(1)})}),describe(`SidebarMenuButton`,()=>{it(`renders default size/active data attributes`,()=>{let{container:e}=O(j(a,{children:j(p,{children:`Item`})})),t=e.querySelector(`[data-slot="sidebar-menu-button"]`);expect(t.getAttribute(`data-size`)).toBe(`md`),expect(t.getAttribute(`data-active`)).toBe(`false`)}),it(`reflects isActive and a custom size`,()=>{let{container:e}=O(j(a,{children:j(p,{isActive:!0,size:`lg`,children:`Item`})})),t=e.querySelector(`[data-slot="sidebar-menu-button"]`);expect(t.getAttribute(`data-active`)).toBe(`true`),expect(t.getAttribute(`data-size`)).toBe(`lg`)}),it(`renders as the child element when asChild is set`,()=>{O(j(a,{children:j(p,{asChild:!0,children:j(`a`,{href:`#item`,children:`Item`})})})),expect(T.getByRole(`link`,{name:`Item`})).not.toBeNull()}),it(`renders without a tooltip wrapper when no tooltip is provided`,()=>{let{container:e}=O(j(a,{children:j(p,{children:`Item`})}));expect(e.querySelector(`[data-slot="tooltip-trigger"]`)).toBeNull()}),it(`wraps the button in a Tooltip when a string tooltip is provided`,()=>{let{baseElement:t}=O(j(e,{children:j(a,{defaultOpen:!1,children:j(p,{tooltip:`Item tooltip`,children:`Item`})})}));expect(t.querySelector(`[data-slot="tooltip-content"]`)).toBeNull(),D.focus(T.getByText(`Item`)),expect(t.querySelector(`[data-slot="tooltip-content"]`)?.textContent).toBe(`Item tooltip`)}),it(`accepts an object tooltip with custom content props`,()=>{let{baseElement:t}=O(j(e,{children:j(a,{defaultOpen:!1,children:j(p,{tooltip:{children:`Custom tooltip`,side:`bottom`},children:`Item`})})}));D.focus(T.getByText(`Item`));let n=t.querySelector(`[data-slot="tooltip-content"]`);expect(n?.textContent).toBe(`Custom tooltip`),expect(n?.getAttribute(`data-side`)).toBe(`bottom`)}),it(`hides the tooltip content while expanded and shows it while collapsed on desktop`,()=>{let{baseElement:n}=O(j(e,{children:M(a,{defaultOpen:!0,children:[j(p,{tooltip:`Item tooltip`,children:`Item`}),j(t,{})]})}));D.focus(T.getByText(`Item`));let r=n.querySelector(`[data-slot="tooltip-content"]`);expect(r.hidden).toBe(!0),D.click(T.getByRole(`button`,{name:`Toggle Sidebar`})),expect(r.hidden).toBe(!1)})}),describe(`SidebarMenuAction`,()=>{it(`renders as a button with the menu-action slot`,()=>{let{container:e}=O(j(c,{children:`Action`}));expect(e.querySelector(`[data-slot="sidebar-menu-action"]`)?.tagName).toBe(`BUTTON`)}),it(`applies the showOnHover classes when requested`,()=>{let{container:e}=O(j(c,{showOnHover:!0,children:`Action`})),t=e.querySelector(`[data-slot="sidebar-menu-action"]`);expect(t.className).toContain(`md:opacity-0`)}),it(`renders as the child element when asChild is set`,()=>{O(j(c,{asChild:!0,children:j(`a`,{href:`#action`,children:`Action`})})),expect(T.getByRole(`link`,{name:`Action`})).not.toBeNull()})}),describe(`SidebarMenuSkeleton`,()=>{it(`renders a text placeholder without an icon by default`,()=>{let{container:e}=O(j(l,{}));expect(e.querySelector(`[data-sidebar="menu-skeleton-icon"]`)).toBeNull(),expect(e.querySelector(`[data-sidebar="menu-skeleton-text"]`)).not.toBeNull()}),it(`renders an icon skeleton when showIcon is set`,()=>{let{container:e}=O(j(l,{showIcon:!0}));expect(e.querySelector(`[data-sidebar="menu-skeleton-icon"]`)).not.toBeNull()}),it(`assigns a random text width between 50% and 90%`,()=>{let{container:e}=O(j(l,{})),t=e.querySelector(`[data-sidebar="menu-skeleton-text"]`),n=Number(t.style.getPropertyValue(`--skeleton-width`).replace(`%`,``));expect(n).toBeGreaterThanOrEqual(50),expect(n).toBeLessThanOrEqual(90)})}),describe(`SidebarMenuSubButton`,()=>{it(`renders as an anchor by default with size and active data attributes`,()=>{let{container:e}=O(j(x,{href:`#sub`,children:`Sub item`})),t=e.querySelector(`[data-slot="sidebar-menu-sub-button"]`);expect(t.tagName).toBe(`A`),expect(t.getAttribute(`data-size`)).toBe(`md`),expect(t.getAttribute(`data-active`)).toBe(`false`)}),it(`reflects isActive and a custom size`,()=>{let{container:e}=O(j(x,{isActive:!0,size:`sm`,children:`Sub item`})),t=e.querySelector(`[data-slot="sidebar-menu-sub-button"]`);expect(t.getAttribute(`data-active`)).toBe(`true`),expect(t.getAttribute(`data-size`)).toBe(`sm`)}),it(`renders as the child element when asChild is set`,()=>{O(j(x,{asChild:!0,children:j(`button`,{type:`button`,children:`Sub item`})})),expect(T.getByRole(`button`,{name:`Sub item`})).not.toBeNull()})});
|
|
1
|
+
import"../rolldown-runtime-Bdj-bS2b.js";import{r as e}from"../tooltip-CNUNWZvs.js";import{C as t,S as n,_ as r,a as i,b as a,c as o,d as s,f as c,g as l,h as u,i as d,l as f,m as p,n as m,o as h,p as g,r as _,s as v,t as y,u as b,v as x,w as S,x as C,y as w}from"../sidebar-f9maf3VF.js";import{a as T,i as E,n as D,r as O,t as k}from"../react.esm-BkhVXJ8s.js";import{Fragment as A,jsx as j,jsxs as M}from"react/jsx-runtime";import*as N from"react";if(globalThis.ResizeObserver===void 0){class ResizeObserverStub{observe(){}unobserve(){}disconnect(){}}globalThis.ResizeObserver=ResizeObserverStub}function clearSidebarCookie(){document.cookie=`sidebar_state=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/`}function readSidebarCookie(){return document.cookie.split(`; `).find(e=>e.startsWith(`sidebar_state=`))?.split(`=`)[1]}function SidebarStateProbe(){let{state:e,open:t,isMobile:n,openMobile:r}=S();return j(`div`,{"data-testid":`probe`,"data-state":e,"data-open":t,"data-mobile":n,"data-open-mobile":r})}beforeEach(()=>{clearSidebarCookie()}),describe(`SidebarProvider`,()=>{it(`renders its children`,()=>{O(j(a,{children:j(`div`,{children:`sidebar content`})})),expect(T.getByText(`sidebar content`)).not.toBeNull()}),it(`renders a wrapper exposing the sidebar css variables and merges custom style/className`,()=>{let{container:e}=O(j(a,{className:`custom-wrapper`,style:{"--custom":`1px`},children:j(`div`,{children:`content`})})),t=e.querySelector(`[data-slot="sidebar-wrapper"]`);expect(t).not.toBeNull(),expect(t.className).toContain(`custom-wrapper`),expect(t.style.getPropertyValue(`--sidebar-width`)).toBe(`16rem`),expect(t.style.getPropertyValue(`--sidebar-width-icon`)).toBe(`3rem`),expect(t.style.getPropertyValue(`--custom`)).toBe(`1px`)}),it(`defaults to an expanded/open state`,()=>{O(j(a,{children:j(SidebarStateProbe,{})}));let e=T.getByTestId(`probe`);expect(e.getAttribute(`data-state`)).toBe(`expanded`),expect(e.getAttribute(`data-open`)).toBe(`true`)}),it(`honors defaultOpen={false}`,()=>{O(j(a,{defaultOpen:!1,children:j(SidebarStateProbe,{})})),expect(T.getByTestId(`probe`).getAttribute(`data-state`)).toBe(`collapsed`)}),it(`toggles open state via the trigger and persists it to the sidebar_state cookie`,()=>{O(M(a,{children:[j(SidebarStateProbe,{}),j(t,{})]})),expect(T.getByTestId(`probe`).getAttribute(`data-state`)).toBe(`expanded`),D.click(T.getByRole(`button`)),expect(T.getByTestId(`probe`).getAttribute(`data-state`)).toBe(`collapsed`),expect(readSidebarCookie()).toBe(`false`),D.click(T.getByRole(`button`)),expect(T.getByTestId(`probe`).getAttribute(`data-state`)).toBe(`expanded`),expect(readSidebarCookie()).toBe(`true`)}),it(`supports a controlled open state via open/onOpenChange`,()=>{let e=vi.fn();function Controlled(){let[n,r]=N.useState(!1);return M(a,{open:n,onOpenChange:t=>{r(t),e(t)},children:[j(SidebarStateProbe,{}),j(t,{})]})}O(j(Controlled,{})),expect(T.getByTestId(`probe`).getAttribute(`data-state`)).toBe(`collapsed`),D.click(T.getByRole(`button`)),expect(e).toHaveBeenCalledWith(!0),expect(T.getByTestId(`probe`).getAttribute(`data-state`)).toBe(`expanded`),expect(readSidebarCookie()).toBe(`true`)}),it(`toggles the sidebar with the Cmd/Ctrl+B keyboard shortcut`,()=>{O(j(a,{children:j(SidebarStateProbe,{})})),D.keyDown(window,{key:`b`,metaKey:!0}),expect(T.getByTestId(`probe`).getAttribute(`data-state`)).toBe(`collapsed`),D.keyDown(window,{key:`b`,ctrlKey:!0}),expect(T.getByTestId(`probe`).getAttribute(`data-state`)).toBe(`expanded`)}),it(`ignores the shortcut key without a meta/ctrl modifier`,()=>{O(j(a,{children:j(SidebarStateProbe,{})})),D.keyDown(window,{key:`b`}),expect(T.getByTestId(`probe`).getAttribute(`data-state`)).toBe(`expanded`)}),it(`reports isMobile from the current viewport width`,()=>{setTestViewportWidth(500),O(j(a,{children:j(SidebarStateProbe,{})}));let e=T.getByTestId(`probe`);expect(e.getAttribute(`data-mobile`)).toBe(`true`),expect(e.getAttribute(`data-open-mobile`)).toBe(`false`)}),it(`toggles openMobile instead of open on a mobile viewport, without writing the cookie`,()=>{setTestViewportWidth(500),O(M(a,{children:[j(SidebarStateProbe,{}),j(t,{})]})),D.click(T.getByRole(`button`));let e=T.getByTestId(`probe`);expect(e.getAttribute(`data-open-mobile`)).toBe(`true`),expect(e.getAttribute(`data-open`)).toBe(`true`),expect(readSidebarCookie()).toBeUndefined()})}),describe(`useSidebar`,()=>{it(`throws when used outside of a SidebarProvider`,()=>{expect(()=>E(()=>S())).toThrow(`useSidebar must be used within a SidebarProvider.`)}),it(`exposes state, open, isMobile, openMobile and toggleSidebar to consumers`,()=>{let{result:e}=E(()=>S(),{wrapper:({children:e})=>j(a,{children:e})});expect(e.current.state).toBe(`expanded`),expect(e.current.open).toBe(!0),expect(e.current.isMobile).toBe(!1),expect(e.current.openMobile).toBe(!1),k(()=>{e.current.toggleSidebar()}),expect(e.current.open).toBe(!1),expect(e.current.state).toBe(`collapsed`)})}),describe(`Sidebar`,()=>{it(`renders a plain wrapper when collapsible="none"`,()=>{let{container:e}=O(j(a,{children:j(y,{collapsible:`none`,children:`plain content`})})),t=e.querySelector(`[data-slot="sidebar"]`);expect(t).not.toBeNull(),expect(t.className).toContain(`w-(--sidebar-width)`),expect(t.getAttribute(`data-state`)).toBeNull(),expect(T.getByText(`plain content`)).not.toBeNull()}),it(`renders the desktop layout with gap/container/inner elements reflecting side/variant/state`,()=>{let{container:e}=O(j(a,{defaultOpen:!1,children:j(y,{side:`right`,variant:`floating`,collapsible:`icon`,children:`desktop content`})})),t=e.querySelector(`[data-slot="sidebar"]`);expect(t.getAttribute(`data-state`)).toBe(`collapsed`),expect(t.getAttribute(`data-collapsible`)).toBe(`icon`),expect(t.getAttribute(`data-variant`)).toBe(`floating`),expect(t.getAttribute(`data-side`)).toBe(`right`),expect(e.querySelector(`[data-slot="sidebar-gap"]`)).not.toBeNull(),expect(e.querySelector(`[data-slot="sidebar-container"]`)).not.toBeNull(),expect(e.querySelector(`[data-slot="sidebar-inner"]`)).not.toBeNull()}),it(`clears data-collapsible while expanded`,()=>{let{container:e}=O(j(a,{children:j(y,{collapsible:`icon`,children:`content`})}));expect(e.querySelector(`[data-slot="sidebar"]`)?.getAttribute(`data-collapsible`)).toBe(``)}),it(`is not rendered on mobile until openMobile is toggled, then renders inside a Drawer`,()=>{setTestViewportWidth(500);let{container:e,baseElement:n}=O(M(a,{children:[j(y,{children:j(`span`,{children:`mobile content`})}),j(t,{})]}));expect(e.querySelector(`[data-slot="sidebar"]`)).toBeNull(),expect(n.querySelector(`[data-slot="sidebar"]`)).toBeNull(),D.click(T.getByRole(`button`));let r=n.querySelector(`[data-slot="sidebar"]`);expect(r).not.toBeNull(),expect(r.getAttribute(`data-mobile`)).toBe(`true`),expect(T.getByText(`mobile content`)).not.toBeNull()})}),describe(`SidebarTrigger`,()=>{it(`renders with the sidebar-trigger slot and an accessible label`,()=>{let{container:e}=O(j(a,{children:j(t,{})}));expect(e.querySelector(`[data-slot="sidebar-trigger"]`)).not.toBeNull(),expect(T.getByRole(`button`,{name:`Toggle Sidebar`})).not.toBeNull()}),it(`calls a provided onClick handler in addition to toggling the sidebar`,()=>{let e=vi.fn();O(M(a,{children:[j(SidebarStateProbe,{}),j(t,{onClick:e})]})),D.click(T.getByRole(`button`)),expect(e).toHaveBeenCalledTimes(1),expect(T.getByTestId(`probe`).getAttribute(`data-state`)).toBe(`collapsed`)})}),describe(`SidebarRail`,()=>{it(`renders a rail button with the expected slot, label and tabIndex`,()=>{let{container:e}=O(j(a,{children:j(C,{})})),t=e.querySelector(`[data-slot="sidebar-rail"]`);expect(t).not.toBeNull(),expect(t.getAttribute(`aria-label`)).toBe(`Toggle Sidebar`),expect(t.getAttribute(`tabIndex`)).toBe(`-1`)}),it(`toggles the sidebar when clicked`,()=>{O(M(a,{children:[j(SidebarStateProbe,{}),j(C,{})]})),D.click(T.getByTitle(`Toggle Sidebar`)),expect(T.getByTestId(`probe`).getAttribute(`data-state`)).toBe(`collapsed`)})}),describe(`static layout subcomponents`,()=>{it(`renders SidebarInset as a main element`,()=>{let{container:e}=O(j(b,{children:`inset content`}));expect(e.querySelector(`[data-slot="sidebar-inset"]`)?.tagName).toBe(`MAIN`)}),it(`renders SidebarInput as a styled text input`,()=>{O(j(f,{placeholder:`Search`}));let e=T.getByPlaceholderText(`Search`);expect(e.getAttribute(`data-slot`)).toBe(`sidebar-input`),expect(e.className).toContain(`h-8`)}),it(`renders SidebarHeader, SidebarFooter, SidebarSeparator and SidebarContent with their slots`,()=>{let{container:e}=O(M(A,{children:[j(o,{children:`header`}),j(_,{children:`footer`}),j(n,{}),j(m,{children:`content`})]}));expect(e.querySelector(`[data-slot="sidebar-header"]`)).not.toBeNull(),expect(e.querySelector(`[data-slot="sidebar-footer"]`)).not.toBeNull(),expect(e.querySelector(`[data-slot="sidebar-separator"]`)).not.toBeNull(),expect(e.querySelector(`[data-slot="sidebar-content"]`)).not.toBeNull()}),it(`renders SidebarGroup, SidebarGroupContent, SidebarMenu, SidebarMenuItem, SidebarMenuBadge, SidebarMenuSub and SidebarMenuSubItem with their slots`,()=>{let{container:e}=O(j(d,{children:j(h,{children:j(s,{children:M(u,{children:[`item`,j(g,{children:`1`}),j(r,{children:j(w,{children:`sub item`})})]})})})}));expect(e.querySelector(`[data-slot="sidebar-group"]`)).not.toBeNull(),expect(e.querySelector(`[data-slot="sidebar-group-content"]`)).not.toBeNull(),expect(e.querySelector(`[data-slot="sidebar-menu"]`)?.tagName).toBe(`UL`),expect(e.querySelector(`[data-slot="sidebar-menu-item"]`)?.tagName).toBe(`LI`),expect(e.querySelector(`[data-slot="sidebar-menu-badge"]`)).not.toBeNull(),expect(e.querySelector(`[data-slot="sidebar-menu-sub"]`)?.tagName).toBe(`UL`),expect(e.querySelector(`[data-slot="sidebar-menu-sub-item"]`)?.tagName).toBe(`LI`)})}),describe(`SidebarGroupLabel`,()=>{it(`renders as a div by default`,()=>{let{container:e}=O(j(v,{children:`Label`}));expect(e.querySelector(`[data-slot="sidebar-group-label"]`)?.tagName).toBe(`DIV`)}),it(`renders as the child element when asChild is set`,()=>{let{container:e}=O(j(v,{asChild:!0,children:j(`span`,{children:`Label`})}));expect(e.querySelector(`[data-slot="sidebar-group-label"]`)?.tagName).toBe(`SPAN`)})}),describe(`SidebarGroupAction`,()=>{it(`renders as a button by default`,()=>{let{container:e}=O(j(i,{children:`Add`}));expect(e.querySelector(`[data-slot="sidebar-group-action"]`)?.tagName).toBe(`BUTTON`)}),it(`renders as the child element when asChild is set and forwards click handlers`,()=>{let e=vi.fn();O(j(i,{asChild:!0,onClick:e,children:j(`a`,{href:`#action`,children:`Add`})}));let t=T.getByText(`Add`);expect(t.tagName).toBe(`A`),D.click(t),expect(e).toHaveBeenCalledTimes(1)})}),describe(`SidebarMenuButton`,()=>{it(`renders default size/active data attributes`,()=>{let{container:e}=O(j(a,{children:j(p,{children:`Item`})})),t=e.querySelector(`[data-slot="sidebar-menu-button"]`);expect(t.getAttribute(`data-size`)).toBe(`md`),expect(t.getAttribute(`data-active`)).toBe(`false`)}),it(`reflects isActive and a custom size`,()=>{let{container:e}=O(j(a,{children:j(p,{isActive:!0,size:`lg`,children:`Item`})})),t=e.querySelector(`[data-slot="sidebar-menu-button"]`);expect(t.getAttribute(`data-active`)).toBe(`true`),expect(t.getAttribute(`data-size`)).toBe(`lg`)}),it(`renders as the child element when asChild is set`,()=>{O(j(a,{children:j(p,{asChild:!0,children:j(`a`,{href:`#item`,children:`Item`})})})),expect(T.getByRole(`link`,{name:`Item`})).not.toBeNull()}),it(`renders without a tooltip wrapper when no tooltip is provided`,()=>{let{container:e}=O(j(a,{children:j(p,{children:`Item`})}));expect(e.querySelector(`[data-slot="tooltip-trigger"]`)).toBeNull()}),it(`wraps the button in a Tooltip when a string tooltip is provided`,()=>{let{baseElement:t}=O(j(e,{children:j(a,{defaultOpen:!1,children:j(p,{tooltip:`Item tooltip`,children:`Item`})})}));expect(t.querySelector(`[data-slot="tooltip-content"]`)).toBeNull(),D.focus(T.getByText(`Item`)),expect(t.querySelector(`[data-slot="tooltip-content"]`)?.textContent).toBe(`Item tooltip`)}),it(`accepts an object tooltip with custom content props`,()=>{let{baseElement:t}=O(j(e,{children:j(a,{defaultOpen:!1,children:j(p,{tooltip:{children:`Custom tooltip`,side:`bottom`},children:`Item`})})}));D.focus(T.getByText(`Item`));let n=t.querySelector(`[data-slot="tooltip-content"]`);expect(n?.textContent).toBe(`Custom tooltip`),expect(n?.getAttribute(`data-side`)).toBe(`bottom`)}),it(`hides the tooltip content while expanded and shows it while collapsed on desktop`,()=>{let{baseElement:n}=O(j(e,{children:M(a,{defaultOpen:!0,children:[j(p,{tooltip:`Item tooltip`,children:`Item`}),j(t,{})]})}));D.focus(T.getByText(`Item`));let r=n.querySelector(`[data-slot="tooltip-content"]`);expect(r.hidden).toBe(!0),D.click(T.getByRole(`button`,{name:`Toggle Sidebar`})),expect(r.hidden).toBe(!1)})}),describe(`SidebarMenuAction`,()=>{it(`renders as a button with the menu-action slot`,()=>{let{container:e}=O(j(c,{children:`Action`}));expect(e.querySelector(`[data-slot="sidebar-menu-action"]`)?.tagName).toBe(`BUTTON`)}),it(`applies the showOnHover classes when requested`,()=>{let{container:e}=O(j(c,{showOnHover:!0,children:`Action`})),t=e.querySelector(`[data-slot="sidebar-menu-action"]`);expect(t.className).toContain(`md:opacity-0`)}),it(`renders as the child element when asChild is set`,()=>{O(j(c,{asChild:!0,children:j(`a`,{href:`#action`,children:`Action`})})),expect(T.getByRole(`link`,{name:`Action`})).not.toBeNull()})}),describe(`SidebarMenuSkeleton`,()=>{it(`renders a text placeholder without an icon by default`,()=>{let{container:e}=O(j(l,{}));expect(e.querySelector(`[data-sidebar="menu-skeleton-icon"]`)).toBeNull(),expect(e.querySelector(`[data-sidebar="menu-skeleton-text"]`)).not.toBeNull()}),it(`renders an icon skeleton when showIcon is set`,()=>{let{container:e}=O(j(l,{showIcon:!0}));expect(e.querySelector(`[data-sidebar="menu-skeleton-icon"]`)).not.toBeNull()}),it(`assigns a random text width between 50% and 90%`,()=>{let{container:e}=O(j(l,{})),t=e.querySelector(`[data-sidebar="menu-skeleton-text"]`),n=Number(t.style.getPropertyValue(`--skeleton-width`).replace(`%`,``));expect(n).toBeGreaterThanOrEqual(50),expect(n).toBeLessThanOrEqual(90)})}),describe(`SidebarMenuSubButton`,()=>{it(`renders as an anchor by default with size and active data attributes`,()=>{let{container:e}=O(j(x,{href:`#sub`,children:`Sub item`})),t=e.querySelector(`[data-slot="sidebar-menu-sub-button"]`);expect(t.tagName).toBe(`A`),expect(t.getAttribute(`data-size`)).toBe(`md`),expect(t.getAttribute(`data-active`)).toBe(`false`)}),it(`reflects isActive and a custom size`,()=>{let{container:e}=O(j(x,{isActive:!0,size:`sm`,children:`Sub item`})),t=e.querySelector(`[data-slot="sidebar-menu-sub-button"]`);expect(t.getAttribute(`data-active`)).toBe(`true`),expect(t.getAttribute(`data-size`)).toBe(`sm`)}),it(`renders as the child element when asChild is set`,()=>{O(j(x,{asChild:!0,children:j(`button`,{type:`button`,children:`Sub item`})})),expect(T.getByRole(`button`,{name:`Sub item`})).not.toBeNull()})});
|
|
2
2
|
//# sourceMappingURL=sidebar.spec.js.map
|