@ngrok/mantle 0.1.11 → 0.1.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.d.ts +48 -2
- package/dist/button.js +1 -1
- package/dist/chunk-WFVD5X7N.js +2 -0
- package/dist/chunk-WFVD5X7N.js.map +1 -0
- package/dist/dialog.js +1 -1
- package/dist/dialog.js.map +1 -1
- package/dist/input.d.ts +3 -52
- package/dist/select.d.ts +39 -4
- package/dist/select.js +1 -1
- package/dist/select.js.map +1 -1
- package/dist/sheet.js +1 -1
- package/dist/sheet.js.map +1 -1
- package/dist/types-nznA3HrJ.d.ts +52 -0
- package/package.json +1 -1
- package/dist/chunk-LFUD45DV.js +0 -2
- package/dist/chunk-LFUD45DV.js.map +0 -1
package/dist/button.d.ts
CHANGED
|
@@ -8,7 +8,6 @@ import * as class_variance_authority_types from 'class-variance-authority/types'
|
|
|
8
8
|
|
|
9
9
|
declare const buttonVariants: (props?: ({
|
|
10
10
|
appearance?: "link" | "filled" | "ghost" | "outlined" | null | undefined;
|
|
11
|
-
iconPlacement?: "end" | "start" | null | undefined;
|
|
12
11
|
isLoading?: boolean | null | undefined;
|
|
13
12
|
priority?: "default" | "danger" | "neutral" | null | undefined;
|
|
14
13
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
@@ -22,6 +21,20 @@ type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & WithAsChild & Butto
|
|
|
22
21
|
* the icon will automatically be replaced with a spinner.
|
|
23
22
|
*/
|
|
24
23
|
icon?: ReactNode;
|
|
24
|
+
/**
|
|
25
|
+
* The side that the icon will render on, if one is present. If `state="pending"`,
|
|
26
|
+
* then the loading icon will also render on this side.
|
|
27
|
+
*/
|
|
28
|
+
iconPlacement?: "start" | "end";
|
|
29
|
+
/**
|
|
30
|
+
* The default behavior of the button. Possible values are: `"button"`, `"submit"`, and `"reset"`.
|
|
31
|
+
* Unlike the native `<button>` element, this prop is required and has no default value.
|
|
32
|
+
* - `"button"`: The button has no default behavior, and does nothing when pressed by default. It can have client-side scripts listen to the element's events, which are triggered when the events occur.
|
|
33
|
+
* - `"reset"`: The button resets all the controls to their initial values.
|
|
34
|
+
* - `"submit"`: The button submits the form data to the server.
|
|
35
|
+
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#type
|
|
36
|
+
*/
|
|
37
|
+
type: Exclude<ButtonHTMLAttributes<HTMLButtonElement>["type"], undefined>;
|
|
25
38
|
};
|
|
26
39
|
/**
|
|
27
40
|
* Renders a button or a component that looks like a button, an interactive
|
|
@@ -33,7 +46,6 @@ type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & WithAsChild & Butto
|
|
|
33
46
|
*/
|
|
34
47
|
declare const Button: react.ForwardRefExoticComponent<ButtonHTMLAttributes<HTMLButtonElement> & WithAsChild & Partial<DeepNonNullable<class_variance_authority.VariantProps<(props?: ({
|
|
35
48
|
appearance?: "link" | "filled" | "ghost" | "outlined" | null | undefined;
|
|
36
|
-
iconPlacement?: "end" | "start" | null | undefined;
|
|
37
49
|
isLoading?: boolean | null | undefined;
|
|
38
50
|
priority?: "default" | "danger" | "neutral" | null | undefined;
|
|
39
51
|
} & class_variance_authority_types.ClassProp) | undefined) => string>>> & {
|
|
@@ -42,6 +54,20 @@ declare const Button: react.ForwardRefExoticComponent<ButtonHTMLAttributes<HTMLB
|
|
|
42
54
|
* the icon will automatically be replaced with a spinner.
|
|
43
55
|
*/
|
|
44
56
|
icon?: ReactNode;
|
|
57
|
+
/**
|
|
58
|
+
* The side that the icon will render on, if one is present. If `state="pending"`,
|
|
59
|
+
* then the loading icon will also render on this side.
|
|
60
|
+
*/
|
|
61
|
+
iconPlacement?: "end" | "start" | undefined;
|
|
62
|
+
/**
|
|
63
|
+
* The default behavior of the button. Possible values are: `"button"`, `"submit"`, and `"reset"`.
|
|
64
|
+
* Unlike the native `<button>` element, this prop is required and has no default value.
|
|
65
|
+
* - `"button"`: The button has no default behavior, and does nothing when pressed by default. It can have client-side scripts listen to the element's events, which are triggered when the events occur.
|
|
66
|
+
* - `"reset"`: The button resets all the controls to their initial values.
|
|
67
|
+
* - `"submit"`: The button submits the form data to the server.
|
|
68
|
+
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#type
|
|
69
|
+
*/
|
|
70
|
+
type: Exclude<ButtonHTMLAttributes<HTMLButtonElement>["type"], undefined>;
|
|
45
71
|
} & react.RefAttributes<HTMLButtonElement>>;
|
|
46
72
|
|
|
47
73
|
declare const iconButtonVariants: (props?: ({
|
|
@@ -63,6 +89,16 @@ type IconButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & WithAsChild & I
|
|
|
63
89
|
* the icon will automatically be replaced with a spinner.
|
|
64
90
|
*/
|
|
65
91
|
icon: ReactNode;
|
|
92
|
+
/**
|
|
93
|
+
* The default behavior of the button. Possible values are: `"button"`, `"submit"`, and `"reset"`.
|
|
94
|
+
* Unlike the native `<button>` element, this prop defaults to `"button"`.
|
|
95
|
+
* - `"button"`: The button has no default behavior, and does nothing when pressed by default. It can have client-side scripts listen to the element's events, which are triggered when the events occur.
|
|
96
|
+
* - `"reset"`: The button resets all the controls to their initial values.
|
|
97
|
+
* - `"submit"`: The button submits the form data to the server.
|
|
98
|
+
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#type
|
|
99
|
+
* @default "button"
|
|
100
|
+
*/
|
|
101
|
+
type?: ButtonHTMLAttributes<HTMLButtonElement>["type"];
|
|
66
102
|
};
|
|
67
103
|
/**
|
|
68
104
|
* Renders a button or a component that looks like a button, an interactive
|
|
@@ -87,6 +123,16 @@ declare const IconButton: react.ForwardRefExoticComponent<ButtonHTMLAttributes<H
|
|
|
87
123
|
* the icon will automatically be replaced with a spinner.
|
|
88
124
|
*/
|
|
89
125
|
icon: ReactNode;
|
|
126
|
+
/**
|
|
127
|
+
* The default behavior of the button. Possible values are: `"button"`, `"submit"`, and `"reset"`.
|
|
128
|
+
* Unlike the native `<button>` element, this prop defaults to `"button"`.
|
|
129
|
+
* - `"button"`: The button has no default behavior, and does nothing when pressed by default. It can have client-side scripts listen to the element's events, which are triggered when the events occur.
|
|
130
|
+
* - `"reset"`: The button resets all the controls to their initial values.
|
|
131
|
+
* - `"submit"`: The button submits the form data to the server.
|
|
132
|
+
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#type
|
|
133
|
+
* @default "button"
|
|
134
|
+
*/
|
|
135
|
+
type?: ButtonHTMLAttributes<HTMLButtonElement>["type"];
|
|
90
136
|
} & react.RefAttributes<HTMLButtonElement>>;
|
|
91
137
|
|
|
92
138
|
export { Button, type ButtonProps, IconButton, type IconButtonProps };
|
package/dist/button.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a,b}from"./chunk-
|
|
1
|
+
import{a,b}from"./chunk-WFVD5X7N.js";import"./chunk-VT3Y7SNW.js";import"./chunk-A5H52ODC.js";export{a as Button,b as IconButton};
|
|
2
2
|
//# sourceMappingURL=button.js.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{a as p}from"./chunk-VT3Y7SNW.js";import{a as b}from"./chunk-A5H52ODC.js";import{CircleNotch as M}from"@phosphor-icons/react/CircleNotch";import{Slot as T}from"@radix-ui/react-slot";import{cva as E}from"class-variance-authority";import C from"clsx";import{Children as A,cloneElement as w,forwardRef as z,isValidElement as L}from"react";import W from"tiny-invariant";function g(e){return typeof e=="boolean"?e:e==="true"}import{jsx as l,jsxs as R}from"react/jsx-runtime";var k=E("inline-flex items-center justify-center gap-1.5 whitespace-nowrap rounded-md focus-within:outline-none focus-visible:ring-4 aria-disabled:opacity-50 sm:text-sm [&>*]:focus-within:outline-none",{variants:{appearance:{filled:"h-11 border border-transparent bg-filled-accent px-3 font-medium text-on-filled hover:bg-filled-accent-hover focus-visible:border-accent-600 focus-visible:ring-focus-accent active:bg-filled-accent-active sm:h-9",ghost:"h-11 border border-transparent px-3 font-medium text-accent-600 hover:bg-accent-500/10 hover:text-accent-700 focus-visible:ring-focus-accent active:bg-accent-500/15 active:text-accent-700 sm:h-9",outlined:"h-11 border border-accent-600 bg-form px-3 font-medium text-accent-600 hover:border-accent-700 hover:bg-accent-500/10 hover:text-accent-700 focus-visible:ring-focus-accent active:border-accent-700 active:bg-accent-500/15 active:text-accent-700 sm:h-9",link:"group cursor-pointer border-transparent text-accent-600 hover:underline focus-visible:ring-focus-accent"},isLoading:{false:"",true:"opacity-50"},priority:{danger:"",default:"",neutral:""}},defaultVariants:{appearance:"outlined",isLoading:!1,priority:"default"},compoundVariants:[{appearance:"ghost",priority:"danger",class:"border-transparent text-danger-600 hover:bg-danger-500/10 hover:text-danger-700 focus-visible:ring-focus-danger active:bg-danger-500/15 active:text-danger-700"},{appearance:"outlined",priority:"danger",class:"border-danger-600 bg-form text-danger-600 hover:border-danger-700 hover:bg-danger-500/10 hover:text-danger-700 focus-visible:ring-focus-danger active:border-danger-700 active:bg-danger-500/15 active:text-danger-700"},{appearance:"filled",priority:"danger",class:"border-transparent bg-filled-danger hover:bg-filled-danger-hover focus-visible:border-danger-600 focus-visible:ring-focus-danger active:bg-filled-danger-active"},{appearance:"link",priority:"danger",class:"text-danger-600 focus-visible:ring-focus-danger"},{appearance:"ghost",priority:"neutral",class:"border-transparent text-strong hover:bg-neutral-500/10 hover:text-strong focus-visible:ring-focus-accent active:bg-neutral-500/15 active:text-strong"},{appearance:"outlined",priority:"neutral",class:"border-form bg-form text-strong hover:border-neutral-400 hover:bg-form-hover hover:text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent active:border-neutral-400 active:bg-neutral-500/10 active:text-strong focus-visible:active:border-accent-600"},{appearance:"filled",priority:"neutral",class:"border-transparent bg-filled-neutral hover:bg-filled-neutral-hover focus-visible:border-neutral-600 focus-visible:ring-focus-neutral active:bg-filled-neutral-active"},{appearance:"link",priority:"neutral",class:"text-strong focus-visible:ring-focus-accent"}]}),I=z(({"aria-disabled":e,appearance:t="outlined",asChild:o=!1,children:a,className:m,disabled:v,icon:r,iconPlacement:n="start",isLoading:i=!1,priority:h="default",...x},y)=>{let f=g(e??v??i),s=i?l(M,{className:"animate-spin"}):r,u=s&&t!=="link",B={"aria-disabled":f,className:b(k({appearance:t,priority:h,isLoading:i}),u&&n==="start"&&"ps-2.5",u&&n==="end"&&"pe-2.5",m),disabled:f,"data-loading":i,ref:y,...x};if(o){let c=A.only(a);W(L(c),"When using `asChild`, Button must be passed a single child as a JSX tag.");let P=c.props?.children;return l(T,{...B,children:w(c,{},l(V,{appearance:t,icon:s,iconPlacement:n,children:P}))})}return l("button",{...B,children:l(V,{appearance:t,icon:s,iconPlacement:n,children:a})})});I.displayName="Button";var V=({appearance:e,children:t,icon:o,iconPlacement:a})=>R("span",{className:C("inline-flex items-center gap-1.5 focus-within:outline-none focus-visible:outline-none",e==="link"&&"group-hover:underline"),children:[o&&l(p,{svg:o,className:C(a==="end"&&"order-last")}),t]});import{CircleNotch as N}from"@phosphor-icons/react/CircleNotch";import{Slot as S}from"@radix-ui/react-slot";import{cva as D}from"class-variance-authority";import{Children as J,cloneElement as X,forwardRef as j,isValidElement as q}from"react";import{jsx as d,jsxs as G}from"react/jsx-runtime";var F=D("inline-flex items-center justify-center rounded-md border focus-within:outline-none focus-visible:ring-4 disabled:pointer-events-none disabled:opacity-50 aria-disabled:opacity-50",{variants:{appearance:{ghost:"border-transparent text-strong hover:bg-neutral-500/10 hover:text-strong focus-visible:ring-focus-accent active:bg-neutral-500/15 active:text-strong",outlined:"border-form bg-form text-strong hover:border-neutral-400 hover:bg-form-hover hover:text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent active:border-neutral-400 active:bg-neutral-500/10 active:text-strong focus-visible:active:border-accent-600"},isLoading:{false:"",true:"opacity-50"},size:{xs:"size-7 sm:size-6",sm:"size-9 sm:size-7",md:"size-11 sm:size-9"}},defaultVariants:{appearance:"outlined",size:"md"}}),H=j(({"aria-disabled":e,appearance:t,asChild:o=!1,children:a,className:m,disabled:v,isLoading:r=!1,icon:n,label:i,size:h,type:x="button",...y},f)=>{let s=g(e??v??r),u={"aria-disabled":s,className:b(F({appearance:t,isLoading:r,size:h}),m),disabled:s,"data-loading":r,ref:f,type:x,...y};if(o){let c=J.only(a),P=q(c);return d(S,{...u,children:P&&X(c,{},d(p,{svg:r?d(N,{className:"animate-spin"}):n}))})}return G("button",{...u,children:[d("span",{className:"sr-only",children:i}),d(p,{svg:r?d(N,{className:"animate-spin"}):n})]})});H.displayName="IconButton";export{I as a,H as b};
|
|
2
|
+
//# sourceMappingURL=chunk-WFVD5X7N.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../packages/button/src/button.tsx","../packages/button/src/parse-booleanish.tsx","../packages/button/src/icon-button.tsx"],"sourcesContent":["import { CircleNotch } from \"@phosphor-icons/react/CircleNotch\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { cva } from \"class-variance-authority\";\nimport clsx from \"clsx\";\nimport { Children, cloneElement, forwardRef, isValidElement } from \"react\";\nimport type { ButtonHTMLAttributes, PropsWithChildren, ReactNode } from \"react\";\nimport invariant from \"tiny-invariant\";\nimport { cx } from \"../../cx\";\nimport { Icon } from \"../../icon\";\nimport type { WithAsChild } from \"../../types/src/as-child\";\nimport type { VariantProps } from \"../../types/src/variant-props\";\nimport { parseBooleanish } from \"./parse-booleanish\";\n\nconst buttonVariants = cva(\n\t\"inline-flex items-center justify-center gap-1.5 whitespace-nowrap rounded-md focus-within:outline-none focus-visible:ring-4 aria-disabled:opacity-50 sm:text-sm [&>*]:focus-within:outline-none\",\n\t{\n\t\tvariants: {\n\t\t\t/**\n\t\t\t * Defines the visual style of the Button.\n\t\t\t */\n\t\t\tappearance: {\n\t\t\t\tfilled:\n\t\t\t\t\t\"h-11 border border-transparent bg-filled-accent px-3 font-medium text-on-filled hover:bg-filled-accent-hover focus-visible:border-accent-600 focus-visible:ring-focus-accent active:bg-filled-accent-active sm:h-9\",\n\t\t\t\tghost:\n\t\t\t\t\t\"h-11 border border-transparent px-3 font-medium text-accent-600 hover:bg-accent-500/10 hover:text-accent-700 focus-visible:ring-focus-accent active:bg-accent-500/15 active:text-accent-700 sm:h-9\",\n\t\t\t\toutlined:\n\t\t\t\t\t\"h-11 border border-accent-600 bg-form px-3 font-medium text-accent-600 hover:border-accent-700 hover:bg-accent-500/10 hover:text-accent-700 focus-visible:ring-focus-accent active:border-accent-700 active:bg-accent-500/15 active:text-accent-700 sm:h-9\",\n\t\t\t\tlink: \"group cursor-pointer border-transparent text-accent-600 hover:underline focus-visible:ring-focus-accent\",\n\t\t\t},\n\t\t\t/**\n\t\t\t * Whether or not the button is in a loading state, default `false`. Setting `isLoading` will\n\t\t\t * replace any `icon` with a spinner, or add one if an icon wasn't given.\n\t\t\t * It will also disable user interaction with the button and set `aria-disabled`.\n\t\t\t */\n\t\t\tisLoading: {\n\t\t\t\tfalse: \"\",\n\t\t\t\ttrue: \"opacity-50\",\n\t\t\t},\n\t\t\t/**\n\t\t\t * Indicates the importance or impact level of the button, affecting its\n\t\t\t * color and styling to communicate its purpose to the user\n\t\t\t */\n\t\t\tpriority: {\n\t\t\t\tdanger: \"\",\n\t\t\t\tdefault: \"\",\n\t\t\t\tneutral: \"\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tappearance: \"outlined\",\n\t\t\tisLoading: false,\n\t\t\tpriority: \"default\",\n\t\t},\n\t\tcompoundVariants: [\n\t\t\t{\n\t\t\t\tappearance: \"ghost\",\n\t\t\t\tpriority: \"danger\",\n\t\t\t\tclass:\n\t\t\t\t\t\"border-transparent text-danger-600 hover:bg-danger-500/10 hover:text-danger-700 focus-visible:ring-focus-danger active:bg-danger-500/15 active:text-danger-700\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"outlined\",\n\t\t\t\tpriority: \"danger\",\n\t\t\t\tclass:\n\t\t\t\t\t\"border-danger-600 bg-form text-danger-600 hover:border-danger-700 hover:bg-danger-500/10 hover:text-danger-700 focus-visible:ring-focus-danger active:border-danger-700 active:bg-danger-500/15 active:text-danger-700\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"filled\",\n\t\t\t\tpriority: \"danger\",\n\t\t\t\tclass:\n\t\t\t\t\t\"border-transparent bg-filled-danger hover:bg-filled-danger-hover focus-visible:border-danger-600 focus-visible:ring-focus-danger active:bg-filled-danger-active\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"link\",\n\t\t\t\tpriority: \"danger\",\n\t\t\t\tclass: \"text-danger-600 focus-visible:ring-focus-danger\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"ghost\",\n\t\t\t\tpriority: \"neutral\",\n\t\t\t\tclass:\n\t\t\t\t\t\"border-transparent text-strong hover:bg-neutral-500/10 hover:text-strong focus-visible:ring-focus-accent active:bg-neutral-500/15 active:text-strong\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"outlined\",\n\t\t\t\tpriority: \"neutral\",\n\t\t\t\tclass:\n\t\t\t\t\t\"border-form bg-form text-strong hover:border-neutral-400 hover:bg-form-hover hover:text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent active:border-neutral-400 active:bg-neutral-500/10 active:text-strong focus-visible:active:border-accent-600\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"filled\",\n\t\t\t\tpriority: \"neutral\",\n\t\t\t\tclass:\n\t\t\t\t\t\"border-transparent bg-filled-neutral hover:bg-filled-neutral-hover focus-visible:border-neutral-600 focus-visible:ring-focus-neutral active:bg-filled-neutral-active\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"link\",\n\t\t\t\tpriority: \"neutral\",\n\t\t\t\tclass: \"text-strong focus-visible:ring-focus-accent\",\n\t\t\t},\n\t\t],\n\t},\n);\n\ntype ButtonVariants = VariantProps<typeof buttonVariants>;\n\n/**\n * The props for the `Button` component.\n */\ntype ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> &\n\tWithAsChild &\n\tButtonVariants & {\n\t\t/**\n\t\t * An icon to render inside the button. If the `state` is `\"pending\"`, then\n\t\t * the icon will automatically be replaced with a spinner.\n\t\t */\n\t\ticon?: ReactNode;\n\t\t/**\n\t\t * The side that the icon will render on, if one is present. If `state=\"pending\"`,\n\t\t * then the loading icon will also render on this side.\n\t\t */\n\t\ticonPlacement?: \"start\" | \"end\";\n\t\t/**\n\t\t * The default behavior of the button. Possible values are: `\"button\"`, `\"submit\"`, and `\"reset\"`.\n\t\t * Unlike the native `<button>` element, this prop is required and has no default value.\n\t\t * - `\"button\"`: The button has no default behavior, and does nothing when pressed by default. It can have client-side scripts listen to the element's events, which are triggered when the events occur.\n\t\t * - `\"reset\"`: The button resets all the controls to their initial values.\n\t\t * - `\"submit\"`: The button submits the form data to the server.\n\t\t * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#type\n\t\t */\n\t\ttype: Exclude<ButtonHTMLAttributes<HTMLButtonElement>[\"type\"], undefined>;\n\t};\n\n/**\n * Renders a button or a component that looks like a button, an interactive\n * element activated by a user with a mouse, keyboard, finger, voice command, or\n * other assistive technology. Once activated, it then performs an action, such\n * as submitting a form or opening a dialog.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button\n */\nconst Button = forwardRef<HTMLButtonElement, ButtonProps>(\n\t(\n\t\t{\n\t\t\t\"aria-disabled\": _ariaDisabled,\n\t\t\tappearance = \"outlined\",\n\t\t\tasChild = false,\n\t\t\tchildren,\n\t\t\tclassName,\n\t\t\tdisabled,\n\t\t\ticon: propIcon,\n\t\t\ticonPlacement = \"start\",\n\t\t\tisLoading = false,\n\t\t\tpriority = \"default\",\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst ariaDisabled = parseBooleanish(_ariaDisabled ?? disabled ?? isLoading);\n\t\tconst icon = isLoading ? <CircleNotch className=\"animate-spin\" /> : propIcon;\n\n\t\t/**\n\t\t * If the button has an icon and is not a link, add padding-start or padding-end to the button depending on the icon placement.\n\t\t */\n\t\tconst hasSpecialIconPadding = icon && appearance !== \"link\";\n\n\t\tconst buttonProps = {\n\t\t\t\"aria-disabled\": ariaDisabled,\n\t\t\tclassName: cx(\n\t\t\t\tbuttonVariants({ appearance, priority, isLoading }),\n\t\t\t\thasSpecialIconPadding && iconPlacement === \"start\" && \"ps-2.5\",\n\t\t\t\thasSpecialIconPadding && iconPlacement === \"end\" && \"pe-2.5\",\n\t\t\t\tclassName,\n\t\t\t),\n\t\t\tdisabled: ariaDisabled,\n\t\t\t\"data-loading\": isLoading,\n\t\t\tref,\n\t\t\t...props,\n\t\t};\n\n\t\tif (asChild) {\n\t\t\tconst singleChild = Children.only(children);\n\t\t\tinvariant(\n\t\t\t\tisValidElement<ButtonProps>(singleChild),\n\t\t\t\t\"When using `asChild`, Button must be passed a single child as a JSX tag.\",\n\t\t\t);\n\t\t\tconst grandchildren = singleChild.props?.children;\n\n\t\t\treturn (\n\t\t\t\t<Slot {...buttonProps}>\n\t\t\t\t\t{cloneElement(\n\t\t\t\t\t\tsingleChild,\n\t\t\t\t\t\t{},\n\t\t\t\t\t\t<InnerContent appearance={appearance} icon={icon} iconPlacement={iconPlacement}>\n\t\t\t\t\t\t\t{grandchildren}\n\t\t\t\t\t\t</InnerContent>,\n\t\t\t\t\t)}\n\t\t\t\t</Slot>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<button {...buttonProps}>\n\t\t\t\t<InnerContent appearance={appearance} icon={icon} iconPlacement={iconPlacement}>\n\t\t\t\t\t{children}\n\t\t\t\t</InnerContent>\n\t\t\t</button>\n\t\t);\n\t},\n);\nButton.displayName = \"Button\";\n\nexport { Button, buttonVariants };\nexport type { ButtonProps };\n\ntype InnerContentProps = PropsWithChildren & Pick<ButtonProps, \"appearance\" | \"icon\" | \"iconPlacement\">;\n\nconst InnerContent = ({ appearance, children, icon, iconPlacement }: InnerContentProps) => (\n\t<span\n\t\tclassName={clsx(\n\t\t\t\"inline-flex items-center gap-1.5 focus-within:outline-none focus-visible:outline-none\",\n\t\t\tappearance === \"link\" && \"group-hover:underline\",\n\t\t)}\n\t>\n\t\t{icon && <Icon svg={icon} className={clsx(iconPlacement === \"end\" && \"order-last\")} />}\n\t\t{children}\n\t</span>\n);\n","export type Booleanish = boolean | \"true\" | \"false\";\n\n/**\n * Parse/coerce a booleanish value (boolean | \"true\" | \"false\") into a boolean.\n * @default false if the value is not a boolean or \"true\"\n */\nexport function parseBooleanish(value: Booleanish | (string & {})): boolean {\n\tif (typeof value === \"boolean\") {\n\t\treturn value;\n\t} else {\n\t\treturn value === \"true\";\n\t}\n}\n","import { CircleNotch } from \"@phosphor-icons/react/CircleNotch\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { cva } from \"class-variance-authority\";\nimport { ButtonHTMLAttributes, Children, cloneElement, forwardRef, isValidElement, ReactNode } from \"react\";\nimport { cx } from \"../../cx\";\nimport { Icon } from \"../../icon\";\nimport type { VariantProps, WithAsChild } from \"../../types\";\nimport { parseBooleanish } from \"./parse-booleanish\";\n\nconst iconButtonVariants = cva(\n\t\"inline-flex items-center justify-center rounded-md border focus-within:outline-none focus-visible:ring-4 disabled:pointer-events-none disabled:opacity-50 aria-disabled:opacity-50\",\n\t{\n\t\tvariants: {\n\t\t\t/**\n\t\t\t * Defines the visual style of the Button.\n\t\t\t */\n\t\t\tappearance: {\n\t\t\t\tghost:\n\t\t\t\t\t\"border-transparent text-strong hover:bg-neutral-500/10 hover:text-strong focus-visible:ring-focus-accent active:bg-neutral-500/15 active:text-strong\",\n\t\t\t\toutlined:\n\t\t\t\t\t\"border-form bg-form text-strong hover:border-neutral-400 hover:bg-form-hover hover:text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent active:border-neutral-400 active:bg-neutral-500/10 active:text-strong focus-visible:active:border-accent-600\",\n\t\t\t},\n\t\t\t/**\n\t\t\t * Whether or not the button is in a loading state, default `false`. Setting `isLoading` will\n\t\t\t * replace the `icon` with a spinner.\n\t\t\t * It will also disable user interaction with the button and set `aria-disabled`.\n\t\t\t */\n\t\t\tisLoading: {\n\t\t\t\tfalse: \"\",\n\t\t\t\ttrue: \"opacity-50\",\n\t\t\t},\n\t\t\t/**\n\t\t\t * The size of the IconButton.\n\t\t\t */\n\t\t\tsize: {\n\t\t\t\txs: \"size-7 sm:size-6\",\n\t\t\t\tsm: \"size-9 sm:size-7\",\n\t\t\t\tmd: \"size-11 sm:size-9\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tappearance: \"outlined\",\n\t\t\tsize: \"md\",\n\t\t},\n\t},\n);\n\ntype IconButtonVariants = VariantProps<typeof iconButtonVariants>;\n\n/**\n * The props for the `Button` component.\n */\ntype IconButtonProps = ButtonHTMLAttributes<HTMLButtonElement> &\n\tWithAsChild &\n\tIconButtonVariants & {\n\t\t/**\n\t\t * The accessible label for the icon. This label will be visually hidden but announced to screen reader users, similar to alt text for img tags.\n\t\t */\n\t\tlabel: string;\n\t\t/**\n\t\t * An icon to render inside the button. If the `state` is `\"pending\"`, then\n\t\t * the icon will automatically be replaced with a spinner.\n\t\t */\n\t\ticon: ReactNode;\n\t\t/**\n\t\t * The default behavior of the button. Possible values are: `\"button\"`, `\"submit\"`, and `\"reset\"`.\n\t\t * Unlike the native `<button>` element, this prop defaults to `\"button\"`.\n\t\t * - `\"button\"`: The button has no default behavior, and does nothing when pressed by default. It can have client-side scripts listen to the element's events, which are triggered when the events occur.\n\t\t * - `\"reset\"`: The button resets all the controls to their initial values.\n\t\t * - `\"submit\"`: The button submits the form data to the server.\n\t\t * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#type\n\t\t * @default \"button\"\n\t\t */\n\t\ttype?: ButtonHTMLAttributes<HTMLButtonElement>[\"type\"];\n\t};\n\n/**\n * Renders a button or a component that looks like a button, an interactive\n * element activated by a user with a mouse, keyboard, finger, voice command, or\n * other assistive technology. Once activated, it then performs an action, such\n * as submitting a form or opening a dialog.\n * Renders only a single icon as children with an accessible, screen-reader-only label.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button\n */\nconst IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n\t(\n\t\t{\n\t\t\t\"aria-disabled\": _ariaDisabled,\n\t\t\tappearance,\n\t\t\tasChild = false,\n\t\t\tchildren,\n\t\t\tclassName,\n\t\t\tdisabled,\n\t\t\tisLoading = false,\n\t\t\ticon: propIcon,\n\t\t\tlabel,\n\t\t\tsize,\n\t\t\ttype = \"button\",\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst ariaDisabled = parseBooleanish(_ariaDisabled ?? disabled ?? isLoading);\n\n\t\tconst buttonProps = {\n\t\t\t\"aria-disabled\": ariaDisabled,\n\t\t\tclassName: cx(iconButtonVariants({ appearance, isLoading, size }), className),\n\t\t\tdisabled: ariaDisabled,\n\t\t\t\"data-loading\": isLoading,\n\t\t\tref,\n\t\t\ttype,\n\t\t\t...props,\n\t\t};\n\n\t\tif (asChild) {\n\t\t\tconst singleChild = Children.only(children);\n\t\t\tconst isValidChild = isValidElement(singleChild);\n\t\t\tconst icon = isLoading ? <CircleNotch className=\"animate-spin\" /> : propIcon;\n\n\t\t\treturn <Slot {...buttonProps}>{isValidChild && cloneElement(singleChild, {}, <Icon svg={icon} />)}</Slot>;\n\t\t}\n\n\t\tconst icon = isLoading ? <CircleNotch className=\"animate-spin\" /> : propIcon;\n\n\t\treturn (\n\t\t\t<button {...buttonProps}>\n\t\t\t\t<span className=\"sr-only\">{label}</span>\n\t\t\t\t<Icon svg={icon} />\n\t\t\t</button>\n\t\t);\n\t},\n);\nIconButton.displayName = \"IconButton\";\n\nexport { IconButton };\nexport type { IconButtonProps };\n"],"mappings":"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","names":["CircleNotch","Slot","cva","clsx","Children","cloneElement","forwardRef","isValidElement","invariant","parseBooleanish","value","jsx","jsxs","buttonVariants","cva","Button","forwardRef","_ariaDisabled","appearance","asChild","children","className","disabled","propIcon","iconPlacement","isLoading","priority","props","ref","ariaDisabled","parseBooleanish","icon","CircleNotch","hasSpecialIconPadding","buttonProps","cx","singleChild","Children","invariant","isValidElement","grandchildren","Slot","cloneElement","InnerContent","InnerContent","appearance","children","icon","iconPlacement","jsxs","clsx","jsx","Icon","CircleNotch","Slot","cva","Children","cloneElement","forwardRef","isValidElement","jsx","jsxs","iconButtonVariants","cva","IconButton","forwardRef","_ariaDisabled","appearance","asChild","children","className","disabled","isLoading","propIcon","label","size","type","props","ref","ariaDisabled","parseBooleanish","buttonProps","cx","singleChild","Children","isValidChild","isValidElement","Slot","cloneElement","Icon","CircleNotch"]}
|
package/dist/dialog.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{
|
|
1
|
+
import{b as n}from"./chunk-WFVD5X7N.js";import"./chunk-VT3Y7SNW.js";import{a}from"./chunk-A5H52ODC.js";import{X as P}from"@phosphor-icons/react/X";import*as e from"@radix-ui/react-dialog";import{forwardRef as r}from"react";import{jsx as o,jsxs as m}from"react/jsx-runtime";var u=e.Root,C=e.Trigger,d=e.Portal,N=e.Close,s=r(({className:t,...i},l)=>o(e.Overlay,{ref:l,className:a("fixed inset-0 z-50 bg-overlay backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",t),...i}));s.displayName=e.Overlay.displayName;var g=r(({className:t,children:i,...l},y)=>m(d,{children:[o(s,{}),m(e.Content,{ref:y,className:a("scrollbar fixed left-[50%] top-[50%] z-50 max-h-dvh w-full max-w-lg translate-x-[-50%] translate-y-[-50%] overflow-y-auto rounded-xl border border-dialog bg-dialog p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]",t),...l,children:[o(e.Close,{asChild:!0,children:o(n,{label:"Close",icon:o(P,{}),appearance:"outlined",className:"absolute right-3.5 top-3.5 size-11 p-0 sm:size-9"})}),i]})]}));g.displayName=e.Content.displayName;var p=({className:t,...i})=>o("div",{className:a("flex shrink-0 flex-col gap-2 text-strong",t),...i});p.displayName="DialogHeader";var D=({className:t,...i})=>o("div",{className:a("my-6 flex-1 text-body",t),...i});D.displayName="DialogBody";var f=({className:t,...i})=>o("div",{className:a("flex shrink-0 flex-row-reverse gap-2",t),...i});f.displayName="DialogFooter";var c=r(({className:t,...i},l)=>o(e.Title,{ref:l,className:a("text-lg font-medium leading-none text-strong",t),...i}));c.displayName=e.Title.displayName;var v=r(({className:t,...i},l)=>o(e.Description,{ref:l,className:a("text-muted",t),...i}));v.displayName=e.Description.displayName;export{u as Dialog,D as DialogBody,N as DialogClose,g as DialogContent,v as DialogDescription,f as DialogFooter,p as DialogHeader,s as DialogOverlay,d as DialogPortal,c as DialogTitle,C as DialogTrigger};
|
|
2
2
|
//# sourceMappingURL=dialog.js.map
|
package/dist/dialog.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../packages/dialog/src/dialog.tsx"],"sourcesContent":["import { X } from \"@phosphor-icons/react/X\";\nimport * as DialogPrimitive from \"@radix-ui/react-dialog\";\nimport { ComponentPropsWithoutRef, ElementRef, forwardRef } from \"react\";\nimport {
|
|
1
|
+
{"version":3,"sources":["../packages/dialog/src/dialog.tsx"],"sourcesContent":["import { X } from \"@phosphor-icons/react/X\";\nimport * as DialogPrimitive from \"@radix-ui/react-dialog\";\nimport { ComponentPropsWithoutRef, ElementRef, forwardRef } from \"react\";\nimport { IconButton } from \"../../button\";\nimport { cx } from \"../../cx\";\n\nconst Dialog = DialogPrimitive.Root;\n\nconst DialogTrigger = DialogPrimitive.Trigger;\n\nconst DialogPortal = DialogPrimitive.Portal;\n\nconst DialogClose = DialogPrimitive.Close;\n\nconst DialogOverlay = forwardRef<\n\tElementRef<typeof DialogPrimitive.Overlay>,\n\tComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Overlay\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"fixed inset-0 z-50 bg-overlay backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nDialogOverlay.displayName = DialogPrimitive.Overlay.displayName;\n\nconst DialogContent = forwardRef<\n\tElementRef<typeof DialogPrimitive.Content>,\n\tComponentPropsWithoutRef<typeof DialogPrimitive.Content>\n>(({ className, children, ...props }, ref) => (\n\t<DialogPortal>\n\t\t<DialogOverlay />\n\t\t<DialogPrimitive.Content\n\t\t\tref={ref}\n\t\t\tclassName={cx(\n\t\t\t\t\"scrollbar fixed left-[50%] top-[50%] z-50 max-h-dvh w-full max-w-lg translate-x-[-50%] translate-y-[-50%] overflow-y-auto rounded-xl border border-dialog bg-dialog p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<DialogPrimitive.Close asChild>\n\t\t\t\t<IconButton\n\t\t\t\t\tlabel=\"Close\"\n\t\t\t\t\ticon={<X />}\n\t\t\t\t\tappearance=\"outlined\"\n\t\t\t\t\tclassName=\"absolute right-3.5 top-3.5 size-11 p-0 sm:size-9\"\n\t\t\t\t/>\n\t\t\t</DialogPrimitive.Close>\n\t\t\t{children}\n\t\t</DialogPrimitive.Content>\n\t</DialogPortal>\n));\nDialogContent.displayName = DialogPrimitive.Content.displayName;\n\nconst DialogHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n\t<div className={cx(\"flex shrink-0 flex-col gap-2 text-strong\", className)} {...props}></div>\n);\nDialogHeader.displayName = \"DialogHeader\";\n\nconst DialogBody = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n\t<div className={cx(\"my-6 flex-1 text-body\", className)} {...props} />\n);\nDialogBody.displayName = \"DialogBody\";\n\nconst DialogFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n\t<div className={cx(\"flex shrink-0 flex-row-reverse gap-2\", className)} {...props} />\n);\nDialogFooter.displayName = \"DialogFooter\";\n\nconst DialogTitle = forwardRef<\n\tElementRef<typeof DialogPrimitive.Title>,\n\tComponentPropsWithoutRef<typeof DialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Title\n\t\tref={ref}\n\t\tclassName={cx(\"text-lg font-medium leading-none text-strong\", className)}\n\t\t{...props}\n\t/>\n));\nDialogTitle.displayName = DialogPrimitive.Title.displayName;\n\nconst DialogDescription = forwardRef<\n\tElementRef<typeof DialogPrimitive.Description>,\n\tComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Description ref={ref} className={cx(\"text-muted\", className)} {...props} />\n));\nDialogDescription.displayName = DialogPrimitive.Description.displayName;\n\nexport {\n\tDialog,\n\tDialogPortal,\n\tDialogOverlay,\n\tDialogTrigger,\n\tDialogClose,\n\tDialogContent,\n\tDialogHeader,\n\tDialogBody,\n\tDialogFooter,\n\tDialogTitle,\n\tDialogDescription,\n};\n"],"mappings":"uGAAA,OAAS,KAAAA,MAAS,0BAClB,UAAYC,MAAqB,yBACjC,OAA+C,cAAAC,MAAkB,QAgBhE,cAAAC,EAiBC,QAAAC,MAjBD,oBAZD,IAAMC,EAAyB,OAEzBC,EAAgC,UAEhCC,EAA+B,SAE/BC,EAA8B,QAE9BC,EAAgBC,EAGpB,CAAC,CAAE,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IAC3BV,EAAiB,UAAhB,CACA,IAAKU,EACL,UAAWC,EACV,yKACAH,CACD,EACC,GAAGC,EACL,CACA,EACDH,EAAc,YAA8B,UAAQ,YAEpD,IAAMM,EAAgBL,EAGpB,CAAC,CAAE,UAAAC,EAAW,SAAAK,EAAU,GAAGJ,CAAM,EAAGC,IACrCT,EAACG,EAAA,CACA,UAAAJ,EAACM,EAAA,EAAc,EACfL,EAAiB,UAAhB,CACA,IAAKS,EACL,UAAWC,EACV,8hBACAH,CACD,EACC,GAAGC,EAEJ,UAAAT,EAAiB,QAAhB,CAAsB,QAAO,GAC7B,SAAAA,EAACc,EAAA,CACA,MAAM,QACN,KAAMd,EAACe,EAAA,EAAE,EACT,WAAW,WACX,UAAU,mDACX,EACD,EACCF,GACF,GACD,CACA,EACDD,EAAc,YAA8B,UAAQ,YAEpD,IAAMI,EAAe,CAAC,CAAE,UAAAR,EAAW,GAAGC,CAAM,IAC3CT,EAAC,OAAI,UAAWW,EAAG,2CAA4CH,CAAS,EAAI,GAAGC,EAAO,EAEvFO,EAAa,YAAc,eAE3B,IAAMC,EAAa,CAAC,CAAE,UAAAT,EAAW,GAAGC,CAAM,IACzCT,EAAC,OAAI,UAAWW,EAAG,wBAAyBH,CAAS,EAAI,GAAGC,EAAO,EAEpEQ,EAAW,YAAc,aAEzB,IAAMC,EAAe,CAAC,CAAE,UAAAV,EAAW,GAAGC,CAAM,IAC3CT,EAAC,OAAI,UAAWW,EAAG,uCAAwCH,CAAS,EAAI,GAAGC,EAAO,EAEnFS,EAAa,YAAc,eAE3B,IAAMC,EAAcZ,EAGlB,CAAC,CAAE,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IAC3BV,EAAiB,QAAhB,CACA,IAAKU,EACL,UAAWC,EAAG,+CAAgDH,CAAS,EACtE,GAAGC,EACL,CACA,EACDU,EAAY,YAA8B,QAAM,YAEhD,IAAMC,EAAoBb,EAGxB,CAAC,CAAE,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IAC3BV,EAAiB,cAAhB,CAA4B,IAAKU,EAAK,UAAWC,EAAG,aAAcH,CAAS,EAAI,GAAGC,EAAO,CAC1F,EACDW,EAAkB,YAA8B,cAAY","names":["X","DialogPrimitive","forwardRef","jsx","jsxs","Dialog","DialogTrigger","DialogPortal","DialogClose","DialogOverlay","forwardRef","className","props","ref","cx","DialogContent","children","IconButton","X","DialogHeader","DialogBody","DialogFooter","DialogTitle","DialogDescription"]}
|
package/dist/input.d.ts
CHANGED
|
@@ -1,56 +1,7 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
2
|
import { InputHTMLAttributes, PropsWithChildren } from 'react';
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
* (Not a Boolean attribute!) The autocomplete attribute takes as its value a space-separated string that describes what,
|
|
6
|
-
* if any, type of autocomplete functionality the input should provide. A typical implementation of autocomplete recalls
|
|
7
|
-
* previous values entered in the same input field, but more complex forms of autocomplete can exist. For instance, a
|
|
8
|
-
* browser could integrate with a device's contacts list to autocomplete email addresses in an email input field.
|
|
9
|
-
*
|
|
10
|
-
* The autocomplete attribute is valid on hidden, text, search, url, tel, email, date, month, week, time, datetime-local,
|
|
11
|
-
* number, range, color, and password. This attribute has no effect on input types that do not return numeric or text
|
|
12
|
-
* data, being valid for all input types except checkbox, radio, file, or any of the button types.
|
|
13
|
-
*
|
|
14
|
-
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete#values
|
|
15
|
-
*/
|
|
16
|
-
type AutoComplete = "off" | "on" | "name" | "honorific-prefix" | "given-name" | "additional-name" | "family-name" | "honorific-suffix" | "nickname" | "email" | "username" | "new-password" | "current-password" | "one-time-code" | "organization-title" | "organization" | "street-address" | "address-line1" | "address-line2" | "address-line3" | "address-level4" | "address-level3" | "address-level2" | "address-level1" | "country" | "country-name" | "postal-code" | "cc-name" | "cc-given-name" | "cc-additional-name" | "cc-family-name" | "cc-number" | "cc-exp" | "cc-exp-month" | "cc-exp-year" | "cc-csc" | "cc-type" | "transaction-currency" | "transaction-amount" | "language" | "bday" | "bday-day" | "bday-month" | "bday-year" | "sex" | "tel" | "tel-country-code" | "tel-national" | "tel-area-code" | "tel-local" | "tel-extension" | "impp" | "url" | "photo";
|
|
17
|
-
type WithAutoComplete = {
|
|
18
|
-
/**
|
|
19
|
-
* (Not a Boolean attribute!) The autocomplete attribute takes as its value a space-separated string that describes what,
|
|
20
|
-
* if any, type of autocomplete functionality the input should provide. A typical implementation of autocomplete recalls
|
|
21
|
-
* previous values entered in the same input field, but more complex forms of autocomplete can exist. For instance, a
|
|
22
|
-
* browser could integrate with a device's contacts list to autocomplete email addresses in an email input field.
|
|
23
|
-
*
|
|
24
|
-
* The autocomplete attribute is valid on hidden, text, search, url, tel, email, date, month, week, time, datetime-local,
|
|
25
|
-
* number, range, color, and password. This attribute has no effect on input types that do not return numeric or text
|
|
26
|
-
* data, being valid for all input types except checkbox, radio, file, or any of the button types.
|
|
27
|
-
*
|
|
28
|
-
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete#values
|
|
29
|
-
*/
|
|
30
|
-
autoComplete?: AutoComplete;
|
|
31
|
-
};
|
|
32
|
-
/**
|
|
33
|
-
* A string specifying the type of control to render. For example, to create a checkbox, a value of `"checkbox"` is used.
|
|
34
|
-
* If omitted (or an unknown value is specified), the input type `"text"` is used, creating a plaintext input field.
|
|
35
|
-
*
|
|
36
|
-
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#input_types
|
|
37
|
-
*/
|
|
38
|
-
type InputType = "button" | "checkbox" | "color" | "date" | "datetime-local" | "email" | "file" | "hidden" | "image" | "month" | "number" | "password" | "radio" | "range" | "reset" | "search" | "submit" | "tel" | "text" | "time" | "url" | "week";
|
|
39
|
-
type WithInputType = {
|
|
40
|
-
/**
|
|
41
|
-
* A string specifying the type of control to render. For example, to create a checkbox, a value of `"checkbox"` is used.
|
|
42
|
-
* If omitted (or an unknown value is specified), the input type `"text"` is used, creating a plaintext input field.
|
|
43
|
-
*
|
|
44
|
-
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#input_types
|
|
45
|
-
*/
|
|
46
|
-
type?: InputType;
|
|
47
|
-
};
|
|
48
|
-
type WithInvalid = {
|
|
49
|
-
/**
|
|
50
|
-
* Whether or not the input has a validation error.
|
|
51
|
-
*/
|
|
52
|
-
invalid?: boolean;
|
|
53
|
-
};
|
|
3
|
+
import { a as WithAutoComplete, b as WithInputType, W as WithInvalid } from './types-nznA3HrJ.js';
|
|
4
|
+
export { A as AutoComplete, I as InputType } from './types-nznA3HrJ.js';
|
|
54
5
|
|
|
55
6
|
type BaseProps = WithAutoComplete & WithInputType & WithInvalid;
|
|
56
7
|
/**
|
|
@@ -72,4 +23,4 @@ declare const InputCapture: react.ForwardRefExoticComponent<Omit<InputHTMLAttrib
|
|
|
72
23
|
type PasswordInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, "autoComplete" | "type"> & WithInvalid & WithAutoComplete;
|
|
73
24
|
declare const PasswordInput: react.ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "autoComplete" | "type"> & WithInvalid & WithAutoComplete & react.RefAttributes<HTMLInputElement>>;
|
|
74
25
|
|
|
75
|
-
export {
|
|
26
|
+
export { Input, InputCapture, type InputCaptureProps, type InputProps, PasswordInput, type PasswordInputProps, WithAutoComplete, WithInputType, WithInvalid };
|
package/dist/select.d.ts
CHANGED
|
@@ -1,19 +1,54 @@
|
|
|
1
1
|
import * as _radix_ui_react_separator from '@radix-ui/react-separator';
|
|
2
2
|
import * as react from 'react';
|
|
3
|
-
import {
|
|
3
|
+
import { SelectHTMLAttributes, ComponentPropsWithoutRef } from 'react';
|
|
4
4
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
5
5
|
import * as SelectPrimitive from '@radix-ui/react-select';
|
|
6
|
+
import { W as WithInvalid } from './types-nznA3HrJ.js';
|
|
6
7
|
|
|
7
|
-
type
|
|
8
|
-
|
|
8
|
+
type WithAriaInvalid = Pick<SelectHTMLAttributes<HTMLSelectElement>, "aria-invalid">;
|
|
9
|
+
type SelectProps = Omit<ComponentPropsWithoutRef<typeof SelectPrimitive.Root>, "onValueChange"> & WithInvalid & WithAriaInvalid & {
|
|
10
|
+
/**
|
|
11
|
+
* Event handler called when the value changes.
|
|
12
|
+
*/
|
|
13
|
+
onChange?: (value: string) => void;
|
|
14
|
+
};
|
|
15
|
+
/**
|
|
16
|
+
* Displays a list of options for the user to pick from—triggered by a button.
|
|
17
|
+
*/
|
|
18
|
+
declare const Select: ({ "aria-invalid": _ariaInvalid, children, invalid, onChange, ...props }: SelectProps) => react_jsx_runtime.JSX.Element;
|
|
19
|
+
/**
|
|
20
|
+
* A group of related options within a select menu. Similar to an html `<optgroup>` element.
|
|
21
|
+
* Use in conjunction with Select.Label to ensure good accessibility via automatic labelling.
|
|
22
|
+
*/
|
|
9
23
|
declare const SelectGroup: react.ForwardRefExoticComponent<SelectPrimitive.SelectGroupProps & react.RefAttributes<HTMLDivElement>>;
|
|
24
|
+
/**
|
|
25
|
+
* The part that reflects the selected value. By default the selected item's text will be rendered. if you require more control, you can instead control the select and pass your own children. It should not be styled to ensure correct positioning. An optional placeholder prop is also available for when the select has no value.
|
|
26
|
+
*/
|
|
10
27
|
declare const SelectValue: react.ForwardRefExoticComponent<SelectPrimitive.SelectValueProps & react.RefAttributes<HTMLSpanElement>>;
|
|
11
|
-
|
|
28
|
+
/**
|
|
29
|
+
* The button that toggles the select. The Select.Content will position itself adjacent to the trigger.
|
|
30
|
+
*/
|
|
31
|
+
declare const SelectTrigger: react.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectTriggerProps & react.RefAttributes<HTMLButtonElement>, "ref"> & WithAriaInvalid & WithInvalid & react.RefAttributes<HTMLButtonElement>>;
|
|
32
|
+
/**
|
|
33
|
+
* The component that pops out when the select is open as a portal adjacent to the trigger button.
|
|
34
|
+
* It contains a scrolling viewport of the select items.
|
|
35
|
+
*/
|
|
12
36
|
declare const SelectContent: react.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & {
|
|
13
37
|
width?: "content" | "trigger" | undefined;
|
|
14
38
|
} & react.RefAttributes<HTMLDivElement>>;
|
|
39
|
+
/**
|
|
40
|
+
* Used to render the label of a group. It won't be focusable using arrow keys.
|
|
41
|
+
*/
|
|
15
42
|
declare const SelectLabel: react.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectLabelProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
|
|
43
|
+
/**
|
|
44
|
+
* An option within a select menu. Similar to an html `<option>` element.
|
|
45
|
+
* Contains a `value` prop that will be passed to the `onChange` handler of the `Select` component when selected.
|
|
46
|
+
* Displays the children as the option's text.
|
|
47
|
+
*/
|
|
16
48
|
declare const SelectItem: react.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectItemProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
|
|
49
|
+
/**
|
|
50
|
+
* Used to visually separate items in the select.
|
|
51
|
+
*/
|
|
17
52
|
declare const SelectSeparator: react.ForwardRefExoticComponent<Omit<Omit<_radix_ui_react_separator.SeparatorProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
|
|
18
53
|
|
|
19
54
|
export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectSeparator, SelectTrigger, SelectValue };
|
package/dist/select.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as
|
|
1
|
+
import{a as p}from"./chunk-C2ECUIPG.js";import{a}from"./chunk-A5H52ODC.js";import{CaretDown as f}from"@phosphor-icons/react/CaretDown";import{CaretUp as w}from"@phosphor-icons/react/CaretUp";import{Check as I}from"@phosphor-icons/react/Check";import*as e from"@radix-ui/react-select";import{createContext as R,forwardRef as n,useContext as N}from"react";import{jsx as i,jsxs as m}from"react/jsx-runtime";var S=R({}),W=({"aria-invalid":r,children:o,invalid:t,onChange:l,...c})=>i(e.Root,{...c,onValueChange:l,children:i(S.Provider,{value:{"aria-invalid":r,invalid:t},children:o})}),T=e.Group,B=e.Value,v=n(({"aria-invalid":r,className:o,children:t,invalid:l,...c},s)=>{let{"aria-invalid":x,invalid:C}=N(S),d=x??C??r??l;return m(e.Trigger,{"aria-invalid":d,ref:s,className:a("flex h-11 w-full items-center justify-between rounded-md border border-form bg-form px-3 py-2 text-strong placeholder:text-placeholder hover:border-neutral-400 hover:bg-form-hover hover:text-strong focus:border-accent-600 focus:outline-none focus:ring-4 focus:ring-focus-accent focus-visible:border-accent-600 focus-visible:ring-focus-accent active:border-neutral-400 active:bg-neutral-500/10 active:text-strong focus-visible:active:border-accent-600 disabled:pointer-events-none disabled:opacity-50 aria-expanded:border-accent-600 aria-expanded:ring-4 aria-expanded:ring-focus-accent sm:h-9 sm:text-sm [&>span]:line-clamp-1 [&>span]:text-left",d&&"border-danger-600 focus:border-danger-600 focus:ring-focus-danger aria-expanded:border-danger-600 aria-expanded:ring-focus-danger",o),...c,children:[t,i(e.Icon,{asChild:!0,children:i(f,{className:"size-4 shrink-0",weight:"bold"})})]})});v.displayName="SelectTrigger";var u=n(({className:r,...o},t)=>i(e.ScrollUpButton,{ref:t,className:a("flex cursor-default items-center justify-center py-1",r),...o,children:i(w,{className:"size-4",weight:"bold"})}));u.displayName="SelectScrollUpButton";var g=n(({className:r,...o},t)=>i(e.ScrollDownButton,{ref:t,className:a("flex cursor-default items-center justify-center py-1",r),...o,children:i(f,{className:"size-4",weight:"bold"})}));g.displayName="SelectScrollDownButton";var P=n(({className:r,children:o,position:t="popper",width:l,...c},s)=>i(e.Portal,{children:m(e.Content,{ref:s,className:a("relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border border-popover shadow-md data-side-bottom:slide-in-from-top-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-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95","bg-popover",t==="popper"&&"max-h-[var(--radix-select-content-available-height)] data-side-bottom:translate-y-2 data-side-left:-translate-x-2 data-side-right:translate-x-2 data-side-top:-translate-y-2",l==="trigger"&&"w-[var(--radix-select-trigger-width)]",r),position:t,...c,children:[i(u,{}),i(e.Viewport,{className:a("p-1",t==="popper"&&"h-[var(--radix-select-trigger-height)] w-full"),children:o}),i(g,{})]})}));P.displayName="SelectContent";var h=n(({className:r,...o},t)=>i(e.Label,{ref:t,className:a("px-2 py-1.5 text-sm font-semibold",r),...o}));h.displayName="SelectLabel";var b=n(({className:r,children:o,...t},l)=>m(e.Item,{ref:l,className:a("relative flex w-full cursor-pointer select-none items-center rounded py-1.5 pl-2 pr-8 text-sm outline-none focus:bg-popover-hover data-state-checked:bg-filled-accent data-state-checked:text-on-filled data-disabled:pointer-events-none data-disabled:opacity-50",r),...t,children:[i(e.ItemText,{children:o}),i(e.ItemIndicator,{className:"absolute right-2 flex h-3.5 w-3.5 items-center justify-center",children:i(I,{className:"size-4",weight:"bold"})})]}));b.displayName="SelectItem";var y=n(({className:r,...o},t)=>i(p,{ref:t,className:a("-mx-1 my-1 h-px w-auto",r),...o}));y.displayName="SelectSeparator";export{W as Select,P as SelectContent,T as SelectGroup,b as SelectItem,h as SelectLabel,y as SelectSeparator,v as SelectTrigger,B as SelectValue};
|
|
2
2
|
//# sourceMappingURL=select.js.map
|
package/dist/select.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../packages/select/src/select.tsx"],"sourcesContent":["import { CaretDown } from \"@phosphor-icons/react/CaretDown\";\nimport { CaretUp } from \"@phosphor-icons/react/CaretUp\";\nimport { Check } from \"@phosphor-icons/react/Check\";\nimport * as SelectPrimitive from \"@radix-ui/react-select\";\nimport { cva } from \"class-variance-authority\";\nimport type { ComponentPropsWithoutRef, ElementRef, SelectHTMLAttributes } from \"react\";\nimport { createContext, forwardRef, useContext } from \"react\";\nimport { cx } from \"../../cx\";\nimport { Separator } from \"../../separator\";\nimport type { VariantProps } from \"../../types/src/variant-props\";\n\nconst SelectAriaInvalidContext = createContext<SelectHTMLAttributes<HTMLSelectElement>[\"aria-invalid\"]>(undefined);\n\ntype SelectProps = ComponentPropsWithoutRef<typeof SelectPrimitive.Root> &\n\tPick<SelectHTMLAttributes<HTMLSelectElement>, \"aria-invalid\">;\n\nconst Select = ({ children, ...props }: SelectProps) => {\n\treturn (\n\t\t<SelectPrimitive.Root {...props}>\n\t\t\t<SelectAriaInvalidContext.Provider value={props[\"aria-invalid\"]}>{children}</SelectAriaInvalidContext.Provider>\n\t\t</SelectPrimitive.Root>\n\t);\n};\n\nconst SelectGroup = SelectPrimitive.Group;\n\nconst SelectValue = SelectPrimitive.Value;\n\nconst selectTriggerVariants = cva(\n\t\"flex h-11 w-full items-center justify-between rounded-md border border-form bg-form px-3 py-2 placeholder:text-placeholder hover:bg-form-hover focus:outline-none focus:ring-4 disabled:pointer-events-none disabled:opacity-50 aria-expanded:ring-4 sm:h-9 sm:text-sm [&>span]:line-clamp-1 [&>span]:text-left\",\n\t{\n\t\tvariants: {\n\t\t\tstate: {\n\t\t\t\tdanger:\n\t\t\t\t\t\"border-danger-600 focus:border-danger-600 focus:ring-focus-danger aria-expanded:border-danger-600 aria-expanded:ring-focus-danger\",\n\t\t\t\tdefault:\n\t\t\t\t\t\"borderpform text-strong placeholder:text-placeholder focus:border-accent-600 focus:ring-focus-accent aria-expanded:border-accent-600 aria-expanded:ring-focus-accent\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tstate: \"default\",\n\t\t},\n\t},\n);\n\ntype SelectTriggerVariants = VariantProps<typeof selectTriggerVariants>;\n\nconst SelectTrigger = forwardRef<\n\tElementRef<typeof SelectPrimitive.Trigger>,\n\tComponentPropsWithoutRef<typeof SelectPrimitive.Trigger>\n>(({ className, children, ...props }, ref) => {\n\tconst ariaInvalidContext = useContext(SelectAriaInvalidContext);\n\tconst ariaInvalid = props[\"aria-invalid\"] ?? ariaInvalidContext;\n\tconst state = ariaInvalid ? \"danger\" : (\"default\" satisfies SelectTriggerVariants[\"state\"]);\n\n\treturn (\n\t\t<SelectPrimitive.Trigger\n\t\t\tref={ref}\n\t\t\tclassName={cx(selectTriggerVariants({ state }), className)}\n\t\t\t{...props}\n\t\t\taria-invalid={ariaInvalid}\n\t\t>\n\t\t\t{children}\n\t\t\t<SelectPrimitive.Icon asChild>\n\t\t\t\t<CaretDown className=\"size-4 shrink-0\" weight=\"bold\" />\n\t\t\t</SelectPrimitive.Icon>\n\t\t</SelectPrimitive.Trigger>\n\t);\n});\nSelectTrigger.displayName = \"SelectTrigger\";\n\nconst SelectScrollUpButton = forwardRef<\n\tElementRef<typeof SelectPrimitive.ScrollUpButton>,\n\tComponentPropsWithoutRef<typeof SelectPrimitive.ScrollUpButton>\n>(({ className, ...props }, ref) => (\n\t<SelectPrimitive.ScrollUpButton\n\t\tref={ref}\n\t\tclassName={cx(\"flex cursor-default items-center justify-center py-1\", className)}\n\t\t{...props}\n\t>\n\t\t<CaretUp className=\"size-4\" weight=\"bold\" />\n\t</SelectPrimitive.ScrollUpButton>\n));\nSelectScrollUpButton.displayName = \"SelectScrollUpButton\";\n\nconst SelectScrollDownButton = forwardRef<\n\tElementRef<typeof SelectPrimitive.ScrollDownButton>,\n\tComponentPropsWithoutRef<typeof SelectPrimitive.ScrollDownButton>\n>(({ className, ...props }, ref) => (\n\t<SelectPrimitive.ScrollDownButton\n\t\tref={ref}\n\t\tclassName={cx(\"flex cursor-default items-center justify-center py-1\", className)}\n\t\t{...props}\n\t>\n\t\t<CaretDown className=\"size-4\" weight=\"bold\" />\n\t</SelectPrimitive.ScrollDownButton>\n));\nSelectScrollDownButton.displayName = \"SelectScrollDownButton\";\n\ntype SelectContentProps = ComponentPropsWithoutRef<typeof SelectPrimitive.Content> & {\n\twidth?: \"trigger\" | \"content\";\n};\n\nconst SelectContent = forwardRef<ElementRef<typeof SelectPrimitive.Content>, SelectContentProps>(\n\t({ className, children, position = \"popper\", width, ...props }, ref) => (\n\t\t<SelectPrimitive.Portal>\n\t\t\t<SelectPrimitive.Content\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border border-popover shadow-md data-side-bottom:slide-in-from-top-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-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95\",\n\t\t\t\t\t\"bg-popover\",\n\t\t\t\t\tposition === \"popper\" &&\n\t\t\t\t\t\t\"max-h-[var(--radix-select-content-available-height)] data-side-bottom:translate-y-2 data-side-left:-translate-x-2 data-side-right:translate-x-2 data-side-top:-translate-y-2\",\n\t\t\t\t\twidth === \"trigger\" && \"w-[var(--radix-select-trigger-width)]\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tposition={position}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t<SelectScrollUpButton />\n\t\t\t\t<SelectPrimitive.Viewport\n\t\t\t\t\tclassName={cx(\"p-1\", position === \"popper\" && \"h-[var(--radix-select-trigger-height)] w-full\")}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</SelectPrimitive.Viewport>\n\t\t\t\t<SelectScrollDownButton />\n\t\t\t</SelectPrimitive.Content>\n\t\t</SelectPrimitive.Portal>\n\t),\n);\nSelectContent.displayName = \"SelectContent\";\n\nconst SelectLabel = forwardRef<\n\tElementRef<typeof SelectPrimitive.Label>,\n\tComponentPropsWithoutRef<typeof SelectPrimitive.Label>\n>(({ className, ...props }, ref) => (\n\t<SelectPrimitive.Label ref={ref} className={cx(\"px-2 py-1.5 text-sm font-semibold\", className)} {...props} />\n));\nSelectLabel.displayName = \"SelectLabel\";\n\nconst SelectItem = forwardRef<\n\tElementRef<typeof SelectPrimitive.Item>,\n\tComponentPropsWithoutRef<typeof SelectPrimitive.Item>\n>(({ className, children, ...props }, ref) => (\n\t<SelectPrimitive.Item\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"relative flex w-full cursor-pointer select-none items-center rounded py-1.5 pl-2 pr-8 text-sm outline-none focus:bg-popover-hover data-state-checked:bg-filled-accent data-state-checked:text-on-filled data-disabled:pointer-events-none data-disabled:opacity-50\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t<SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n\t\t<SelectPrimitive.ItemIndicator className=\"absolute right-2 flex h-3.5 w-3.5 items-center justify-center\">\n\t\t\t<Check className=\"size-4\" weight=\"bold\" />\n\t\t</SelectPrimitive.ItemIndicator>\n\t</SelectPrimitive.Item>\n));\nSelectItem.displayName = \"SelectItem\";\n\nconst SelectSeparator = forwardRef<ElementRef<typeof Separator>, ComponentPropsWithoutRef<typeof Separator>>(\n\t({ className, ...props }, ref) => (\n\t\t<Separator ref={ref} className={cx(\"-mx-1 my-1 h-px w-auto\", className)} {...props} />\n\t),\n);\nSelectSeparator.displayName = \"SelectSeparator\";\n\nexport {\n\tSelect,\n\tSelectGroup,\n\tSelectValue,\n\tSelectTrigger,\n\tSelectContent,\n\tSelectLabel,\n\tSelectItem,\n\tSelectSeparator,\n\tSelectScrollUpButton,\n\tSelectScrollDownButton,\n};\n"],"mappings":"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","names":["CaretDown","CaretUp","Check","SelectPrimitive","cva","createContext","forwardRef","useContext","jsx","jsxs","SelectAriaInvalidContext","createContext","Select","children","props","SelectGroup","SelectValue","selectTriggerVariants","cva","SelectTrigger","forwardRef","className","ref","ariaInvalidContext","useContext","ariaInvalid","cx","CaretDown","SelectScrollUpButton","CaretUp","SelectScrollDownButton","SelectContent","position","width","SelectLabel","SelectItem","Check","SelectSeparator","Separator"]}
|
|
1
|
+
{"version":3,"sources":["../packages/select/src/select.tsx"],"sourcesContent":["import { CaretDown } from \"@phosphor-icons/react/CaretDown\";\nimport { CaretUp } from \"@phosphor-icons/react/CaretUp\";\nimport { Check } from \"@phosphor-icons/react/Check\";\nimport * as SelectPrimitive from \"@radix-ui/react-select\";\nimport type { ComponentPropsWithoutRef, ElementRef, SelectHTMLAttributes } from \"react\";\nimport { createContext, forwardRef, useContext } from \"react\";\nimport { cx } from \"../../cx\";\nimport type { WithInvalid } from \"../../input\";\nimport { Separator } from \"../../separator\";\n\ntype WithAriaInvalid = Pick<SelectHTMLAttributes<HTMLSelectElement>, \"aria-invalid\">;\ntype SelectContextType = WithInvalid & WithAriaInvalid;\n\nconst SelectContext = createContext<SelectContextType>({});\n\ntype SelectProps = Omit<ComponentPropsWithoutRef<typeof SelectPrimitive.Root>, \"onValueChange\"> &\n\tWithInvalid &\n\tWithAriaInvalid & {\n\t\t/**\n\t\t * Event handler called when the value changes.\n\t\t */\n\t\tonChange?: (value: string) => void;\n\t};\n\n/**\n * Displays a list of options for the user to pick from—triggered by a button.\n */\nconst Select = ({ \"aria-invalid\": _ariaInvalid, children, invalid, onChange, ...props }: SelectProps) => {\n\treturn (\n\t\t<SelectPrimitive.Root {...props} onValueChange={onChange}>\n\t\t\t<SelectContext.Provider value={{ \"aria-invalid\": _ariaInvalid, invalid }}>{children}</SelectContext.Provider>\n\t\t</SelectPrimitive.Root>\n\t);\n};\n\n/**\n * A group of related options within a select menu. Similar to an html `<optgroup>` element.\n * Use in conjunction with Select.Label to ensure good accessibility via automatic labelling.\n */\nconst SelectGroup = SelectPrimitive.Group;\n\n/**\n * The part that reflects the selected value. By default the selected item's text will be rendered. if you require more control, you can instead control the select and pass your own children. It should not be styled to ensure correct positioning. An optional placeholder prop is also available for when the select has no value.\n */\nconst SelectValue = SelectPrimitive.Value;\n\ntype SelectTriggerProps = ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger> & WithAriaInvalid & WithInvalid;\n\n/**\n * The button that toggles the select. The Select.Content will position itself adjacent to the trigger.\n */\nconst SelectTrigger = forwardRef<ElementRef<typeof SelectPrimitive.Trigger>, SelectTriggerProps>(\n\t({ \"aria-invalid\": _ariaInvalid, className, children, invalid, ...props }, ref) => {\n\t\tconst { \"aria-invalid\": ctxAriaInvalid, invalid: ctxInvalid } = useContext(SelectContext);\n\t\tconst ariaInvalid = ctxAriaInvalid ?? ctxInvalid ?? _ariaInvalid ?? invalid;\n\n\t\treturn (\n\t\t\t<SelectPrimitive.Trigger\n\t\t\t\taria-invalid={ariaInvalid}\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"flex h-11 w-full items-center justify-between rounded-md border border-form bg-form px-3 py-2 text-strong placeholder:text-placeholder hover:border-neutral-400 hover:bg-form-hover hover:text-strong focus:border-accent-600 focus:outline-none focus:ring-4 focus:ring-focus-accent focus-visible:border-accent-600 focus-visible:ring-focus-accent active:border-neutral-400 active:bg-neutral-500/10 active:text-strong focus-visible:active:border-accent-600 disabled:pointer-events-none disabled:opacity-50 aria-expanded:border-accent-600 aria-expanded:ring-4 aria-expanded:ring-focus-accent sm:h-9 sm:text-sm [&>span]:line-clamp-1 [&>span]:text-left\",\n\t\t\t\t\tariaInvalid &&\n\t\t\t\t\t\t\"border-danger-600 focus:border-danger-600 focus:ring-focus-danger aria-expanded:border-danger-600 aria-expanded:ring-focus-danger\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t\t<SelectPrimitive.Icon asChild>\n\t\t\t\t\t<CaretDown className=\"size-4 shrink-0\" weight=\"bold\" />\n\t\t\t\t</SelectPrimitive.Icon>\n\t\t\t</SelectPrimitive.Trigger>\n\t\t);\n\t},\n);\nSelectTrigger.displayName = \"SelectTrigger\";\n\nconst SelectScrollUpButton = forwardRef<\n\tElementRef<typeof SelectPrimitive.ScrollUpButton>,\n\tComponentPropsWithoutRef<typeof SelectPrimitive.ScrollUpButton>\n>(({ className, ...props }, ref) => (\n\t<SelectPrimitive.ScrollUpButton\n\t\tref={ref}\n\t\tclassName={cx(\"flex cursor-default items-center justify-center py-1\", className)}\n\t\t{...props}\n\t>\n\t\t<CaretUp className=\"size-4\" weight=\"bold\" />\n\t</SelectPrimitive.ScrollUpButton>\n));\nSelectScrollUpButton.displayName = \"SelectScrollUpButton\";\n\nconst SelectScrollDownButton = forwardRef<\n\tElementRef<typeof SelectPrimitive.ScrollDownButton>,\n\tComponentPropsWithoutRef<typeof SelectPrimitive.ScrollDownButton>\n>(({ className, ...props }, ref) => (\n\t<SelectPrimitive.ScrollDownButton\n\t\tref={ref}\n\t\tclassName={cx(\"flex cursor-default items-center justify-center py-1\", className)}\n\t\t{...props}\n\t>\n\t\t<CaretDown className=\"size-4\" weight=\"bold\" />\n\t</SelectPrimitive.ScrollDownButton>\n));\nSelectScrollDownButton.displayName = \"SelectScrollDownButton\";\n\ntype SelectContentProps = ComponentPropsWithoutRef<typeof SelectPrimitive.Content> & {\n\twidth?: \"trigger\" | \"content\";\n};\n\n/**\n * The component that pops out when the select is open as a portal adjacent to the trigger button.\n * It contains a scrolling viewport of the select items.\n */\nconst SelectContent = forwardRef<ElementRef<typeof SelectPrimitive.Content>, SelectContentProps>(\n\t({ className, children, position = \"popper\", width, ...props }, ref) => (\n\t\t<SelectPrimitive.Portal>\n\t\t\t<SelectPrimitive.Content\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border border-popover shadow-md data-side-bottom:slide-in-from-top-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-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95\",\n\t\t\t\t\t\"bg-popover\",\n\t\t\t\t\tposition === \"popper\" &&\n\t\t\t\t\t\t\"max-h-[var(--radix-select-content-available-height)] data-side-bottom:translate-y-2 data-side-left:-translate-x-2 data-side-right:translate-x-2 data-side-top:-translate-y-2\",\n\t\t\t\t\twidth === \"trigger\" && \"w-[var(--radix-select-trigger-width)]\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tposition={position}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t<SelectScrollUpButton />\n\t\t\t\t<SelectPrimitive.Viewport\n\t\t\t\t\tclassName={cx(\"p-1\", position === \"popper\" && \"h-[var(--radix-select-trigger-height)] w-full\")}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</SelectPrimitive.Viewport>\n\t\t\t\t<SelectScrollDownButton />\n\t\t\t</SelectPrimitive.Content>\n\t\t</SelectPrimitive.Portal>\n\t),\n);\nSelectContent.displayName = \"SelectContent\";\n\n/**\n * Used to render the label of a group. It won't be focusable using arrow keys.\n */\nconst SelectLabel = forwardRef<\n\tElementRef<typeof SelectPrimitive.Label>,\n\tComponentPropsWithoutRef<typeof SelectPrimitive.Label>\n>(({ className, ...props }, ref) => (\n\t<SelectPrimitive.Label ref={ref} className={cx(\"px-2 py-1.5 text-sm font-semibold\", className)} {...props} />\n));\nSelectLabel.displayName = \"SelectLabel\";\n\n/**\n * An option within a select menu. Similar to an html `<option>` element.\n * Contains a `value` prop that will be passed to the `onChange` handler of the `Select` component when selected.\n * Displays the children as the option's text.\n */\nconst SelectItem = forwardRef<\n\tElementRef<typeof SelectPrimitive.Item>,\n\tComponentPropsWithoutRef<typeof SelectPrimitive.Item>\n>(({ className, children, ...props }, ref) => (\n\t<SelectPrimitive.Item\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"relative flex w-full cursor-pointer select-none items-center rounded py-1.5 pl-2 pr-8 text-sm outline-none focus:bg-popover-hover data-state-checked:bg-filled-accent data-state-checked:text-on-filled data-disabled:pointer-events-none data-disabled:opacity-50\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t<SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n\t\t<SelectPrimitive.ItemIndicator className=\"absolute right-2 flex h-3.5 w-3.5 items-center justify-center\">\n\t\t\t<Check className=\"size-4\" weight=\"bold\" />\n\t\t</SelectPrimitive.ItemIndicator>\n\t</SelectPrimitive.Item>\n));\nSelectItem.displayName = \"SelectItem\";\n\n/**\n * Used to visually separate items in the select.\n */\nconst SelectSeparator = forwardRef<ElementRef<typeof Separator>, ComponentPropsWithoutRef<typeof Separator>>(\n\t({ className, ...props }, ref) => (\n\t\t<Separator ref={ref} className={cx(\"-mx-1 my-1 h-px w-auto\", className)} {...props} />\n\t),\n);\nSelectSeparator.displayName = \"SelectSeparator\";\n\nexport {\n\tSelect,\n\tSelectGroup,\n\tSelectValue,\n\tSelectTrigger,\n\tSelectContent,\n\tSelectLabel,\n\tSelectItem,\n\tSelectSeparator,\n\tSelectScrollUpButton,\n\tSelectScrollDownButton,\n};\n"],"mappings":"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","names":["CaretDown","CaretUp","Check","SelectPrimitive","createContext","forwardRef","useContext","jsx","jsxs","SelectContext","createContext","Select","_ariaInvalid","children","invalid","onChange","props","SelectGroup","SelectValue","SelectTrigger","forwardRef","className","ref","ctxAriaInvalid","ctxInvalid","useContext","ariaInvalid","cx","CaretDown","SelectScrollUpButton","CaretUp","SelectScrollDownButton","SelectContent","position","width","SelectLabel","SelectItem","Check","SelectSeparator","Separator"]}
|
package/dist/sheet.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{
|
|
1
|
+
import{b as n}from"./chunk-WFVD5X7N.js";import"./chunk-VT3Y7SNW.js";import{a}from"./chunk-A5H52ODC.js";import{X as v}from"@phosphor-icons/react/X";import*as e from"@radix-ui/react-dialog";import{cva as P}from"class-variance-authority";import{forwardRef as s}from"react";import{jsx as o,jsxs as m}from"react/jsx-runtime";var y=e.Root,b=e.Trigger,u=e.Close,d=e.Portal,l=s(({className:t,...i},r)=>o(e.Overlay,{className:a("fixed inset-0 z-50 bg-overlay backdrop-blur-sm data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:animate-in data-state-open:fade-in-0",t),...i,ref:r}));l.displayName=e.Overlay.displayName;var g=P("fixed z-50 flex flex-col bg-dialog shadow-lg transition ease-in-out data-state-closed:duration-100 data-state-closed:animate-out data-state-open:duration-100 data-state-open:animate-in",{variants:{side:{top:"inset-x-0 top-0 border-b border-dialog data-state-closed:slide-out-to-top data-state-open:slide-in-from-top",bottom:"inset-x-0 bottom-0 border-t border-dialog data-state-closed:slide-out-to-bottom data-state-open:slide-in-from-bottom",left:"inset-y-0 left-0 h-full w-full border-r border-dialog data-state-closed:slide-out-to-left data-state-open:slide-in-from-left sm:max-w-sm",right:"inset-y-0 right-0 h-full w-full border-l border-dialog data-state-closed:slide-out-to-right data-state-open:slide-in-from-right sm:max-w-sm"}},defaultVariants:{side:"right"}}),p=s(({side:t="right",className:i,children:r,...S},c)=>m(d,{children:[o(l,{}),m(e.Content,{ref:c,className:a(g({side:t}),i),...S,children:[r,o(e.Close,{asChild:!0,children:o(n,{label:"Close",icon:o(v,{}),type:"button",appearance:"outlined",className:"absolute right-4 top-4 size-11 sm:size-9"})})]})]}));p.displayName=e.Content.displayName;var C=({className:t,...i})=>o("div",{className:a("scrollbar flex-1 overflow-y-auto p-6 text-body",t),...i}),x=({className:t,...i})=>o("div",{className:a("shrink-0 border-b border-dialog-muted px-6 py-4",t),...i}),N=({className:t,...i})=>o("div",{className:a("flex shrink-0 flex-row-reverse gap-2 border-t border-dialog-muted px-6 py-2.5",t),...i}),h=s(({className:t,...i},r)=>o(e.Title,{ref:r,className:a("text-lg font-medium text-strong",t),...i}));h.displayName=e.Title.displayName;var f=s(({className:t,...i},r)=>o(e.Description,{ref:r,className:a("text-body",t),...i}));f.displayName=e.Description.displayName;export{y as Sheet,C as SheetBody,u as SheetClose,p as SheetContent,f as SheetDescription,N as SheetFooter,x as SheetHeader,l as SheetOverlay,d as SheetPortal,h as SheetTitle,b as SheetTrigger};
|
|
2
2
|
//# sourceMappingURL=sheet.js.map
|
package/dist/sheet.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../packages/sheet/src/sheet.tsx"],"sourcesContent":["import { X } from \"@phosphor-icons/react/X\";\nimport * as SheetPrimitive from \"@radix-ui/react-dialog\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { ComponentPropsWithoutRef, ElementRef, forwardRef, HTMLAttributes } from \"react\";\nimport {
|
|
1
|
+
{"version":3,"sources":["../packages/sheet/src/sheet.tsx"],"sourcesContent":["import { X } from \"@phosphor-icons/react/X\";\nimport * as SheetPrimitive from \"@radix-ui/react-dialog\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { ComponentPropsWithoutRef, ElementRef, forwardRef, HTMLAttributes } from \"react\";\nimport { IconButton } from \"../../button\";\nimport { cx } from \"../../cx\";\n\nconst Sheet = SheetPrimitive.Root;\n\nconst SheetTrigger = SheetPrimitive.Trigger;\n\nconst SheetClose = SheetPrimitive.Close;\n\nconst SheetPortal = SheetPrimitive.Portal;\n\nconst SheetOverlay = forwardRef<\n\tElementRef<typeof SheetPrimitive.Overlay>,\n\tComponentPropsWithoutRef<typeof SheetPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n\t<SheetPrimitive.Overlay\n\t\tclassName={cx(\n\t\t\t\"fixed inset-0 z-50 bg-overlay backdrop-blur-sm data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:animate-in data-state-open:fade-in-0\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t\tref={ref}\n\t/>\n));\nSheetOverlay.displayName = SheetPrimitive.Overlay.displayName;\n\nconst SheetVariants = cva(\n\t\"fixed z-50 flex flex-col bg-dialog shadow-lg transition ease-in-out data-state-closed:duration-100 data-state-closed:animate-out data-state-open:duration-100 data-state-open:animate-in\",\n\t{\n\t\tvariants: {\n\t\t\tside: {\n\t\t\t\ttop: \"inset-x-0 top-0 border-b border-dialog data-state-closed:slide-out-to-top data-state-open:slide-in-from-top\",\n\t\t\t\tbottom:\n\t\t\t\t\t\"inset-x-0 bottom-0 border-t border-dialog data-state-closed:slide-out-to-bottom data-state-open:slide-in-from-bottom\",\n\t\t\t\tleft: \"inset-y-0 left-0 h-full w-full border-r border-dialog data-state-closed:slide-out-to-left data-state-open:slide-in-from-left sm:max-w-sm\",\n\t\t\t\tright:\n\t\t\t\t\t\"inset-y-0 right-0 h-full w-full border-l border-dialog data-state-closed:slide-out-to-right data-state-open:slide-in-from-right sm:max-w-sm\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tside: \"right\",\n\t\t},\n\t},\n);\n\ntype SheetContentProps = {} & ComponentPropsWithoutRef<typeof SheetPrimitive.Content> &\n\tVariantProps<typeof SheetVariants>;\n\nconst SheetContent = forwardRef<ElementRef<typeof SheetPrimitive.Content>, SheetContentProps>(\n\t({ side = \"right\", className, children, ...props }, ref) => (\n\t\t<SheetPortal>\n\t\t\t<SheetOverlay />\n\t\t\t<SheetPrimitive.Content ref={ref} className={cx(SheetVariants({ side }), className)} {...props}>\n\t\t\t\t{children}\n\t\t\t\t<SheetPrimitive.Close asChild>\n\t\t\t\t\t<IconButton\n\t\t\t\t\t\tlabel=\"Close\"\n\t\t\t\t\t\ticon={<X />}\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tappearance=\"outlined\"\n\t\t\t\t\t\tclassName=\"absolute right-4 top-4 size-11 sm:size-9\"\n\t\t\t\t\t/>\n\t\t\t\t</SheetPrimitive.Close>\n\t\t\t</SheetPrimitive.Content>\n\t\t</SheetPortal>\n\t),\n);\nSheetContent.displayName = SheetPrimitive.Content.displayName;\n\nconst SheetBody = ({ className, ...props }: HTMLAttributes<HTMLDivElement>) => (\n\t<div className={cx(\"scrollbar flex-1 overflow-y-auto p-6 text-body\", className)} {...props} />\n);\n\nconst SheetHeader = ({ className, ...props }: HTMLAttributes<HTMLDivElement>) => (\n\t<div className={cx(\"shrink-0 border-b border-dialog-muted px-6 py-4\", className)} {...props} />\n);\n\nconst SheetFooter = ({ className, ...props }: HTMLAttributes<HTMLDivElement>) => (\n\t<div\n\t\tclassName={cx(\"flex shrink-0 flex-row-reverse gap-2 border-t border-dialog-muted px-6 py-2.5\", className)}\n\t\t{...props}\n\t/>\n);\n\nconst SheetTitle = forwardRef<\n\tElementRef<typeof SheetPrimitive.Title>,\n\tComponentPropsWithoutRef<typeof SheetPrimitive.Title>\n>(({ className, ...props }, ref) => (\n\t<SheetPrimitive.Title ref={ref} className={cx(\"text-lg font-medium text-strong\", className)} {...props} />\n));\nSheetTitle.displayName = SheetPrimitive.Title.displayName;\n\nconst SheetDescription = forwardRef<\n\tElementRef<typeof SheetPrimitive.Description>,\n\tComponentPropsWithoutRef<typeof SheetPrimitive.Description>\n>(({ className, ...props }, ref) => (\n\t<SheetPrimitive.Description ref={ref} className={cx(\"text-body\", className)} {...props} />\n));\nSheetDescription.displayName = SheetPrimitive.Description.displayName;\n\nexport {\n\tSheet,\n\tSheetBody,\n\tSheetClose,\n\tSheetContent,\n\tSheetDescription,\n\tSheetFooter,\n\tSheetHeader,\n\tSheetOverlay,\n\tSheetPortal,\n\tSheetTitle,\n\tSheetTrigger,\n};\n"],"mappings":"uGAAA,OAAS,KAAAA,MAAS,0BAClB,UAAYC,MAAoB,yBAChC,OAAS,OAAAC,MAA8B,2BACvC,OAA+C,cAAAC,MAAkC,QAgBhF,cAAAC,EAqCE,QAAAC,MArCF,oBAZD,IAAMC,EAAuB,OAEvBC,EAA8B,UAE9BC,EAA4B,QAE5BC,EAA6B,SAE7BC,EAAeC,EAGnB,CAAC,CAAE,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IAC3BV,EAAgB,UAAf,CACA,UAAWW,EACV,iKACAH,CACD,EACC,GAAGC,EACJ,IAAKC,EACN,CACA,EACDJ,EAAa,YAA6B,UAAQ,YAElD,IAAMM,EAAgBC,EACrB,2LACA,CACC,SAAU,CACT,KAAM,CACL,IAAK,8GACL,OACC,uHACD,KAAM,2IACN,MACC,6IACF,CACD,EACA,gBAAiB,CAChB,KAAM,OACP,CACD,CACD,EAKMC,EAAeP,EACpB,CAAC,CAAE,KAAAQ,EAAO,QAAS,UAAAP,EAAW,SAAAQ,EAAU,GAAGP,CAAM,EAAGC,IACnDT,EAACI,EAAA,CACA,UAAAL,EAACM,EAAA,EAAa,EACdL,EAAgB,UAAf,CAAuB,IAAKS,EAAK,UAAWC,EAAGC,EAAc,CAAE,KAAAG,CAAK,CAAC,EAAGP,CAAS,EAAI,GAAGC,EACvF,UAAAO,EACDhB,EAAgB,QAAf,CAAqB,QAAO,GAC5B,SAAAA,EAACiB,EAAA,CACA,MAAM,QACN,KAAMjB,EAACkB,EAAA,EAAE,EACT,KAAK,SACL,WAAW,WACX,UAAU,2CACX,EACD,GACD,GACD,CAEF,EACAJ,EAAa,YAA6B,UAAQ,YAElD,IAAMK,EAAY,CAAC,CAAE,UAAAX,EAAW,GAAGC,CAAM,IACxCT,EAAC,OAAI,UAAWW,EAAG,iDAAkDH,CAAS,EAAI,GAAGC,EAAO,EAGvFW,EAAc,CAAC,CAAE,UAAAZ,EAAW,GAAGC,CAAM,IAC1CT,EAAC,OAAI,UAAWW,EAAG,kDAAmDH,CAAS,EAAI,GAAGC,EAAO,EAGxFY,EAAc,CAAC,CAAE,UAAAb,EAAW,GAAGC,CAAM,IAC1CT,EAAC,OACA,UAAWW,EAAG,gFAAiFH,CAAS,EACvG,GAAGC,EACL,EAGKa,EAAaf,EAGjB,CAAC,CAAE,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IAC3BV,EAAgB,QAAf,CAAqB,IAAKU,EAAK,UAAWC,EAAG,kCAAmCH,CAAS,EAAI,GAAGC,EAAO,CACxG,EACDa,EAAW,YAA6B,QAAM,YAE9C,IAAMC,EAAmBhB,EAGvB,CAAC,CAAE,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IAC3BV,EAAgB,cAAf,CAA2B,IAAKU,EAAK,UAAWC,EAAG,YAAaH,CAAS,EAAI,GAAGC,EAAO,CACxF,EACDc,EAAiB,YAA6B,cAAY","names":["X","SheetPrimitive","cva","forwardRef","jsx","jsxs","Sheet","SheetTrigger","SheetClose","SheetPortal","SheetOverlay","forwardRef","className","props","ref","cx","SheetVariants","cva","SheetContent","side","children","IconButton","X","SheetBody","SheetHeader","SheetFooter","SheetTitle","SheetDescription"]}
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* (Not a Boolean attribute!) The autocomplete attribute takes as its value a space-separated string that describes what,
|
|
3
|
+
* if any, type of autocomplete functionality the input should provide. A typical implementation of autocomplete recalls
|
|
4
|
+
* previous values entered in the same input field, but more complex forms of autocomplete can exist. For instance, a
|
|
5
|
+
* browser could integrate with a device's contacts list to autocomplete email addresses in an email input field.
|
|
6
|
+
*
|
|
7
|
+
* The autocomplete attribute is valid on hidden, text, search, url, tel, email, date, month, week, time, datetime-local,
|
|
8
|
+
* number, range, color, and password. This attribute has no effect on input types that do not return numeric or text
|
|
9
|
+
* data, being valid for all input types except checkbox, radio, file, or any of the button types.
|
|
10
|
+
*
|
|
11
|
+
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete#values
|
|
12
|
+
*/
|
|
13
|
+
type AutoComplete = "off" | "on" | "name" | "honorific-prefix" | "given-name" | "additional-name" | "family-name" | "honorific-suffix" | "nickname" | "email" | "username" | "new-password" | "current-password" | "one-time-code" | "organization-title" | "organization" | "street-address" | "address-line1" | "address-line2" | "address-line3" | "address-level4" | "address-level3" | "address-level2" | "address-level1" | "country" | "country-name" | "postal-code" | "cc-name" | "cc-given-name" | "cc-additional-name" | "cc-family-name" | "cc-number" | "cc-exp" | "cc-exp-month" | "cc-exp-year" | "cc-csc" | "cc-type" | "transaction-currency" | "transaction-amount" | "language" | "bday" | "bday-day" | "bday-month" | "bday-year" | "sex" | "tel" | "tel-country-code" | "tel-national" | "tel-area-code" | "tel-local" | "tel-extension" | "impp" | "url" | "photo";
|
|
14
|
+
type WithAutoComplete = {
|
|
15
|
+
/**
|
|
16
|
+
* (Not a Boolean attribute!) The autocomplete attribute takes as its value a space-separated string that describes what,
|
|
17
|
+
* if any, type of autocomplete functionality the input should provide. A typical implementation of autocomplete recalls
|
|
18
|
+
* previous values entered in the same input field, but more complex forms of autocomplete can exist. For instance, a
|
|
19
|
+
* browser could integrate with a device's contacts list to autocomplete email addresses in an email input field.
|
|
20
|
+
*
|
|
21
|
+
* The autocomplete attribute is valid on hidden, text, search, url, tel, email, date, month, week, time, datetime-local,
|
|
22
|
+
* number, range, color, and password. This attribute has no effect on input types that do not return numeric or text
|
|
23
|
+
* data, being valid for all input types except checkbox, radio, file, or any of the button types.
|
|
24
|
+
*
|
|
25
|
+
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete#values
|
|
26
|
+
*/
|
|
27
|
+
autoComplete?: AutoComplete;
|
|
28
|
+
};
|
|
29
|
+
/**
|
|
30
|
+
* A string specifying the type of control to render. For example, to create a checkbox, a value of `"checkbox"` is used.
|
|
31
|
+
* If omitted (or an unknown value is specified), the input type `"text"` is used, creating a plaintext input field.
|
|
32
|
+
*
|
|
33
|
+
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#input_types
|
|
34
|
+
*/
|
|
35
|
+
type InputType = "button" | "checkbox" | "color" | "date" | "datetime-local" | "email" | "file" | "hidden" | "image" | "month" | "number" | "password" | "radio" | "range" | "reset" | "search" | "submit" | "tel" | "text" | "time" | "url" | "week";
|
|
36
|
+
type WithInputType = {
|
|
37
|
+
/**
|
|
38
|
+
* A string specifying the type of control to render. For example, to create a checkbox, a value of `"checkbox"` is used.
|
|
39
|
+
* If omitted (or an unknown value is specified), the input type `"text"` is used, creating a plaintext input field.
|
|
40
|
+
*
|
|
41
|
+
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#input_types
|
|
42
|
+
*/
|
|
43
|
+
type?: InputType;
|
|
44
|
+
};
|
|
45
|
+
type WithInvalid = {
|
|
46
|
+
/**
|
|
47
|
+
* Whether or not the input has a validation error.
|
|
48
|
+
*/
|
|
49
|
+
invalid?: boolean;
|
|
50
|
+
};
|
|
51
|
+
|
|
52
|
+
export type { AutoComplete as A, InputType as I, WithInvalid as W, WithAutoComplete as a, WithInputType as b };
|
package/package.json
CHANGED
package/dist/chunk-LFUD45DV.js
DELETED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{a as p}from"./chunk-VT3Y7SNW.js";import{a as f}from"./chunk-A5H52ODC.js";import{CircleNotch as E}from"@phosphor-icons/react/CircleNotch";import{Slot as M}from"@radix-ui/react-slot";import{cva as H}from"class-variance-authority";import C from"clsx";import{Children as T,cloneElement as k,forwardRef as w,isValidElement as z}from"react";import A from"tiny-invariant";import{jsx as s,jsxs as R}from"react/jsx-runtime";var W=H("items-center justify-center gap-1.5 whitespace-nowrap rounded-md focus-within:outline-none focus-visible:ring-4 disabled:pointer-events-none disabled:opacity-50 aria-disabled:opacity-50 sm:text-sm [&>*]:focus-within:outline-none",{variants:{appearance:{filled:"inline-flex h-11 border border-transparent bg-filled-accent px-3 font-medium text-on-filled hover:bg-filled-accent-hover focus-visible:border-accent-600 focus-visible:ring-focus-accent active:bg-filled-accent-active sm:h-9",ghost:"inline-flex h-11 border border-transparent px-3 font-medium text-accent-600 hover:bg-accent-500/10 hover:text-accent-700 focus-visible:ring-focus-accent active:bg-accent-500/15 active:text-accent-700 sm:h-9",outlined:"inline-flex h-11 border border-accent-600 bg-form px-3 font-medium text-accent-600 hover:border-accent-700 hover:bg-accent-500/10 hover:text-accent-700 focus-visible:ring-focus-accent active:border-accent-700 active:bg-accent-500/15 active:text-accent-700 sm:h-9",link:"group inline cursor-pointer border-transparent text-accent-600 hover:underline focus-visible:ring-focus-accent"},iconPlacement:{end:"pe-2.5",start:"ps-2.5"},isLoading:{false:"",true:"opacity-50"},priority:{danger:"",default:"",neutral:""}},defaultVariants:{appearance:"outlined",isLoading:!1,priority:"default"},compoundVariants:[{appearance:"ghost",priority:"danger",class:"border-transparent text-danger-600 hover:bg-danger-500/10 hover:text-danger-700 focus-visible:ring-focus-danger active:bg-danger-500/15 active:text-danger-700"},{appearance:"outlined",priority:"danger",class:"border-danger-600 bg-form text-danger-600 hover:border-danger-700 hover:bg-danger-500/10 hover:text-danger-700 focus-visible:ring-focus-danger active:border-danger-700 active:bg-danger-500/15 active:text-danger-700"},{appearance:"filled",priority:"danger",class:"border-transparent bg-filled-danger hover:bg-filled-danger-hover focus-visible:border-danger-600 focus-visible:ring-focus-danger active:bg-filled-danger-active"},{appearance:"link",priority:"danger",class:"text-danger-600 focus-visible:ring-focus-danger"},{appearance:"ghost",priority:"neutral",class:"border-transparent text-strong hover:bg-neutral-500/10 hover:text-strong focus-visible:ring-focus-accent active:bg-neutral-500/15 active:text-strong"},{appearance:"outlined",priority:"neutral",class:"border-form bg-form text-strong hover:border-neutral-400 hover:bg-form-hover hover:text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent active:border-neutral-400 active:bg-neutral-500/10 active:text-strong focus-visible:active:border-accent-600"},{appearance:"filled",priority:"neutral",class:"border-transparent bg-filled-neutral hover:bg-filled-neutral-hover focus-visible:border-neutral-600 focus-visible:ring-focus-neutral active:bg-filled-neutral-active"},{appearance:"link",priority:"neutral",class:"text-strong focus-visible:ring-focus-accent"}]}),V=w(({"aria-disabled":l,appearance:r="outlined",asChild:o=!1,children:a,className:b,icon:t,iconPlacement:i="start",isLoading:n=!1,onClickCapture:g,priority:m="default",...v},h)=>{let x=l??n,u=n?s(E,{className:"animate-spin"}):t,d=e=>{n&&(e.preventDefault(),e.stopPropagation()),g?.(e)},y={"aria-disabled":x,className:f(W({appearance:r,priority:m,isLoading:n,iconPlacement:u?i:void 0}),b),"data-loading":n,onClickCapture:d,ref:h,...v};if(o){let e=T.only(a);A(z(e),"When using `asChild`, Button must be passed a single child as a JSX tag.");let B=e.props?.children;return s(M,{...y,children:k(e,{},s(P,{appearance:r,icon:u,iconPlacement:i,children:B}))})}return s("button",{...y,children:s(P,{appearance:r,icon:u,iconPlacement:i,children:a})})});V.displayName="Button";var P=({appearance:l,children:r,icon:o,iconPlacement:a})=>R("span",{className:C("inline-flex items-center gap-1.5 focus-within:outline-none focus-visible:outline-none",l==="link"&&"group-hover:underline"),children:[o&&s(p,{svg:o,className:C(a==="end"&&"order-last")}),r]});import{CircleNotch as N}from"@phosphor-icons/react/CircleNotch";import{Slot as S}from"@radix-ui/react-slot";import{cva as D}from"class-variance-authority";import{Children as L,cloneElement as _,forwardRef as J,isValidElement as X}from"react";import{jsx as c,jsxs as q}from"react/jsx-runtime";var j=D("inline-flex items-center justify-center rounded-md border focus-within:outline-none focus-visible:ring-4 disabled:pointer-events-none disabled:opacity-50 aria-disabled:opacity-50",{variants:{appearance:{ghost:"border-transparent text-strong hover:bg-neutral-500/10 hover:text-strong focus-visible:ring-focus-accent active:bg-neutral-500/15 active:text-strong",outlined:"border-form bg-form text-strong hover:border-neutral-400 hover:bg-form-hover hover:text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent active:border-neutral-400 active:bg-neutral-500/10 active:text-strong focus-visible:active:border-accent-600"},isLoading:{false:"",true:"opacity-50"},size:{xs:"size-7 sm:size-6",sm:"size-9 sm:size-7",md:"size-11 sm:size-9"}},defaultVariants:{appearance:"outlined",size:"md"}}),I=J(({"aria-disabled":l,appearance:r,asChild:o=!1,children:a,className:b,isLoading:t=!1,icon:i,label:n,onClickCapture:g,size:m,...v},h)=>{let x=l??t,u=e=>{t&&(e.preventDefault(),e.stopPropagation()),g?.(e)},d={"aria-disabled":x,className:f(j({appearance:r,isLoading:t,size:m}),b),"data-loading":t,onClickCapture:u,ref:h,...v};if(o){let e=L.only(a),B=X(e);return c(S,{...d,children:B&&_(e,{},c(p,{svg:t?c(N,{className:"animate-spin"}):i}))})}return q("button",{...d,children:[c("span",{className:"sr-only",children:n}),c(p,{svg:t?c(N,{className:"animate-spin"}):i})]})});I.displayName="IconButton";export{V as a,I as b};
|
|
2
|
-
//# sourceMappingURL=chunk-LFUD45DV.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../packages/button/src/button.tsx","../packages/button/src/icon-button.tsx"],"sourcesContent":["import { CircleNotch } from \"@phosphor-icons/react/CircleNotch\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { cva } from \"class-variance-authority\";\nimport clsx from \"clsx\";\nimport { Children, cloneElement, forwardRef, isValidElement } from \"react\";\nimport type { ButtonHTMLAttributes, MouseEvent, PropsWithChildren, ReactNode } from \"react\";\nimport invariant from \"tiny-invariant\";\nimport { cx } from \"../../cx\";\nimport { Icon } from \"../../icon\";\nimport type { WithAsChild } from \"../../types/src/as-child\";\nimport type { VariantProps } from \"../../types/src/variant-props\";\n\nconst buttonVariants = cva(\n\t\"items-center justify-center gap-1.5 whitespace-nowrap rounded-md focus-within:outline-none focus-visible:ring-4 disabled:pointer-events-none disabled:opacity-50 aria-disabled:opacity-50 sm:text-sm [&>*]:focus-within:outline-none\",\n\t{\n\t\tvariants: {\n\t\t\t/**\n\t\t\t * Defines the visual style of the Button.\n\t\t\t */\n\t\t\tappearance: {\n\t\t\t\tfilled:\n\t\t\t\t\t\"inline-flex h-11 border border-transparent bg-filled-accent px-3 font-medium text-on-filled hover:bg-filled-accent-hover focus-visible:border-accent-600 focus-visible:ring-focus-accent active:bg-filled-accent-active sm:h-9\",\n\t\t\t\tghost:\n\t\t\t\t\t\"inline-flex h-11 border border-transparent px-3 font-medium text-accent-600 hover:bg-accent-500/10 hover:text-accent-700 focus-visible:ring-focus-accent active:bg-accent-500/15 active:text-accent-700 sm:h-9\",\n\t\t\t\toutlined:\n\t\t\t\t\t\"inline-flex h-11 border border-accent-600 bg-form px-3 font-medium text-accent-600 hover:border-accent-700 hover:bg-accent-500/10 hover:text-accent-700 focus-visible:ring-focus-accent active:border-accent-700 active:bg-accent-500/15 active:text-accent-700 sm:h-9\",\n\t\t\t\tlink: \"group inline cursor-pointer border-transparent text-accent-600 hover:underline focus-visible:ring-focus-accent\",\n\t\t\t},\n\t\t\t/**\n\t\t\t * The side that the icon will render on, if one is present. If `state=\"pending\"`,\n\t\t\t * then the loading icon will also render on this side.\n\t\t\t */\n\t\t\ticonPlacement: {\n\t\t\t\tend: \"pe-2.5\",\n\t\t\t\tstart: \"ps-2.5\",\n\t\t\t},\n\t\t\t/**\n\t\t\t * Whether or not the button is in a loading state, default `false`. Setting `isLoading` will\n\t\t\t * replace any `icon` with a spinner, or add one if an icon wasn't given.\n\t\t\t * It will also disable user interaction with the button and set `aria-disabled`.\n\t\t\t */\n\t\t\tisLoading: {\n\t\t\t\tfalse: \"\",\n\t\t\t\ttrue: \"opacity-50\",\n\t\t\t},\n\t\t\t/**\n\t\t\t * Indicates the importance or impact level of the button, affecting its\n\t\t\t * color and styling to communicate its purpose to the user\n\t\t\t */\n\t\t\tpriority: {\n\t\t\t\tdanger: \"\",\n\t\t\t\tdefault: \"\",\n\t\t\t\tneutral: \"\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tappearance: \"outlined\",\n\t\t\tisLoading: false,\n\t\t\tpriority: \"default\",\n\t\t},\n\t\tcompoundVariants: [\n\t\t\t{\n\t\t\t\tappearance: \"ghost\",\n\t\t\t\tpriority: \"danger\",\n\t\t\t\tclass:\n\t\t\t\t\t\"border-transparent text-danger-600 hover:bg-danger-500/10 hover:text-danger-700 focus-visible:ring-focus-danger active:bg-danger-500/15 active:text-danger-700\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"outlined\",\n\t\t\t\tpriority: \"danger\",\n\t\t\t\tclass:\n\t\t\t\t\t\"border-danger-600 bg-form text-danger-600 hover:border-danger-700 hover:bg-danger-500/10 hover:text-danger-700 focus-visible:ring-focus-danger active:border-danger-700 active:bg-danger-500/15 active:text-danger-700\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"filled\",\n\t\t\t\tpriority: \"danger\",\n\t\t\t\tclass:\n\t\t\t\t\t\"border-transparent bg-filled-danger hover:bg-filled-danger-hover focus-visible:border-danger-600 focus-visible:ring-focus-danger active:bg-filled-danger-active\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"link\",\n\t\t\t\tpriority: \"danger\",\n\t\t\t\tclass: \"text-danger-600 focus-visible:ring-focus-danger\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"ghost\",\n\t\t\t\tpriority: \"neutral\",\n\t\t\t\tclass:\n\t\t\t\t\t\"border-transparent text-strong hover:bg-neutral-500/10 hover:text-strong focus-visible:ring-focus-accent active:bg-neutral-500/15 active:text-strong\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"outlined\",\n\t\t\t\tpriority: \"neutral\",\n\t\t\t\tclass:\n\t\t\t\t\t\"border-form bg-form text-strong hover:border-neutral-400 hover:bg-form-hover hover:text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent active:border-neutral-400 active:bg-neutral-500/10 active:text-strong focus-visible:active:border-accent-600\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"filled\",\n\t\t\t\tpriority: \"neutral\",\n\t\t\t\tclass:\n\t\t\t\t\t\"border-transparent bg-filled-neutral hover:bg-filled-neutral-hover focus-visible:border-neutral-600 focus-visible:ring-focus-neutral active:bg-filled-neutral-active\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"link\",\n\t\t\t\tpriority: \"neutral\",\n\t\t\t\tclass: \"text-strong focus-visible:ring-focus-accent\",\n\t\t\t},\n\t\t],\n\t},\n);\n\ntype ButtonVariants = VariantProps<typeof buttonVariants>;\n\n/**\n * The props for the `Button` component.\n */\ntype ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> &\n\tWithAsChild &\n\tButtonVariants & {\n\t\t/**\n\t\t * An icon to render inside the button. If the `state` is `\"pending\"`, then\n\t\t * the icon will automatically be replaced with a spinner.\n\t\t */\n\t\ticon?: ReactNode;\n\t};\n\n/**\n * Renders a button or a component that looks like a button, an interactive\n * element activated by a user with a mouse, keyboard, finger, voice command, or\n * other assistive technology. Once activated, it then performs an action, such\n * as submitting a form or opening a dialog.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button\n */\nconst Button = forwardRef<HTMLButtonElement, ButtonProps>(\n\t(\n\t\t{\n\t\t\t\"aria-disabled\": _ariaDisabled,\n\t\t\tappearance = \"outlined\",\n\t\t\tasChild = false,\n\t\t\tchildren,\n\t\t\tclassName,\n\t\t\ticon: propIcon,\n\t\t\ticonPlacement = \"start\",\n\t\t\tisLoading = false,\n\t\t\tonClickCapture,\n\t\t\tpriority = \"default\",\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst ariaDisabled = _ariaDisabled ?? isLoading;\n\t\tconst icon = isLoading ? <CircleNotch className=\"animate-spin\" /> : propIcon;\n\n\t\tconst _onClickCapture = (event: MouseEvent<HTMLButtonElement>) => {\n\t\t\tif (isLoading) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tevent.stopPropagation();\n\t\t\t}\n\t\t\tonClickCapture?.(event);\n\t\t};\n\n\t\tconst buttonProps = {\n\t\t\t\"aria-disabled\": ariaDisabled,\n\t\t\tclassName: cx(\n\t\t\t\tbuttonVariants({ appearance, priority, isLoading, iconPlacement: icon ? iconPlacement : undefined }),\n\t\t\t\tclassName,\n\t\t\t),\n\t\t\t\"data-loading\": isLoading,\n\t\t\tonClickCapture: _onClickCapture,\n\t\t\tref,\n\t\t\t...props,\n\t\t};\n\n\t\tif (asChild) {\n\t\t\tconst singleChild = Children.only(children);\n\t\t\tinvariant(\n\t\t\t\tisValidElement<ButtonProps>(singleChild),\n\t\t\t\t\"When using `asChild`, Button must be passed a single child as a JSX tag.\",\n\t\t\t);\n\t\t\tconst grandchildren = singleChild.props?.children;\n\n\t\t\treturn (\n\t\t\t\t<Slot {...buttonProps}>\n\t\t\t\t\t{cloneElement(\n\t\t\t\t\t\tsingleChild,\n\t\t\t\t\t\t{},\n\t\t\t\t\t\t<InnerContent appearance={appearance} icon={icon} iconPlacement={iconPlacement}>\n\t\t\t\t\t\t\t{grandchildren}\n\t\t\t\t\t\t</InnerContent>,\n\t\t\t\t\t)}\n\t\t\t\t</Slot>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<button {...buttonProps}>\n\t\t\t\t<InnerContent appearance={appearance} icon={icon} iconPlacement={iconPlacement}>\n\t\t\t\t\t{children}\n\t\t\t\t</InnerContent>\n\t\t\t</button>\n\t\t);\n\t},\n);\nButton.displayName = \"Button\";\n\nexport { Button, buttonVariants };\nexport type { ButtonProps };\n\ntype InnerContentProps = PropsWithChildren & Pick<ButtonProps, \"appearance\" | \"icon\" | \"iconPlacement\">;\n\nconst InnerContent = ({ appearance, children, icon, iconPlacement }: InnerContentProps) => (\n\t<span\n\t\tclassName={clsx(\n\t\t\t\"inline-flex items-center gap-1.5 focus-within:outline-none focus-visible:outline-none\",\n\t\t\tappearance === \"link\" && \"group-hover:underline\",\n\t\t)}\n\t>\n\t\t{icon && <Icon svg={icon} className={clsx(iconPlacement === \"end\" && \"order-last\")} />}\n\t\t{children}\n\t</span>\n);\n","import { CircleNotch } from \"@phosphor-icons/react/CircleNotch\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { cva } from \"class-variance-authority\";\nimport { ButtonHTMLAttributes, Children, cloneElement, forwardRef, isValidElement, MouseEvent, ReactNode } from \"react\";\nimport { cx } from \"../../cx\";\nimport { Icon } from \"../../icon\";\nimport type { VariantProps, WithAsChild } from \"../../types\";\n\nconst iconButtonVariants = cva(\n\t\"inline-flex items-center justify-center rounded-md border focus-within:outline-none focus-visible:ring-4 disabled:pointer-events-none disabled:opacity-50 aria-disabled:opacity-50\",\n\t{\n\t\tvariants: {\n\t\t\t/**\n\t\t\t * Defines the visual style of the Button.\n\t\t\t */\n\t\t\tappearance: {\n\t\t\t\tghost:\n\t\t\t\t\t\"border-transparent text-strong hover:bg-neutral-500/10 hover:text-strong focus-visible:ring-focus-accent active:bg-neutral-500/15 active:text-strong\",\n\t\t\t\toutlined:\n\t\t\t\t\t\"border-form bg-form text-strong hover:border-neutral-400 hover:bg-form-hover hover:text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent active:border-neutral-400 active:bg-neutral-500/10 active:text-strong focus-visible:active:border-accent-600\",\n\t\t\t},\n\t\t\t/**\n\t\t\t * Whether or not the button is in a loading state, default `false`. Setting `isLoading` will\n\t\t\t * replace the `icon` with a spinner.\n\t\t\t * It will also disable user interaction with the button and set `aria-disabled`.\n\t\t\t */\n\t\t\tisLoading: {\n\t\t\t\tfalse: \"\",\n\t\t\t\ttrue: \"opacity-50\",\n\t\t\t},\n\t\t\t/**\n\t\t\t * The size of the IconButton.\n\t\t\t */\n\t\t\tsize: {\n\t\t\t\txs: \"size-7 sm:size-6\",\n\t\t\t\tsm: \"size-9 sm:size-7\",\n\t\t\t\tmd: \"size-11 sm:size-9\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tappearance: \"outlined\",\n\t\t\tsize: \"md\",\n\t\t},\n\t},\n);\n\ntype IconButtonVariants = VariantProps<typeof iconButtonVariants>;\n\n/**\n * The props for the `Button` component.\n */\ntype IconButtonProps = ButtonHTMLAttributes<HTMLButtonElement> &\n\tWithAsChild &\n\tIconButtonVariants & {\n\t\t/**\n\t\t * The accessible label for the icon. This label will be visually hidden but announced to screen reader users, similar to alt text for img tags.\n\t\t */\n\t\tlabel: string;\n\t\t/**\n\t\t * An icon to render inside the button. If the `state` is `\"pending\"`, then\n\t\t * the icon will automatically be replaced with a spinner.\n\t\t */\n\t\ticon: ReactNode;\n\t};\n\n/**\n * Renders a button or a component that looks like a button, an interactive\n * element activated by a user with a mouse, keyboard, finger, voice command, or\n * other assistive technology. Once activated, it then performs an action, such\n * as submitting a form or opening a dialog.\n * Renders only a single icon as children with an accessible, screen-reader-only label.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button\n */\nconst IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n\t(\n\t\t{\n\t\t\t\"aria-disabled\": _ariaDisabled,\n\t\t\tappearance,\n\t\t\tasChild = false,\n\t\t\tchildren,\n\t\t\tclassName,\n\t\t\tisLoading = false,\n\t\t\ticon: propIcon,\n\t\t\tlabel,\n\t\t\tonClickCapture,\n\t\t\tsize,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst ariaDisabled = _ariaDisabled ?? isLoading;\n\n\t\tconst _onClickCapture = (event: MouseEvent<HTMLButtonElement>) => {\n\t\t\tif (isLoading) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tevent.stopPropagation();\n\t\t\t}\n\t\t\tonClickCapture?.(event);\n\t\t};\n\n\t\tconst buttonProps = {\n\t\t\t\"aria-disabled\": ariaDisabled,\n\t\t\tclassName: cx(iconButtonVariants({ appearance, isLoading, size }), className),\n\t\t\t\"data-loading\": isLoading,\n\t\t\tonClickCapture: _onClickCapture,\n\t\t\tref,\n\t\t\t...props,\n\t\t};\n\n\t\tif (asChild) {\n\t\t\tconst singleChild = Children.only(children);\n\t\t\tconst isValidChild = isValidElement(singleChild);\n\t\t\tconst icon = isLoading ? <CircleNotch className=\"animate-spin\" /> : propIcon;\n\n\t\t\treturn <Slot {...buttonProps}>{isValidChild && cloneElement(singleChild, {}, <Icon svg={icon} />)}</Slot>;\n\t\t}\n\n\t\tconst icon = isLoading ? <CircleNotch className=\"animate-spin\" /> : propIcon;\n\n\t\treturn (\n\t\t\t<button {...buttonProps}>\n\t\t\t\t<span className=\"sr-only\">{label}</span>\n\t\t\t\t<Icon svg={icon} />\n\t\t\t</button>\n\t\t);\n\t},\n);\nIconButton.displayName = \"IconButton\";\n\nexport { IconButton };\nexport type { IconButtonProps };\n"],"mappings":"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","names":["CircleNotch","Slot","cva","clsx","Children","cloneElement","forwardRef","isValidElement","invariant","jsx","jsxs","buttonVariants","cva","Button","forwardRef","_ariaDisabled","appearance","asChild","children","className","propIcon","iconPlacement","isLoading","onClickCapture","priority","props","ref","ariaDisabled","icon","CircleNotch","_onClickCapture","event","buttonProps","cx","singleChild","Children","invariant","isValidElement","grandchildren","Slot","cloneElement","InnerContent","InnerContent","appearance","children","icon","iconPlacement","jsxs","clsx","jsx","Icon","CircleNotch","Slot","cva","Children","cloneElement","forwardRef","isValidElement","jsx","jsxs","iconButtonVariants","cva","IconButton","forwardRef","_ariaDisabled","appearance","asChild","children","className","isLoading","propIcon","label","onClickCapture","size","props","ref","ariaDisabled","_onClickCapture","event","buttonProps","cx","singleChild","Children","isValidChild","isValidElement","Slot","cloneElement","Icon","CircleNotch"]}
|