@popgrids/ui 0.0.11 → 0.0.13
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/button.cjs +1 -0
- package/dist/button.cjs.map +1 -1
- package/dist/button.d.cts +21 -3
- package/dist/button.d.ts +21 -3
- package/dist/button.js +1 -0
- package/dist/button.js.map +1 -1
- package/dist/content-block.d.cts +1 -1
- package/dist/content-block.d.ts +1 -1
- package/dist/index.cjs +127 -0
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +4 -3
- package/dist/index.d.ts +4 -3
- package/dist/index.js +127 -1
- package/dist/index.js.map +1 -1
- package/dist/input.cjs +1 -0
- package/dist/input.cjs.map +1 -1
- package/dist/input.d.cts +1 -1
- package/dist/input.d.ts +1 -1
- package/dist/input.js +1 -0
- package/dist/input.js.map +1 -1
- package/dist/label.cjs +1 -0
- package/dist/label.cjs.map +1 -1
- package/dist/label.d.cts +1 -1
- package/dist/label.d.ts +1 -1
- package/dist/label.js +1 -0
- package/dist/label.js.map +1 -1
- package/dist/loader.d.cts +20 -2
- package/dist/loader.d.ts +20 -2
- package/dist/metafile-cjs.json +1 -1
- package/dist/metafile-esm.json +1 -1
- package/dist/notification-badge.cjs +1 -0
- package/dist/notification-badge.cjs.map +1 -1
- package/dist/notification-badge.d.cts +2 -2
- package/dist/notification-badge.d.ts +2 -2
- package/dist/notification-badge.js +1 -0
- package/dist/notification-badge.js.map +1 -1
- package/dist/section-header.cjs +1 -0
- package/dist/section-header.cjs.map +1 -1
- package/dist/section-header.d.cts +18 -2
- package/dist/section-header.d.ts +18 -2
- package/dist/section-header.js +1 -0
- package/dist/section-header.js.map +1 -1
- package/dist/tag.cjs +141 -0
- package/dist/tag.cjs.map +1 -0
- package/dist/tag.d.cts +16 -0
- package/dist/tag.d.ts +16 -0
- package/dist/tag.js +139 -0
- package/dist/tag.js.map +1 -0
- package/package.json +11 -1
- package/dist/button-D4TdCwoe.d.cts +0 -21
- package/dist/button-D4TdCwoe.d.ts +0 -21
- package/dist/loader-xdvZkRei.d.cts +0 -20
- package/dist/loader-xdvZkRei.d.ts +0 -20
- package/dist/section-header-BWd0FD9Q.d.cts +0 -18
- package/dist/section-header-BWd0FD9Q.d.ts +0 -18
package/dist/button.cjs
CHANGED
package/dist/button.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/lib/utils.ts","../src/components/button/button.tsx"],"names":["twMerge","clsx","cva","jsx","ButtonPrimitive","jsxs","Fragment"],"mappings":"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","file":"button.cjs","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n","\"use client\";\n\nimport { Button as ButtonPrimitive } from \"@base-ui/react/button\";\nimport { cva } from \"class-variance-authority\";\n\nimport { cn } from \"../../lib/utils\";\nimport { ButtonProps } from \"./types\";\n\nconst buttonVariants = cva(\n \"inline-flex relative items-center gap-1.5 whitespace-nowrap font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none shrink-0 [&_svg]:shrink-0 text-foreground bg-background group/button outline-none focus-visible:border-ring-3 focus-visible:ring-ring/60 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive\",\n {\n variants: {\n align: {\n left: \"justify-start\",\n center: \"justify-center\",\n right: \"justify-end\",\n },\n collapsed: {\n false: null,\n true: \"min-w-10 max-w-10 justify-center\",\n },\n outline: {\n false: null,\n true: \"\",\n },\n hasLeading: {\n false: null,\n },\n theme: {\n base: \"bg-foreground text-background\",\n brand: \"bg-primary-foreground text-primary\",\n error: \"\",\n },\n hasTrailing: {\n false: null,\n },\n variant: {\n default: \"hover:bg-background/90\",\n outline: \"backdrop-blur-lg \",\n primary: \"bg-primary-foreground/0 backdrop-blur-lg text-primary\",\n secondary: \"bg-secondary-foreground/0 backdrop-blur-lg text-secondary\",\n tertiary: \"bg-background/0 backdrop-blur-lg [--foreground:var(--color-text-text-default)]\",\n },\n pill: {\n false: \"rounded-xs\",\n true: \"rounded-full\",\n },\n size: {\n default: \"h-10 min-h-10 px-3 py-2 text-sm [&_svg:not([class*='size-'])]:size-[18px]\",\n lg: \"h-12 min-h-12 text-base [&_svg:not([class*='size-'])]:size-[20px]\",\n },\n },\n defaultVariants: {\n align: \"center\",\n outline: false,\n pill: false,\n size: \"default\",\n theme: \"brand\",\n variant: \"default\",\n },\n compoundVariants: [\n {\n pill: true,\n size: \"default\",\n class: \"min-w-10 min-h-10 px-4\",\n },\n {\n pill: true,\n collapsed: true,\n class: \"max-w-10\",\n },\n {\n pill: true,\n size: \"lg\",\n class: \"min-w-12 min-h-12 px-4\",\n },\n {\n pill: true,\n size: \"lg\",\n collapsed: true,\n class: \"max-w-[54px] max-h-12\",\n },\n {\n collapsed: false,\n size: \"default\",\n align: \"left\",\n pill: false,\n class: \"pr-3 pl-2\",\n },\n {\n align: \"center\",\n collapsed: false,\n size: \"default\",\n pill: false,\n class: \"px-3\",\n },\n {\n hasLeading: true,\n pill: false,\n align: \"left\",\n size: \"default\",\n class: \"pr-3 pl-2\",\n },\n {\n collapsed: false,\n size: \"default\",\n pill: true,\n class: \"px-4\",\n },\n {\n size: \"lg\",\n pill: true,\n collapsed: false,\n class: \"px-4\",\n },\n {\n variant: \"primary\",\n outline: false,\n theme: \"base\",\n class:\n \"bg-foreground text-background hover:ring-2 active:ring active:bg-background disabled:outline-none disabled:bg-black/0 disabled:text-black-alpha-600 focus-visible:ring-3 focus-visible:ring-ring focus-visible:outline-background focus-visible:bg-foreground focus-visible:text-background\",\n },\n {\n variant: \"primary\",\n outline: true,\n theme: \"base\",\n class:\n \"ring ring-foreground bg-background/0 text-foreground hover:ring-2 active:ring active:bg-background/1 disabled:outline-none disabled:bg-background/0 focus-visible:ring focus-visible:ring-ring focus-visible:outline-background focus-visible:bg-background/1\",\n },\n {\n variant: \"primary\",\n outline: true,\n theme: \"brand\",\n class:\n \"ring ring-primary-foreground bg-background/0 text-primary-foreground hover:ring-2 active:ring active:bg-background/1 disabled:outline-none disabled:bg-background/0 focus-visible:ring focus-visible:ring-ring focus-visible:outline-background focus-visible:bg-background/1\",\n },\n {\n variant: \"primary\",\n theme: \"brand\",\n outline: false,\n class:\n \"bg-primary-foreground text-primary hover:bg-primary-foreground hover:text-primary active:bg-primary-foreground active:text-primary focus-visible:bg-primary-foreground focus-visible:text-primary\",\n },\n {\n variant: \"primary\",\n theme: \"error\",\n class: \"bg-destructive text-black\",\n },\n {\n variant: \"secondary\",\n outline: false,\n theme: \"base\",\n class: \"bg-background/0 text-foreground backdrop-blur-lg focus-visible:backdrop-blur-md\",\n },\n {\n variant: \"secondary\",\n outline: true,\n theme: \"base\",\n class:\n \"bg-background/0 text-foreground ring ring-foreground/0 hover:ring-foreground active:ring-foreground/0 disabled:ring-foreground/0 backdrop-blur-lg focus-visible:backdrop-blur-md\",\n },\n {\n variant: \"tertiary\",\n outline: false,\n theme: \"base\",\n class: \"bg-background/0 text-foreground backdrop-blur-lg focus-visible:backdrop-blur-md\",\n },\n {\n variant: \"tertiary\",\n theme: \"error\",\n class: \"bg-transparent backdrop-blur-lg text-error-600\",\n },\n ],\n },\n);\n\nconst tintVariants = cva(\n \"before:content-[''] before:absolute before:inset-0 before:transition-all before:rounded-[inherit] before:pointer-events-none\",\n {\n variants: {\n outline: {\n false: null,\n },\n variant: {\n default: \"\",\n outline: \"\",\n primary:\n \"before:bg-tint-700-reversed/0 hover:before:bg-tint-700-reversed active:before:bg-tint-700-reversed/0 disabled:before:bg-tint-900-default focus-visible:before:bg-tint-700-reversed/0\",\n secondary:\n \"before:bg-tint-900-default hover:before:bg-tint-800-default active:before:bg-tint-900-default disabled:before:bg-tint-900-default focus-visible:before:bg-tint-800-default\",\n tertiary:\n \"before:bg-tint-950-reversed hover:before:bg-tint-900-default active:before:bg-tint-950-reversed disabled:before:bg-tint-950-reversed focus-visible:before:bg-tint-950-reversed\",\n },\n },\n defaultVariants: {\n outline: false,\n variant: \"default\",\n },\n compoundVariants: [\n {\n outline: true,\n variant: \"primary\",\n class:\n \"before:bg-tint-950-reversed hover:before:bg-tint-950-reversed active:before:bg-tint-950-reversed disabled:before:bg-tint-900-default focus-visible:before:bg-tint-950-reversed\",\n },\n {\n outline: true,\n variant: \"secondary\",\n class:\n \"before:bg-tint-950-reversed hover:before:bg-tint-950-reversed active:before:bg-tint-950-reversed disabled:before:bg-tint-900-default focus-visible:before:bg-tint-950-reversed\",\n },\n ],\n },\n);\n\nfunction Button({\n className,\n children,\n collapsed = false,\n variant = \"default\",\n align = \"center\",\n outline = false,\n pill = false,\n size = \"default\",\n theme = \"brand\",\n leading,\n trailing,\n ...props\n}: ButtonProps) {\n return (\n <ButtonPrimitive\n data-slot=\"button\"\n className={cn(\n buttonVariants({\n variant,\n size,\n align,\n outline,\n collapsed,\n pill,\n className,\n hasLeading: !!leading,\n theme,\n hasTrailing: !!trailing,\n }),\n tintVariants({ variant, outline }),\n )}\n {...props}\n >\n <>\n {leading && <div className=\"group-aria-busy/button:opacity-0\">{leading}</div>}\n {children && <span className=\"min-w-[18px] truncate\">{children}</span>}\n {trailing && (\n <div\n className={cn(\"group-aria-busy/button:opacity-0\", {\n \"absolute top-1/2 right-0 translate-x-1/2 -translate-y-1/2\": collapsed,\n })}\n >\n {trailing}\n </div>\n )}\n </>\n </ButtonPrimitive>\n );\n}\n\nexport { Button };\n"]}
|
|
1
|
+
{"version":3,"sources":["../src/lib/utils.ts","../src/components/button/button.tsx"],"names":["twMerge","clsx","cva","jsx","ButtonPrimitive","jsxs","Fragment"],"mappings":"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","file":"button.cjs","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n","\"use client\";\n\nimport { Button as ButtonPrimitive } from \"@base-ui/react/button\";\nimport { cva } from \"class-variance-authority\";\n\nimport { cn } from \"../../lib/utils\";\nimport { ButtonProps } from \"./types\";\n\nconst buttonVariants = cva(\n \"inline-flex relative items-center gap-1.5 whitespace-nowrap font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none shrink-0 [&_svg]:shrink-0 text-foreground bg-background group/button outline-none focus-visible:border-ring-3 focus-visible:ring-ring/60 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive\",\n {\n variants: {\n align: {\n left: \"justify-start\",\n center: \"justify-center\",\n right: \"justify-end\",\n },\n collapsed: {\n false: null,\n true: \"min-w-10 max-w-10 justify-center\",\n },\n outline: {\n false: null,\n true: \"\",\n },\n hasLeading: {\n false: null,\n },\n theme: {\n base: \"bg-foreground text-background\",\n brand: \"bg-primary-foreground text-primary\",\n error: \"\",\n },\n hasTrailing: {\n false: null,\n },\n variant: {\n default: \"hover:bg-background/90\",\n outline: \"backdrop-blur-lg \",\n primary: \"bg-primary-foreground/0 backdrop-blur-lg text-primary\",\n secondary: \"bg-secondary-foreground/0 backdrop-blur-lg text-secondary\",\n tertiary: \"bg-background/0 backdrop-blur-lg [--foreground:var(--color-text-text-default)]\",\n },\n pill: {\n false: \"rounded-xs\",\n true: \"rounded-full\",\n },\n size: {\n default: \"h-10 min-h-10 px-3 py-2 text-sm [&_svg:not([class*='size-'])]:size-[18px]\",\n lg: \"h-12 min-h-12 text-base [&_svg:not([class*='size-'])]:size-[20px]\",\n },\n },\n defaultVariants: {\n align: \"center\",\n outline: false,\n pill: false,\n size: \"default\",\n theme: \"brand\",\n variant: \"default\",\n },\n compoundVariants: [\n {\n pill: true,\n size: \"default\",\n class: \"min-w-10 min-h-10 px-4\",\n },\n {\n pill: true,\n collapsed: true,\n class: \"max-w-10\",\n },\n {\n pill: true,\n size: \"lg\",\n class: \"min-w-12 min-h-12 px-4\",\n },\n {\n pill: true,\n size: \"lg\",\n collapsed: true,\n class: \"max-w-[54px] max-h-12\",\n },\n {\n collapsed: false,\n size: \"default\",\n align: \"left\",\n pill: false,\n class: \"pr-3 pl-2\",\n },\n {\n align: \"center\",\n collapsed: false,\n size: \"default\",\n pill: false,\n class: \"px-3\",\n },\n {\n hasLeading: true,\n pill: false,\n align: \"left\",\n size: \"default\",\n class: \"pr-3 pl-2\",\n },\n {\n collapsed: false,\n size: \"default\",\n pill: true,\n class: \"px-4\",\n },\n {\n size: \"lg\",\n pill: true,\n collapsed: false,\n class: \"px-4\",\n },\n {\n variant: \"primary\",\n outline: false,\n theme: \"base\",\n class:\n \"bg-foreground text-background hover:ring-2 active:ring active:bg-background disabled:outline-none disabled:bg-black/0 disabled:text-black-alpha-600 focus-visible:ring-3 focus-visible:ring-ring focus-visible:outline-background focus-visible:bg-foreground focus-visible:text-background\",\n },\n {\n variant: \"primary\",\n outline: true,\n theme: \"base\",\n class:\n \"ring ring-foreground bg-background/0 text-foreground hover:ring-2 active:ring active:bg-background/1 disabled:outline-none disabled:bg-background/0 focus-visible:ring focus-visible:ring-ring focus-visible:outline-background focus-visible:bg-background/1\",\n },\n {\n variant: \"primary\",\n outline: true,\n theme: \"brand\",\n class:\n \"ring ring-primary-foreground bg-background/0 text-primary-foreground hover:ring-2 active:ring active:bg-background/1 disabled:outline-none disabled:bg-background/0 focus-visible:ring focus-visible:ring-ring focus-visible:outline-background focus-visible:bg-background/1\",\n },\n {\n variant: \"primary\",\n theme: \"brand\",\n outline: false,\n class:\n \"bg-primary-foreground text-primary hover:bg-primary-foreground hover:text-primary active:bg-primary-foreground active:text-primary focus-visible:bg-primary-foreground focus-visible:text-primary\",\n },\n {\n variant: \"primary\",\n theme: \"error\",\n class: \"bg-destructive text-black\",\n },\n {\n variant: \"secondary\",\n outline: false,\n theme: \"base\",\n class: \"bg-background/0 text-foreground backdrop-blur-lg focus-visible:backdrop-blur-md\",\n },\n {\n variant: \"secondary\",\n outline: true,\n theme: \"base\",\n class:\n \"bg-background/0 text-foreground ring ring-foreground/0 hover:ring-foreground active:ring-foreground/0 disabled:ring-foreground/0 backdrop-blur-lg focus-visible:backdrop-blur-md\",\n },\n {\n variant: \"tertiary\",\n outline: false,\n theme: \"base\",\n class: \"bg-background/0 text-foreground backdrop-blur-lg focus-visible:backdrop-blur-md\",\n },\n {\n variant: \"tertiary\",\n theme: \"error\",\n class: \"bg-transparent backdrop-blur-lg text-error-600\",\n },\n ],\n },\n);\n\nconst tintVariants = cva(\n \"before:content-[''] before:absolute before:inset-0 before:transition-all before:rounded-[inherit] before:pointer-events-none\",\n {\n variants: {\n outline: {\n false: null,\n },\n variant: {\n default: \"\",\n outline: \"\",\n primary:\n \"before:bg-tint-700-reversed/0 hover:before:bg-tint-700-reversed active:before:bg-tint-700-reversed/0 disabled:before:bg-tint-900-default focus-visible:before:bg-tint-700-reversed/0\",\n secondary:\n \"before:bg-tint-900-default hover:before:bg-tint-800-default active:before:bg-tint-900-default disabled:before:bg-tint-900-default focus-visible:before:bg-tint-800-default\",\n tertiary:\n \"before:bg-tint-950-reversed hover:before:bg-tint-900-default active:before:bg-tint-950-reversed disabled:before:bg-tint-950-reversed focus-visible:before:bg-tint-950-reversed\",\n },\n },\n defaultVariants: {\n outline: false,\n variant: \"default\",\n },\n compoundVariants: [\n {\n outline: true,\n variant: \"primary\",\n class:\n \"before:bg-tint-950-reversed hover:before:bg-tint-950-reversed active:before:bg-tint-950-reversed disabled:before:bg-tint-900-default focus-visible:before:bg-tint-950-reversed\",\n },\n {\n outline: true,\n variant: \"secondary\",\n class:\n \"before:bg-tint-950-reversed hover:before:bg-tint-950-reversed active:before:bg-tint-950-reversed disabled:before:bg-tint-900-default focus-visible:before:bg-tint-950-reversed\",\n },\n ],\n },\n);\n\nfunction Button({\n className,\n children,\n collapsed = false,\n variant = \"default\",\n align = \"center\",\n outline = false,\n pill = false,\n size = \"default\",\n theme = \"brand\",\n leading,\n trailing,\n ...props\n}: ButtonProps) {\n return (\n <ButtonPrimitive\n data-slot=\"button\"\n className={cn(\n buttonVariants({\n variant,\n size,\n align,\n outline,\n collapsed,\n pill,\n className,\n hasLeading: !!leading,\n theme,\n hasTrailing: !!trailing,\n }),\n tintVariants({ variant, outline }),\n )}\n {...props}\n >\n <>\n {leading && <div className=\"group-aria-busy/button:opacity-0\">{leading}</div>}\n {children && <span className=\"min-w-[18px] truncate\">{children}</span>}\n {trailing && (\n <div\n className={cn(\"group-aria-busy/button:opacity-0\", {\n \"absolute top-1/2 right-0 translate-x-1/2 -translate-y-1/2\": collapsed,\n })}\n >\n {trailing}\n </div>\n )}\n </>\n </ButtonPrimitive>\n );\n}\n\nexport { Button };\n"]}
|
package/dist/button.d.cts
CHANGED
|
@@ -1,3 +1,21 @@
|
|
|
1
|
-
import 'react/jsx-runtime';
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import { useRender } from '@base-ui/react/use-render';
|
|
3
|
+
|
|
4
|
+
interface ButtonProps extends useRender.ComponentProps<"button"> {
|
|
5
|
+
className?: string;
|
|
6
|
+
collapsed?: boolean;
|
|
7
|
+
variant?: "default" | "outline" | "primary" | "secondary" | "tertiary";
|
|
8
|
+
align?: "left" | "center" | "right";
|
|
9
|
+
outline?: boolean;
|
|
10
|
+
pill?: boolean;
|
|
11
|
+
size?: "default" | "lg";
|
|
12
|
+
theme?: "base" | "brand" | "error";
|
|
13
|
+
leading?: React.ReactNode;
|
|
14
|
+
trailing?: React.ReactNode;
|
|
15
|
+
nativeButton?: boolean;
|
|
16
|
+
focusableWhenDisabled?: boolean;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
declare function Button({ className, children, collapsed, variant, align, outline, pill, size, theme, leading, trailing, ...props }: ButtonProps): react_jsx_runtime.JSX.Element;
|
|
20
|
+
|
|
21
|
+
export { Button, type ButtonProps };
|
package/dist/button.d.ts
CHANGED
|
@@ -1,3 +1,21 @@
|
|
|
1
|
-
import 'react/jsx-runtime';
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import { useRender } from '@base-ui/react/use-render';
|
|
3
|
+
|
|
4
|
+
interface ButtonProps extends useRender.ComponentProps<"button"> {
|
|
5
|
+
className?: string;
|
|
6
|
+
collapsed?: boolean;
|
|
7
|
+
variant?: "default" | "outline" | "primary" | "secondary" | "tertiary";
|
|
8
|
+
align?: "left" | "center" | "right";
|
|
9
|
+
outline?: boolean;
|
|
10
|
+
pill?: boolean;
|
|
11
|
+
size?: "default" | "lg";
|
|
12
|
+
theme?: "base" | "brand" | "error";
|
|
13
|
+
leading?: React.ReactNode;
|
|
14
|
+
trailing?: React.ReactNode;
|
|
15
|
+
nativeButton?: boolean;
|
|
16
|
+
focusableWhenDisabled?: boolean;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
declare function Button({ className, children, collapsed, variant, align, outline, pill, size, theme, leading, trailing, ...props }: ButtonProps): react_jsx_runtime.JSX.Element;
|
|
20
|
+
|
|
21
|
+
export { Button, type ButtonProps };
|
package/dist/button.js
CHANGED
package/dist/button.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/lib/utils.ts","../src/components/button/button.tsx"],"names":["ButtonPrimitive"],"mappings":"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","file":"button.js","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n","\"use client\";\n\nimport { Button as ButtonPrimitive } from \"@base-ui/react/button\";\nimport { cva } from \"class-variance-authority\";\n\nimport { cn } from \"../../lib/utils\";\nimport { ButtonProps } from \"./types\";\n\nconst buttonVariants = cva(\n \"inline-flex relative items-center gap-1.5 whitespace-nowrap font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none shrink-0 [&_svg]:shrink-0 text-foreground bg-background group/button outline-none focus-visible:border-ring-3 focus-visible:ring-ring/60 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive\",\n {\n variants: {\n align: {\n left: \"justify-start\",\n center: \"justify-center\",\n right: \"justify-end\",\n },\n collapsed: {\n false: null,\n true: \"min-w-10 max-w-10 justify-center\",\n },\n outline: {\n false: null,\n true: \"\",\n },\n hasLeading: {\n false: null,\n },\n theme: {\n base: \"bg-foreground text-background\",\n brand: \"bg-primary-foreground text-primary\",\n error: \"\",\n },\n hasTrailing: {\n false: null,\n },\n variant: {\n default: \"hover:bg-background/90\",\n outline: \"backdrop-blur-lg \",\n primary: \"bg-primary-foreground/0 backdrop-blur-lg text-primary\",\n secondary: \"bg-secondary-foreground/0 backdrop-blur-lg text-secondary\",\n tertiary: \"bg-background/0 backdrop-blur-lg [--foreground:var(--color-text-text-default)]\",\n },\n pill: {\n false: \"rounded-xs\",\n true: \"rounded-full\",\n },\n size: {\n default: \"h-10 min-h-10 px-3 py-2 text-sm [&_svg:not([class*='size-'])]:size-[18px]\",\n lg: \"h-12 min-h-12 text-base [&_svg:not([class*='size-'])]:size-[20px]\",\n },\n },\n defaultVariants: {\n align: \"center\",\n outline: false,\n pill: false,\n size: \"default\",\n theme: \"brand\",\n variant: \"default\",\n },\n compoundVariants: [\n {\n pill: true,\n size: \"default\",\n class: \"min-w-10 min-h-10 px-4\",\n },\n {\n pill: true,\n collapsed: true,\n class: \"max-w-10\",\n },\n {\n pill: true,\n size: \"lg\",\n class: \"min-w-12 min-h-12 px-4\",\n },\n {\n pill: true,\n size: \"lg\",\n collapsed: true,\n class: \"max-w-[54px] max-h-12\",\n },\n {\n collapsed: false,\n size: \"default\",\n align: \"left\",\n pill: false,\n class: \"pr-3 pl-2\",\n },\n {\n align: \"center\",\n collapsed: false,\n size: \"default\",\n pill: false,\n class: \"px-3\",\n },\n {\n hasLeading: true,\n pill: false,\n align: \"left\",\n size: \"default\",\n class: \"pr-3 pl-2\",\n },\n {\n collapsed: false,\n size: \"default\",\n pill: true,\n class: \"px-4\",\n },\n {\n size: \"lg\",\n pill: true,\n collapsed: false,\n class: \"px-4\",\n },\n {\n variant: \"primary\",\n outline: false,\n theme: \"base\",\n class:\n \"bg-foreground text-background hover:ring-2 active:ring active:bg-background disabled:outline-none disabled:bg-black/0 disabled:text-black-alpha-600 focus-visible:ring-3 focus-visible:ring-ring focus-visible:outline-background focus-visible:bg-foreground focus-visible:text-background\",\n },\n {\n variant: \"primary\",\n outline: true,\n theme: \"base\",\n class:\n \"ring ring-foreground bg-background/0 text-foreground hover:ring-2 active:ring active:bg-background/1 disabled:outline-none disabled:bg-background/0 focus-visible:ring focus-visible:ring-ring focus-visible:outline-background focus-visible:bg-background/1\",\n },\n {\n variant: \"primary\",\n outline: true,\n theme: \"brand\",\n class:\n \"ring ring-primary-foreground bg-background/0 text-primary-foreground hover:ring-2 active:ring active:bg-background/1 disabled:outline-none disabled:bg-background/0 focus-visible:ring focus-visible:ring-ring focus-visible:outline-background focus-visible:bg-background/1\",\n },\n {\n variant: \"primary\",\n theme: \"brand\",\n outline: false,\n class:\n \"bg-primary-foreground text-primary hover:bg-primary-foreground hover:text-primary active:bg-primary-foreground active:text-primary focus-visible:bg-primary-foreground focus-visible:text-primary\",\n },\n {\n variant: \"primary\",\n theme: \"error\",\n class: \"bg-destructive text-black\",\n },\n {\n variant: \"secondary\",\n outline: false,\n theme: \"base\",\n class: \"bg-background/0 text-foreground backdrop-blur-lg focus-visible:backdrop-blur-md\",\n },\n {\n variant: \"secondary\",\n outline: true,\n theme: \"base\",\n class:\n \"bg-background/0 text-foreground ring ring-foreground/0 hover:ring-foreground active:ring-foreground/0 disabled:ring-foreground/0 backdrop-blur-lg focus-visible:backdrop-blur-md\",\n },\n {\n variant: \"tertiary\",\n outline: false,\n theme: \"base\",\n class: \"bg-background/0 text-foreground backdrop-blur-lg focus-visible:backdrop-blur-md\",\n },\n {\n variant: \"tertiary\",\n theme: \"error\",\n class: \"bg-transparent backdrop-blur-lg text-error-600\",\n },\n ],\n },\n);\n\nconst tintVariants = cva(\n \"before:content-[''] before:absolute before:inset-0 before:transition-all before:rounded-[inherit] before:pointer-events-none\",\n {\n variants: {\n outline: {\n false: null,\n },\n variant: {\n default: \"\",\n outline: \"\",\n primary:\n \"before:bg-tint-700-reversed/0 hover:before:bg-tint-700-reversed active:before:bg-tint-700-reversed/0 disabled:before:bg-tint-900-default focus-visible:before:bg-tint-700-reversed/0\",\n secondary:\n \"before:bg-tint-900-default hover:before:bg-tint-800-default active:before:bg-tint-900-default disabled:before:bg-tint-900-default focus-visible:before:bg-tint-800-default\",\n tertiary:\n \"before:bg-tint-950-reversed hover:before:bg-tint-900-default active:before:bg-tint-950-reversed disabled:before:bg-tint-950-reversed focus-visible:before:bg-tint-950-reversed\",\n },\n },\n defaultVariants: {\n outline: false,\n variant: \"default\",\n },\n compoundVariants: [\n {\n outline: true,\n variant: \"primary\",\n class:\n \"before:bg-tint-950-reversed hover:before:bg-tint-950-reversed active:before:bg-tint-950-reversed disabled:before:bg-tint-900-default focus-visible:before:bg-tint-950-reversed\",\n },\n {\n outline: true,\n variant: \"secondary\",\n class:\n \"before:bg-tint-950-reversed hover:before:bg-tint-950-reversed active:before:bg-tint-950-reversed disabled:before:bg-tint-900-default focus-visible:before:bg-tint-950-reversed\",\n },\n ],\n },\n);\n\nfunction Button({\n className,\n children,\n collapsed = false,\n variant = \"default\",\n align = \"center\",\n outline = false,\n pill = false,\n size = \"default\",\n theme = \"brand\",\n leading,\n trailing,\n ...props\n}: ButtonProps) {\n return (\n <ButtonPrimitive\n data-slot=\"button\"\n className={cn(\n buttonVariants({\n variant,\n size,\n align,\n outline,\n collapsed,\n pill,\n className,\n hasLeading: !!leading,\n theme,\n hasTrailing: !!trailing,\n }),\n tintVariants({ variant, outline }),\n )}\n {...props}\n >\n <>\n {leading && <div className=\"group-aria-busy/button:opacity-0\">{leading}</div>}\n {children && <span className=\"min-w-[18px] truncate\">{children}</span>}\n {trailing && (\n <div\n className={cn(\"group-aria-busy/button:opacity-0\", {\n \"absolute top-1/2 right-0 translate-x-1/2 -translate-y-1/2\": collapsed,\n })}\n >\n {trailing}\n </div>\n )}\n </>\n </ButtonPrimitive>\n );\n}\n\nexport { Button };\n"]}
|
|
1
|
+
{"version":3,"sources":["../src/lib/utils.ts","../src/components/button/button.tsx"],"names":["ButtonPrimitive"],"mappings":";;;;;;;AAGO,SAAS,MAAM,MAAA,EAAsB;AAC1C,EAAA,OAAO,OAAA,CAAQ,IAAA,CAAK,MAAM,CAAC,CAAA;AAC7B;ACGA,IAAM,cAAA,GAAiB,GAAA;AAAA,EACrB,8aAAA;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,KAAA,EAAO;AAAA,QACL,IAAA,EAAM,eAAA;AAAA,QACN,MAAA,EAAQ,gBAAA;AAAA,QACR,KAAA,EAAO;AAAA,OACT;AAAA,MACA,SAAA,EAAW;AAAA,QACT,KAAA,EAAO,IAAA;AAAA,QACP,IAAA,EAAM;AAAA,OACR;AAAA,MACA,OAAA,EAAS;AAAA,QACP,KAAA,EAAO,IAAA;AAAA,QACP,IAAA,EAAM;AAAA,OACR;AAAA,MACA,UAAA,EAAY;AAAA,QACV,KAAA,EAAO;AAAA,OACT;AAAA,MACA,KAAA,EAAO;AAAA,QACL,IAAA,EAAM,+BAAA;AAAA,QACN,KAAA,EAAO,oCAAA;AAAA,QACP,KAAA,EAAO;AAAA,OACT;AAAA,MACA,WAAA,EAAa;AAAA,QACX,KAAA,EAAO;AAAA,OACT;AAAA,MACA,OAAA,EAAS;AAAA,QACP,OAAA,EAAS,wBAAA;AAAA,QACT,OAAA,EAAS,mBAAA;AAAA,QACT,OAAA,EAAS,uDAAA;AAAA,QACT,SAAA,EAAW,2DAAA;AAAA,QACX,QAAA,EAAU;AAAA,OACZ;AAAA,MACA,IAAA,EAAM;AAAA,QACJ,KAAA,EAAO,YAAA;AAAA,QACP,IAAA,EAAM;AAAA,OACR;AAAA,MACA,IAAA,EAAM;AAAA,QACJ,OAAA,EAAS,2EAAA;AAAA,QACT,EAAA,EAAI;AAAA;AACN,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,KAAA,EAAO,QAAA;AAAA,MACP,OAAA,EAAS,KAAA;AAAA,MACT,IAAA,EAAM,KAAA;AAAA,MACN,IAAA,EAAM,SAAA;AAAA,MACN,KAAA,EAAO,OAAA;AAAA,MACP,OAAA,EAAS;AAAA,KACX;AAAA,IACA,gBAAA,EAAkB;AAAA,MAChB;AAAA,QACE,IAAA,EAAM,IAAA;AAAA,QACN,IAAA,EAAM,SAAA;AAAA,QACN,KAAA,EAAO;AAAA,OACT;AAAA,MACA;AAAA,QACE,IAAA,EAAM,IAAA;AAAA,QACN,SAAA,EAAW,IAAA;AAAA,QACX,KAAA,EAAO;AAAA,OACT;AAAA,MACA;AAAA,QACE,IAAA,EAAM,IAAA;AAAA,QACN,IAAA,EAAM,IAAA;AAAA,QACN,KAAA,EAAO;AAAA,OACT;AAAA,MACA;AAAA,QACE,IAAA,EAAM,IAAA;AAAA,QACN,IAAA,EAAM,IAAA;AAAA,QACN,SAAA,EAAW,IAAA;AAAA,QACX,KAAA,EAAO;AAAA,OACT;AAAA,MACA;AAAA,QACE,SAAA,EAAW,KAAA;AAAA,QACX,IAAA,EAAM,SAAA;AAAA,QACN,KAAA,EAAO,MAAA;AAAA,QACP,IAAA,EAAM,KAAA;AAAA,QACN,KAAA,EAAO;AAAA,OACT;AAAA,MACA;AAAA,QACE,KAAA,EAAO,QAAA;AAAA,QACP,SAAA,EAAW,KAAA;AAAA,QACX,IAAA,EAAM,SAAA;AAAA,QACN,IAAA,EAAM,KAAA;AAAA,QACN,KAAA,EAAO;AAAA,OACT;AAAA,MACA;AAAA,QACE,UAAA,EAAY,IAAA;AAAA,QACZ,IAAA,EAAM,KAAA;AAAA,QACN,KAAA,EAAO,MAAA;AAAA,QACP,IAAA,EAAM,SAAA;AAAA,QACN,KAAA,EAAO;AAAA,OACT;AAAA,MACA;AAAA,QACE,SAAA,EAAW,KAAA;AAAA,QACX,IAAA,EAAM,SAAA;AAAA,QACN,IAAA,EAAM,IAAA;AAAA,QACN,KAAA,EAAO;AAAA,OACT;AAAA,MACA;AAAA,QACE,IAAA,EAAM,IAAA;AAAA,QACN,IAAA,EAAM,IAAA;AAAA,QACN,SAAA,EAAW,KAAA;AAAA,QACX,KAAA,EAAO;AAAA,OACT;AAAA,MACA;AAAA,QACE,OAAA,EAAS,SAAA;AAAA,QACT,OAAA,EAAS,KAAA;AAAA,QACT,KAAA,EAAO,MAAA;AAAA,QACP,KAAA,EACE;AAAA,OACJ;AAAA,MACA;AAAA,QACE,OAAA,EAAS,SAAA;AAAA,QACT,OAAA,EAAS,IAAA;AAAA,QACT,KAAA,EAAO,MAAA;AAAA,QACP,KAAA,EACE;AAAA,OACJ;AAAA,MACA;AAAA,QACE,OAAA,EAAS,SAAA;AAAA,QACT,OAAA,EAAS,IAAA;AAAA,QACT,KAAA,EAAO,OAAA;AAAA,QACP,KAAA,EACE;AAAA,OACJ;AAAA,MACA;AAAA,QACE,OAAA,EAAS,SAAA;AAAA,QACT,KAAA,EAAO,OAAA;AAAA,QACP,OAAA,EAAS,KAAA;AAAA,QACT,KAAA,EACE;AAAA,OACJ;AAAA,MACA;AAAA,QACE,OAAA,EAAS,SAAA;AAAA,QACT,KAAA,EAAO,OAAA;AAAA,QACP,KAAA,EAAO;AAAA,OACT;AAAA,MACA;AAAA,QACE,OAAA,EAAS,WAAA;AAAA,QACT,OAAA,EAAS,KAAA;AAAA,QACT,KAAA,EAAO,MAAA;AAAA,QACP,KAAA,EAAO;AAAA,OACT;AAAA,MACA;AAAA,QACE,OAAA,EAAS,WAAA;AAAA,QACT,OAAA,EAAS,IAAA;AAAA,QACT,KAAA,EAAO,MAAA;AAAA,QACP,KAAA,EACE;AAAA,OACJ;AAAA,MACA;AAAA,QACE,OAAA,EAAS,UAAA;AAAA,QACT,OAAA,EAAS,KAAA;AAAA,QACT,KAAA,EAAO,MAAA;AAAA,QACP,KAAA,EAAO;AAAA,OACT;AAAA,MACA;AAAA,QACE,OAAA,EAAS,UAAA;AAAA,QACT,KAAA,EAAO,OAAA;AAAA,QACP,KAAA,EAAO;AAAA;AACT;AACF;AAEJ,CAAA;AAEA,IAAM,YAAA,GAAe,GAAA;AAAA,EACnB,8HAAA;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,OAAA,EAAS;AAAA,QACP,KAAA,EAAO;AAAA,OACT;AAAA,MACA,OAAA,EAAS;AAAA,QACP,OAAA,EAAS,EAAA;AAAA,QACT,OAAA,EAAS,EAAA;AAAA,QACT,OAAA,EACE,sLAAA;AAAA,QACF,SAAA,EACE,4KAAA;AAAA,QACF,QAAA,EACE;AAAA;AACJ,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,OAAA,EAAS,KAAA;AAAA,MACT,OAAA,EAAS;AAAA,KACX;AAAA,IACA,gBAAA,EAAkB;AAAA,MAChB;AAAA,QACE,OAAA,EAAS,IAAA;AAAA,QACT,OAAA,EAAS,SAAA;AAAA,QACT,KAAA,EACE;AAAA,OACJ;AAAA,MACA;AAAA,QACE,OAAA,EAAS,IAAA;AAAA,QACT,OAAA,EAAS,WAAA;AAAA,QACT,KAAA,EACE;AAAA;AACJ;AACF;AAEJ,CAAA;AAEA,SAAS,MAAA,CAAO;AAAA,EACd,SAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA,GAAY,KAAA;AAAA,EACZ,OAAA,GAAU,SAAA;AAAA,EACV,KAAA,GAAQ,QAAA;AAAA,EACR,OAAA,GAAU,KAAA;AAAA,EACV,IAAA,GAAO,KAAA;AAAA,EACP,IAAA,GAAO,SAAA;AAAA,EACP,KAAA,GAAQ,OAAA;AAAA,EACR,OAAA;AAAA,EACA,QAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAgB;AACd,EAAA,uBACE,GAAA;AAAA,IAACA,QAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,QAAA;AAAA,MACV,SAAA,EAAW,EAAA;AAAA,QACT,cAAA,CAAe;AAAA,UACb,OAAA;AAAA,UACA,IAAA;AAAA,UACA,KAAA;AAAA,UACA,OAAA;AAAA,UACA,SAAA;AAAA,UACA,IAAA;AAAA,UACA,SAAA;AAAA,UACA,UAAA,EAAY,CAAC,CAAC,OAAA;AAAA,UACd,KAAA;AAAA,UACA,WAAA,EAAa,CAAC,CAAC;AAAA,SAChB,CAAA;AAAA,QACD,YAAA,CAAa,EAAE,OAAA,EAAS,OAAA,EAAS;AAAA,OACnC;AAAA,MACC,GAAG,KAAA;AAAA,MAEJ,QAAA,kBAAA,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,QAAA,OAAA,oBAAW,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,kCAAA,EAAoC,QAAA,EAAA,OAAA,EAAQ,CAAA;AAAA,QACtE,QAAA,oBAAY,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,yBAAyB,QAAA,EAAS,CAAA;AAAA,QAC9D,QAAA,oBACC,GAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,GAAG,kCAAA,EAAoC;AAAA,cAChD,2DAAA,EAA6D;AAAA,aAC9D,CAAA;AAAA,YAEA,QAAA,EAAA;AAAA;AAAA;AACH,OAAA,EAEJ;AAAA;AAAA,GACF;AAEJ","file":"button.js","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n","\"use client\";\n\nimport { Button as ButtonPrimitive } from \"@base-ui/react/button\";\nimport { cva } from \"class-variance-authority\";\n\nimport { cn } from \"../../lib/utils\";\nimport { ButtonProps } from \"./types\";\n\nconst buttonVariants = cva(\n \"inline-flex relative items-center gap-1.5 whitespace-nowrap font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none shrink-0 [&_svg]:shrink-0 text-foreground bg-background group/button outline-none focus-visible:border-ring-3 focus-visible:ring-ring/60 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive\",\n {\n variants: {\n align: {\n left: \"justify-start\",\n center: \"justify-center\",\n right: \"justify-end\",\n },\n collapsed: {\n false: null,\n true: \"min-w-10 max-w-10 justify-center\",\n },\n outline: {\n false: null,\n true: \"\",\n },\n hasLeading: {\n false: null,\n },\n theme: {\n base: \"bg-foreground text-background\",\n brand: \"bg-primary-foreground text-primary\",\n error: \"\",\n },\n hasTrailing: {\n false: null,\n },\n variant: {\n default: \"hover:bg-background/90\",\n outline: \"backdrop-blur-lg \",\n primary: \"bg-primary-foreground/0 backdrop-blur-lg text-primary\",\n secondary: \"bg-secondary-foreground/0 backdrop-blur-lg text-secondary\",\n tertiary: \"bg-background/0 backdrop-blur-lg [--foreground:var(--color-text-text-default)]\",\n },\n pill: {\n false: \"rounded-xs\",\n true: \"rounded-full\",\n },\n size: {\n default: \"h-10 min-h-10 px-3 py-2 text-sm [&_svg:not([class*='size-'])]:size-[18px]\",\n lg: \"h-12 min-h-12 text-base [&_svg:not([class*='size-'])]:size-[20px]\",\n },\n },\n defaultVariants: {\n align: \"center\",\n outline: false,\n pill: false,\n size: \"default\",\n theme: \"brand\",\n variant: \"default\",\n },\n compoundVariants: [\n {\n pill: true,\n size: \"default\",\n class: \"min-w-10 min-h-10 px-4\",\n },\n {\n pill: true,\n collapsed: true,\n class: \"max-w-10\",\n },\n {\n pill: true,\n size: \"lg\",\n class: \"min-w-12 min-h-12 px-4\",\n },\n {\n pill: true,\n size: \"lg\",\n collapsed: true,\n class: \"max-w-[54px] max-h-12\",\n },\n {\n collapsed: false,\n size: \"default\",\n align: \"left\",\n pill: false,\n class: \"pr-3 pl-2\",\n },\n {\n align: \"center\",\n collapsed: false,\n size: \"default\",\n pill: false,\n class: \"px-3\",\n },\n {\n hasLeading: true,\n pill: false,\n align: \"left\",\n size: \"default\",\n class: \"pr-3 pl-2\",\n },\n {\n collapsed: false,\n size: \"default\",\n pill: true,\n class: \"px-4\",\n },\n {\n size: \"lg\",\n pill: true,\n collapsed: false,\n class: \"px-4\",\n },\n {\n variant: \"primary\",\n outline: false,\n theme: \"base\",\n class:\n \"bg-foreground text-background hover:ring-2 active:ring active:bg-background disabled:outline-none disabled:bg-black/0 disabled:text-black-alpha-600 focus-visible:ring-3 focus-visible:ring-ring focus-visible:outline-background focus-visible:bg-foreground focus-visible:text-background\",\n },\n {\n variant: \"primary\",\n outline: true,\n theme: \"base\",\n class:\n \"ring ring-foreground bg-background/0 text-foreground hover:ring-2 active:ring active:bg-background/1 disabled:outline-none disabled:bg-background/0 focus-visible:ring focus-visible:ring-ring focus-visible:outline-background focus-visible:bg-background/1\",\n },\n {\n variant: \"primary\",\n outline: true,\n theme: \"brand\",\n class:\n \"ring ring-primary-foreground bg-background/0 text-primary-foreground hover:ring-2 active:ring active:bg-background/1 disabled:outline-none disabled:bg-background/0 focus-visible:ring focus-visible:ring-ring focus-visible:outline-background focus-visible:bg-background/1\",\n },\n {\n variant: \"primary\",\n theme: \"brand\",\n outline: false,\n class:\n \"bg-primary-foreground text-primary hover:bg-primary-foreground hover:text-primary active:bg-primary-foreground active:text-primary focus-visible:bg-primary-foreground focus-visible:text-primary\",\n },\n {\n variant: \"primary\",\n theme: \"error\",\n class: \"bg-destructive text-black\",\n },\n {\n variant: \"secondary\",\n outline: false,\n theme: \"base\",\n class: \"bg-background/0 text-foreground backdrop-blur-lg focus-visible:backdrop-blur-md\",\n },\n {\n variant: \"secondary\",\n outline: true,\n theme: \"base\",\n class:\n \"bg-background/0 text-foreground ring ring-foreground/0 hover:ring-foreground active:ring-foreground/0 disabled:ring-foreground/0 backdrop-blur-lg focus-visible:backdrop-blur-md\",\n },\n {\n variant: \"tertiary\",\n outline: false,\n theme: \"base\",\n class: \"bg-background/0 text-foreground backdrop-blur-lg focus-visible:backdrop-blur-md\",\n },\n {\n variant: \"tertiary\",\n theme: \"error\",\n class: \"bg-transparent backdrop-blur-lg text-error-600\",\n },\n ],\n },\n);\n\nconst tintVariants = cva(\n \"before:content-[''] before:absolute before:inset-0 before:transition-all before:rounded-[inherit] before:pointer-events-none\",\n {\n variants: {\n outline: {\n false: null,\n },\n variant: {\n default: \"\",\n outline: \"\",\n primary:\n \"before:bg-tint-700-reversed/0 hover:before:bg-tint-700-reversed active:before:bg-tint-700-reversed/0 disabled:before:bg-tint-900-default focus-visible:before:bg-tint-700-reversed/0\",\n secondary:\n \"before:bg-tint-900-default hover:before:bg-tint-800-default active:before:bg-tint-900-default disabled:before:bg-tint-900-default focus-visible:before:bg-tint-800-default\",\n tertiary:\n \"before:bg-tint-950-reversed hover:before:bg-tint-900-default active:before:bg-tint-950-reversed disabled:before:bg-tint-950-reversed focus-visible:before:bg-tint-950-reversed\",\n },\n },\n defaultVariants: {\n outline: false,\n variant: \"default\",\n },\n compoundVariants: [\n {\n outline: true,\n variant: \"primary\",\n class:\n \"before:bg-tint-950-reversed hover:before:bg-tint-950-reversed active:before:bg-tint-950-reversed disabled:before:bg-tint-900-default focus-visible:before:bg-tint-950-reversed\",\n },\n {\n outline: true,\n variant: \"secondary\",\n class:\n \"before:bg-tint-950-reversed hover:before:bg-tint-950-reversed active:before:bg-tint-950-reversed disabled:before:bg-tint-900-default focus-visible:before:bg-tint-950-reversed\",\n },\n ],\n },\n);\n\nfunction Button({\n className,\n children,\n collapsed = false,\n variant = \"default\",\n align = \"center\",\n outline = false,\n pill = false,\n size = \"default\",\n theme = \"brand\",\n leading,\n trailing,\n ...props\n}: ButtonProps) {\n return (\n <ButtonPrimitive\n data-slot=\"button\"\n className={cn(\n buttonVariants({\n variant,\n size,\n align,\n outline,\n collapsed,\n pill,\n className,\n hasLeading: !!leading,\n theme,\n hasTrailing: !!trailing,\n }),\n tintVariants({ variant, outline }),\n )}\n {...props}\n >\n <>\n {leading && <div className=\"group-aria-busy/button:opacity-0\">{leading}</div>}\n {children && <span className=\"min-w-[18px] truncate\">{children}</span>}\n {trailing && (\n <div\n className={cn(\"group-aria-busy/button:opacity-0\", {\n \"absolute top-1/2 right-0 translate-x-1/2 -translate-y-1/2\": collapsed,\n })}\n >\n {trailing}\n </div>\n )}\n </>\n </ButtonPrimitive>\n );\n}\n\nexport { Button };\n"]}
|
package/dist/content-block.d.cts
CHANGED
package/dist/content-block.d.ts
CHANGED
package/dist/index.cjs
CHANGED
|
@@ -1103,6 +1103,132 @@ function SectionHeader({
|
|
|
1103
1103
|
}
|
|
1104
1104
|
);
|
|
1105
1105
|
}
|
|
1106
|
+
var tagVariants = classVarianceAuthority.cva(
|
|
1107
|
+
// Base styles
|
|
1108
|
+
"inline-flex items-center justify-center rounded-full box-border relative transition-all duration-150 ease-in-out font-medium text-sm leading-5 text-center whitespace-nowrap appearance-none focus-visible:outline-none focus-visible:ring-[3px] focus-visible:ring-[rgba(21,94,239,0.6)] focus-visible:ring-offset-0",
|
|
1109
|
+
{
|
|
1110
|
+
variants: {
|
|
1111
|
+
selected: {
|
|
1112
|
+
false: "bg-background text-primary-foreground ring ring-primary-foreground ring-offset-0 focus-visible:bg-background focus-visible:text-primary-foreground",
|
|
1113
|
+
true: "bg-primary-foreground text-white focus-visible:bg-primary-foreground focus-visible:text-white"
|
|
1114
|
+
},
|
|
1115
|
+
interactive: {
|
|
1116
|
+
false: null,
|
|
1117
|
+
true: "cursor-pointer"
|
|
1118
|
+
},
|
|
1119
|
+
size: {
|
|
1120
|
+
md: null,
|
|
1121
|
+
lg: null
|
|
1122
|
+
},
|
|
1123
|
+
collapsed: {
|
|
1124
|
+
false: null,
|
|
1125
|
+
true: null
|
|
1126
|
+
}
|
|
1127
|
+
},
|
|
1128
|
+
defaultVariants: {
|
|
1129
|
+
selected: true,
|
|
1130
|
+
interactive: false,
|
|
1131
|
+
size: "md",
|
|
1132
|
+
collapsed: false
|
|
1133
|
+
},
|
|
1134
|
+
compoundVariants: [
|
|
1135
|
+
// Interactive hover states
|
|
1136
|
+
{
|
|
1137
|
+
interactive: true,
|
|
1138
|
+
selected: false,
|
|
1139
|
+
class: "hover:ring-2 hover:ring-primary-foreground"
|
|
1140
|
+
},
|
|
1141
|
+
{
|
|
1142
|
+
interactive: true,
|
|
1143
|
+
selected: true,
|
|
1144
|
+
class: "hover:bg-primary-foreground/90"
|
|
1145
|
+
},
|
|
1146
|
+
// Interactive active states
|
|
1147
|
+
{
|
|
1148
|
+
interactive: true,
|
|
1149
|
+
selected: false,
|
|
1150
|
+
class: "active:ring active:ring-primary-foreground"
|
|
1151
|
+
},
|
|
1152
|
+
{
|
|
1153
|
+
interactive: true,
|
|
1154
|
+
selected: true,
|
|
1155
|
+
class: "active:bg-primary-foreground"
|
|
1156
|
+
},
|
|
1157
|
+
// Size variants (non-collapsed)
|
|
1158
|
+
{
|
|
1159
|
+
size: "md",
|
|
1160
|
+
collapsed: false,
|
|
1161
|
+
class: "px-2 py-1.5 gap-0.5"
|
|
1162
|
+
},
|
|
1163
|
+
{
|
|
1164
|
+
size: "lg",
|
|
1165
|
+
collapsed: false,
|
|
1166
|
+
class: "px-3 py-2.5 gap-1"
|
|
1167
|
+
},
|
|
1168
|
+
// Collapsed size adjustments
|
|
1169
|
+
{
|
|
1170
|
+
size: "md",
|
|
1171
|
+
collapsed: true,
|
|
1172
|
+
class: "p-1.5 w-8 h-8"
|
|
1173
|
+
},
|
|
1174
|
+
{
|
|
1175
|
+
size: "lg",
|
|
1176
|
+
collapsed: true,
|
|
1177
|
+
class: "p-2.5 w-10 h-10"
|
|
1178
|
+
}
|
|
1179
|
+
]
|
|
1180
|
+
}
|
|
1181
|
+
);
|
|
1182
|
+
function Tag({
|
|
1183
|
+
size = "md",
|
|
1184
|
+
selected = true,
|
|
1185
|
+
collapsed = false,
|
|
1186
|
+
children,
|
|
1187
|
+
leading,
|
|
1188
|
+
trailing,
|
|
1189
|
+
onClick,
|
|
1190
|
+
className = ""
|
|
1191
|
+
}) {
|
|
1192
|
+
const handleClick = () => {
|
|
1193
|
+
if (onClick) {
|
|
1194
|
+
onClick();
|
|
1195
|
+
}
|
|
1196
|
+
};
|
|
1197
|
+
const handleKeyDown = (event) => {
|
|
1198
|
+
if (onClick && (event.key === "Enter" || event.key === " ")) {
|
|
1199
|
+
event.preventDefault();
|
|
1200
|
+
onClick();
|
|
1201
|
+
}
|
|
1202
|
+
};
|
|
1203
|
+
const showLeading = leading && !collapsed;
|
|
1204
|
+
const showTrailing = trailing && !collapsed;
|
|
1205
|
+
const TagElement = onClick ? "button" : "div";
|
|
1206
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1207
|
+
TagElement,
|
|
1208
|
+
{
|
|
1209
|
+
className: cn(
|
|
1210
|
+
tagVariants({
|
|
1211
|
+
size,
|
|
1212
|
+
selected,
|
|
1213
|
+
collapsed,
|
|
1214
|
+
interactive: !!onClick
|
|
1215
|
+
}),
|
|
1216
|
+
className
|
|
1217
|
+
),
|
|
1218
|
+
onClick: handleClick,
|
|
1219
|
+
onKeyDown: handleKeyDown,
|
|
1220
|
+
type: onClick ? "button" : void 0,
|
|
1221
|
+
children: [
|
|
1222
|
+
!collapsed && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1223
|
+
showLeading && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-5 w-5 shrink-0 items-center justify-center overflow-hidden text-inherit", children: leading }),
|
|
1224
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center px-1 first:pl-0 last:pr-0", children }),
|
|
1225
|
+
showTrailing && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-5 w-5 shrink-0 items-center justify-center overflow-hidden text-inherit", children: trailing })
|
|
1226
|
+
] }),
|
|
1227
|
+
collapsed && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-5 w-5 shrink-0 items-center justify-center overflow-hidden text-inherit", children: leading || trailing })
|
|
1228
|
+
]
|
|
1229
|
+
}
|
|
1230
|
+
);
|
|
1231
|
+
}
|
|
1106
1232
|
|
|
1107
1233
|
exports.Button = Button;
|
|
1108
1234
|
exports.ContentBlock = ContentBlock;
|
|
@@ -1140,6 +1266,7 @@ exports.Loader = Loader;
|
|
|
1140
1266
|
exports.NotificationBadge = NotificationBadge;
|
|
1141
1267
|
exports.SectionFlourish = SectionFlourish;
|
|
1142
1268
|
exports.SectionHeader = SectionHeader;
|
|
1269
|
+
exports.Tag = Tag;
|
|
1143
1270
|
exports.Tooltip = Tooltip;
|
|
1144
1271
|
exports.TooltipArrow = TooltipArrow;
|
|
1145
1272
|
exports.TooltipContent = TooltipContent;
|