@lerianstudio/sindarian-ui 1.0.0-beta.1 → 1.0.0-beta.11
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/components/breadcrumb/index.js +2 -2
- package/dist/components/card/account-card/index.d.ts +32 -0
- package/dist/components/card/account-card/index.d.ts.map +1 -0
- package/dist/components/card/account-card/index.js +69 -0
- package/dist/components/card/basic-card/index.d.ts +6 -0
- package/dist/components/card/basic-card/index.d.ts.map +1 -0
- package/dist/components/card/basic-card/index.js +20 -0
- package/dist/components/card/dashboard-card/index.d.ts +5 -0
- package/dist/components/card/dashboard-card/index.d.ts.map +1 -0
- package/dist/components/card/dashboard-card/index.js +20 -0
- package/dist/components/card/entity-card/index.d.ts +21 -0
- package/dist/components/card/entity-card/index.d.ts.map +1 -0
- package/dist/components/card/entity-card/index.js +60 -0
- package/dist/components/card/index.d.ts +5 -0
- package/dist/components/card/index.d.ts.map +1 -0
- package/dist/components/card/index.js +20 -0
- package/dist/components/dialog/confirmation-dialog/index.d.ts +15 -0
- package/dist/components/dialog/confirmation-dialog/index.d.ts.map +1 -0
- package/dist/components/dialog/confirmation-dialog/index.js +28 -0
- package/dist/components/dialog/confirmation-dialog/use-confirm-dialog.d.ts +31 -0
- package/dist/components/dialog/confirmation-dialog/use-confirm-dialog.d.ts.map +1 -0
- package/dist/components/dialog/confirmation-dialog/use-confirm-dialog.js +55 -0
- package/dist/components/dialog/index.d.ts +4 -0
- package/dist/components/dialog/index.d.ts.map +1 -0
- package/dist/components/dialog/index.js +19 -0
- package/dist/components/dialog/large-dialog/index.d.ts +11 -0
- package/dist/components/dialog/large-dialog/index.d.ts.map +1 -0
- package/dist/components/dialog/large-dialog/index.js +21 -0
- package/dist/components/form/input-field/index.d.ts +3 -1
- package/dist/components/form/input-field/index.d.ts.map +1 -1
- package/dist/components/form/input-field/index.js +2 -2
- package/dist/components/form/password-field/index.d.ts +4 -4
- package/dist/components/form/password-field/index.d.ts.map +1 -1
- package/dist/components/form/password-field/index.js +8 -7
- package/dist/components/page-header/index.js +1 -1
- package/dist/components/pagination/index.js +1 -1
- package/dist/components/ui/alert/index.d.ts +5 -1
- package/dist/components/ui/alert/index.d.ts.map +1 -1
- package/dist/components/ui/alert/index.js +22 -8
- package/dist/components/ui/alert/styles.css +68 -0
- package/dist/components/ui/badge/index.d.ts +1 -1
- package/dist/components/ui/breadcrumb/index.d.ts.map +1 -1
- package/dist/components/ui/breadcrumb/index.js +5 -5
- package/dist/components/ui/breadcrumb/styles.css +27 -0
- package/dist/components/ui/button/index.d.ts +3 -2
- package/dist/components/ui/button/index.d.ts.map +1 -1
- package/dist/components/ui/button/index.js +19 -28
- package/dist/components/ui/button/styles.css +64 -0
- package/dist/components/ui/card/index.js +1 -1
- package/dist/components/ui/dialog/index.d.ts.map +1 -1
- package/dist/components/ui/dialog/index.js +6 -6
- package/dist/components/ui/dialog/styles.css +34 -0
- package/dist/components/ui/form.d.ts.map +1 -1
- package/dist/components/ui/form.js +1 -0
- package/dist/components/ui/icon-button/index.d.ts +13 -0
- package/dist/components/ui/icon-button/index.d.ts.map +1 -0
- package/dist/components/ui/icon-button/index.js +35 -0
- package/dist/components/ui/icon-button/styles.css +33 -0
- package/dist/components/ui/input/adornment.d.ts +9 -0
- package/dist/components/ui/input/adornment.d.ts.map +1 -0
- package/dist/components/ui/input/adornment.js +21 -0
- package/dist/components/ui/input/index.d.ts +16 -2
- package/dist/components/ui/input/index.d.ts.map +1 -1
- package/dist/components/ui/input/index.js +90 -2
- package/dist/components/ui/input/styles.css +68 -0
- package/dist/components/ui/multiple-select/index.d.ts +6 -6
- package/dist/components/ui/paper-collapsible/index.d.ts +9 -0
- package/dist/components/ui/paper-collapsible/index.d.ts.map +1 -0
- package/dist/components/ui/paper-collapsible/index.js +24 -0
- package/dist/components/ui/progress/index.d.ts +1 -1
- package/dist/components/ui/progress/index.d.ts.map +1 -1
- package/dist/components/ui/select/index.d.ts +1 -2
- package/dist/components/ui/select/index.d.ts.map +1 -1
- package/dist/components/ui/select/index.js +9 -18
- package/dist/components/ui/select/styles.css +57 -0
- package/dist/components/ui/stepper/index.d.ts.map +1 -1
- package/dist/components/ui/stepper/index.js +4 -4
- package/dist/components/ui/stepper/styles.css +41 -0
- package/dist/components/ui/tabs/index.d.ts.map +1 -1
- package/dist/components/ui/tabs/index.js +4 -4
- package/dist/components/ui/tabs/styles.css +31 -0
- package/dist/components/ui/toast/toaster.js +1 -1
- package/dist/globals.css +234 -0
- package/dist/hooks/use-time.d.ts +6 -0
- package/dist/hooks/use-time.d.ts.map +1 -0
- package/dist/hooks/use-time.js +20 -0
- package/dist/index.d.ts +5 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +6 -1
- package/dist/public/arm.gif +0 -0
- package/dist/public/clap.gif +0 -0
- package/dist/public/confetti-ball.gif +0 -0
- package/dist/public/countries.json +21200 -21200
- package/dist/public/dizzy.gif +0 -0
- package/dist/public/electricity.gif +0 -0
- package/dist/public/gear.gif +0 -0
- package/dist/public/gem.gif +0 -0
- package/dist/public/pencil.gif +0 -0
- package/dist/public/robot.gif +0 -0
- package/dist/public/rocket.gif +0 -0
- package/dist/public/software.gif +0 -0
- package/dist/public/solar-system.gif +0 -0
- package/dist/public/unicorn.gif +0 -0
- package/package.json +22 -19
- package/dist/components/ui/input-with-icon/index.d.ts +0 -12
- package/dist/components/ui/input-with-icon/index.d.ts.map +0 -1
- package/dist/components/ui/input-with-icon/index.js +0 -57
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
@theme {
|
|
2
|
+
--spacing-icon-button-p: var(--spacing(2))
|
|
3
|
+
}
|
|
4
|
+
|
|
5
|
+
@layer components {
|
|
6
|
+
.icon-button-base {
|
|
7
|
+
@apply p-icon-button-p rounded-md size-10 [&>*]:size-6;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
.icon-button-read-only {
|
|
11
|
+
@apply data-[read-only=true]:border data-[read-only=true]:border-button-border;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
.icon-button-disabled {
|
|
15
|
+
@apply disabled:border disabled:border-button-border;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
.icon-button-small {
|
|
19
|
+
@apply size-8 [&>*]:size-4;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
.icon-button-rounded {
|
|
23
|
+
@apply rounded-full;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
/* Overwrite for outline style */
|
|
27
|
+
.button-outline.icon-button-disabled {
|
|
28
|
+
@apply disabled:border-transparent
|
|
29
|
+
}
|
|
30
|
+
.button-outline.icon-button-read-only {
|
|
31
|
+
@apply data-[read-only=true]:border-transparent
|
|
32
|
+
}
|
|
33
|
+
}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { VariantProps } from 'class-variance-authority';
|
|
2
|
+
export declare const inputAdornmentVariants: (props?: ({
|
|
3
|
+
position?: "start" | "end" | null | undefined;
|
|
4
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
5
|
+
export type InputAdornmentProps = React.ComponentProps<'span'> & VariantProps<typeof inputAdornmentVariants> & {
|
|
6
|
+
position?: 'start' | 'end';
|
|
7
|
+
};
|
|
8
|
+
export declare function InputAdornment({ className, position, ...props }: InputAdornmentProps): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
//# sourceMappingURL=adornment.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"adornment.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/input/adornment.tsx"],"names":[],"mappings":"AACA,OAAO,EAAO,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAE5D,eAAO,MAAM,sBAAsB;;8EAUjC,CAAA;AAEF,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,GAC5D,YAAY,CAAC,OAAO,sBAAsB,CAAC,GAAG;IAC5C,QAAQ,CAAC,EAAE,OAAO,GAAG,KAAK,CAAA;CAC3B,CAAA;AAEH,wBAAgB,cAAc,CAAC,EAC7B,SAAS,EACT,QAAkB,EAClB,GAAG,KAAK,EACT,EAAE,mBAAmB,2CAQrB"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.inputAdornmentVariants = void 0;
|
|
4
|
+
exports.InputAdornment = InputAdornment;
|
|
5
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
+
const utils_1 = require("../../../lib/utils");
|
|
7
|
+
const class_variance_authority_1 = require("class-variance-authority");
|
|
8
|
+
exports.inputAdornmentVariants = (0, class_variance_authority_1.cva)('input-adornment', {
|
|
9
|
+
variants: {
|
|
10
|
+
position: {
|
|
11
|
+
start: 'input-adornment-start',
|
|
12
|
+
end: 'input-adornment-end'
|
|
13
|
+
}
|
|
14
|
+
},
|
|
15
|
+
defaultVariants: {
|
|
16
|
+
position: 'start'
|
|
17
|
+
}
|
|
18
|
+
});
|
|
19
|
+
function InputAdornment({ className, position = 'start', ...props }) {
|
|
20
|
+
return ((0, jsx_runtime_1.jsx)("span", { "data-slot": "input-adornment", className: (0, utils_1.cn)((0, exports.inputAdornmentVariants)({ position }), className), ...props }));
|
|
21
|
+
}
|
|
@@ -1,4 +1,18 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
|
|
3
|
-
|
|
2
|
+
import { VariantProps } from 'class-variance-authority';
|
|
3
|
+
declare const inputVariants: (props?: ({
|
|
4
|
+
startAdornment?: boolean | null | undefined;
|
|
5
|
+
endAdornment?: boolean | null | undefined;
|
|
6
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
7
|
+
export type InputRef = {
|
|
8
|
+
focus: () => void;
|
|
9
|
+
blur: () => void;
|
|
10
|
+
};
|
|
11
|
+
export type InputProps = Omit<VariantProps<typeof inputVariants>, 'startAdornment' | 'endAdornment'> & React.ComponentProps<'input'> & {
|
|
12
|
+
startAdornment?: React.ReactNode;
|
|
13
|
+
endAdornment?: React.ReactNode;
|
|
14
|
+
ref?: React.Ref<InputRef>;
|
|
15
|
+
};
|
|
16
|
+
export declare function Input({ className, startAdornment, endAdornment, onFocus, onBlur, onClick, ref, ...props }: InputProps): import("react/jsx-runtime").JSX.Element;
|
|
17
|
+
export * from './adornment';
|
|
4
18
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/input/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/input/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,OAAO,EAAO,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAE5D,QAAA,MAAM,aAAa;;;8EAejB,CAAA;AAEF,MAAM,MAAM,QAAQ,GAAG;IACrB,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,IAAI,EAAE,MAAM,IAAI,CAAA;CACjB,CAAA;AAED,MAAM,MAAM,UAAU,GAAG,IAAI,CAC3B,YAAY,CAAC,OAAO,aAAa,CAAC,EAClC,gBAAgB,GAAG,cAAc,CAClC,GACC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,GAAG;IAC9B,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAChC,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC9B,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAA;CAC1B,CAAA;AAEH,wBAAgB,KAAK,CAAC,EACpB,SAAS,EACT,cAAc,EACd,YAAY,EACZ,OAAO,EACP,MAAM,EACN,OAAO,EACP,GAAG,EACH,GAAG,KAAK,EACT,EAAE,UAAU,2CAuEZ;AAED,cAAc,aAAa,CAAA"}
|
|
@@ -1,10 +1,98 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || (function () {
|
|
19
|
+
var ownKeys = function(o) {
|
|
20
|
+
ownKeys = Object.getOwnPropertyNames || function (o) {
|
|
21
|
+
var ar = [];
|
|
22
|
+
for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
|
|
23
|
+
return ar;
|
|
24
|
+
};
|
|
25
|
+
return ownKeys(o);
|
|
26
|
+
};
|
|
27
|
+
return function (mod) {
|
|
28
|
+
if (mod && mod.__esModule) return mod;
|
|
29
|
+
var result = {};
|
|
30
|
+
if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
|
|
31
|
+
__setModuleDefault(result, mod);
|
|
32
|
+
return result;
|
|
33
|
+
};
|
|
34
|
+
})();
|
|
35
|
+
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
36
|
+
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
37
|
+
};
|
|
2
38
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
39
|
exports.Input = Input;
|
|
4
40
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
41
|
+
const React = __importStar(require("react"));
|
|
5
42
|
const utils_1 = require("../../../lib/utils");
|
|
6
43
|
const form_1 = require("../../../components/ui/form");
|
|
7
|
-
|
|
44
|
+
const class_variance_authority_1 = require("class-variance-authority");
|
|
45
|
+
const inputVariants = (0, class_variance_authority_1.cva)('input-base input-disabled input-read-only', {
|
|
46
|
+
variants: {
|
|
47
|
+
startAdornment: {
|
|
48
|
+
false: '',
|
|
49
|
+
true: 'input-start'
|
|
50
|
+
},
|
|
51
|
+
endAdornment: {
|
|
52
|
+
false: '',
|
|
53
|
+
true: 'input-end'
|
|
54
|
+
}
|
|
55
|
+
},
|
|
56
|
+
defaultVariants: {
|
|
57
|
+
startAdornment: false,
|
|
58
|
+
endAdornment: false
|
|
59
|
+
}
|
|
60
|
+
});
|
|
61
|
+
function Input({ className, startAdornment, endAdornment, onFocus, onBlur, onClick, ref, ...props }) {
|
|
8
62
|
const { formItemId } = (0, form_1.useFormField)();
|
|
9
|
-
|
|
63
|
+
const [focus, setFocus] = React.useState(false);
|
|
64
|
+
const inputRef = React.useRef(null);
|
|
65
|
+
React.useImperativeHandle(ref, () => ({
|
|
66
|
+
...inputRef.current,
|
|
67
|
+
focus: () => () => {
|
|
68
|
+
inputRef.current?.focus();
|
|
69
|
+
setFocus(true);
|
|
70
|
+
},
|
|
71
|
+
blur: () => () => {
|
|
72
|
+
inputRef.current?.blur();
|
|
73
|
+
setFocus(false);
|
|
74
|
+
}
|
|
75
|
+
}), [inputRef]);
|
|
76
|
+
const handleWrapperClick = (event) => {
|
|
77
|
+
// Don't focus input if clicking on interactive elements or input adornments
|
|
78
|
+
const target = event.target;
|
|
79
|
+
const isAdornment = target.closest('[data-slot="input-adornment"]');
|
|
80
|
+
if (!isAdornment) {
|
|
81
|
+
inputRef.current?.focus();
|
|
82
|
+
}
|
|
83
|
+
onClick?.(event);
|
|
84
|
+
};
|
|
85
|
+
const handleFocus = (e) => {
|
|
86
|
+
setFocus(true);
|
|
87
|
+
onFocus?.(e);
|
|
88
|
+
};
|
|
89
|
+
const handleBlur = (e) => {
|
|
90
|
+
setFocus(false);
|
|
91
|
+
onBlur?.(e);
|
|
92
|
+
};
|
|
93
|
+
return ((0, jsx_runtime_1.jsxs)("div", { "data-slot": "input-wrapper", className: (0, utils_1.cn)('input-wrapper input-wrapper-focus'), "data-focus": focus, onClick: handleWrapperClick, children: [startAdornment, (0, jsx_runtime_1.jsx)("input", { ref: inputRef, id: formItemId, "data-slot": "input", className: (0, utils_1.cn)(inputVariants({
|
|
94
|
+
startAdornment: !!startAdornment,
|
|
95
|
+
endAdornment: !!endAdornment
|
|
96
|
+
}), className), onFocus: handleFocus, onBlur: handleBlur, ...props }), endAdornment] }));
|
|
10
97
|
}
|
|
98
|
+
__exportStar(require("./adornment"), exports);
|
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
@theme {
|
|
2
|
+
--spacing-input-wrapper-h: --spacing(10);
|
|
3
|
+
--spacing-input-wrapper-p: --spacing(2);
|
|
4
|
+
--spacing-input-px: --spacing(4);
|
|
5
|
+
--color-input-foreground: var(--color-zinc-700);
|
|
6
|
+
--color-input-placeholder: var(--color-shadcn-400);
|
|
7
|
+
--color-input-border: var(--color-shadcn-300);
|
|
8
|
+
|
|
9
|
+
--color-input-adornment: var(--color-shadcn-400);
|
|
10
|
+
--spacing-input-adornment-size: --spacing(10);
|
|
11
|
+
--spacing-input-adornment-icon-size: --spacing(5);
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
@layer components {
|
|
15
|
+
.input-wrapper {
|
|
16
|
+
@apply relative flex items-center h-input-wrapper-h w-full border border-input-border rounded-md p-input-wrapper-p cursor-text transition-[color,box-shadow];
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
.input-wrapper-focus {
|
|
20
|
+
@apply data-[focus=true]:ring-ring data-[focus=true]:ring-2 data-[focus=true]:ring-offset-0;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
.input-wrapper:focus-within {
|
|
24
|
+
@apply border-ring;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
.input-base {
|
|
28
|
+
@apply bg-transparent min-h-0 h-full flex-1 px-input-px text-input-foreground border-none outline-none placeholder:text-input-placeholder placeholder:font-medium placeholder:text-sm focus:ring-0 focus:ring-offset-0;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
.input-disabled {
|
|
32
|
+
@apply disabled:cursor-not-allowed disabled:pointer-events-none disabled:opacity-50;
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
.input-read-only {
|
|
36
|
+
@apply read-only:cursor-default read-only:caret-transparent read-only:opacity-50 read-only:select-text read-only:focus:ring-0 read-only:focus:ring-offset-0 read-only:focus:outline-hidden;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
.input-start {
|
|
40
|
+
@apply ml-6;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
.input-end {
|
|
44
|
+
@apply mr-6;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
.input-adornment {
|
|
48
|
+
@apply absolute -top-[0.5px] flex items-center justify-center text-input-adornment size-input-adornment-size select-none;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
.input-adornment > * {
|
|
52
|
+
height: calc(var(--spacing-input-adornment-size) - 4px);
|
|
53
|
+
width: calc(var(--spacing-input-adornment-size) - 4px);
|
|
54
|
+
@apply text-input-adornment;
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
.input-adornment > svg {
|
|
58
|
+
@apply text-input-adornment size-input-adornment-icon-size;
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
.input-adornment-start {
|
|
62
|
+
@apply -left-0;
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
.input-adornment-end {
|
|
66
|
+
@apply -right-0;
|
|
67
|
+
}
|
|
68
|
+
}
|
|
@@ -9,7 +9,7 @@ export declare const MultipleSelectValue: React.ForwardRefExoticComponent<Omit<O
|
|
|
9
9
|
ref?: React.Ref<HTMLInputElement>;
|
|
10
10
|
} & {
|
|
11
11
|
asChild?: boolean;
|
|
12
|
-
}, "
|
|
12
|
+
}, "asChild" | "key" | keyof React.InputHTMLAttributes<HTMLInputElement>>, "type" | "value" | "onChange"> & {
|
|
13
13
|
value?: string;
|
|
14
14
|
onValueChange?: (search: string) => void;
|
|
15
15
|
} & React.RefAttributes<HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;
|
|
@@ -19,7 +19,7 @@ export declare const MultipleSelectEmpty: React.ForwardRefExoticComponent<Omit<{
|
|
|
19
19
|
ref?: React.Ref<HTMLDivElement>;
|
|
20
20
|
} & {
|
|
21
21
|
asChild?: boolean;
|
|
22
|
-
}, "
|
|
22
|
+
}, "asChild" | "key" | keyof React.HTMLAttributes<HTMLDivElement>> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
23
23
|
export type MultipleSelectContentProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive.List> & {
|
|
24
24
|
position?: 'popper' | 'static';
|
|
25
25
|
};
|
|
@@ -29,7 +29,7 @@ export declare const MultipleSelectContent: React.ForwardRefExoticComponent<Omit
|
|
|
29
29
|
ref?: React.Ref<HTMLDivElement>;
|
|
30
30
|
} & {
|
|
31
31
|
asChild?: boolean;
|
|
32
|
-
}, "
|
|
32
|
+
}, "asChild" | "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
|
|
33
33
|
label?: string;
|
|
34
34
|
} & React.RefAttributes<HTMLDivElement>, "ref"> & {
|
|
35
35
|
position?: "popper" | "static";
|
|
@@ -40,7 +40,7 @@ export declare const MultipleSelectGroup: React.ForwardRefExoticComponent<Omit<{
|
|
|
40
40
|
ref?: React.Ref<HTMLDivElement>;
|
|
41
41
|
} & {
|
|
42
42
|
asChild?: boolean;
|
|
43
|
-
}, "
|
|
43
|
+
}, "asChild" | "key" | keyof React.HTMLAttributes<HTMLDivElement>>, "value" | "heading"> & {
|
|
44
44
|
heading?: React.ReactNode;
|
|
45
45
|
value?: string;
|
|
46
46
|
forceMount?: boolean;
|
|
@@ -51,7 +51,7 @@ export declare const MultipleSelectItem: React.ForwardRefExoticComponent<Omit<{
|
|
|
51
51
|
ref?: React.Ref<HTMLDivElement>;
|
|
52
52
|
} & {
|
|
53
53
|
asChild?: boolean;
|
|
54
|
-
}, "
|
|
54
|
+
}, "asChild" | "key" | keyof React.HTMLAttributes<HTMLDivElement>>, "disabled" | "value" | "onSelect"> & {
|
|
55
55
|
disabled?: boolean;
|
|
56
56
|
onSelect?: (value: string) => void;
|
|
57
57
|
value?: string;
|
|
@@ -71,7 +71,7 @@ export declare const MultipleSelect: React.ForwardRefExoticComponent<Omit<{
|
|
|
71
71
|
ref?: React.Ref<HTMLDivElement>;
|
|
72
72
|
} & {
|
|
73
73
|
asChild?: boolean;
|
|
74
|
-
}, "
|
|
74
|
+
}, "asChild" | "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
|
|
75
75
|
label?: string;
|
|
76
76
|
shouldFilter?: boolean;
|
|
77
77
|
filter?: (value: string, search: string, keywords?: string[]) => number;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { CollapsibleProps, CollapsibleTriggerProps } from '@radix-ui/react-collapsible';
|
|
3
|
+
export type PaperCollapsibleProps = CollapsibleProps;
|
|
4
|
+
declare function PaperCollapsible({ className, children, ...props }: PaperCollapsibleProps): import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
declare function PaperCollapsibleBanner({ className, children, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
|
|
6
|
+
declare function PaperCollapsibleTrigger({ className, children: _children, ...props }: CollapsibleTriggerProps): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
declare function PaperCollapsibleContent({ className, children, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export { PaperCollapsible, PaperCollapsibleBanner, PaperCollapsibleTrigger, PaperCollapsibleContent };
|
|
9
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/paper-collapsible/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EACL,gBAAgB,EAChB,uBAAuB,EACxB,MAAM,6BAA6B,CAAA;AAUpC,MAAM,MAAM,qBAAqB,GAAG,gBAAgB,CAAA;AAEpD,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,qBAAqB,2CAWvB;AAED,iBAAS,sBAAsB,CAAC,EAC9B,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAW7B;AAED,iBAAS,uBAAuB,CAAC,EAC/B,SAAS,EACT,QAAQ,EAAE,SAAS,EACnB,GAAG,KAAK,EACT,EAAE,uBAAuB,2CAazB;AAED,iBAAS,uBAAuB,CAAC,EAC/B,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAc7B;AAED,OAAO,EACL,gBAAgB,EAChB,sBAAsB,EACtB,uBAAuB,EACvB,uBAAuB,EACxB,CAAA"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.PaperCollapsible = PaperCollapsible;
|
|
4
|
+
exports.PaperCollapsibleBanner = PaperCollapsibleBanner;
|
|
5
|
+
exports.PaperCollapsibleTrigger = PaperCollapsibleTrigger;
|
|
6
|
+
exports.PaperCollapsibleContent = PaperCollapsibleContent;
|
|
7
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
8
|
+
const utils_1 = require("../../../lib/utils");
|
|
9
|
+
const collapsible_1 = require("../../../components/ui/collapsible");
|
|
10
|
+
const paper_1 = require("../../../components/ui/paper");
|
|
11
|
+
const lucide_react_1 = require("lucide-react");
|
|
12
|
+
const separator_1 = require("../separator");
|
|
13
|
+
function PaperCollapsible({ className, children, ...props }) {
|
|
14
|
+
return ((0, jsx_runtime_1.jsx)(collapsible_1.Collapsible, { className: "group/paper-collapsible", ...props, children: (0, jsx_runtime_1.jsx)(paper_1.Paper, { "data-slot": "paper-collapsible", className: (0, utils_1.cn)('flex flex-col', className), children: children }) }));
|
|
15
|
+
}
|
|
16
|
+
function PaperCollapsibleBanner({ className, children, ...props }) {
|
|
17
|
+
return ((0, jsx_runtime_1.jsxs)("div", { "data-slot": "paper-collapsible-banner", className: (0, utils_1.cn)('flex flex-row p-6', className), ...props, children: [(0, jsx_runtime_1.jsx)("div", { className: "flex grow flex-col", children: children }), (0, jsx_runtime_1.jsx)(PaperCollapsibleTrigger, {})] }));
|
|
18
|
+
}
|
|
19
|
+
function PaperCollapsibleTrigger({ className, children: _children, ...props }) {
|
|
20
|
+
return ((0, jsx_runtime_1.jsx)(collapsible_1.CollapsibleTrigger, { "data-slot": "paper-collapsible-trigger", className: (0, utils_1.cn)('transition-all hover:underline [&[data-state=open]>svg]:rotate-180', className), ...props, children: (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronDown, { className: "size-6 shrink-0 cursor-pointer text-zinc-700 transition-transform duration-200" }) }));
|
|
21
|
+
}
|
|
22
|
+
function PaperCollapsibleContent({ className, children, ...props }) {
|
|
23
|
+
return ((0, jsx_runtime_1.jsxs)(collapsible_1.CollapsibleContent, { "data-slot": "paper-collapsible-content", className: (0, utils_1.cn)('data-[state=closed]:animate-collapsible-up data-[state=open]:animate-collapsible-down overflow-hidden transition-all duration-200 ease-in-out', className), ...props, children: [(0, jsx_runtime_1.jsx)(separator_1.Separator, {}), children] }));
|
|
24
|
+
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import * as ProgressPrimitive from '@radix-ui/react-progress';
|
|
3
3
|
type ProgressProps = React.ComponentProps<typeof ProgressPrimitive.Root> & {
|
|
4
|
-
indicatorColor
|
|
4
|
+
indicatorColor?: string;
|
|
5
5
|
};
|
|
6
6
|
declare function Progress({ className, value, indicatorColor, ...props }: ProgressProps): import("react/jsx-runtime").JSX.Element;
|
|
7
7
|
export { Progress };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/progress/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,iBAAiB,MAAM,0BAA0B,CAAA;AAI7D,KAAK,aAAa,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,iBAAiB,CAAC,IAAI,CAAC,GAAG;IACzE,cAAc,EAAE,MAAM,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/progress/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,iBAAiB,MAAM,0BAA0B,CAAA;AAI7D,KAAK,aAAa,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,iBAAiB,CAAC,IAAI,CAAC,GAAG;IACzE,cAAc,CAAC,EAAE,MAAM,CAAA;CACxB,CAAA;AAED,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,KAAK,EACL,cAA6B,EAC7B,GAAG,KAAK,EACT,EAAE,aAAa,2CAiBf;AAED,OAAO,EAAE,QAAQ,EAAE,CAAA"}
|
|
@@ -4,10 +4,9 @@ declare function Select({ ...props }: React.ComponentProps<typeof SelectPrimitiv
|
|
|
4
4
|
declare function SelectGroup({ ...props }: React.ComponentProps<typeof SelectPrimitive.Group>): import("react/jsx-runtime").JSX.Element;
|
|
5
5
|
declare function SelectValue({ ...props }: React.ComponentProps<typeof SelectPrimitive.Value>): import("react/jsx-runtime").JSX.Element;
|
|
6
6
|
type SelectTriggerProps = React.ComponentProps<typeof SelectPrimitive.Trigger> & {
|
|
7
|
-
size?: 'sm' | 'default';
|
|
8
7
|
readOnly?: boolean;
|
|
9
8
|
};
|
|
10
|
-
declare function SelectTrigger({ className,
|
|
9
|
+
declare function SelectTrigger({ className, readOnly, children, ...props }: SelectTriggerProps): import("react/jsx-runtime").JSX.Element;
|
|
11
10
|
declare function SelectScrollUpButton({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.ScrollUpButton>): import("react/jsx-runtime").JSX.Element;
|
|
12
11
|
declare function SelectScrollDownButton({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.ScrollDownButton>): import("react/jsx-runtime").JSX.Element;
|
|
13
12
|
declare function SelectContent({ className, children, position, ...props }: React.ComponentProps<typeof SelectPrimitive.Content>): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/select/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAA;AAKzD,iBAAS,MAAM,CAAC,EACd,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,2CAEnD;AAED,iBAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,2CAEpD;AAED,iBAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,2CAEpD;AAED,KAAK,kBAAkB,GAAG,KAAK,CAAC,cAAc,CAC5C,OAAO,eAAe,CAAC,OAAO,CAC/B,GAAG;IACF,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/select/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAA;AAKzD,iBAAS,MAAM,CAAC,EACd,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,2CAEnD;AAED,iBAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,2CAEpD;AAED,iBAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,2CAEpD;AAED,KAAK,kBAAkB,GAAG,KAAK,CAAC,cAAc,CAC5C,OAAO,eAAe,CAAC,OAAO,CAC/B,GAAG;IACF,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,kBAAkB,2CAqBpB;AAED,iBAAS,oBAAoB,CAAC,EAC5B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,cAAc,CAAC,2CAU7D;AACD,iBAAS,sBAAsB,CAAC,EAC9B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,gBAAgB,CAAC,2CAU/D;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,QAAQ,EACR,QAAmB,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,2CA0CtD;AAED,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,2CAQvC;AAED,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,2CAQpD;AAED,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,2CAgBnD;AAED,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,SAAS,CAAC,2CAQxD;AAED,OAAO,EACL,MAAM,EACN,WAAW,EACX,WAAW,EACX,aAAa,EACb,aAAa,EACb,WAAW,EACX,WAAW,EACX,UAAU,EACV,eAAe,EACf,oBAAoB,EACpB,sBAAsB,EACvB,CAAA"}
|
|
@@ -59,22 +59,14 @@ function SelectGroup({ ...props }) {
|
|
|
59
59
|
function SelectValue({ ...props }) {
|
|
60
60
|
return (0, jsx_runtime_1.jsx)(SelectPrimitive.Value, { "data-slot": "select-value", ...props });
|
|
61
61
|
}
|
|
62
|
-
function SelectTrigger({ className,
|
|
63
|
-
return ((0, jsx_runtime_1.jsxs)(SelectPrimitive.Trigger, { "data-slot": "select-trigger", "data-size":
|
|
64
|
-
'data-read-only:cursor-default',
|
|
65
|
-
'data-read-only:select-text',
|
|
66
|
-
'data-read-only:bg-zinc-100',
|
|
67
|
-
'data-read-only:opacity-50',
|
|
68
|
-
'data-read-only:pointer-events-none',
|
|
69
|
-
'data-read-only:focus:outline-hidden',
|
|
70
|
-
'data-read-only:focus:ring-0'
|
|
71
|
-
], 'disabled:cursor-not-allowed disabled:opacity-50', className), "data-read-only": props.readOnly ? '' : undefined, ...props, children: [children, !props.readOnly && ((0, jsx_runtime_1.jsx)(SelectPrimitive.Icon, { asChild: true, children: (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronDown, { className: "size-4 opacity-50" }) }))] }));
|
|
62
|
+
function SelectTrigger({ className, readOnly, children, ...props }) {
|
|
63
|
+
return ((0, jsx_runtime_1.jsxs)(SelectPrimitive.Trigger, { "data-slot": "select-trigger", "data-size": "default", className: (0, utils_1.cn)('select-trigger select-read-only select-disabled', className), "aria-readonly": readOnly, "data-read-only": readOnly ? '' : undefined, ...props, children: [children, !readOnly && ((0, jsx_runtime_1.jsx)(SelectPrimitive.Icon, { asChild: true, children: (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronDown, { className: "select-chevron" }) }))] }));
|
|
72
64
|
}
|
|
73
65
|
function SelectScrollUpButton({ className, ...props }) {
|
|
74
|
-
return ((0, jsx_runtime_1.jsx)(SelectPrimitive.ScrollUpButton, { "data-slot": "select-scroll-up-button", className: (0, utils_1.cn)('
|
|
66
|
+
return ((0, jsx_runtime_1.jsx)(SelectPrimitive.ScrollUpButton, { "data-slot": "select-scroll-up-button", className: (0, utils_1.cn)('select-scroll-button', className), ...props, children: (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronUp, { className: "size-4" }) }));
|
|
75
67
|
}
|
|
76
68
|
function SelectScrollDownButton({ className, ...props }) {
|
|
77
|
-
return ((0, jsx_runtime_1.jsx)(SelectPrimitive.ScrollDownButton, { "data-slot": "select-scroll-down-button", className: (0, utils_1.cn)('
|
|
69
|
+
return ((0, jsx_runtime_1.jsx)(SelectPrimitive.ScrollDownButton, { "data-slot": "select-scroll-down-button", className: (0, utils_1.cn)('select-scroll-button', className), ...props, children: (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronDown, { className: "size-4" }) }));
|
|
78
70
|
}
|
|
79
71
|
function SelectContent({ className, children, position = 'popper', ...props }) {
|
|
80
72
|
const options = React.useMemo(() => React.Children.map(React.Children.toArray(children), (child) => {
|
|
@@ -83,19 +75,18 @@ function SelectContent({ className, children, position = 'popper', ...props }) {
|
|
|
83
75
|
return child.props.value;
|
|
84
76
|
}
|
|
85
77
|
}), [children]);
|
|
86
|
-
return ((0, jsx_runtime_1.jsx)(SelectPrimitive.Portal, { children: (0, jsx_runtime_1.jsxs)(SelectPrimitive.Content, { "data-slot": "select-content", "data-position": position, className: (0, utils_1.cn)('group/select
|
|
87
|
-
'data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1', className), "data-empty": options.length === 0, position: position, ...props, children: [(0, jsx_runtime_1.jsx)(SelectScrollUpButton, {}), (0, jsx_runtime_1.jsx)(SelectPrimitive.Viewport, { className: (0, utils_1.cn)('p-1', position === 'popper' &&
|
|
78
|
+
return ((0, jsx_runtime_1.jsx)(SelectPrimitive.Portal, { children: (0, jsx_runtime_1.jsxs)(SelectPrimitive.Content, { "data-slot": "select-content", "data-position": position, className: (0, utils_1.cn)('group/select select-content', position === 'popper' && 'select-content-popper', className), "data-empty": options.length === 0, position: position, ...props, children: [(0, jsx_runtime_1.jsx)(SelectScrollUpButton, {}), (0, jsx_runtime_1.jsx)(SelectPrimitive.Viewport, { className: (0, utils_1.cn)('p-1', position === 'popper' &&
|
|
88
79
|
'h-(--radix-select-trigger-height) w-full min-w-(--radix-select-trigger-width)'), children: children }), (0, jsx_runtime_1.jsx)(SelectScrollDownButton, {})] }) }));
|
|
89
80
|
}
|
|
90
81
|
function SelectEmpty({ className, ...props }) {
|
|
91
|
-
return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "select-empty", className: (0, utils_1.cn)('
|
|
82
|
+
return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "select-empty", className: (0, utils_1.cn)('select-empty', className), ...props }));
|
|
92
83
|
}
|
|
93
84
|
function SelectLabel({ className, ...props }) {
|
|
94
|
-
return ((0, jsx_runtime_1.jsx)(SelectPrimitive.Label, { "data-slot": "select-label", className: (0, utils_1.cn)('
|
|
85
|
+
return ((0, jsx_runtime_1.jsx)(SelectPrimitive.Label, { "data-slot": "select-label", className: (0, utils_1.cn)('select-label', className), ...props }));
|
|
95
86
|
}
|
|
96
87
|
function SelectItem({ className, children, ...props }) {
|
|
97
|
-
return ((0, jsx_runtime_1.jsxs)(SelectPrimitive.Item, { "data-slot": "select-item", className: (0, utils_1.cn)('
|
|
88
|
+
return ((0, jsx_runtime_1.jsxs)(SelectPrimitive.Item, { "data-slot": "select-item", className: (0, utils_1.cn)('select-item', className), ...props, children: [(0, jsx_runtime_1.jsx)("span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: (0, jsx_runtime_1.jsx)(SelectPrimitive.ItemIndicator, { children: (0, jsx_runtime_1.jsx)(lucide_react_1.Check, { className: "size-4" }) }) }), (0, jsx_runtime_1.jsx)(SelectPrimitive.ItemText, { children: children })] }));
|
|
98
89
|
}
|
|
99
90
|
function SelectSeparator({ className, ...props }) {
|
|
100
|
-
return ((0, jsx_runtime_1.jsx)(SelectPrimitive.Separator, { "data-slot": "select-separator", className: (0, utils_1.cn)('
|
|
91
|
+
return ((0, jsx_runtime_1.jsx)(SelectPrimitive.Separator, { "data-slot": "select-separator", className: (0, utils_1.cn)('select-separator', className), ...props }));
|
|
101
92
|
}
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
@theme {
|
|
2
|
+
--spacing-select-h: --spacing(10);
|
|
3
|
+
--spacing-select-px: --spacing(3);
|
|
4
|
+
--spacing-select-py: --spacing(2);
|
|
5
|
+
|
|
6
|
+
--color-select-foreground: var(--color-zinc-700);
|
|
7
|
+
--color-select-placeholder: var(--color-shadcn-400);
|
|
8
|
+
--color-select-border: var(--color-shadcn-300);
|
|
9
|
+
--color-select-chevron: var(--color-shadcn-400);
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
@layer components {
|
|
13
|
+
.select-trigger {
|
|
14
|
+
@apply flex items-center justify-between h-select-h w-full px-select-px py-select-py text-sm font-medium text-select-foreground border border-select-border rounded-md data-placeholder:text-select-placeholder focus:ring-2 focus:ring-offset-0 focus:outline-hidden focus-visible:outline-hidden;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
.select-read-only {
|
|
18
|
+
@apply data-read-only:cursor-default data-read-only:select-text data-read-only:bg-zinc-100 data-read-only:opacity-50 data-read-only:pointer-events-none data-read-only:focus:outline-hidden data-read-only:focus:ring-0;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
.select-disabled {
|
|
22
|
+
@apply disabled:cursor-not-allowed disabled:opacity-50;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
.select-chevron {
|
|
26
|
+
@apply text-select-chevron size-4;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
.select-scroll-button {
|
|
30
|
+
@apply flex cursor-default items-center justify-center py-1;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
.select-content {
|
|
34
|
+
@apply bg-popover text-popover-foreground relative z-50 max-h-96 min-w-32 overflow-hidden rounded-md border shadow-md;
|
|
35
|
+
@apply 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-[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;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
.select-content-popper {
|
|
39
|
+
@apply data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1;
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
.select-empty {
|
|
43
|
+
@apply text-muted-foreground hidden py-6 text-center text-sm group-data-[empty=true]/select:block;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
.select-label {
|
|
47
|
+
@apply py-1.5 pr-8 pl-2 text-sm font-semibold;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
.select-item {
|
|
51
|
+
@apply focus:bg-accent focus:text-accent-foreground relative flex w-full cursor-default items-center rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
.select-separator {
|
|
55
|
+
@apply bg-muted -mx-1 my-1 h-px;
|
|
56
|
+
}
|
|
57
|
+
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/stepper/index.tsx"],"names":[],"mappings":"AAIA,wBAAgB,OAAO,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/stepper/index.tsx"],"names":[],"mappings":"AAIA,wBAAgB,OAAO,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAI3E;AAED,MAAM,MAAM,gBAAgB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC3D,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,wBAAgB,WAAW,CAAC,EAC1B,SAAS,EACT,MAAc,EACd,QAAgB,EAChB,GAAG,KAAK,EACT,EAAE,gBAAgB,2CAUlB;AAED,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQ7B;AAED,MAAM,MAAM,oBAAoB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/D,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,CAAA;AAED,wBAAgB,eAAe,CAAC,EAC9B,SAAS,EACT,KAAK,EACL,WAAW,EACX,GAAG,KAAK,EACT,EAAE,oBAAoB,2CActB;AAED,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,iBAAiB,GAAG;IAC1D,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,CAAA;AAED,eAAO,MAAM,cAAc,GAAI,sBAAsB,mBAAmB,mDAEvE,CAAA;AAED,eAAO,MAAM,mBAAmB,+CAK/B,CAAA"}
|
|
@@ -10,16 +10,16 @@ const utils_1 = require("../../../lib/utils");
|
|
|
10
10
|
const lucide_react_1 = require("lucide-react");
|
|
11
11
|
const skeleton_1 = require("../skeleton");
|
|
12
12
|
function Stepper({ className, ...props }) {
|
|
13
|
-
return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "stepper", className: (0, utils_1.cn)('
|
|
13
|
+
return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "stepper", className: (0, utils_1.cn)('stepper', className), ...props }));
|
|
14
14
|
}
|
|
15
15
|
function StepperItem({ className, active = false, complete = false, ...props }) {
|
|
16
|
-
return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "stepper-item", "data-active": active, "data-complete": complete, className: (0, utils_1.cn)('group
|
|
16
|
+
return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "stepper-item", "data-active": active, "data-complete": complete, className: (0, utils_1.cn)('group stepper-item', className), ...props }));
|
|
17
17
|
}
|
|
18
18
|
function StepperItemNumber({ className, ...props }) {
|
|
19
|
-
return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "stepper-item-number", className: (0, utils_1.cn)('
|
|
19
|
+
return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "stepper-item-number", className: (0, utils_1.cn)('stepper-item-number', className), ...props }));
|
|
20
20
|
}
|
|
21
21
|
function StepperItemText({ className, title, description, ...props }) {
|
|
22
|
-
return ((0, jsx_runtime_1.jsxs)("div", { "data-slot": "stepper-item-text", className: (0, utils_1.cn)('
|
|
22
|
+
return ((0, jsx_runtime_1.jsxs)("div", { "data-slot": "stepper-item-text", className: (0, utils_1.cn)('stepper-item-text', className), ...props, children: [(0, jsx_runtime_1.jsxs)("div", { className: "stepper-item-title", children: [(0, jsx_runtime_1.jsx)("p", { children: title }), (0, jsx_runtime_1.jsx)(lucide_react_1.CircleCheck, { className: "stepper-item-icon", width: 16, height: 16 })] }), description && (0, jsx_runtime_1.jsx)("p", { className: "stepper-item-description", children: description })] }));
|
|
23
23
|
}
|
|
24
24
|
const StepperContent = ({ active, children }) => {
|
|
25
25
|
return active ? (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children }) : null;
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
@theme {
|
|
2
|
+
--color-stepper-item-text: var(--color-shadcn-400);
|
|
3
|
+
--color-stepper-item-active: var(--color-zinc-700);
|
|
4
|
+
--color-stepper-item-number: var(--color-shadcn-400);
|
|
5
|
+
--color-stepper-item-icon: var(--color-green-600);
|
|
6
|
+
--color-stepper-item-description: var(--color-zinc-500);
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
@layer components {
|
|
10
|
+
.stepper {
|
|
11
|
+
@apply flex flex-col gap-4;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
.stepper-item {
|
|
15
|
+
@apply flex flex-row gap-3 data-[complete=true]:cursor-pointer;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
.stepper-item-number {
|
|
19
|
+
@apply border-stepper-item-number text-stepper-item-number flex h-8 w-8 shrink-0 items-center justify-center rounded-full border text-sm font-medium;
|
|
20
|
+
@apply group-data-[active=true]:border-none group-data-[active=true]:bg-stepper-item-active group-data-[active=true]:text-white;
|
|
21
|
+
@apply group-data-[complete=true]:border-none group-data-[complete=true]:bg-white group-data-[complete=true]:text-stepper-item-active;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.stepper-item-text {
|
|
25
|
+
@apply text-stepper-item-text flex flex-col text-sm font-medium;
|
|
26
|
+
@apply group-data-[active=true]:text-stepper-item-active;
|
|
27
|
+
@apply group-data-[complete=true]:text-stepper-item-active group-data-[complete=true]:underline;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
.stepper-item-title {
|
|
31
|
+
@apply flex h-8 items-center gap-3;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
.stepper-item-icon {
|
|
35
|
+
@apply text-stepper-item-icon group-data-[complete=false]:hidden;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
.stepper-item-description {
|
|
39
|
+
@apply text-xs text-stepper-item-description group-data-[active=false]:hidden;
|
|
40
|
+
}
|
|
41
|
+
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/tabs/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,aAAa,MAAM,sBAAsB,CAAA;AAIrD,iBAAS,IAAI,CAAC,EACZ,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,aAAa,CAAC,IAAI,CAAC,2CAQjD;AAED,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,aAAa,CAAC,IAAI,CAAC,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/tabs/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,aAAa,MAAM,sBAAsB,CAAA;AAIrD,iBAAS,IAAI,CAAC,EACZ,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,aAAa,CAAC,IAAI,CAAC,2CAQjD;AAED,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,aAAa,CAAC,IAAI,CAAC,2CAQjD;AAED,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,aAAa,CAAC,OAAO,CAAC,2CAWpD;AAED,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,aAAa,CAAC,OAAO,CAAC,2CAQpD;AAED,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,CAAA"}
|