@a-type/ui 3.0.25 → 3.0.26
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/cjs/components/button/Button.js +3 -3
- package/dist/cjs/components/button/Button.js.map +1 -1
- package/dist/cjs/components/icon/Icon.d.ts +2 -1
- package/dist/cjs/components/icon/Icon.js +3 -2
- package/dist/cjs/components/icon/Icon.js.map +1 -1
- package/dist/css/main.css +1 -1
- package/dist/esm/components/button/Button.js +3 -3
- package/dist/esm/components/button/Button.js.map +1 -1
- package/dist/esm/components/icon/Icon.d.ts +2 -1
- package/dist/esm/components/icon/Icon.js +3 -2
- package/dist/esm/components/icon/Icon.js.map +1 -1
- package/package.json +1 -1
- package/src/components/button/Button.tsx +7 -4
- package/src/components/icon/Icon.tsx +4 -1
|
@@ -62,14 +62,14 @@ function ButtonRoot(_a) {
|
|
|
62
62
|
// avoid rendering loading spinner with asChild
|
|
63
63
|
return (0, jsx_runtime_1.jsx)(Comp, Object.assign({}, buttonProps, { children: children }));
|
|
64
64
|
}
|
|
65
|
-
return ((0, jsx_runtime_1.jsx)(IconLoadingContext_js_1.IconLoadingProvider, { value: isLoading, children: (0, jsx_runtime_1.jsxs)(Comp, Object.assign({}, buttonProps, { children: [(0, jsx_runtime_1.jsx)(react_1.AnimatePresence, { children: isLoading && ((0, jsx_runtime_1.jsx)(react_1.motion.div, { initial: { width: 0, marginLeft: '-0.5rem' }, animate: { width: 'auto', marginLeft: 0 }, exit: { width: 0, marginLeft: '-0.5rem' }, className: (0, clsx_1.clsx)('flex-shrink-0 inline-block overflow-hidden my-auto flex', '[[data-has-icon=true]
|
|
65
|
+
return ((0, jsx_runtime_1.jsx)(IconLoadingContext_js_1.IconLoadingProvider, { value: isLoading, children: (0, jsx_runtime_1.jsxs)(Comp, Object.assign({}, buttonProps, { children: [(0, jsx_runtime_1.jsx)(react_1.AnimatePresence, { children: isLoading && ((0, jsx_runtime_1.jsx)(react_1.motion.div, { initial: { width: 0, marginLeft: '-0.5rem' }, animate: { width: 'auto', marginLeft: 0 }, exit: { width: 0, marginLeft: '-0.5rem' }, className: (0, clsx_1.clsx)('flex-shrink-0 inline-block overflow-hidden my-auto flex', '[[data-has-icon=true]_&]:hidden'), "data-default-loader": true, children: (0, jsx_runtime_1.jsx)(index_js_2.Spinner, { size: 15, className: "inline-block w-1em h-1em" }) }, "spinner")) }), toggled !== undefined &&
|
|
66
66
|
(toggleMode === 'indicator' ||
|
|
67
|
-
toggleMode === 'color-and-indicator') && ((0, jsx_runtime_1.jsx)(exports.ButtonToggleIndicator, { value: toggled })), children, isDropdownTrigger && ((0, jsx_runtime_1.jsx)(DropdownMenu_js_1.DropdownMenuTriggerIcon, { asChild: true, children: (0, jsx_runtime_1.jsx)(index_js_1.Icon, { name: "chevron" }) }))] })) }));
|
|
67
|
+
toggleMode === 'color-and-indicator') && ((0, jsx_runtime_1.jsx)(exports.ButtonToggleIndicator, { value: toggled })), children, isDropdownTrigger && ((0, jsx_runtime_1.jsx)(IconLoadingContext_js_1.IconLoadingProvider, { value: false, children: (0, jsx_runtime_1.jsx)(DropdownMenu_js_1.DropdownMenuTriggerIcon, { asChild: true, children: (0, jsx_runtime_1.jsx)(index_js_1.Icon, { name: "chevron" }) }) }))] })) }));
|
|
68
68
|
}
|
|
69
69
|
exports.ButtonToggleIndicator = (0, react_2.memo)(function ToggleIndicator({ value, }) {
|
|
70
70
|
return ((0, jsx_runtime_1.jsx)(index_js_1.Icon, { "aria-hidden": true, name: "check", className: "transition-width w-0 ml--1", style: {
|
|
71
71
|
width: value ? '15px' : 0,
|
|
72
|
-
} }));
|
|
72
|
+
}, loading: false }));
|
|
73
73
|
});
|
|
74
74
|
// allows custom icons to trigger icon button behavior
|
|
75
75
|
exports.ButtonIcon = (0, hooks_js_1.withClassName)('div', 'icon flex-shrink-0 flex');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../../src/components/button/Button.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AA6CA,
|
|
1
|
+
{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../../src/components/button/Button.tsx"],"names":[],"mappings":"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"}
|
|
@@ -3,7 +3,8 @@ import { IconName } from './generated/iconNames.js';
|
|
|
3
3
|
export interface IconProps extends HTMLAttributes<SVGSVGElement> {
|
|
4
4
|
name: IconName;
|
|
5
5
|
size?: number;
|
|
6
|
+
loading?: boolean;
|
|
6
7
|
}
|
|
7
|
-
export declare const Icon: ({ ref, name, size, className, ...rest }: IconProps & {
|
|
8
|
+
export declare const Icon: ({ ref, name, size, className, loading: loadingProp, ...rest }: IconProps & {
|
|
8
9
|
ref?: React.Ref<SVGSVGElement>;
|
|
9
10
|
}) => import("react/jsx-runtime.js").JSX.Element;
|
|
@@ -21,8 +21,9 @@ const clsx_1 = __importDefault(require("clsx"));
|
|
|
21
21
|
const Spinner_js_1 = require("../spinner/Spinner.js");
|
|
22
22
|
const IconLoadingContext_js_1 = require("./IconLoadingContext.js");
|
|
23
23
|
const Icon = function Icon(_a) {
|
|
24
|
-
var { ref, name, size = 15, className } = _a, rest = __rest(_a, ["ref", "name", "size", "className"]);
|
|
25
|
-
const
|
|
24
|
+
var { ref, name, size = 15, className, loading: loadingProp } = _a, rest = __rest(_a, ["ref", "name", "size", "className", "loading"]);
|
|
25
|
+
const loadingContext = (0, IconLoadingContext_js_1.useIconLoading)();
|
|
26
|
+
const loading = loadingProp !== false && (loadingProp || loadingContext);
|
|
26
27
|
if (loading) {
|
|
27
28
|
return (0, jsx_runtime_1.jsx)(Spinner_js_1.Spinner, { size: size, className: "icon inline-block" });
|
|
28
29
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Icon.js","sourceRoot":"","sources":["../../../../src/components/icon/Icon.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA,gDAA8B;AAE9B,sDAAgD;AAEhD,mEAAyD;
|
|
1
|
+
{"version":3,"file":"Icon.js","sourceRoot":"","sources":["../../../../src/components/icon/Icon.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA,gDAA8B;AAE9B,sDAAgD;AAEhD,mEAAyD;AAQlD,MAAM,IAAI,GAAG,SAAS,IAAI,CAAC,EASjC;QATiC,EACjC,GAAG,EACH,IAAI,EACJ,IAAI,GAAG,EAAE,EACT,SAAS,EACT,OAAO,EAAE,WAAW,OAIpB,EAHG,IAAI,cAN0B,+CAOjC,CADO;IAIP,MAAM,cAAc,GAAG,IAAA,sCAAc,GAAE,CAAC;IACxC,MAAM,OAAO,GAAG,WAAW,KAAK,KAAK,IAAI,CAAC,WAAW,IAAI,cAAc,CAAC,CAAC;IAEzE,IAAI,OAAO,EAAE,CAAC;QACb,OAAO,uBAAC,oBAAO,IAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAC,mBAAmB,GAAG,CAAC;IAC9D,CAAC;IAED,OAAO,CACN,8CACC,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,cAAU,EACpB,MAAM,EACN,0CAA0C,EAC1C,SAAS,CACT,EACD,KAAK,EAAE,IAAI,EACX,MAAM,EAAE,IAAI,IACR,IAAI,cAER,gCAAK,SAAS,EAAE,SAAS,IAAI,EAAE,GAAI,IAC9B,CACN,CAAC;AACH,CAAC,CAAC;AAhCW,QAAA,IAAI,QAgCf"}
|
package/dist/css/main.css
CHANGED
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
@layer preflightBase { html { --mode-mult: 1; --mode-l-neutral: 90%; --mode-l-range-up: 10%; --mode-l-range-down: 70%; --mode-s-neutral: 75%; --mode-s-range-up: -55%; --mode-s-range-down: 20%; --mode-white: #ffffff; --mode-black: #000000; } @media (prefers-color-scheme: dark) { html { --mode-mult: -1; --mode-l-neutral: 60%; --mode-l-range-up: 38%; --mode-l-range-down: 70%; --mode-s-neutral: 80%; --mode-s-range-up: 40%; --mode-s-range-down: -30%; --mode-white: #000000; --mode-black: #ffffff; } } } @layer preflightVariants { .override-light { --mode-mult: 1; --mode-l-neutral: 90%; --mode-l-range-up: 10%; --mode-l-range-down: 70%; --mode-s-neutral: 75%; --mode-s-range-up: -55%; --mode-s-range-down: 20%; --mode-white: #ffffff; --mode-black: #000000; } .override-dark { --mode-mult: -1; --mode-l-neutral: 60%; --mode-l-range-up: 38%; --mode-l-range-down: 70%; --mode-s-neutral: 80%; --mode-s-range-up: 40%; --mode-s-range-down: -30%; --mode-white: #000000; --mode-black: #ffffff; } }
|
|
6
6
|
@layer preflightBase { :root { --global-saturation: 0.5; --global-corner-scale: 1; --global-spacing-scale: 1; --global-border-scale: 1; --global-shadow-spread: 1; --p-primary-hue: 90.8; --p-accent-hue: 165.88; } } @property --local-corner-scale { syntax: "*"; inherits: false; }
|
|
7
7
|
@font-face { font-family: "Inter"; src: url("undefined") format("truetype-variations"); font-weight: 1 999; font-style: oblique 0deg 5deg; font-display: block; }
|
|
8
|
-
.outline-off{outline:none;}.unset{all:unset;}.container{width:100%;}.hidden-input{pointer-events:none;position:absolute;z-index:-1;opacity:0;}.bottom-keyboard{bottom:var(--mock-virtual-keyboard-height,env(keyboard-inset-height,0px));}.center{left:50%;top:50%;--un-translate-x:-50%;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));--un-translate-y:-50%;}.center-x{left:50%;--un-translate-x:-50%;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.center-y{top:50%;--un-translate-y:-50%;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.hidden-input::webkit-file-upload-button{display:none;}.body{min-height:100vh;color:var(--v-color-altered,var(--v-color));--v-color:oklch(calc(clamp(0%, (var(--mode-l-neutral) - (var(--mode-l-range-down) * 1 * var(--mode-mult, 1) * var(--l-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--l-saturation, 1) * var(--global-saturation, 1) * (var(--mode-s-neutral) - (var(--mode-s-range-down) * 1 * var(--mode-mult, 1)))), 100%)) calc(var(--l-main-hue,var(--p-primary-hue,91.8))));--v-color-opacity:100%;background-color:var(--v-bg-altered,var(--v-bg));--v-bg:oklch(calc(clamp(0%, (var(--mode-l-neutral) + (var(--mode-l-range-up) * var(--mode-mult, 1) * var(--l-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--l-saturation, 1) * var(--global-saturation, 1) * (var(--mode-s-neutral) + (var(--mode-s-range-up) * var(--mode-mult, 1)))), 100%)) calc(var(--l-main-hue,var(--p-primary-hue,91.8))));--v-bg-opacity:100%;}.flex-0-0-auto{flex-shrink:0;flex-grow:0;flex-basis:auto;}.flex-1-0-0{flex-shrink:0;flex-grow:1;flex-basis:0;}.border{border-width:calc(1px * var(--global-border-scale,1));border-style:solid;}.border-default{border-width:calc(1px * var(--global-border-scale,1));border-style:solid;border-right-color:var(--v-border-r-color-altered, var(--v-border-r-color, var(--v-border-altered,var(--v-border))));border-bottom-color:var(--v-border-b-color-altered, var(--v-border-b-color, var(--v-border-altered,var(--v-border))));border-left-color:var(--v-border-l-color-altered, var(--v-border-l-color, var(--v-border-altered,var(--v-border))));border-top-color:var(--v-border-t-color-altered, var(--v-border-t-color, var(--v-border-altered,var(--v-border))));--v-border:oklch(calc(clamp(0%, (var(--mode-l-neutral) - (var(--mode-l-range-down) * 1 * var(--mode-mult, 1) * var(--l-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--l-saturation, 1) * var(--global-saturation, 1) * (var(--mode-s-neutral) - (var(--mode-s-range-down) * 1 * var(--mode-mult, 1)))), 100%)) calc(var(--l-main-hue,var(--p-primary-hue,91.8))));--v-border-opacity:100%;}.border-light{border-width:calc(1px * var(--global-border-scale,1));border-style:solid;border-right-color:var(--v-border-r-color-altered, var(--v-border-r-color, var(--v-border-altered,var(--v-border))));border-bottom-color:var(--v-border-b-color-altered, var(--v-border-b-color, var(--v-border-altered,var(--v-border))));border-left-color:var(--v-border-l-color-altered, var(--v-border-l-color, var(--v-border-altered,var(--v-border))));border-top-color:var(--v-border-t-color-altered, var(--v-border-t-color, var(--v-border-altered,var(--v-border))));--v-border:oklch(calc(var(--mode-l-neutral)) calc(clamp(0%, (0.15 * var(--l-saturation, 1) * var(--global-saturation, 1) * var(--mode-s-neutral)), 100%)) calc(var(--l-main-hue,var(--p-primary-hue,91.8))));--v-border-opacity:100%;--v-border-altered:oklch(from var(--v-border,currentColor) calc(l * (1 + 3 / 30 * -1 * var(--mode-mult, 1))) calc(c * (1 - (3 * 0.1 * -1 * (1 + (1 - var(--global-saturation, 0)))))) h);}@layer components{.layer-components\:\[\&\[data-focus\=true\]\]\:outline-off[data-focus=true]{outline:none;}.layer-components\:unset{all:unset;}.layer-components\:focus\:outline-off:focus{outline:none;}.layer-components\:focus-visible\:outline-off:focus-visible{outline:none;}.col{display:flex;flex-direction:column;align-items:center;gap:calc(0.5rem * var(--spacing-scale,1) * var(--global-spacing-scale,1));}.row{display:flex;flex-direction:row;align-items:center;gap:calc(0.5rem * var(--spacing-scale,1) * var(--global-spacing-scale,1));}.layer-components\:border{border-width:calc(1px * var(--global-border-scale,1));border-style:solid;}.layer-components\:\[\&\[data-state\=on\]\]\:border-default[data-state=on],.layer-components\:border-default{border-width:calc(1px * var(--global-border-scale,1));border-style:solid;border-right-color:var(--v-border-r-color-altered, var(--v-border-r-color, var(--v-border-altered,var(--v-border))));border-bottom-color:var(--v-border-b-color-altered, var(--v-border-b-color, var(--v-border-altered,var(--v-border))));border-left-color:var(--v-border-l-color-altered, var(--v-border-l-color, var(--v-border-altered,var(--v-border))));border-top-color:var(--v-border-t-color-altered, var(--v-border-t-color, var(--v-border-altered,var(--v-border))));--v-border:oklch(calc(clamp(0%, (var(--mode-l-neutral) - (var(--mode-l-range-down) * 1 * var(--mode-mult, 1) * var(--l-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--l-saturation, 1) * var(--global-saturation, 1) * (var(--mode-s-neutral) - (var(--mode-s-range-down) * 1 * var(--mode-mult, 1)))), 100%)) calc(var(--l-main-hue,var(--p-primary-hue,91.8))));--v-border-opacity:100%;}.layer-components\:border-light{border-width:calc(1px * var(--global-border-scale,1));border-style:solid;border-right-color:var(--v-border-r-color-altered, var(--v-border-r-color, var(--v-border-altered,var(--v-border))));border-bottom-color:var(--v-border-b-color-altered, var(--v-border-b-color, var(--v-border-altered,var(--v-border))));border-left-color:var(--v-border-l-color-altered, var(--v-border-l-color, var(--v-border-altered,var(--v-border))));border-top-color:var(--v-border-t-color-altered, var(--v-border-t-color, var(--v-border-altered,var(--v-border))));--v-border:oklch(calc(var(--mode-l-neutral)) calc(clamp(0%, (0.15 * var(--l-saturation, 1) * var(--global-saturation, 1) * var(--mode-s-neutral)), 100%)) calc(var(--l-main-hue,var(--p-primary-hue,91.8))));--v-border-opacity:100%;--v-border-altered:oklch(from var(--v-border,currentColor) calc(l * (1 + 3 / 30 * -1 * var(--mode-mult, 1))) calc(c * (1 - (3 * 0.1 * -1 * (1 + (1 - var(--global-saturation, 0)))))) h);}.layer-components\:\[\&\[data-state\=on\]\]\:hover\:border-default:hover[data-state=on]{border-width:calc(1px * var(--global-border-scale,1));border-style:solid;border-right-color:var(--v-border-r-color-altered, var(--v-border-r-color, var(--v-border-altered,var(--v-border))));border-bottom-color:var(--v-border-b-color-altered, var(--v-border-b-color, var(--v-border-altered,var(--v-border))));border-left-color:var(--v-border-l-color-altered, var(--v-border-l-color, var(--v-border-altered,var(--v-border))));border-top-color:var(--v-border-t-color-altered, var(--v-border-t-color, var(--v-border-altered,var(--v-border))));--v-border:oklch(calc(clamp(0%, (var(--mode-l-neutral) - (var(--mode-l-range-down) * 1 * var(--mode-mult, 1) * var(--l-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--l-saturation, 1) * var(--global-saturation, 1) * (var(--mode-s-neutral) - (var(--mode-s-range-down) * 1 * var(--mode-mult, 1)))), 100%)) calc(var(--l-main-hue,var(--p-primary-hue,91.8))));--v-border-opacity:100%;}.layer-components\:focus-visible\:border:focus-visible{border-width:calc(1px * var(--global-border-scale,1));border-style:solid;}}@layer composed{.layer-composed\:border{border-width:calc(1px * var(--global-border-scale,1));border-style:solid;}.layer-composed\:border-light{border-width:calc(1px * var(--global-border-scale,1));border-style:solid;border-right-color:var(--v-border-r-color-altered, var(--v-border-r-color, var(--v-border-altered,var(--v-border))));border-bottom-color:var(--v-border-b-color-altered, var(--v-border-b-color, var(--v-border-altered,var(--v-border))));border-left-color:var(--v-border-l-color-altered, var(--v-border-l-color, var(--v-border-altered,var(--v-border))));border-top-color:var(--v-border-t-color-altered, var(--v-border-t-color, var(--v-border-altered,var(--v-border))));--v-border:oklch(calc(var(--mode-l-neutral)) calc(clamp(0%, (0.15 * var(--l-saturation, 1) * var(--global-saturation, 1) * var(--mode-s-neutral)), 100%)) calc(var(--l-main-hue,var(--p-primary-hue,91.8))));--v-border-opacity:100%;--v-border-altered:oklch(from var(--v-border,currentColor) calc(l * (1 + 3 / 30 * -1 * var(--mode-mult, 1))) calc(c * (1 - (3 * 0.1 * -1 * (1 + (1 - var(--global-saturation, 0)))))) h);}}@media (min-width: 640px){.container{max-width:640px;}}@media (min-width: 768px){.container{max-width:768px;}}@media (min-width: 1024px){.container{max-width:1024px;}}@media (min-width: 1280px){.container{max-width:1280px;}}@media (min-width: 1536px){.container{max-width:1536px;}}.\!\[background-attachment\:local\,local\,scroll\,scroll\]{background-attachment:local,local,scroll,scroll !important;}.\!\[background-repeat\:no-repeat\]{background-repeat:no-repeat !important;}.\!\[background-size\:100\%_40px\,100\%_40px\,100\%_14px\,100\%_14px\]{background-size:100% 40px,100% 40px,100% 14px,100% 14px !important;}.\[--l-saturation\:0\]{--l-saturation:0;}.\[\&\[data-different-month\]\]\:\[visibility\:hidden\][data-different-month]{visibility:hidden;}.\[all\:unset\]{all:unset;}.\[background-size\:400\%_400\%\]{background-size:400% 400%;}.\[background\:linear-gradient\(var\(--v-bg\)_30\%\,rgba\(255\,255\,255\,0\)\)_center_top\,linear-gradient\(rgba\(255\,255\,255\,0\)\,var\(--v-bg\)_70\%\)_center_bottom\,radial-gradient\(farthest-side_at_50\%_0\,oklch\(from_var\(--v-bg\)_calc\(l\*0\.9\)_c_h\)\,rgba\(0\,0\,0\,0\)\)_center_top\,radial-gradient\(farthest-side_at_50\%_100\%\,oklch\(from_var\(--v-bg\)_calc\(l\*0\.9\)_c_h\)\,rgba\(0\,0\,0\,0\)\)_center_bottom\]{background:linear-gradient(var(--v-bg) 30%,rgba(255,255,255,0)) center top,linear-gradient(rgba(255,255,255,0),var(--v-bg) 70%) center bottom,radial-gradient(farthest-side at 50% 0,oklch(from var(--v-bg) calc(l*0.9) c h),rgba(0,0,0,0)) center top,radial-gradient(farthest-side at 50% 100%,oklch(from var(--v-bg) calc(l*0.9) c h),rgba(0,0,0,0)) center bottom;}.\[grid-area\:content\]{grid-area:content;}.\[grid-area\:leftGrid\]{grid-area:leftGrid;}.\[grid-area\:leftMonth\]{grid-area:leftMonth;}.\[grid-area\:nextMonth\]{grid-area:nextMonth;}.\[grid-area\:prevMonth\]{grid-area:prevMonth;}.\[grid-area\:rightGrid\]{grid-area:rightGrid;}.\[grid-area\:rightMonth\]{grid-area:rightMonth;}.\[grid-auto-rows\:var\(--day-size\,32px\)\]{grid-auto-rows:var(--day-size,32px);}.\[grid-template-areas\:\"prevMonth_leftMonth_nextMonth\"\"leftGrid_leftGrid_leftGrid\"\]{grid-template-areas:"prevMonth leftMonth nextMonth""leftGrid leftGrid leftGrid";}.\[grid-template-columns\:auto_1fr_auto\]{grid-template-columns:auto 1fr auto;}.\[grid-template-rows\:auto_1fr\]{grid-template-rows:auto 1fr;}.\[outline\:none\]{outline:none;}.\[stroke-dasharray\:80_200\]{stroke-dasharray:80 200;}.\[stroke-dashoffset\:0\]{stroke-dashoffset:0;}.contain-strict{contain:strict;}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0;}.pointer-events-none{pointer-events:none;}.after\:pointer-events-none::after{pointer-events:none;}.\!visible{visibility:visible !important;}.visible{visibility:visible;}.\[\&\[data-state\=active\]\]\:relative[data-state=active],.relative{position:relative;}.absolute{position:absolute;}.fixed{position:fixed;}.sticky{position:sticky;}.\[\&\[data-today\]\]\:before\:absolute[data-today]::before{position:absolute;}.before\:absolute::before{position:absolute;}.after\:absolute::after{position:absolute;}.static{position:static;}.inset-0{inset:0;}.after\:inset-0::after{inset:0;}.bottom-\[anchor\(bottom\)\]{bottom:anchor(bottom);}.bottom-\[var\(--mock-virtual-keyboard-height\,env\(keyboard-inset-height\,0px\)\)\]{bottom:var(--mock-virtual-keyboard-height,env(keyboard-inset-height,0px));}.bottom-0,.bottom-0px{bottom:0;}.bottom-2{bottom:0.5rem;}.bottom-3{bottom:0.75rem;}.left-\[anchor\(right\)\]{left:anchor(right);}.left-0{left:0;}.left-1\/2{left:50%;}.left-2{left:0.5rem;}.right-\[anchor\(right\)\]{right:anchor(right);}.right-0{right:0;}.right-1{right:0.25rem;}.right-2{right:0.5rem;}.top-\[anchor\(bottom\)\]{top:anchor(bottom);}.top-0{top:0;}.top-1\/2,.top-50\%{top:50%;}.top-1px{top:1px;}.top-2{top:0.5rem;}.top-auto{top:auto;}.\[\&\[data-today\]\]\:before\:left-\[1px\][data-today]::before{left:1px;}.\[\&\[data-today\]\]\:before\:top-\[1px\][data-today]::before{top:1px;}.before\:left-1\/2::before{left:50%;}.before\:top-1\/2::before{top:50%;}.after\:bottom-0::after{bottom:0;}.after\:right-0::after{right:0;}.after\:top-0::after{top:0;}.after\:top-auto::after{top:auto;}.\[\&\[data-highlighted\]\]\:z-1[data-highlighted],.\[\&\[data-in-range\]\]\:z-1[data-in-range],.\[\&\[data-range-end\]\]\:z-1[data-range-end],.\[\&\[data-range-start\]\]\:z-1[data-range-start],.\[\&\[data-state\=active\]\]\:z-1[data-state=active],.z-1{z-index:1;}.\[\&\[data-selected\]\]\:z-2[data-selected]{z-index:2;}.z--1{z-index:-1;}.z-\[100000\]{z-index:100000;}.z-\[calc\(var\(--z-dialog\)\+1\)\]{z-index:calc(var(--z-dialog) + 1);}.z-1000{z-index:1000;}.hover\:z-1:hover{z-index:1;}.after\:z-1::after{z-index:1;}.grid{display:grid;}.grid-col-span-2{grid-column:span 2/span 2;}.grid-cols-\[repeat\(7\,var\(--day-size\,32px\)\)\]{grid-template-columns:repeat(7,var(--day-size,32px));}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr));}.m-1{margin:0.25rem;}.m-2{margin:0.5rem;}.m-auto{margin:auto;}.m\[k\]{margin:k;}.my-4{margin-top:1rem;margin-bottom:1rem;}.my-auto{margin-top:auto;margin-bottom:auto;}.mb--1px{margin-bottom:-1px;}.mb-1{margin-bottom:0.25rem;}.me{margin-inline-end:1rem;}.ml--1{margin-left:-0.25rem;}.ml-auto{margin-left:auto;}.ml-md{margin-left:calc(1rem * var(--spacing-scale,1) * var(--global-spacing-scale,1));}.mr--1px{margin-right:-1px;}.mr-1{margin-right:0.25rem;}.mr-auto{margin-right:auto;}.mt-auto{margin-top:auto;}.block{display:block;}.inline-block{display:inline-block;}.\!hidden{display:none !important;}.\[\&\:\:webkit-file-upload-button\]\:hidden::webkit-file-upload-button,.hidden,[data-has-icon=true]>.\[\[data-has-icon\=true\]\>\&\]\:hidden{display:none;}.aspect-\[9\/16\]{aspect-ratio:9/16;}.\[\&\[data-state\=closed\]\]\:max-h-\[var\(--peek-height\,120px\)\][data-state=closed]{max-height:var(--peek-height,120px);}.h-\[100vh\]{height:100vh;}.h-\[12px\]{height:12px;}.h-\[var\(--mock-virtual-keyboard-height\,0\)\]{height:var(--mock-virtual-keyboard-height,0);}.h-10{height:2.5rem;}.h-100px{height:100px;}.h-16{height:4rem;}.h-16px{height:16px;}.h-1em{height:1em;}.h-1px{height:1px;}.h-200px{height:200px;}.h-25px{height:25px;}.h-32{height:8rem;}.h-4,.h4{height:1rem;}.h-600px{height:600px;}.h-64{height:16rem;}.h-80px{height:80px;}.h-full{height:100%;}.h1{height:0.25rem;}.h2{height:0.5rem;}.h3{height:0.75rem;}.h5{height:1.25rem;}.max-h-200px{max-height:200px;}.max-w-300px{max-width:300px;}.max-w-full{max-width:100%;}.min-h-0{min-height:0;}.min-h-18px{min-height:18px;}.min-h-20vh{min-height:20vh;}.min-h-32px{min-height:32px;}.min-h-screen{min-height:100vh;}.min-w-0{min-width:0;}.min-w-32px{min-width:32px;}.w-\[12px\]{width:12px;}.w-0{width:0;}.w-16{width:4rem;}.w-16px{width:16px;}.w-1em{width:1em;}.w-300px{width:300px;}.w-4{width:1rem;}.w-400px{width:400px;}.w-64{width:16rem;}.w-80px{width:80px;}.w-full{width:100%;}.w-max-content{width:max-content;}.\[\&\[data-today\]\]\:before\:h-\[6px\][data-today]::before{height:6px;}.\[\&\[data-today\]\]\:before\:w-\[6px\][data-today]::before{width:6px;}.before\:min-h-44px::before{min-height:44px;}.before\:min-w-44px::before{min-width:44px;}.before\:w-full::before{width:100%;}.after\:h-80px::after{height:80px;}.after\:w-50px::after{width:50px;}.\[\&\[data-state\=delayed-open\]\]\:flex[data-state=delayed-open],.\[\&\[data-state\=instant-open\]\]\:flex[data-state=instant-open],.flex{display:flex;}.after\:flex::after{display:flex;}.inline-flex{display:inline-flex;}.flex-1{flex:1 1 0%;}.flex-shrink-0,.shrink-0{flex-shrink:0;}.flex-grow-0{flex-grow:0;}.flex-grow-1,.grow{flex-grow:1;}.flex-basis-0{flex-basis:0;}.flex-basis-auto{flex-basis:auto;}.flex-row{flex-direction:row;}.flex-col{flex-direction:column;}.after\:flex-col::after{flex-direction:column;}.flex-wrap{flex-wrap:wrap;}.table{display:table;}.transform-origin-\[50\%_50\%\]{transform-origin:50% 50%;}.-translate-x-1\/2,.translate-x--1\/2{--un-translate-x:-50%;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.translate-y--1\/2,.translate-y-\[-50\%\]{--un-translate-y:-50%;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.before\:-translate-x-1\/2::before{--un-translate-x:-50%;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.before\:-translate-y-1\/2::before{--un-translate-y:-50%;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.rotate-180{--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-rotate:180deg;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.transform{transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.transform-gpu{transform:translate3d(var(--un-translate-x), var(--un-translate-y), var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}@keyframes peek-close{
|
|
8
|
+
.outline-off{outline:none;}.unset{all:unset;}.container{width:100%;}.hidden-input{pointer-events:none;position:absolute;z-index:-1;opacity:0;}.bottom-keyboard{bottom:var(--mock-virtual-keyboard-height,env(keyboard-inset-height,0px));}.center{left:50%;top:50%;--un-translate-x:-50%;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));--un-translate-y:-50%;}.center-x{left:50%;--un-translate-x:-50%;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.center-y{top:50%;--un-translate-y:-50%;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.hidden-input::webkit-file-upload-button{display:none;}.body{min-height:100vh;color:var(--v-color-altered,var(--v-color));--v-color:oklch(calc(clamp(0%, (var(--mode-l-neutral) - (var(--mode-l-range-down) * 1 * var(--mode-mult, 1) * var(--l-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--l-saturation, 1) * var(--global-saturation, 1) * (var(--mode-s-neutral) - (var(--mode-s-range-down) * 1 * var(--mode-mult, 1)))), 100%)) calc(var(--l-main-hue,var(--p-primary-hue,91.8))));--v-color-opacity:100%;background-color:var(--v-bg-altered,var(--v-bg));--v-bg:oklch(calc(clamp(0%, (var(--mode-l-neutral) + (var(--mode-l-range-up) * var(--mode-mult, 1) * var(--l-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--l-saturation, 1) * var(--global-saturation, 1) * (var(--mode-s-neutral) + (var(--mode-s-range-up) * var(--mode-mult, 1)))), 100%)) calc(var(--l-main-hue,var(--p-primary-hue,91.8))));--v-bg-opacity:100%;}.flex-0-0-auto{flex-shrink:0;flex-grow:0;flex-basis:auto;}.flex-1-0-0{flex-shrink:0;flex-grow:1;flex-basis:0;}.border{border-width:calc(1px * var(--global-border-scale,1));border-style:solid;}.border-default{border-width:calc(1px * var(--global-border-scale,1));border-style:solid;border-right-color:var(--v-border-r-color-altered, var(--v-border-r-color, var(--v-border-altered,var(--v-border))));border-bottom-color:var(--v-border-b-color-altered, var(--v-border-b-color, var(--v-border-altered,var(--v-border))));border-left-color:var(--v-border-l-color-altered, var(--v-border-l-color, var(--v-border-altered,var(--v-border))));border-top-color:var(--v-border-t-color-altered, var(--v-border-t-color, var(--v-border-altered,var(--v-border))));--v-border:oklch(calc(clamp(0%, (var(--mode-l-neutral) - (var(--mode-l-range-down) * 1 * var(--mode-mult, 1) * var(--l-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--l-saturation, 1) * var(--global-saturation, 1) * (var(--mode-s-neutral) - (var(--mode-s-range-down) * 1 * var(--mode-mult, 1)))), 100%)) calc(var(--l-main-hue,var(--p-primary-hue,91.8))));--v-border-opacity:100%;}.border-light{border-width:calc(1px * var(--global-border-scale,1));border-style:solid;border-right-color:var(--v-border-r-color-altered, var(--v-border-r-color, var(--v-border-altered,var(--v-border))));border-bottom-color:var(--v-border-b-color-altered, var(--v-border-b-color, var(--v-border-altered,var(--v-border))));border-left-color:var(--v-border-l-color-altered, var(--v-border-l-color, var(--v-border-altered,var(--v-border))));border-top-color:var(--v-border-t-color-altered, var(--v-border-t-color, var(--v-border-altered,var(--v-border))));--v-border:oklch(calc(var(--mode-l-neutral)) calc(clamp(0%, (0.15 * var(--l-saturation, 1) * var(--global-saturation, 1) * var(--mode-s-neutral)), 100%)) calc(var(--l-main-hue,var(--p-primary-hue,91.8))));--v-border-opacity:100%;--v-border-altered:oklch(from var(--v-border,currentColor) calc(l * (1 + 3 / 30 * -1 * var(--mode-mult, 1))) calc(c * (1 - (3 * 0.1 * -1 * (1 + (1 - var(--global-saturation, 0)))))) h);}@layer components{.layer-components\:\[\&\[data-focus\=true\]\]\:outline-off[data-focus=true]{outline:none;}.layer-components\:unset{all:unset;}.layer-components\:focus\:outline-off:focus{outline:none;}.layer-components\:focus-visible\:outline-off:focus-visible{outline:none;}.col{display:flex;flex-direction:column;align-items:center;gap:calc(0.5rem * var(--spacing-scale,1) * var(--global-spacing-scale,1));}.row{display:flex;flex-direction:row;align-items:center;gap:calc(0.5rem * var(--spacing-scale,1) * var(--global-spacing-scale,1));}.layer-components\:border{border-width:calc(1px * var(--global-border-scale,1));border-style:solid;}.layer-components\:\[\&\[data-state\=on\]\]\:border-default[data-state=on],.layer-components\:border-default{border-width:calc(1px * var(--global-border-scale,1));border-style:solid;border-right-color:var(--v-border-r-color-altered, var(--v-border-r-color, var(--v-border-altered,var(--v-border))));border-bottom-color:var(--v-border-b-color-altered, var(--v-border-b-color, var(--v-border-altered,var(--v-border))));border-left-color:var(--v-border-l-color-altered, var(--v-border-l-color, var(--v-border-altered,var(--v-border))));border-top-color:var(--v-border-t-color-altered, var(--v-border-t-color, var(--v-border-altered,var(--v-border))));--v-border:oklch(calc(clamp(0%, (var(--mode-l-neutral) - (var(--mode-l-range-down) * 1 * var(--mode-mult, 1) * var(--l-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--l-saturation, 1) * var(--global-saturation, 1) * (var(--mode-s-neutral) - (var(--mode-s-range-down) * 1 * var(--mode-mult, 1)))), 100%)) calc(var(--l-main-hue,var(--p-primary-hue,91.8))));--v-border-opacity:100%;}.layer-components\:border-light{border-width:calc(1px * var(--global-border-scale,1));border-style:solid;border-right-color:var(--v-border-r-color-altered, var(--v-border-r-color, var(--v-border-altered,var(--v-border))));border-bottom-color:var(--v-border-b-color-altered, var(--v-border-b-color, var(--v-border-altered,var(--v-border))));border-left-color:var(--v-border-l-color-altered, var(--v-border-l-color, var(--v-border-altered,var(--v-border))));border-top-color:var(--v-border-t-color-altered, var(--v-border-t-color, var(--v-border-altered,var(--v-border))));--v-border:oklch(calc(var(--mode-l-neutral)) calc(clamp(0%, (0.15 * var(--l-saturation, 1) * var(--global-saturation, 1) * var(--mode-s-neutral)), 100%)) calc(var(--l-main-hue,var(--p-primary-hue,91.8))));--v-border-opacity:100%;--v-border-altered:oklch(from var(--v-border,currentColor) calc(l * (1 + 3 / 30 * -1 * var(--mode-mult, 1))) calc(c * (1 - (3 * 0.1 * -1 * (1 + (1 - var(--global-saturation, 0)))))) h);}.layer-components\:\[\&\[data-state\=on\]\]\:hover\:border-default:hover[data-state=on]{border-width:calc(1px * var(--global-border-scale,1));border-style:solid;border-right-color:var(--v-border-r-color-altered, var(--v-border-r-color, var(--v-border-altered,var(--v-border))));border-bottom-color:var(--v-border-b-color-altered, var(--v-border-b-color, var(--v-border-altered,var(--v-border))));border-left-color:var(--v-border-l-color-altered, var(--v-border-l-color, var(--v-border-altered,var(--v-border))));border-top-color:var(--v-border-t-color-altered, var(--v-border-t-color, var(--v-border-altered,var(--v-border))));--v-border:oklch(calc(clamp(0%, (var(--mode-l-neutral) - (var(--mode-l-range-down) * 1 * var(--mode-mult, 1) * var(--l-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--l-saturation, 1) * var(--global-saturation, 1) * (var(--mode-s-neutral) - (var(--mode-s-range-down) * 1 * var(--mode-mult, 1)))), 100%)) calc(var(--l-main-hue,var(--p-primary-hue,91.8))));--v-border-opacity:100%;}.layer-components\:focus-visible\:border:focus-visible{border-width:calc(1px * var(--global-border-scale,1));border-style:solid;}}@layer composed{.layer-composed\:border{border-width:calc(1px * var(--global-border-scale,1));border-style:solid;}.layer-composed\:border-light{border-width:calc(1px * var(--global-border-scale,1));border-style:solid;border-right-color:var(--v-border-r-color-altered, var(--v-border-r-color, var(--v-border-altered,var(--v-border))));border-bottom-color:var(--v-border-b-color-altered, var(--v-border-b-color, var(--v-border-altered,var(--v-border))));border-left-color:var(--v-border-l-color-altered, var(--v-border-l-color, var(--v-border-altered,var(--v-border))));border-top-color:var(--v-border-t-color-altered, var(--v-border-t-color, var(--v-border-altered,var(--v-border))));--v-border:oklch(calc(var(--mode-l-neutral)) calc(clamp(0%, (0.15 * var(--l-saturation, 1) * var(--global-saturation, 1) * var(--mode-s-neutral)), 100%)) calc(var(--l-main-hue,var(--p-primary-hue,91.8))));--v-border-opacity:100%;--v-border-altered:oklch(from var(--v-border,currentColor) calc(l * (1 + 3 / 30 * -1 * var(--mode-mult, 1))) calc(c * (1 - (3 * 0.1 * -1 * (1 + (1 - var(--global-saturation, 0)))))) h);}}@media (min-width: 640px){.container{max-width:640px;}}@media (min-width: 768px){.container{max-width:768px;}}@media (min-width: 1024px){.container{max-width:1024px;}}@media (min-width: 1280px){.container{max-width:1280px;}}@media (min-width: 1536px){.container{max-width:1536px;}}.\!\[background-attachment\:local\,local\,scroll\,scroll\]{background-attachment:local,local,scroll,scroll !important;}.\!\[background-repeat\:no-repeat\]{background-repeat:no-repeat !important;}.\!\[background-size\:100\%_40px\,100\%_40px\,100\%_14px\,100\%_14px\]{background-size:100% 40px,100% 40px,100% 14px,100% 14px !important;}.\[--l-saturation\:0\]{--l-saturation:0;}.\[\&\[data-different-month\]\]\:\[visibility\:hidden\][data-different-month]{visibility:hidden;}.\[all\:unset\]{all:unset;}.\[background-size\:400\%_400\%\]{background-size:400% 400%;}.\[background\:linear-gradient\(var\(--v-bg\)_30\%\,rgba\(255\,255\,255\,0\)\)_center_top\,linear-gradient\(rgba\(255\,255\,255\,0\)\,var\(--v-bg\)_70\%\)_center_bottom\,radial-gradient\(farthest-side_at_50\%_0\,oklch\(from_var\(--v-bg\)_calc\(l\*0\.9\)_c_h\)\,rgba\(0\,0\,0\,0\)\)_center_top\,radial-gradient\(farthest-side_at_50\%_100\%\,oklch\(from_var\(--v-bg\)_calc\(l\*0\.9\)_c_h\)\,rgba\(0\,0\,0\,0\)\)_center_bottom\]{background:linear-gradient(var(--v-bg) 30%,rgba(255,255,255,0)) center top,linear-gradient(rgba(255,255,255,0),var(--v-bg) 70%) center bottom,radial-gradient(farthest-side at 50% 0,oklch(from var(--v-bg) calc(l*0.9) c h),rgba(0,0,0,0)) center top,radial-gradient(farthest-side at 50% 100%,oklch(from var(--v-bg) calc(l*0.9) c h),rgba(0,0,0,0)) center bottom;}.\[grid-area\:content\]{grid-area:content;}.\[grid-area\:leftGrid\]{grid-area:leftGrid;}.\[grid-area\:leftMonth\]{grid-area:leftMonth;}.\[grid-area\:nextMonth\]{grid-area:nextMonth;}.\[grid-area\:prevMonth\]{grid-area:prevMonth;}.\[grid-area\:rightGrid\]{grid-area:rightGrid;}.\[grid-area\:rightMonth\]{grid-area:rightMonth;}.\[grid-auto-rows\:var\(--day-size\,32px\)\]{grid-auto-rows:var(--day-size,32px);}.\[grid-template-areas\:\"prevMonth_leftMonth_nextMonth\"\"leftGrid_leftGrid_leftGrid\"\]{grid-template-areas:"prevMonth leftMonth nextMonth""leftGrid leftGrid leftGrid";}.\[grid-template-columns\:auto_1fr_auto\]{grid-template-columns:auto 1fr auto;}.\[grid-template-rows\:auto_1fr\]{grid-template-rows:auto 1fr;}.\[outline\:none\]{outline:none;}.\[stroke-dasharray\:80_200\]{stroke-dasharray:80 200;}.\[stroke-dashoffset\:0\]{stroke-dashoffset:0;}.contain-strict{contain:strict;}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0;}.pointer-events-none{pointer-events:none;}.after\:pointer-events-none::after{pointer-events:none;}.\!visible{visibility:visible !important;}.visible{visibility:visible;}.\[\&\[data-state\=active\]\]\:relative[data-state=active],.relative{position:relative;}.absolute{position:absolute;}.fixed{position:fixed;}.sticky{position:sticky;}.\[\&\[data-today\]\]\:before\:absolute[data-today]::before{position:absolute;}.before\:absolute::before{position:absolute;}.after\:absolute::after{position:absolute;}.static{position:static;}.inset-0{inset:0;}.after\:inset-0::after{inset:0;}.bottom-\[anchor\(bottom\)\]{bottom:anchor(bottom);}.bottom-\[var\(--mock-virtual-keyboard-height\,env\(keyboard-inset-height\,0px\)\)\]{bottom:var(--mock-virtual-keyboard-height,env(keyboard-inset-height,0px));}.bottom-0,.bottom-0px{bottom:0;}.bottom-2{bottom:0.5rem;}.bottom-3{bottom:0.75rem;}.left-\[anchor\(right\)\]{left:anchor(right);}.left-0{left:0;}.left-1\/2{left:50%;}.left-2{left:0.5rem;}.right-\[anchor\(right\)\]{right:anchor(right);}.right-0{right:0;}.right-1{right:0.25rem;}.right-2{right:0.5rem;}.top-\[anchor\(bottom\)\]{top:anchor(bottom);}.top-0{top:0;}.top-1\/2,.top-50\%{top:50%;}.top-1px{top:1px;}.top-2{top:0.5rem;}.top-auto{top:auto;}.\[\&\[data-today\]\]\:before\:left-\[1px\][data-today]::before{left:1px;}.\[\&\[data-today\]\]\:before\:top-\[1px\][data-today]::before{top:1px;}.before\:left-1\/2::before{left:50%;}.before\:top-1\/2::before{top:50%;}.after\:bottom-0::after{bottom:0;}.after\:right-0::after{right:0;}.after\:top-0::after{top:0;}.after\:top-auto::after{top:auto;}.\[\&\[data-highlighted\]\]\:z-1[data-highlighted],.\[\&\[data-in-range\]\]\:z-1[data-in-range],.\[\&\[data-range-end\]\]\:z-1[data-range-end],.\[\&\[data-range-start\]\]\:z-1[data-range-start],.\[\&\[data-state\=active\]\]\:z-1[data-state=active],.z-1{z-index:1;}.\[\&\[data-selected\]\]\:z-2[data-selected]{z-index:2;}.z--1{z-index:-1;}.z-\[100000\]{z-index:100000;}.z-\[calc\(var\(--z-dialog\)\+1\)\]{z-index:calc(var(--z-dialog) + 1);}.z-1000{z-index:1000;}.hover\:z-1:hover{z-index:1;}.after\:z-1::after{z-index:1;}.grid{display:grid;}.grid-col-span-2{grid-column:span 2/span 2;}.grid-cols-\[repeat\(7\,var\(--day-size\,32px\)\)\]{grid-template-columns:repeat(7,var(--day-size,32px));}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr));}.m-1{margin:0.25rem;}.m-2{margin:0.5rem;}.m-auto{margin:auto;}.m\[k\]{margin:k;}.my-4{margin-top:1rem;margin-bottom:1rem;}.my-auto{margin-top:auto;margin-bottom:auto;}.mb--1px{margin-bottom:-1px;}.mb-1{margin-bottom:0.25rem;}.me{margin-inline-end:1rem;}.ml--1{margin-left:-0.25rem;}.ml-auto{margin-left:auto;}.ml-md{margin-left:calc(1rem * var(--spacing-scale,1) * var(--global-spacing-scale,1));}.mr--1px{margin-right:-1px;}.mr-1{margin-right:0.25rem;}.mr-auto{margin-right:auto;}.mt-auto{margin-top:auto;}.block{display:block;}.inline-block{display:inline-block;}.\!hidden{display:none !important;}.\[\&\:\:webkit-file-upload-button\]\:hidden::webkit-file-upload-button,.hidden,[data-has-icon=true] .\[\[data-has-icon\=true\]_\&\]\:hidden{display:none;}.aspect-\[9\/16\]{aspect-ratio:9/16;}.\[\&\[data-state\=closed\]\]\:max-h-\[var\(--peek-height\,120px\)\][data-state=closed]{max-height:var(--peek-height,120px);}.h-\[100vh\]{height:100vh;}.h-\[12px\]{height:12px;}.h-\[var\(--mock-virtual-keyboard-height\,0\)\]{height:var(--mock-virtual-keyboard-height,0);}.h-10{height:2.5rem;}.h-100px{height:100px;}.h-16{height:4rem;}.h-16px{height:16px;}.h-1em{height:1em;}.h-1px{height:1px;}.h-200px{height:200px;}.h-25px{height:25px;}.h-32{height:8rem;}.h-4,.h4{height:1rem;}.h-600px{height:600px;}.h-64{height:16rem;}.h-80px{height:80px;}.h-full{height:100%;}.h1{height:0.25rem;}.h2{height:0.5rem;}.h3{height:0.75rem;}.h5{height:1.25rem;}.max-h-200px{max-height:200px;}.max-w-300px{max-width:300px;}.max-w-full{max-width:100%;}.min-h-0{min-height:0;}.min-h-18px{min-height:18px;}.min-h-20vh{min-height:20vh;}.min-h-32px{min-height:32px;}.min-h-screen{min-height:100vh;}.min-w-0{min-width:0;}.min-w-32px{min-width:32px;}.w-\[12px\]{width:12px;}.w-0{width:0;}.w-16{width:4rem;}.w-16px{width:16px;}.w-1em{width:1em;}.w-300px{width:300px;}.w-4{width:1rem;}.w-400px{width:400px;}.w-64{width:16rem;}.w-80px{width:80px;}.w-full{width:100%;}.w-max-content{width:max-content;}.\[\&\[data-today\]\]\:before\:h-\[6px\][data-today]::before{height:6px;}.\[\&\[data-today\]\]\:before\:w-\[6px\][data-today]::before{width:6px;}.before\:min-h-44px::before{min-height:44px;}.before\:min-w-44px::before{min-width:44px;}.before\:w-full::before{width:100%;}.after\:h-80px::after{height:80px;}.after\:w-50px::after{width:50px;}.\[\&\[data-state\=delayed-open\]\]\:flex[data-state=delayed-open],.\[\&\[data-state\=instant-open\]\]\:flex[data-state=instant-open],.flex{display:flex;}.after\:flex::after{display:flex;}.inline-flex{display:inline-flex;}.flex-1{flex:1 1 0%;}.flex-shrink-0,.shrink-0{flex-shrink:0;}.flex-grow-0{flex-grow:0;}.flex-grow-1,.grow{flex-grow:1;}.flex-basis-0{flex-basis:0;}.flex-basis-auto{flex-basis:auto;}.flex-row{flex-direction:row;}.flex-col{flex-direction:column;}.after\:flex-col::after{flex-direction:column;}.flex-wrap{flex-wrap:wrap;}.table{display:table;}.transform-origin-\[50\%_50\%\]{transform-origin:50% 50%;}.-translate-x-1\/2,.translate-x--1\/2{--un-translate-x:-50%;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.translate-y--1\/2,.translate-y-\[-50\%\]{--un-translate-y:-50%;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.before\:-translate-x-1\/2::before{--un-translate-x:-50%;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.before\:-translate-y-1\/2::before{--un-translate-y:-50%;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.rotate-180{--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-rotate:180deg;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.transform{transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.transform-gpu{transform:translate3d(var(--un-translate-x), var(--un-translate-y), var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}@keyframes peek-close{
|
|
9
9
|
from { height: calc(var(--collapsible-height) + 80px); max-height: none; }
|
|
10
10
|
to { height: min(var(--peek-height, 120px), var(--collapsible-height)); max-height: var(--peek-height, 120px); }
|
|
11
11
|
}@keyframes peek-open{
|
|
@@ -55,14 +55,14 @@ export function ButtonRoot(_a) {
|
|
|
55
55
|
// avoid rendering loading spinner with asChild
|
|
56
56
|
return _jsx(Comp, Object.assign({}, buttonProps, { children: children }));
|
|
57
57
|
}
|
|
58
|
-
return (_jsx(IconLoadingProvider, { value: isLoading, children: _jsxs(Comp, Object.assign({}, buttonProps, { children: [_jsx(AnimatePresence, { children: isLoading && (_jsx(motion.div, { initial: { width: 0, marginLeft: '-0.5rem' }, animate: { width: 'auto', marginLeft: 0 }, exit: { width: 0, marginLeft: '-0.5rem' }, className: clsx('flex-shrink-0 inline-block overflow-hidden my-auto flex', '[[data-has-icon=true]
|
|
58
|
+
return (_jsx(IconLoadingProvider, { value: isLoading, children: _jsxs(Comp, Object.assign({}, buttonProps, { children: [_jsx(AnimatePresence, { children: isLoading && (_jsx(motion.div, { initial: { width: 0, marginLeft: '-0.5rem' }, animate: { width: 'auto', marginLeft: 0 }, exit: { width: 0, marginLeft: '-0.5rem' }, className: clsx('flex-shrink-0 inline-block overflow-hidden my-auto flex', '[[data-has-icon=true]_&]:hidden'), "data-default-loader": true, children: _jsx(Spinner, { size: 15, className: "inline-block w-1em h-1em" }) }, "spinner")) }), toggled !== undefined &&
|
|
59
59
|
(toggleMode === 'indicator' ||
|
|
60
|
-
toggleMode === 'color-and-indicator') && (_jsx(ButtonToggleIndicator, { value: toggled })), children, isDropdownTrigger && (_jsx(DropdownMenuTriggerIcon, { asChild: true, children: _jsx(Icon, { name: "chevron" }) }))] })) }));
|
|
60
|
+
toggleMode === 'color-and-indicator') && (_jsx(ButtonToggleIndicator, { value: toggled })), children, isDropdownTrigger && (_jsx(IconLoadingProvider, { value: false, children: _jsx(DropdownMenuTriggerIcon, { asChild: true, children: _jsx(Icon, { name: "chevron" }) }) }))] })) }));
|
|
61
61
|
}
|
|
62
62
|
export const ButtonToggleIndicator = memo(function ToggleIndicator({ value, }) {
|
|
63
63
|
return (_jsx(Icon, { "aria-hidden": true, name: "check", className: "transition-width w-0 ml--1", style: {
|
|
64
64
|
width: value ? '15px' : 0,
|
|
65
|
-
} }));
|
|
65
|
+
}, loading: false }));
|
|
66
66
|
});
|
|
67
67
|
// allows custom icons to trigger icon button behavior
|
|
68
68
|
export const ButtonIcon = withClassName('div', 'icon flex-shrink-0 flex');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../../src/components/button/Button.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../../src/components/button/Button.tsx"],"names":[],"mappings":"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"}
|
|
@@ -3,7 +3,8 @@ import { IconName } from './generated/iconNames.js';
|
|
|
3
3
|
export interface IconProps extends HTMLAttributes<SVGSVGElement> {
|
|
4
4
|
name: IconName;
|
|
5
5
|
size?: number;
|
|
6
|
+
loading?: boolean;
|
|
6
7
|
}
|
|
7
|
-
export declare const Icon: ({ ref, name, size, className, ...rest }: IconProps & {
|
|
8
|
+
export declare const Icon: ({ ref, name, size, className, loading: loadingProp, ...rest }: IconProps & {
|
|
8
9
|
ref?: React.Ref<SVGSVGElement>;
|
|
9
10
|
}) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -15,8 +15,9 @@ import classNames from 'clsx';
|
|
|
15
15
|
import { Spinner } from '../spinner/Spinner.js';
|
|
16
16
|
import { useIconLoading } from './IconLoadingContext.js';
|
|
17
17
|
export const Icon = function Icon(_a) {
|
|
18
|
-
var { ref, name, size = 15, className } = _a, rest = __rest(_a, ["ref", "name", "size", "className"]);
|
|
19
|
-
const
|
|
18
|
+
var { ref, name, size = 15, className, loading: loadingProp } = _a, rest = __rest(_a, ["ref", "name", "size", "className", "loading"]);
|
|
19
|
+
const loadingContext = useIconLoading();
|
|
20
|
+
const loading = loadingProp !== false && (loadingProp || loadingContext);
|
|
20
21
|
if (loading) {
|
|
21
22
|
return _jsx(Spinner, { size: size, className: "icon inline-block" });
|
|
22
23
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Icon.js","sourceRoot":"","sources":["../../../../src/components/icon/Icon.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,UAAU,MAAM,MAAM,CAAC;AAE9B,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAEhD,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;
|
|
1
|
+
{"version":3,"file":"Icon.js","sourceRoot":"","sources":["../../../../src/components/icon/Icon.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,UAAU,MAAM,MAAM,CAAC;AAE9B,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAEhD,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAQzD,MAAM,CAAC,MAAM,IAAI,GAAG,SAAS,IAAI,CAAC,EASjC;QATiC,EACjC,GAAG,EACH,IAAI,EACJ,IAAI,GAAG,EAAE,EACT,SAAS,EACT,OAAO,EAAE,WAAW,OAIpB,EAHG,IAAI,cAN0B,+CAOjC,CADO;IAIP,MAAM,cAAc,GAAG,cAAc,EAAE,CAAC;IACxC,MAAM,OAAO,GAAG,WAAW,KAAK,KAAK,IAAI,CAAC,WAAW,IAAI,cAAc,CAAC,CAAC;IAEzE,IAAI,OAAO,EAAE,CAAC;QACb,OAAO,KAAC,OAAO,IAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAC,mBAAmB,GAAG,CAAC;IAC9D,CAAC;IAED,OAAO,CACN,4BACC,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,UAAU,CACpB,MAAM,EACN,0CAA0C,EAC1C,SAAS,CACT,EACD,KAAK,EAAE,IAAI,EACX,MAAM,EAAE,IAAI,IACR,IAAI,cAER,cAAK,SAAS,EAAE,SAAS,IAAI,EAAE,GAAI,IAC9B,CACN,CAAC;AACH,CAAC,CAAC"}
|
package/package.json
CHANGED
|
@@ -130,7 +130,7 @@ export function ButtonRoot({
|
|
|
130
130
|
exit={{ width: 0, marginLeft: '-0.5rem' }}
|
|
131
131
|
className={clsx(
|
|
132
132
|
'flex-shrink-0 inline-block overflow-hidden my-auto flex',
|
|
133
|
-
'[[data-has-icon=true]
|
|
133
|
+
'[[data-has-icon=true]_&]:hidden',
|
|
134
134
|
)}
|
|
135
135
|
data-default-loader
|
|
136
136
|
>
|
|
@@ -145,9 +145,11 @@ export function ButtonRoot({
|
|
|
145
145
|
)}
|
|
146
146
|
{children}
|
|
147
147
|
{isDropdownTrigger && (
|
|
148
|
-
<
|
|
149
|
-
<
|
|
150
|
-
|
|
148
|
+
<IconLoadingProvider value={false}>
|
|
149
|
+
<DropdownMenuTriggerIcon asChild>
|
|
150
|
+
<Icon name="chevron" />
|
|
151
|
+
</DropdownMenuTriggerIcon>
|
|
152
|
+
</IconLoadingProvider>
|
|
151
153
|
)}
|
|
152
154
|
</Comp>
|
|
153
155
|
</IconLoadingProvider>
|
|
@@ -167,6 +169,7 @@ export const ButtonToggleIndicator = memo(function ToggleIndicator({
|
|
|
167
169
|
style={{
|
|
168
170
|
width: value ? '15px' : 0,
|
|
169
171
|
}}
|
|
172
|
+
loading={false}
|
|
170
173
|
/>
|
|
171
174
|
);
|
|
172
175
|
});
|
|
@@ -7,6 +7,7 @@ import { useIconLoading } from './IconLoadingContext.js';
|
|
|
7
7
|
export interface IconProps extends HTMLAttributes<SVGSVGElement> {
|
|
8
8
|
name: IconName;
|
|
9
9
|
size?: number;
|
|
10
|
+
loading?: boolean;
|
|
10
11
|
}
|
|
11
12
|
|
|
12
13
|
export const Icon = function Icon({
|
|
@@ -14,11 +15,13 @@ export const Icon = function Icon({
|
|
|
14
15
|
name,
|
|
15
16
|
size = 15,
|
|
16
17
|
className,
|
|
18
|
+
loading: loadingProp,
|
|
17
19
|
...rest
|
|
18
20
|
}: IconProps & {
|
|
19
21
|
ref?: React.Ref<SVGSVGElement>;
|
|
20
22
|
}) {
|
|
21
|
-
const
|
|
23
|
+
const loadingContext = useIconLoading();
|
|
24
|
+
const loading = loadingProp !== false && (loadingProp || loadingContext);
|
|
22
25
|
|
|
23
26
|
if (loading) {
|
|
24
27
|
return <Spinner size={size} className="icon inline-block" />;
|