Skip to content

Commit

Permalink
feat: default disable flip
Browse files Browse the repository at this point in the history
fix: `Navigation Menu` content shrink
  • Loading branch information
hngngn committed Nov 4, 2024
1 parent c67a880 commit 1d16b7c
Show file tree
Hide file tree
Showing 21 changed files with 71 additions and 19 deletions.

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion docs/public/registry/frameworks/tailwindcss/menubar.json

Large diffs are not rendered by default.

Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
"files": [
{
"name": "navigation-menu.tsx",
"content": "import { cn } from \"@/libs/cn\";\nimport type {\n\tNavigationMenuContentProps,\n\tNavigationMenuRootProps,\n\tNavigationMenuTriggerProps,\n} from \"@kobalte/core/navigation-menu\";\nimport { NavigationMenu as NavigationMenuPrimitive } from \"@kobalte/core/navigation-menu\";\nimport type { PolymorphicProps } from \"@kobalte/core/polymorphic\";\nimport {\n\ttype ParentProps,\n\tShow,\n\ttype ValidComponent,\n\tmergeProps,\n\tsplitProps,\n} from \"solid-js\";\n\nexport const NavigationMenuItem = NavigationMenuPrimitive.Menu;\nexport const NavigationMenuLink = NavigationMenuPrimitive.Item;\nexport const NavigationMenuItemLabel = NavigationMenuPrimitive.ItemLabel;\nexport const NavigationMenuDescription =\n\tNavigationMenuPrimitive.ItemDescription;\nexport const NavigationMenuItemIndicator =\n\tNavigationMenuPrimitive.ItemIndicator;\nexport const NavigationMenuSub = NavigationMenuPrimitive.Sub;\nexport const NavigationMenuSubTrigger = NavigationMenuPrimitive.SubTrigger;\nexport const NavigationMenuSubContent = NavigationMenuPrimitive.SubContent;\nexport const NavigationMenuRadioGroup = NavigationMenuPrimitive.RadioGroup;\nexport const NavigationMenuRadioItem = NavigationMenuPrimitive.RadioItem;\nexport const NavigationMenuCheckboxItem = NavigationMenuPrimitive.CheckboxItem;\nexport const NavigationMenuSeparator = NavigationMenuPrimitive.Separator;\n\ntype withArrow = {\n\twithArrow?: boolean;\n};\n\ntype navigationMenuProps<T extends ValidComponent = \"ul\"> = ParentProps<\n\tNavigationMenuRootProps<T> &\n\t\twithArrow & {\n\t\t\tclass?: string;\n\t\t}\n>;\n\nexport const NavigationMenu = <T extends ValidComponent = \"ul\">(\n\tprops: PolymorphicProps<T, navigationMenuProps<T>>,\n) => {\n\tconst merge = mergeProps<navigationMenuProps<T>[]>(\n\t\t{\n\t\t\tget gutter() {\n\t\t\t\treturn props.withArrow ? props.gutter : 6;\n\t\t\t},\n\t\t\twithArrow: false,\n\t\t},\n\t\tprops,\n\t);\n\tconst [local, rest] = splitProps(merge as navigationMenuProps, [\n\t\t\"class\",\n\t\t\"children\",\n\t\t\"withArrow\",\n\t]);\n\n\treturn (\n\t\t<NavigationMenuPrimitive\n\t\t\tclass={cn(\"flex w-max items-center justify-center gap-x-1\", local.class)}\n\t\t\t{...rest}\n\t\t>\n\t\t\t{local.children}\n\t\t\t<NavigationMenuPrimitive.Viewport\n\t\t\t\tclass={cn(\n\t\t\t\t\t\"pointer-events-none z-50 overflow-x-clip overflow-y-visible rounded-md border bg-popover text-popover-foreground shadow\",\n\t\t\t\t\t\"h-[--kb-navigation-menu-viewport-height] w-[--kb-navigation-menu-viewport-width] transition-[width,height] duration-300\",\n\t\t\t\t\t\"origin-[--kb-menu-content-transform-origin]\",\n\t\t\t\t\t\"data-[expanded]:duration-300 data-[expanded]:animate-in data-[expanded]:fade-in data-[expanded]:zoom-in-95\",\n\t\t\t\t\t\"data-[closed]:duration-300 data-[closed]:animate-out data-[closed]:fade-out data-[closed]:zoom-out-95\",\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t<Show when={local.withArrow}>\n\t\t\t\t\t<NavigationMenuPrimitive.Arrow class=\"transition-transform duration-300\" />\n\t\t\t\t</Show>\n\t\t\t</NavigationMenuPrimitive.Viewport>\n\t\t</NavigationMenuPrimitive>\n\t);\n};\n\ntype navigationMenuTriggerProps<T extends ValidComponent = \"button\"> =\n\tParentProps<\n\t\tNavigationMenuTriggerProps<T> &\n\t\t\twithArrow & {\n\t\t\t\tclass?: string;\n\t\t\t}\n\t>;\n\nexport const NavigationMenuTrigger = <T extends ValidComponent = \"button\">(\n\tprops: PolymorphicProps<T, navigationMenuTriggerProps<T>>,\n) => {\n\tconst merge = mergeProps<navigationMenuTriggerProps<T>[]>(\n\t\t{\n\t\t\tget withArrow() {\n\t\t\t\treturn props.as === undefined ? true : props.withArrow;\n\t\t\t},\n\t\t},\n\t\tprops,\n\t);\n\tconst [local, rest] = splitProps(merge as navigationMenuTriggerProps, [\n\t\t\"class\",\n\t\t\"children\",\n\t\t\"withArrow\",\n\t]);\n\n\treturn (\n\t\t<NavigationMenuPrimitive.Trigger\n\t\t\tclass={cn(\n\t\t\t\t\"inline-flex w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium outline-none transition-colors duration-300 hover:bg-accent hover:text-accent-foreground disabled:pointer-events-none disabled:opacity-50\",\n\t\t\t\tlocal.class,\n\t\t\t)}\n\t\t\t{...rest}\n\t\t>\n\t\t\t{local.children}\n\t\t\t<Show when={local.withArrow}>\n\t\t\t\t<NavigationMenuPrimitive.Icon\n\t\t\t\t\tclass=\"ml-1 size-3 transition-transform duration-300 data-[expanded]:rotate-180\"\n\t\t\t\t\tas=\"svg\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t>\n\t\t\t\t\t<path\n\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\td=\"m6 9l6 6l6-6\"\n\t\t\t\t\t/>\n\t\t\t\t</NavigationMenuPrimitive.Icon>\n\t\t\t</Show>\n\t\t</NavigationMenuPrimitive.Trigger>\n\t);\n};\n\ntype navigationMenuContentProps<T extends ValidComponent = \"ul\"> = ParentProps<\n\tNavigationMenuContentProps<T> & {\n\t\tclass?: string;\n\t}\n>;\n\nexport const NavigationMenuContent = <T extends ValidComponent = \"ul\">(\n\tprops: PolymorphicProps<T, navigationMenuContentProps<T>>,\n) => {\n\tconst [local, rest] = splitProps(props as navigationMenuContentProps, [\n\t\t\"class\",\n\t\t\"children\",\n\t]);\n\n\treturn (\n\t\t<NavigationMenuPrimitive.Portal>\n\t\t\t<NavigationMenuPrimitive.Content\n\t\t\t\tclass={cn(\n\t\t\t\t\t\"absolute left-0 top-0 p-4 outline-none\",\n\t\t\t\t\t\"data-[motion^=from-]:duration-300 data-[motion^=from-]:animate-in data-[motion^=from-]:fade-in data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52\",\n\t\t\t\t\t\"data-[motion^=to-]:duration-300 data-[motion^=to-]:animate-out data-[motion^=to-]:fade-out data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52\",\n\t\t\t\t\tlocal.class,\n\t\t\t\t)}\n\t\t\t\t{...rest}\n\t\t\t>\n\t\t\t\t{local.children}\n\t\t\t</NavigationMenuPrimitive.Content>\n\t\t</NavigationMenuPrimitive.Portal>\n\t);\n};\n"
"content": "import { cn } from \"@/libs/cn\";\nimport type {\n\tNavigationMenuContentProps,\n\tNavigationMenuRootProps,\n\tNavigationMenuTriggerProps,\n} from \"@kobalte/core/navigation-menu\";\nimport { NavigationMenu as NavigationMenuPrimitive } from \"@kobalte/core/navigation-menu\";\nimport type { PolymorphicProps } from \"@kobalte/core/polymorphic\";\nimport {\n\ttype ParentProps,\n\tShow,\n\ttype ValidComponent,\n\tmergeProps,\n\tsplitProps,\n} from \"solid-js\";\n\nexport const NavigationMenuItem = NavigationMenuPrimitive.Menu;\nexport const NavigationMenuLink = NavigationMenuPrimitive.Item;\nexport const NavigationMenuItemLabel = NavigationMenuPrimitive.ItemLabel;\nexport const NavigationMenuDescription =\n\tNavigationMenuPrimitive.ItemDescription;\nexport const NavigationMenuItemIndicator =\n\tNavigationMenuPrimitive.ItemIndicator;\nexport const NavigationMenuSub = NavigationMenuPrimitive.Sub;\nexport const NavigationMenuSubTrigger = NavigationMenuPrimitive.SubTrigger;\nexport const NavigationMenuSubContent = NavigationMenuPrimitive.SubContent;\nexport const NavigationMenuRadioGroup = NavigationMenuPrimitive.RadioGroup;\nexport const NavigationMenuRadioItem = NavigationMenuPrimitive.RadioItem;\nexport const NavigationMenuCheckboxItem = NavigationMenuPrimitive.CheckboxItem;\nexport const NavigationMenuSeparator = NavigationMenuPrimitive.Separator;\n\ntype withArrow = {\n\twithArrow?: boolean;\n};\n\ntype navigationMenuProps<T extends ValidComponent = \"ul\"> = ParentProps<\n\tNavigationMenuRootProps<T> &\n\t\twithArrow & {\n\t\t\tclass?: string;\n\t\t}\n>;\n\nexport const NavigationMenu = <T extends ValidComponent = \"ul\">(\n\tprops: PolymorphicProps<T, navigationMenuProps<T>>,\n) => {\n\tconst merge = mergeProps<navigationMenuProps<T>[]>(\n\t\t{\n\t\t\tget gutter() {\n\t\t\t\treturn props.withArrow ? props.gutter : 6;\n\t\t\t},\n\t\t\twithArrow: false,\n\t\t\tflip: false,\n\t\t},\n\t\tprops,\n\t);\n\tconst [local, rest] = splitProps(merge as navigationMenuProps, [\n\t\t\"class\",\n\t\t\"children\",\n\t\t\"withArrow\",\n\t]);\n\n\treturn (\n\t\t<NavigationMenuPrimitive\n\t\t\tclass={cn(\"flex w-max items-center justify-center gap-x-1\", local.class)}\n\t\t\t{...rest}\n\t\t>\n\t\t\t{local.children}\n\t\t\t<NavigationMenuPrimitive.Viewport\n\t\t\t\tclass={cn(\n\t\t\t\t\t\"pointer-events-none z-50 overflow-x-clip overflow-y-visible rounded-md border bg-popover text-popover-foreground shadow\",\n\t\t\t\t\t\"h-[--kb-navigation-menu-viewport-height] w-[--kb-navigation-menu-viewport-width] transition-[width,height] duration-300\",\n\t\t\t\t\t\"origin-[--kb-menu-content-transform-origin]\",\n\t\t\t\t\t\"data-[expanded]:duration-300 data-[expanded]:animate-in data-[expanded]:fade-in data-[expanded]:zoom-in-95\",\n\t\t\t\t\t\"data-[closed]:duration-300 data-[closed]:animate-out data-[closed]:fade-out data-[closed]:zoom-out-95\",\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t<Show when={local.withArrow}>\n\t\t\t\t\t<NavigationMenuPrimitive.Arrow class=\"transition-transform duration-300\" />\n\t\t\t\t</Show>\n\t\t\t</NavigationMenuPrimitive.Viewport>\n\t\t</NavigationMenuPrimitive>\n\t);\n};\n\ntype navigationMenuTriggerProps<T extends ValidComponent = \"button\"> =\n\tParentProps<\n\t\tNavigationMenuTriggerProps<T> &\n\t\t\twithArrow & {\n\t\t\t\tclass?: string;\n\t\t\t}\n\t>;\n\nexport const NavigationMenuTrigger = <T extends ValidComponent = \"button\">(\n\tprops: PolymorphicProps<T, navigationMenuTriggerProps<T>>,\n) => {\n\tconst merge = mergeProps<navigationMenuTriggerProps<T>[]>(\n\t\t{\n\t\t\tget withArrow() {\n\t\t\t\treturn props.as === undefined ? true : props.withArrow;\n\t\t\t},\n\t\t},\n\t\tprops,\n\t);\n\tconst [local, rest] = splitProps(merge as navigationMenuTriggerProps, [\n\t\t\"class\",\n\t\t\"children\",\n\t\t\"withArrow\",\n\t]);\n\n\treturn (\n\t\t<NavigationMenuPrimitive.Trigger\n\t\t\tclass={cn(\n\t\t\t\t\"inline-flex w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium outline-none transition-colors duration-300 hover:bg-accent hover:text-accent-foreground disabled:pointer-events-none disabled:opacity-50\",\n\t\t\t\tlocal.class,\n\t\t\t)}\n\t\t\t{...rest}\n\t\t>\n\t\t\t{local.children}\n\t\t\t<Show when={local.withArrow}>\n\t\t\t\t<NavigationMenuPrimitive.Icon\n\t\t\t\t\tclass=\"ml-1 size-3 transition-transform duration-300 data-[expanded]:rotate-180\"\n\t\t\t\t\tas=\"svg\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t>\n\t\t\t\t\t<path\n\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\td=\"m6 9l6 6l6-6\"\n\t\t\t\t\t/>\n\t\t\t\t</NavigationMenuPrimitive.Icon>\n\t\t\t</Show>\n\t\t</NavigationMenuPrimitive.Trigger>\n\t);\n};\n\ntype navigationMenuContentProps<T extends ValidComponent = \"ul\"> = ParentProps<\n\tNavigationMenuContentProps<T> & {\n\t\tclass?: string;\n\t}\n>;\n\nexport const NavigationMenuContent = <T extends ValidComponent = \"ul\">(\n\tprops: PolymorphicProps<T, navigationMenuContentProps<T>>,\n) => {\n\tconst [local, rest] = splitProps(props as navigationMenuContentProps, [\n\t\t\"class\",\n\t\t\"children\",\n\t]);\n\n\treturn (\n\t\t<NavigationMenuPrimitive.Portal>\n\t\t\t<NavigationMenuPrimitive.Content\n\t\t\t\tclass={cn(\n\t\t\t\t\t\"absolute left-0 top-0 p-4 outline-none\",\n\t\t\t\t\t\"data-[motion^=from-]:duration-300 data-[motion^=from-]:animate-in data-[motion^=from-]:fade-in data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52\",\n\t\t\t\t\t\"data-[motion^=to-]:duration-300 data-[motion^=to-]:animate-out data-[motion^=to-]:fade-out data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52\",\n\t\t\t\t\tlocal.class,\n\t\t\t\t)}\n\t\t\t\t{...rest}\n\t\t\t>\n\t\t\t\t{local.children}\n\t\t\t</NavigationMenuPrimitive.Content>\n\t\t</NavigationMenuPrimitive.Portal>\n\t);\n};\n"
}
],
"type": "components:ui"
Expand Down
2 changes: 1 addition & 1 deletion docs/public/registry/frameworks/tailwindcss/popover.json
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
"files": [
{
"name": "popover.tsx",
"content": "import { cn } from \"@/libs/cn\";\nimport type { PolymorphicProps } from \"@kobalte/core/polymorphic\";\nimport type {\n\tPopoverContentProps,\n\tPopoverRootProps,\n} from \"@kobalte/core/popover\";\nimport { Popover as PopoverPrimitive } from \"@kobalte/core/popover\";\nimport type { ParentProps, ValidComponent } from \"solid-js\";\nimport { mergeProps, splitProps } from \"solid-js\";\n\nexport const PopoverTrigger = PopoverPrimitive.Trigger;\nexport const PopoverTitle = PopoverPrimitive.Title;\nexport const PopoverDescription = PopoverPrimitive.Description;\n\nexport const Popover = (props: PopoverRootProps) => {\n\tconst merge = mergeProps<PopoverRootProps[]>({ gutter: 4 }, props);\n\n\treturn <PopoverPrimitive {...merge} />;\n};\n\ntype popoverContentProps<T extends ValidComponent = \"div\"> = ParentProps<\n\tPopoverContentProps<T> & {\n\t\tclass?: string;\n\t}\n>;\n\nexport const PopoverContent = <T extends ValidComponent = \"div\">(\n\tprops: PolymorphicProps<T, popoverContentProps<T>>,\n) => {\n\tconst [local, rest] = splitProps(props as popoverContentProps, [\n\t\t\"class\",\n\t\t\"children\",\n\t]);\n\n\treturn (\n\t\t<PopoverPrimitive.Portal>\n\t\t\t<PopoverPrimitive.Content\n\t\t\t\tclass={cn(\n\t\t\t\t\t\"z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[expanded]:animate-in data-[closed]:animate-out data-[closed]:fade-out-0 data-[expanded]:fade-in-0 data-[closed]:zoom-out-95 data-[expanded]:zoom-in-95\",\n\t\t\t\t\tlocal.class,\n\t\t\t\t)}\n\t\t\t\t{...rest}\n\t\t\t>\n\t\t\t\t{local.children}\n\t\t\t\t<PopoverPrimitive.CloseButton class=\"absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-[opacity,box-shadow] hover:opacity-100 focus:outline-none focus:ring-[1.5px] focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none\">\n\t\t\t\t\t<svg\n\t\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\tclass=\"h-4 w-4\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<path\n\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\t\td=\"M18 6L6 18M6 6l12 12\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<title>Close</title>\n\t\t\t\t\t</svg>\n\t\t\t\t</PopoverPrimitive.CloseButton>\n\t\t\t</PopoverPrimitive.Content>\n\t\t</PopoverPrimitive.Portal>\n\t);\n};\n"
"content": "import { cn } from \"@/libs/cn\";\nimport type { PolymorphicProps } from \"@kobalte/core/polymorphic\";\nimport type {\n\tPopoverContentProps,\n\tPopoverRootProps,\n} from \"@kobalte/core/popover\";\nimport { Popover as PopoverPrimitive } from \"@kobalte/core/popover\";\nimport type { ParentProps, ValidComponent } from \"solid-js\";\nimport { mergeProps, splitProps } from \"solid-js\";\n\nexport const PopoverTrigger = PopoverPrimitive.Trigger;\nexport const PopoverTitle = PopoverPrimitive.Title;\nexport const PopoverDescription = PopoverPrimitive.Description;\n\nexport const Popover = (props: PopoverRootProps) => {\n\tconst merge = mergeProps<PopoverRootProps[]>(\n\t\t{\n\t\t\tgutter: 4,\n\t\t\tflip: false,\n\t\t},\n\t\tprops,\n\t);\n\n\treturn <PopoverPrimitive {...merge} />;\n};\n\ntype popoverContentProps<T extends ValidComponent = \"div\"> = ParentProps<\n\tPopoverContentProps<T> & {\n\t\tclass?: string;\n\t}\n>;\n\nexport const PopoverContent = <T extends ValidComponent = \"div\">(\n\tprops: PolymorphicProps<T, popoverContentProps<T>>,\n) => {\n\tconst [local, rest] = splitProps(props as popoverContentProps, [\n\t\t\"class\",\n\t\t\"children\",\n\t]);\n\n\treturn (\n\t\t<PopoverPrimitive.Portal>\n\t\t\t<PopoverPrimitive.Content\n\t\t\t\tclass={cn(\n\t\t\t\t\t\"z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[expanded]:animate-in data-[closed]:animate-out data-[closed]:fade-out-0 data-[expanded]:fade-in-0 data-[closed]:zoom-out-95 data-[expanded]:zoom-in-95\",\n\t\t\t\t\tlocal.class,\n\t\t\t\t)}\n\t\t\t\t{...rest}\n\t\t\t>\n\t\t\t\t{local.children}\n\t\t\t\t<PopoverPrimitive.CloseButton class=\"absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-[opacity,box-shadow] hover:opacity-100 focus:outline-none focus:ring-[1.5px] focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none\">\n\t\t\t\t\t<svg\n\t\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\tclass=\"h-4 w-4\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<path\n\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\t\td=\"M18 6L6 18M6 6l12 12\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<title>Close</title>\n\t\t\t\t\t</svg>\n\t\t\t\t</PopoverPrimitive.CloseButton>\n\t\t\t</PopoverPrimitive.Content>\n\t\t</PopoverPrimitive.Portal>\n\t);\n};\n"
}
],
"type": "components:ui"
Expand Down
2 changes: 1 addition & 1 deletion docs/public/registry/frameworks/tailwindcss/tooltip.json
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
"files": [
{
"name": "tooltip.tsx",
"content": "import { cn } from \"@/libs/cn\";\nimport type { PolymorphicProps } from \"@kobalte/core/polymorphic\";\nimport type {\n\tTooltipContentProps,\n\tTooltipRootProps,\n} from \"@kobalte/core/tooltip\";\nimport { Tooltip as TooltipPrimitive } from \"@kobalte/core/tooltip\";\nimport { type ValidComponent, mergeProps, splitProps } from \"solid-js\";\n\nexport const TooltipTrigger = TooltipPrimitive.Trigger;\n\nexport const Tooltip = (props: TooltipRootProps) => {\n\tconst merge = mergeProps<TooltipRootProps[]>({ gutter: 4 }, props);\n\n\treturn <TooltipPrimitive {...merge} />;\n};\n\ntype tooltipContentProps<T extends ValidComponent = \"div\"> =\n\tTooltipContentProps<T> & {\n\t\tclass?: string;\n\t};\n\nexport const TooltipContent = <T extends ValidComponent = \"div\">(\n\tprops: PolymorphicProps<T, tooltipContentProps<T>>,\n) => {\n\tconst [local, rest] = splitProps(props as tooltipContentProps, [\"class\"]);\n\n\treturn (\n\t\t<TooltipPrimitive.Portal>\n\t\t\t<TooltipPrimitive.Content\n\t\t\t\tclass={cn(\n\t\t\t\t\t\"z-50 overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground data-[expanded]:animate-in data-[closed]:animate-out data-[closed]:fade-out-0 data-[expanded]:fade-in-0 data-[closed]:zoom-out-95 data-[expanded]:zoom-in-95\",\n\t\t\t\t\tlocal.class,\n\t\t\t\t)}\n\t\t\t\t{...rest}\n\t\t\t/>\n\t\t</TooltipPrimitive.Portal>\n\t);\n};\n"
"content": "import { cn } from \"@/libs/cn\";\nimport type { PolymorphicProps } from \"@kobalte/core/polymorphic\";\nimport type {\n\tTooltipContentProps,\n\tTooltipRootProps,\n} from \"@kobalte/core/tooltip\";\nimport { Tooltip as TooltipPrimitive } from \"@kobalte/core/tooltip\";\nimport { type ValidComponent, mergeProps, splitProps } from \"solid-js\";\n\nexport const TooltipTrigger = TooltipPrimitive.Trigger;\n\nexport const Tooltip = (props: TooltipRootProps) => {\n\tconst merge = mergeProps<TooltipRootProps[]>(\n\t\t{\n\t\t\tgutter: 4,\n\t\t\tflip: false,\n\t\t},\n\t\tprops,\n\t);\n\n\treturn <TooltipPrimitive {...merge} />;\n};\n\ntype tooltipContentProps<T extends ValidComponent = \"div\"> =\n\tTooltipContentProps<T> & {\n\t\tclass?: string;\n\t};\n\nexport const TooltipContent = <T extends ValidComponent = \"div\">(\n\tprops: PolymorphicProps<T, tooltipContentProps<T>>,\n) => {\n\tconst [local, rest] = splitProps(props as tooltipContentProps, [\"class\"]);\n\n\treturn (\n\t\t<TooltipPrimitive.Portal>\n\t\t\t<TooltipPrimitive.Content\n\t\t\t\tclass={cn(\n\t\t\t\t\t\"z-50 overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground data-[expanded]:animate-in data-[closed]:animate-out data-[closed]:fade-out-0 data-[expanded]:fade-in-0 data-[closed]:zoom-out-95 data-[expanded]:zoom-in-95\",\n\t\t\t\t\tlocal.class,\n\t\t\t\t)}\n\t\t\t\t{...rest}\n\t\t\t/>\n\t\t</TooltipPrimitive.Portal>\n\t);\n};\n"
}
],
"type": "components:ui"
Expand Down
Loading

1 comment on commit 1d16b7c

@vercel
Copy link

@vercel vercel bot commented on 1d16b7c Nov 4, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please sign in to comment.