@clicoh/orion-library 1.1.0-beta.6 → 1.1.0-beta.8
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/assets/css/base.css +18 -0
- package/dist/components/01-atoms/Badge/Badge.d.ts +14 -4
- package/dist/components/01-atoms/Badge/Badge.d.ts.map +1 -1
- package/dist/components/01-atoms/Badge/Badge.jsx +34 -4
- package/dist/components/01-atoms/Badge/Badge.jsx.map +1 -1
- package/dist/components/01-atoms/CountryFlag/CountryFlag.d.ts +30 -0
- package/dist/components/01-atoms/CountryFlag/CountryFlag.d.ts.map +1 -0
- package/dist/components/01-atoms/CountryFlag/CountryFlag.jsx +105 -0
- package/dist/components/01-atoms/CountryFlag/CountryFlag.jsx.map +1 -0
- package/dist/components/01-atoms/CountryFlag/index.d.ts +3 -0
- package/dist/components/01-atoms/CountryFlag/index.d.ts.map +1 -0
- package/dist/components/01-atoms/CountryFlag/index.js +2 -0
- package/dist/components/01-atoms/CountryFlag/index.js.map +1 -0
- package/dist/components/01-atoms/Input/Input.d.ts +3 -1
- package/dist/components/01-atoms/Input/Input.d.ts.map +1 -1
- package/dist/components/01-atoms/Input/Input.jsx +5 -2
- package/dist/components/01-atoms/Input/Input.jsx.map +1 -1
- package/dist/components/01-atoms/Input/utils/border.d.ts +6 -1
- package/dist/components/01-atoms/Input/utils/border.d.ts.map +1 -1
- package/dist/components/01-atoms/Input/utils/border.js +13 -3
- package/dist/components/01-atoms/Input/utils/border.js.map +1 -1
- package/dist/components/01-atoms/MultiSelect/MultiSelect.d.ts +3 -1
- package/dist/components/01-atoms/MultiSelect/MultiSelect.d.ts.map +1 -1
- package/dist/components/01-atoms/MultiSelect/MultiSelect.jsx +17 -5
- package/dist/components/01-atoms/MultiSelect/MultiSelect.jsx.map +1 -1
- package/dist/components/01-atoms/Paragraph/Paragraph.d.ts +14 -4
- package/dist/components/01-atoms/Paragraph/Paragraph.d.ts.map +1 -1
- package/dist/components/01-atoms/Paragraph/Paragraph.jsx +30 -8
- package/dist/components/01-atoms/Paragraph/Paragraph.jsx.map +1 -1
- package/dist/components/01-atoms/Select/Select.d.ts +3 -1
- package/dist/components/01-atoms/Select/Select.d.ts.map +1 -1
- package/dist/components/01-atoms/Select/Select.jsx +10 -4
- package/dist/components/01-atoms/Select/Select.jsx.map +1 -1
- package/dist/components/01-atoms/index.d.ts +1 -0
- package/dist/components/01-atoms/index.d.ts.map +1 -1
- package/dist/components/01-atoms/index.js +1 -0
- package/dist/components/01-atoms/index.js.map +1 -1
- package/dist/components/02-molecules/Autocomplete/Autocomplete.d.ts +3 -1
- package/dist/components/02-molecules/Autocomplete/Autocomplete.d.ts.map +1 -1
- package/dist/components/02-molecules/Autocomplete/Autocomplete.jsx +3 -2
- package/dist/components/02-molecules/Autocomplete/Autocomplete.jsx.map +1 -1
- package/dist/components/02-molecules/BellNotifications/index.d.ts +1 -1
- package/dist/components/02-molecules/BellNotifications/index.d.ts.map +1 -1
- package/dist/components/02-molecules/Filter/Filter.d.ts +13 -50
- package/dist/components/02-molecules/Filter/Filter.d.ts.map +1 -1
- package/dist/components/02-molecules/Filter/Filter.jsx +156 -165
- package/dist/components/02-molecules/Filter/Filter.jsx.map +1 -1
- package/dist/components/02-molecules/Filter/index.d.ts +2 -0
- package/dist/components/02-molecules/Filter/index.d.ts.map +1 -1
- package/dist/components/02-molecules/Filter/index.js +2 -0
- package/dist/components/02-molecules/Filter/index.js.map +1 -1
- package/dist/components/02-molecules/Filter/types.d.ts +59 -0
- package/dist/components/02-molecules/Filter/types.d.ts.map +1 -0
- package/dist/components/02-molecules/Filter/types.js +2 -0
- package/dist/components/02-molecules/Filter/types.js.map +1 -0
- package/dist/components/02-molecules/Filter/utils/getFilterChips.d.ts +23 -0
- package/dist/components/02-molecules/Filter/utils/getFilterChips.d.ts.map +1 -0
- package/dist/components/02-molecules/Filter/utils/getFilterChips.js +47 -0
- package/dist/components/02-molecules/Filter/utils/getFilterChips.js.map +1 -0
- package/dist/components/02-molecules/FilterChips/FilterChips.d.ts +44 -0
- package/dist/components/02-molecules/FilterChips/FilterChips.d.ts.map +1 -0
- package/dist/components/02-molecules/FilterChips/FilterChips.jsx +60 -0
- package/dist/components/02-molecules/FilterChips/FilterChips.jsx.map +1 -0
- package/dist/components/02-molecules/FilterChips/index.d.ts +2 -0
- package/dist/components/02-molecules/FilterChips/index.d.ts.map +1 -0
- package/dist/components/02-molecules/FilterChips/index.js +2 -0
- package/dist/components/02-molecules/FilterChips/index.js.map +1 -0
- package/dist/components/02-molecules/ImageViewer/ImageViewer.d.ts +60 -0
- package/dist/components/02-molecules/ImageViewer/ImageViewer.d.ts.map +1 -0
- package/dist/components/02-molecules/ImageViewer/ImageViewer.jsx +144 -0
- package/dist/components/02-molecules/ImageViewer/ImageViewer.jsx.map +1 -0
- package/dist/components/02-molecules/ImageViewer/index.d.ts +2 -0
- package/dist/components/02-molecules/ImageViewer/index.d.ts.map +1 -0
- package/dist/components/02-molecules/ImageViewer/index.js +2 -0
- package/dist/components/02-molecules/ImageViewer/index.js.map +1 -0
- package/dist/components/02-molecules/SideNav/SideNav.d.ts +58 -0
- package/dist/components/02-molecules/SideNav/SideNav.d.ts.map +1 -0
- package/dist/components/02-molecules/SideNav/SideNav.jsx +53 -0
- package/dist/components/02-molecules/SideNav/SideNav.jsx.map +1 -0
- package/dist/components/02-molecules/SideNav/SideNavItem.d.ts +36 -0
- package/dist/components/02-molecules/SideNav/SideNavItem.d.ts.map +1 -0
- package/dist/components/02-molecules/SideNav/SideNavItem.jsx +38 -0
- package/dist/components/02-molecules/SideNav/SideNavItem.jsx.map +1 -0
- package/dist/components/02-molecules/SideNav/index.d.ts +3 -0
- package/dist/components/02-molecules/SideNav/index.d.ts.map +1 -0
- package/dist/components/02-molecules/SideNav/index.js +3 -0
- package/dist/components/02-molecules/SideNav/index.js.map +1 -0
- package/dist/components/02-molecules/Tab/TabItem.d.ts +4 -1
- package/dist/components/02-molecules/Tab/TabItem.d.ts.map +1 -1
- package/dist/components/02-molecules/Tab/TabItem.jsx +9 -2
- package/dist/components/02-molecules/Tab/TabItem.jsx.map +1 -1
- package/dist/components/02-molecules/Tab/TabList.d.ts +12 -2
- package/dist/components/02-molecules/Tab/TabList.d.ts.map +1 -1
- package/dist/components/02-molecules/Tab/TabList.jsx +40 -9
- package/dist/components/02-molecules/Tab/TabList.jsx.map +1 -1
- package/dist/components/02-molecules/Table/Table.d.ts.map +1 -1
- package/dist/components/02-molecules/Table/Table.jsx +6 -3
- package/dist/components/02-molecules/Table/Table.jsx.map +1 -1
- package/dist/components/02-molecules/index.d.ts +3 -0
- package/dist/components/02-molecules/index.d.ts.map +1 -1
- package/dist/components/02-molecules/index.js +3 -0
- package/dist/components/02-molecules/index.js.map +1 -1
- package/dist/components/03-organisms/AsideFilters/AsideFilters.jsx +1 -1
- package/dist/components/03-organisms/AsideFilters/AsideFilters.jsx.map +1 -1
- package/dist/components/03-organisms/DataTable/DataTable.d.ts +10 -1
- package/dist/components/03-organisms/DataTable/DataTable.d.ts.map +1 -1
- package/dist/components/03-organisms/DataTable/DataTable.jsx +16 -3
- package/dist/components/03-organisms/DataTable/DataTable.jsx.map +1 -1
- package/dist/components/03-organisms/Header/HeaderActions.d.ts.map +1 -1
- package/dist/components/03-organisms/Header/HeaderActions.jsx +13 -12
- package/dist/components/03-organisms/Header/HeaderActions.jsx.map +1 -1
- package/dist/components/04-templates/SideFilterTemplate/SideFilterTemplate.d.ts +3 -1
- package/dist/components/04-templates/SideFilterTemplate/SideFilterTemplate.d.ts.map +1 -1
- package/dist/components/04-templates/SideFilterTemplate/SideFilterTemplate.jsx +3 -1
- package/dist/components/04-templates/SideFilterTemplate/SideFilterTemplate.jsx.map +1 -1
- package/package.json +1 -1
- package/tailwind.config.ts +21 -0
package/assets/css/base.css
CHANGED
|
@@ -33,6 +33,7 @@
|
|
|
33
33
|
|
|
34
34
|
--color-error-1: #fceaea;
|
|
35
35
|
--color-error: #df3c3c;
|
|
36
|
+
--color-error-strong: #c1332f;
|
|
36
37
|
--color-error-dark: #df3c3c;
|
|
37
38
|
--color-error-dark-1: #4e2c2f;
|
|
38
39
|
|
|
@@ -43,6 +44,7 @@
|
|
|
43
44
|
|
|
44
45
|
--color-success-1: #e8f6ed;
|
|
45
46
|
--color-success: #16a34a;
|
|
47
|
+
--color-success-strong: #16803c;
|
|
46
48
|
--color-success-dark: #22c55e;
|
|
47
49
|
--color-success-dark-1: #264936;
|
|
48
50
|
|
|
@@ -75,6 +77,22 @@
|
|
|
75
77
|
--color-violet-dark: #cf5dfe;
|
|
76
78
|
--color-violet-dark-1: #292532;
|
|
77
79
|
|
|
80
|
+
--color-cyan-1: #e7f5f7;
|
|
81
|
+
--color-cyan: #0e8c9e;
|
|
82
|
+
--color-cyan-dark: #22b8cc;
|
|
83
|
+
--color-cyan-dark-1: #22414a;
|
|
84
|
+
|
|
85
|
+
--color-olive-1: #eff7e4;
|
|
86
|
+
--color-olive: #5f9b12;
|
|
87
|
+
--color-olive-dark: #7fbf2a;
|
|
88
|
+
--color-olive-dark-1: #33421f;
|
|
89
|
+
|
|
90
|
+
--color-amber-1: #fdf3e0;
|
|
91
|
+
--color-amber: #b07800;
|
|
92
|
+
--color-amber-strong: #8a5b00;
|
|
93
|
+
--color-amber-dark: #d9a21a;
|
|
94
|
+
--color-amber-dark-1: #4a3b1c;
|
|
95
|
+
|
|
78
96
|
--background-image-clicoh: linear-gradient(135deg, #6a5df9, #c854e4);
|
|
79
97
|
--background-image-brand-shipping: linear-gradient(135deg, #5683dd, #8ee3c6);
|
|
80
98
|
--background-image-brand-full: linear-gradient(135deg, #cfbdb2, #cf86f4);
|
|
@@ -1,21 +1,31 @@
|
|
|
1
1
|
import type { HTMLAttributes, ReactNode } from 'react';
|
|
2
2
|
type BadgeProps = {
|
|
3
|
-
modifier: 'success' | 'warning' | 'error' | 'info' | 'progress' | 'disabled';
|
|
3
|
+
modifier: 'success' | 'warning' | 'error' | 'info' | 'progress' | 'disabled' | 'violet' | 'cyan' | 'olive' | 'amber';
|
|
4
|
+
accentLabel?: boolean;
|
|
4
5
|
} & HTMLAttributes<HTMLSpanElement>;
|
|
5
6
|
/**
|
|
6
7
|
* Badge component used for indicating different statuses.
|
|
7
8
|
*
|
|
9
|
+
* The modifier always colors the border and the dot. With `accentLabel` the
|
|
10
|
+
* label takes that same color, for outline pills meant to be told apart by hue
|
|
11
|
+
* alone; without it the label keeps the default text color.
|
|
12
|
+
*
|
|
8
13
|
* @component
|
|
9
14
|
* @example
|
|
10
|
-
* //
|
|
15
|
+
* // Default label color
|
|
11
16
|
* <Badge modifier="success">Success</Badge>
|
|
12
17
|
*
|
|
18
|
+
* @example
|
|
19
|
+
* // Label in the modifier color
|
|
20
|
+
* <Badge modifier="info" accentLabel>Reviewing</Badge>
|
|
21
|
+
*
|
|
13
22
|
* @param {Object} props - The properties of the Badge component.
|
|
14
|
-
* @param {'success' | 'warning' | 'error' | 'info'} props.modifier - The modifier to determine the badge style.
|
|
23
|
+
* @param {'success' | 'warning' | 'error' | 'info' | 'progress' | 'disabled' | 'violet' | 'cyan' | 'olive' | 'amber'} props.modifier - The modifier to determine the badge style.
|
|
24
|
+
* @param {boolean} [props.accentLabel] - Whether the label takes the modifier color.
|
|
15
25
|
* @param {ReactNode} props.children - The content to be displayed inside the badge.
|
|
16
26
|
*
|
|
17
27
|
* @returns {ReactNode} The rendered Badge component.
|
|
18
28
|
*/
|
|
19
|
-
export declare function Badge({ modifier, children, ...restProps }: BadgeProps): ReactNode;
|
|
29
|
+
export declare function Badge({ modifier, accentLabel, children, ...restProps }: BadgeProps): ReactNode;
|
|
20
30
|
export {};
|
|
21
31
|
//# sourceMappingURL=Badge.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../../src/components/01-atoms/Badge/Badge.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvD,KAAK,UAAU,GAAG;IAChB,QAAQ,
|
|
1
|
+
{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../../src/components/01-atoms/Badge/Badge.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvD,KAAK,UAAU,GAAG;IAChB,QAAQ,EACJ,SAAS,GACT,SAAS,GACT,OAAO,GACP,MAAM,GACN,UAAU,GACV,UAAU,GACV,QAAQ,GACR,MAAM,GACN,OAAO,GACP,OAAO,CAAC;IACZ,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,GAAG,cAAc,CAAC,eAAe,CAAC,CAAC;AAqDpC;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,KAAK,CAAC,EACpB,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,GAAG,SAAS,EACb,EAAE,UAAU,GAAG,SAAS,CAqBxB"}
|
|
@@ -7,25 +7,55 @@ const styleMap = {
|
|
|
7
7
|
info: clsx('border-info before:bg-info dark:border-info-dark dark:before:bg-info-dark'),
|
|
8
8
|
progress: clsx('border-lavender before:bg-lavender dark:border-lavender-dark dark:before:bg-lavender-dark'),
|
|
9
9
|
disabled: clsx('border-gray-1 before:bg-gray-1 dark:border-gray-2 dark:before:bg-gray-2'),
|
|
10
|
+
violet: clsx('border-violet before:bg-violet dark:border-violet-dark dark:before:bg-violet-dark'),
|
|
11
|
+
cyan: clsx('border-cyan before:bg-cyan dark:border-cyan-dark dark:before:bg-cyan-dark'),
|
|
12
|
+
olive: clsx('border-olive before:bg-olive dark:border-olive-dark dark:before:bg-olive-dark'),
|
|
13
|
+
amber: clsx('border-amber before:bg-amber dark:border-amber-dark dark:before:bg-amber-dark'),
|
|
14
|
+
};
|
|
15
|
+
/**
|
|
16
|
+
* `warning` es la unica que no usa su propio token para la etiqueta: #FFC34C
|
|
17
|
+
* sobre blanco no llega a 2:1 de contraste y el texto queda ilegible, asi que
|
|
18
|
+
* toma el amarillo oscuro del tema. El borde y el punto siguen en su color.
|
|
19
|
+
*/
|
|
20
|
+
const accentLabelMap = {
|
|
21
|
+
success: clsx('text-success dark:text-success-dark'),
|
|
22
|
+
warning: clsx('text-amber dark:text-warning-dark'),
|
|
23
|
+
error: clsx('text-error dark:text-error-dark'),
|
|
24
|
+
info: clsx('text-info dark:text-info-dark'),
|
|
25
|
+
progress: clsx('text-lavender dark:text-lavender-dark'),
|
|
26
|
+
disabled: clsx('text-gray-1 dark:text-gray-2'),
|
|
27
|
+
violet: clsx('text-violet dark:text-violet-dark'),
|
|
28
|
+
cyan: clsx('text-cyan dark:text-cyan-dark'),
|
|
29
|
+
olive: clsx('text-olive dark:text-olive-dark'),
|
|
30
|
+
amber: clsx('text-amber dark:text-amber-dark'),
|
|
10
31
|
};
|
|
11
32
|
/**
|
|
12
33
|
* Badge component used for indicating different statuses.
|
|
13
34
|
*
|
|
35
|
+
* The modifier always colors the border and the dot. With `accentLabel` the
|
|
36
|
+
* label takes that same color, for outline pills meant to be told apart by hue
|
|
37
|
+
* alone; without it the label keeps the default text color.
|
|
38
|
+
*
|
|
14
39
|
* @component
|
|
15
40
|
* @example
|
|
16
|
-
* //
|
|
41
|
+
* // Default label color
|
|
17
42
|
* <Badge modifier="success">Success</Badge>
|
|
18
43
|
*
|
|
44
|
+
* @example
|
|
45
|
+
* // Label in the modifier color
|
|
46
|
+
* <Badge modifier="info" accentLabel>Reviewing</Badge>
|
|
47
|
+
*
|
|
19
48
|
* @param {Object} props - The properties of the Badge component.
|
|
20
|
-
* @param {'success' | 'warning' | 'error' | 'info'} props.modifier - The modifier to determine the badge style.
|
|
49
|
+
* @param {'success' | 'warning' | 'error' | 'info' | 'progress' | 'disabled' | 'violet' | 'cyan' | 'olive' | 'amber'} props.modifier - The modifier to determine the badge style.
|
|
50
|
+
* @param {boolean} [props.accentLabel] - Whether the label takes the modifier color.
|
|
21
51
|
* @param {ReactNode} props.children - The content to be displayed inside the badge.
|
|
22
52
|
*
|
|
23
53
|
* @returns {ReactNode} The rendered Badge component.
|
|
24
54
|
*/
|
|
25
|
-
export function Badge({ modifier, children, ...restProps }) {
|
|
55
|
+
export function Badge({ modifier, accentLabel, children, ...restProps }) {
|
|
26
56
|
const className = clsx('relative inline-block rounded-full border py-1 pr-2 pl-6', 'before:absolute before:start-3 before:top-[50%] before:-mt-1 before:block before:h-[6px] before:w-[6px] before:rounded-full', styleMap[modifier], restProps.className);
|
|
27
57
|
return (<span {...restProps} className={className}>
|
|
28
|
-
<Paragraph size="chips" className=
|
|
58
|
+
<Paragraph size="chips" className={clsx('text-nowrap', accentLabel ? accentLabelMap[modifier] : 'dark:text-white')}>
|
|
29
59
|
{children}
|
|
30
60
|
</Paragraph>
|
|
31
61
|
</span>);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Badge.jsx","sourceRoot":"","sources":["../../../../src/components/01-atoms/Badge/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"Badge.jsx","sourceRoot":"","sources":["../../../../src/components/01-atoms/Badge/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAiBzC,MAAM,QAAQ,GAA2C;IACvD,OAAO,EAAE,IAAI,CACX,uFAAuF,CACxF;IACD,OAAO,EAAE,IAAI,CACX,uFAAuF,CACxF;IACD,KAAK,EAAE,IAAI,CACT,+EAA+E,CAChF;IACD,IAAI,EAAE,IAAI,CACR,2EAA2E,CAC5E;IACD,QAAQ,EAAE,IAAI,CACZ,2FAA2F,CAC5F;IACD,QAAQ,EAAE,IAAI,CACZ,yEAAyE,CAC1E;IACD,MAAM,EAAE,IAAI,CACV,mFAAmF,CACpF;IACD,IAAI,EAAE,IAAI,CACR,2EAA2E,CAC5E;IACD,KAAK,EAAE,IAAI,CACT,+EAA+E,CAChF;IACD,KAAK,EAAE,IAAI,CACT,+EAA+E,CAChF;CACF,CAAC;AAEF;;;;GAIG;AACH,MAAM,cAAc,GAA2C;IAC7D,OAAO,EAAE,IAAI,CAAC,qCAAqC,CAAC;IACpD,OAAO,EAAE,IAAI,CAAC,mCAAmC,CAAC;IAClD,KAAK,EAAE,IAAI,CAAC,iCAAiC,CAAC;IAC9C,IAAI,EAAE,IAAI,CAAC,+BAA+B,CAAC;IAC3C,QAAQ,EAAE,IAAI,CAAC,uCAAuC,CAAC;IACvD,QAAQ,EAAE,IAAI,CAAC,8BAA8B,CAAC;IAC9C,MAAM,EAAE,IAAI,CAAC,mCAAmC,CAAC;IACjD,IAAI,EAAE,IAAI,CAAC,+BAA+B,CAAC;IAC3C,KAAK,EAAE,IAAI,CAAC,iCAAiC,CAAC;IAC9C,KAAK,EAAE,IAAI,CAAC,iCAAiC,CAAC;CAC/C,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,MAAM,UAAU,KAAK,CAAC,EACpB,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,GAAG,SAAS,EACD;IACX,MAAM,SAAS,GAAG,IAAI,CACpB,0DAA0D,EAC1D,6HAA6H,EAC7H,QAAQ,CAAC,QAAQ,CAAC,EAClB,SAAS,CAAC,SAAS,CACpB,CAAC;IAEF,OAAO,CACL,CAAC,IAAI,CAAC,IAAI,SAAS,CAAC,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,CACxC;MAAA,CAAC,SAAS,CACR,IAAI,CAAC,OAAO,CACZ,SAAS,CAAC,CAAC,IAAI,CACb,aAAa,EACb,WAAW,CAAC,CAAC,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,iBAAiB,CAC3D,CAAC,CAEF;QAAA,CAAC,QAAQ,CACX;MAAA,EAAE,SAAS,CACb;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import type { HTMLAttributes, ReactNode } from 'react';
|
|
2
|
+
export type CountryFlagProps = {
|
|
3
|
+
/** Codigo de dos letras del pais, case insensitive. Ej: `MX`, `mx`. */
|
|
4
|
+
code: string;
|
|
5
|
+
size?: 'sm' | 'md' | 'lg';
|
|
6
|
+
} & Omit<HTMLAttributes<HTMLSpanElement>, 'children'>;
|
|
7
|
+
/**
|
|
8
|
+
* Bandera circular de un pais, resuelta a partir de su codigo de dos letras.
|
|
9
|
+
*
|
|
10
|
+
* Cuando el codigo no tiene bandera definida cae en un circulo neutro con el
|
|
11
|
+
* codigo escrito, para que un pais nuevo no deje un hueco en la interfaz.
|
|
12
|
+
*
|
|
13
|
+
* Es decorativa por defecto. Si se usa sin una etiqueta de texto al lado,
|
|
14
|
+
* pasarle `aria-label` para que tenga nombre accesible.
|
|
15
|
+
*
|
|
16
|
+
* @component
|
|
17
|
+
* @example
|
|
18
|
+
* // Junto a un texto que ya nombra al pais
|
|
19
|
+
* <CountryFlag code="MX" />
|
|
20
|
+
*
|
|
21
|
+
* @example
|
|
22
|
+
* // Sola, con nombre accesible y tamano grande
|
|
23
|
+
* <CountryFlag code="co" size="lg" aria-label="Colombia" />
|
|
24
|
+
*
|
|
25
|
+
* @param {string} props.code - Codigo de dos letras del pais, case insensitive.
|
|
26
|
+
* @param {'sm' | 'md' | 'lg'} [props.size] - Diametro del circulo. Default `md`.
|
|
27
|
+
* @returns {ReactNode} La bandera recortada en circulo.
|
|
28
|
+
*/
|
|
29
|
+
export declare function CountryFlag({ code, size, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, ...restProps }: CountryFlagProps): ReactNode;
|
|
30
|
+
//# sourceMappingURL=CountryFlag.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CountryFlag.d.ts","sourceRoot":"","sources":["../../../../src/components/01-atoms/CountryFlag/CountryFlag.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,uEAAuE;IACvE,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;CAC3B,GAAG,IAAI,CAAC,cAAc,CAAC,eAAe,CAAC,EAAE,UAAU,CAAC,CAAC;AAwGtD;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,IAAW,EACX,YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,cAAc,EACjC,GAAG,SAAS,EACb,EAAE,gBAAgB,GAAG,SAAS,CAkC9B"}
|
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
import clsx from 'clsx';
|
|
2
|
+
const sizeMap = {
|
|
3
|
+
sm: 'h-4 w-4 text-[8px]',
|
|
4
|
+
md: 'h-5 w-5 text-[9px]',
|
|
5
|
+
lg: 'h-6 w-6 text-[10px]',
|
|
6
|
+
};
|
|
7
|
+
/**
|
|
8
|
+
* Estrella de cinco puntas con radio 1 centrada en el origen. Se reusa con
|
|
9
|
+
* `translate` y `scale` en cada bandera que la necesita.
|
|
10
|
+
*/
|
|
11
|
+
const STAR_POINTS = '0,-1 0.225,-0.309 0.951,-0.309 0.363,0.118 0.588,0.809 0,0.382 -0.588,0.809 -0.363,0.118 -0.951,-0.309 -0.225,-0.309';
|
|
12
|
+
const star = (cx, cy, r, fill) => (<polygon points={STAR_POINTS} fill={fill} transform={`translate(${cx} ${cy}) scale(${r})`}/>);
|
|
13
|
+
/**
|
|
14
|
+
* Cada bandera se dibuja sobre una grilla cuadrada de 24 y el contenedor la
|
|
15
|
+
* recorta en circulo, asi que lo que se ve es el cuadrado central de la
|
|
16
|
+
* bandera real. Los escudos y emblemas se omiten a proposito: a 16 o 24 px no
|
|
17
|
+
* se distinguen y solo agregarian paths enormes.
|
|
18
|
+
*/
|
|
19
|
+
const ARGENTINA = (<>
|
|
20
|
+
<rect width={24} height={24} fill="#74ACDF"/>
|
|
21
|
+
<rect y={8} width={24} height={8} fill="#FFFFFF"/>
|
|
22
|
+
<circle cx={12} cy={12} r={2.6} fill="#F6B40E"/>
|
|
23
|
+
</>);
|
|
24
|
+
const CHILE = (<>
|
|
25
|
+
<rect width={24} height={24} fill="#FFFFFF"/>
|
|
26
|
+
<rect y={12} width={24} height={12} fill="#D52B1E"/>
|
|
27
|
+
<rect width={9} height={12} fill="#0039A6"/>
|
|
28
|
+
{star(4.5, 6, 3, '#FFFFFF')}
|
|
29
|
+
</>);
|
|
30
|
+
const COLOMBIA = (<>
|
|
31
|
+
<rect width={24} height={24} fill="#FCD116"/>
|
|
32
|
+
<rect y={12} width={24} height={6} fill="#003893"/>
|
|
33
|
+
<rect y={18} width={24} height={6} fill="#CE1126"/>
|
|
34
|
+
</>);
|
|
35
|
+
const MEXICO = (<>
|
|
36
|
+
<rect width={8} height={24} fill="#006847"/>
|
|
37
|
+
<rect x={8} width={8} height={24} fill="#FFFFFF"/>
|
|
38
|
+
<rect x={16} width={8} height={24} fill="#CE1126"/>
|
|
39
|
+
</>);
|
|
40
|
+
const PANAMA = (<>
|
|
41
|
+
<rect width={24} height={24} fill="#FFFFFF"/>
|
|
42
|
+
<rect x={12} width={12} height={12} fill="#DA121A"/>
|
|
43
|
+
<rect y={12} width={12} height={12} fill="#072357"/>
|
|
44
|
+
{star(6, 6, 3.2, '#072357')}
|
|
45
|
+
{star(18, 18, 3.2, '#DA121A')}
|
|
46
|
+
</>);
|
|
47
|
+
const PERU = (<>
|
|
48
|
+
<rect width={8} height={24} fill="#D91023"/>
|
|
49
|
+
<rect x={8} width={8} height={24} fill="#FFFFFF"/>
|
|
50
|
+
<rect x={16} width={8} height={24} fill="#D91023"/>
|
|
51
|
+
</>);
|
|
52
|
+
const URUGUAY = (<>
|
|
53
|
+
<rect width={24} height={24} fill="#FFFFFF"/>
|
|
54
|
+
<rect y={5.5} width={24} height={2.7} fill="#0038A8"/>
|
|
55
|
+
<rect y={11} width={24} height={2.7} fill="#0038A8"/>
|
|
56
|
+
<rect y={16.5} width={24} height={2.7} fill="#0038A8"/>
|
|
57
|
+
<rect y={22} width={24} height={2} fill="#0038A8"/>
|
|
58
|
+
<rect width={13} height={13} fill="#FFFFFF"/>
|
|
59
|
+
<circle cx={6.5} cy={6.5} r={3} fill="#FCD116"/>
|
|
60
|
+
</>);
|
|
61
|
+
const flagMap = {
|
|
62
|
+
AR: ARGENTINA,
|
|
63
|
+
CL: CHILE,
|
|
64
|
+
CO: COLOMBIA,
|
|
65
|
+
MX: MEXICO,
|
|
66
|
+
PA: PANAMA,
|
|
67
|
+
PE: PERU,
|
|
68
|
+
UY: URUGUAY,
|
|
69
|
+
/** `UR` no es ISO, pero hay catalogos que identifican asi a Uruguay. */
|
|
70
|
+
UR: URUGUAY,
|
|
71
|
+
};
|
|
72
|
+
/**
|
|
73
|
+
* Bandera circular de un pais, resuelta a partir de su codigo de dos letras.
|
|
74
|
+
*
|
|
75
|
+
* Cuando el codigo no tiene bandera definida cae en un circulo neutro con el
|
|
76
|
+
* codigo escrito, para que un pais nuevo no deje un hueco en la interfaz.
|
|
77
|
+
*
|
|
78
|
+
* Es decorativa por defecto. Si se usa sin una etiqueta de texto al lado,
|
|
79
|
+
* pasarle `aria-label` para que tenga nombre accesible.
|
|
80
|
+
*
|
|
81
|
+
* @component
|
|
82
|
+
* @example
|
|
83
|
+
* // Junto a un texto que ya nombra al pais
|
|
84
|
+
* <CountryFlag code="MX" />
|
|
85
|
+
*
|
|
86
|
+
* @example
|
|
87
|
+
* // Sola, con nombre accesible y tamano grande
|
|
88
|
+
* <CountryFlag code="co" size="lg" aria-label="Colombia" />
|
|
89
|
+
*
|
|
90
|
+
* @param {string} props.code - Codigo de dos letras del pais, case insensitive.
|
|
91
|
+
* @param {'sm' | 'md' | 'lg'} [props.size] - Diametro del circulo. Default `md`.
|
|
92
|
+
* @returns {ReactNode} La bandera recortada en circulo.
|
|
93
|
+
*/
|
|
94
|
+
export function CountryFlag({ code, size = 'md', 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, ...restProps }) {
|
|
95
|
+
const normalized = (code ?? '').trim().toUpperCase();
|
|
96
|
+
const flag = flagMap[normalized];
|
|
97
|
+
const hasAccessibleName = Boolean(ariaLabel || ariaLabelledBy);
|
|
98
|
+
return (<span {...restProps} role={hasAccessibleName ? 'img' : undefined} aria-label={ariaLabel} aria-labelledby={ariaLabelledBy} aria-hidden={hasAccessibleName ? undefined : true} className={clsx('inline-flex shrink-0 items-center justify-center overflow-hidden rounded-full', !flag &&
|
|
99
|
+
'border-gray-5 text-gray-1 dark:border-gray-1 dark:text-gray-2 border font-bold', sizeMap[size], restProps.className)}>
|
|
100
|
+
{flag ? (<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" focusable="false" className="h-full w-full">
|
|
101
|
+
{flag}
|
|
102
|
+
</svg>) : (normalized.slice(0, 2))}
|
|
103
|
+
</span>);
|
|
104
|
+
}
|
|
105
|
+
//# sourceMappingURL=CountryFlag.jsx.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CountryFlag.jsx","sourceRoot":"","sources":["../../../../src/components/01-atoms/CountryFlag/CountryFlag.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/01-atoms/CountryFlag/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/01-atoms/CountryFlag/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC"}
|
|
@@ -8,6 +8,7 @@ type InputProps = {
|
|
|
8
8
|
error?: string;
|
|
9
9
|
iconL?: ReactNode;
|
|
10
10
|
iconR?: ReactNode;
|
|
11
|
+
isMutedWhenEmpty?: boolean;
|
|
11
12
|
showPasswordAriaLabel?: string;
|
|
12
13
|
hidePasswordAriaLabel?: string;
|
|
13
14
|
};
|
|
@@ -33,9 +34,10 @@ type InputProps = {
|
|
|
33
34
|
* @param {string} [props.error] - Optional error message to be displayed below the input field.
|
|
34
35
|
* @param {ReactNode} [props.iconL] - Optional icon to be displayed to the left of the input field.
|
|
35
36
|
* @param {ReactNode} [props.iconR] - Optional icon to be displayed to the right of the input field.
|
|
37
|
+
* @param {boolean} [props.isMutedWhenEmpty] - Renders the border and label in gray while the field has no value.
|
|
36
38
|
*
|
|
37
39
|
* @returns {ReactNode} The rendered Input component.
|
|
38
40
|
*/
|
|
39
|
-
export declare function Input({ label, input, helperText, error, iconL, iconR, showPasswordAriaLabel, hidePasswordAriaLabel, }: InputProps): ReactNode;
|
|
41
|
+
export declare function Input({ label, input, helperText, error, iconL, iconR, isMutedWhenEmpty, showPasswordAriaLabel, hidePasswordAriaLabel, }: InputProps): ReactNode;
|
|
40
42
|
export {};
|
|
41
43
|
//# sourceMappingURL=Input.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../../src/components/01-atoms/Input/Input.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,KAAK,iBAAiB,EACtB,KAAK,mBAAmB,EACxB,KAAK,SAAS,EAGf,MAAM,OAAO,CAAC;AAKf,KAAK,UAAU,GAAG;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE;QACL,IAAI,EAAE,IAAI,CACR,iBAAiB,CACf,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,gBAAgB,CACjB,CAAC,MAAM,CAAC,EACT,QAAQ,GAAG,UAAU,GAAG,OAAO,CAChC,CAAC;KACH,GAAG,IAAI,CACN,iBAAiB,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,EAC1E,aAAa,CACd,CAAC;IACF,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,qBAAqB,CAAC,EAAE,MAAM,CAAC;CAChC,CAAC;AAEF
|
|
1
|
+
{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../../src/components/01-atoms/Input/Input.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,KAAK,iBAAiB,EACtB,KAAK,mBAAmB,EACxB,KAAK,SAAS,EAGf,MAAM,OAAO,CAAC;AAKf,KAAK,UAAU,GAAG;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE;QACL,IAAI,EAAE,IAAI,CACR,iBAAiB,CACf,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,gBAAgB,CACjB,CAAC,MAAM,CAAC,EACT,QAAQ,GAAG,UAAU,GAAG,OAAO,CAChC,CAAC;KACH,GAAG,IAAI,CACN,iBAAiB,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,EAC1E,aAAa,CACd,CAAC;IACF,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,qBAAqB,CAAC,EAAE,MAAM,CAAC;CAChC,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,KAAK,CAAC,EACpB,KAAK,EACL,KAAK,EACL,UAAU,EACV,KAAK,EACL,KAAK,EACL,KAAK,EACL,gBAAgB,EAChB,qBAAqB,EACrB,qBAAqB,GACtB,EAAE,UAAU,GAAG,SAAS,CAiGxB"}
|
|
@@ -26,10 +26,11 @@ import { RenderErrorOrHelperText } from './utils/RenderErrorOrHelperText';
|
|
|
26
26
|
* @param {string} [props.error] - Optional error message to be displayed below the input field.
|
|
27
27
|
* @param {ReactNode} [props.iconL] - Optional icon to be displayed to the left of the input field.
|
|
28
28
|
* @param {ReactNode} [props.iconR] - Optional icon to be displayed to the right of the input field.
|
|
29
|
+
* @param {boolean} [props.isMutedWhenEmpty] - Renders the border and label in gray while the field has no value.
|
|
29
30
|
*
|
|
30
31
|
* @returns {ReactNode} The rendered Input component.
|
|
31
32
|
*/
|
|
32
|
-
export function Input({ label, input, helperText, error, iconL, iconR, showPasswordAriaLabel, hidePasswordAriaLabel, }) {
|
|
33
|
+
export function Input({ label, input, helperText, error, iconL, iconR, isMutedWhenEmpty, showPasswordAriaLabel, hidePasswordAriaLabel, }) {
|
|
33
34
|
const generatedId = useId();
|
|
34
35
|
const [showPassword, setShowPassword] = useState(false);
|
|
35
36
|
const id = input.id ?? generatedId;
|
|
@@ -39,7 +40,9 @@ export function Input({ label, input, helperText, error, iconL, iconR, showPassw
|
|
|
39
40
|
const isPassword = input.type === 'password';
|
|
40
41
|
const effectiveType = isPassword && showPassword ? 'text' : input.type;
|
|
41
42
|
const inputClasses = clsx('peer disabled:text-gray-3 dark:disabled:text-gray-2 h-full w-full rounded-full bg-transparent px-5 text-sm font-normal text-black outline-0 transition-all focus:text-black dark:text-white dark:focus:text-white', input.className);
|
|
42
|
-
const { labelProps, legendClasses, fieldsetClasses } = generateBorder(error
|
|
43
|
+
const { labelProps, legendClasses, fieldsetClasses } = generateBorder(error, {
|
|
44
|
+
isMutedWhenEmpty,
|
|
45
|
+
});
|
|
43
46
|
labelProps.htmlFor = id;
|
|
44
47
|
const rightSlot = isPassword ? (<button type="button" onClick={() => setShowPassword((prev) => !prev)} aria-pressed={showPassword} aria-label={showPassword ? hidePasswordAriaLabel : showPasswordAriaLabel} disabled={input.disabled} className={clsx('disabled:text-gray-3 dark:disabled:text-gray-2 flex cursor-pointer items-center justify-center rounded-full p-1 transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-black/20 disabled:cursor-not-allowed dark:focus-visible:ring-white/30', error
|
|
45
48
|
? 'text-error dark:text-error-dark'
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.jsx","sourceRoot":"","sources":["../../../../src/components/01-atoms/Input/Input.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAIL,KAAK,EACL,QAAQ,GACT,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAChD,OAAO,EAAE,uBAAuB,EAAE,MAAM,iCAAiC,CAAC;
|
|
1
|
+
{"version":3,"file":"Input.jsx","sourceRoot":"","sources":["../../../../src/components/01-atoms/Input/Input.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,4 +1,8 @@
|
|
|
1
|
-
|
|
1
|
+
type BorderOptions = {
|
|
2
|
+
isMuted?: boolean;
|
|
3
|
+
isMutedWhenEmpty?: boolean;
|
|
4
|
+
};
|
|
5
|
+
export declare const generateBorder: (error?: string, { isMuted, isMutedWhenEmpty }?: BorderOptions) => {
|
|
2
6
|
labelProps: {
|
|
3
7
|
htmlFor?: string;
|
|
4
8
|
className: string;
|
|
@@ -6,4 +10,5 @@ export declare const generateBorder: (error?: string) => {
|
|
|
6
10
|
fieldsetClasses: string;
|
|
7
11
|
legendClasses: string;
|
|
8
12
|
};
|
|
13
|
+
export {};
|
|
9
14
|
//# sourceMappingURL=border.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"border.d.ts","sourceRoot":"","sources":["../../../../../src/components/01-atoms/Input/utils/border.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,cAAc,
|
|
1
|
+
{"version":3,"file":"border.d.ts","sourceRoot":"","sources":["../../../../../src/components/01-atoms/Input/utils/border.ts"],"names":[],"mappings":"AAEA,KAAK,aAAa,GAAG;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B,CAAC;AAEF,eAAO,MAAM,cAAc,WACjB,MAAM,kCACiB,aAAa;;kBAEd,MAAM;mBAAa,MAAM;;;;CAqCxD,CAAC"}
|
|
@@ -1,11 +1,21 @@
|
|
|
1
1
|
import clsx from 'clsx';
|
|
2
|
-
export const generateBorder = (error) => {
|
|
2
|
+
export const generateBorder = (error, { isMuted, isMutedWhenEmpty } = {}) => {
|
|
3
3
|
const labelProps = {
|
|
4
|
-
className: clsx('pointer-events-none absolute -top-2 left-[1.0625rem] truncate overflow-visible px-1 text-xs leading-tight transition-all select-none', 'peer-disabled:text-gray-3 dark:peer-disabled:text-gray-2 peer-not-empty:-top-2 peer-not-empty:text-xs peer-placeholder-shown:top-2.5 peer-placeholder-shown:text-sm peer-placeholder-shown:leading-tight peer-autofill:-top-2 peer-autofill:text-xs peer-focus:-top-2 peer-focus:text-xs', error
|
|
4
|
+
className: clsx('pointer-events-none absolute -top-2 left-[1.0625rem] truncate overflow-visible px-1 text-xs leading-tight transition-all select-none', 'peer-disabled:text-gray-3 dark:peer-disabled:text-gray-2 peer-not-empty:-top-2 peer-not-empty:text-xs peer-placeholder-shown:top-2.5 peer-placeholder-shown:text-sm peer-placeholder-shown:leading-tight peer-autofill:-top-2 peer-autofill:text-xs peer-focus:-top-2 peer-focus:text-xs', error
|
|
5
|
+
? 'text-error dark:text-error-dark'
|
|
6
|
+
: isMuted
|
|
7
|
+
? 'text-gray-2 dark:text-gray-2'
|
|
8
|
+
: 'text-black dark:text-white', !error &&
|
|
9
|
+
isMutedWhenEmpty &&
|
|
10
|
+
'peer-placeholder-shown:text-gray-2 dark:peer-placeholder-shown:text-gray-2'),
|
|
5
11
|
};
|
|
6
12
|
const fieldsetClasses = clsx('pointer-events-none absolute -top-2 left-0 h-[calc(100%+.5rem)] w-full rounded-full border px-4', 'peer-disabled:border-gray-3 dark:peer-disabled:border-gray-2 peer-not-empty:*:max-w-full peer-not-empty:*:px-1 peer-placeholder-shown:*:max-w-0 peer-placeholder-shown:*:px-0 peer-autofill:max-w-full peer-autofill:*:px-1 peer-focus:*:max-w-full peer-focus:*:px-1', error
|
|
7
13
|
? 'border-error dark:border-error-dark'
|
|
8
|
-
:
|
|
14
|
+
: isMuted
|
|
15
|
+
? 'border-gray-3 dark:border-gray-2'
|
|
16
|
+
: 'border-black dark:border-white', !error &&
|
|
17
|
+
isMutedWhenEmpty &&
|
|
18
|
+
'peer-placeholder-shown:border-gray-3 dark:peer-placeholder-shown:border-gray-2 peer-focus:border-black dark:peer-focus:border-white');
|
|
9
19
|
const legendClasses = clsx('invisible max-w-full px-1 text-left text-xs text-nowrap transition-all');
|
|
10
20
|
return {
|
|
11
21
|
labelProps,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"border.js","sourceRoot":"","sources":["../../../../../src/components/01-atoms/Input/utils/border.ts"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"border.js","sourceRoot":"","sources":["../../../../../src/components/01-atoms/Input/utils/border.ts"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AAOxB,MAAM,CAAC,MAAM,cAAc,GAAG,CAC5B,KAAc,EACd,EAAE,OAAO,EAAE,gBAAgB,KAAoB,EAAE,EACjD,EAAE;IACF,MAAM,UAAU,GAA4C;QAC1D,SAAS,EAAE,IAAI,CACb,sIAAsI,EACtI,0RAA0R,EAC1R,KAAK;YACH,CAAC,CAAC,iCAAiC;YACnC,CAAC,CAAC,OAAO;gBACP,CAAC,CAAC,8BAA8B;gBAChC,CAAC,CAAC,4BAA4B,EAClC,CAAC,KAAK;YACJ,gBAAgB;YAChB,4EAA4E,CAC/E;KACF,CAAC;IAEF,MAAM,eAAe,GAAG,IAAI,CAC1B,iGAAiG,EACjG,uQAAuQ,EACvQ,KAAK;QACH,CAAC,CAAC,qCAAqC;QACvC,CAAC,CAAC,OAAO;YACP,CAAC,CAAC,kCAAkC;YACpC,CAAC,CAAC,gCAAgC,EACtC,CAAC,KAAK;QACJ,gBAAgB;QAChB,qIAAqI,CACxI,CAAC;IAEF,MAAM,aAAa,GAAG,IAAI,CACxB,wEAAwE,CACzE,CAAC;IAEF,OAAO;QACL,UAAU;QACV,eAAe;QACf,aAAa;KACd,CAAC;AACJ,CAAC,CAAC"}
|
|
@@ -11,6 +11,7 @@ type MultiSelectProps = {
|
|
|
11
11
|
disabled?: boolean;
|
|
12
12
|
helperText?: string;
|
|
13
13
|
error?: string;
|
|
14
|
+
isMutedWhenEmpty?: boolean;
|
|
14
15
|
clearButtonAriaLabel?: string;
|
|
15
16
|
} & Omit<HTMLAttributes<HTMLDivElement>, 'onClick'>;
|
|
16
17
|
/**
|
|
@@ -43,11 +44,12 @@ type MultiSelectProps = {
|
|
|
43
44
|
* @param {boolean} [props.disabled] - Boolean to disable the multi-select input.
|
|
44
45
|
* @param {string} [props.helperText] - Helper text to be displayed below the input.
|
|
45
46
|
* @param {string} [props.error] - Error message to be displayed below the input.
|
|
47
|
+
* @param {boolean} [props.isMutedWhenEmpty] - Renders the border and label in gray while nothing is selected.
|
|
46
48
|
* @param {string} [props.clearButtonAriaLabel] - Accessible label for the button that clears the selection.
|
|
47
49
|
* @param {HTMLAttributes<HTMLDivElement>} [props.restProps] - Additional HTML attributes for the container div.
|
|
48
50
|
*
|
|
49
51
|
* @returns {ReactNode} The rendered MultiSelect component.
|
|
50
52
|
*/
|
|
51
|
-
export declare function MultiSelect({ options, value, onChange, label, disabled, helperText, error, clearButtonAriaLabel, ...restProps }: MultiSelectProps): ReactNode;
|
|
53
|
+
export declare function MultiSelect({ options, value, onChange, label, disabled, helperText, error, isMutedWhenEmpty, clearButtonAriaLabel, ...restProps }: MultiSelectProps): ReactNode;
|
|
52
54
|
export {};
|
|
53
55
|
//# sourceMappingURL=MultiSelect.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiSelect.d.ts","sourceRoot":"","sources":["../../../../src/components/01-atoms/MultiSelect/MultiSelect.tsx"],"names":[],"mappings":"AAGA,OAAO,EAEL,KAAK,cAAc,EAEnB,SAAS,EAIV,MAAM,OAAO,CAAC;AASf,MAAM,MAAM,UAAU,GAAG;IACvB,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,gBAAgB,GAAG;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,UAAU,EAAE,CAAC;IACtB,KAAK,CAAC,EAAE,UAAU,EAAE,CAAC;IACrB,QAAQ,CAAC,EAAE,CAAC,eAAe,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;IACnD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B,GAAG,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,SAAS,CAAC,CAAC;AAIpD
|
|
1
|
+
{"version":3,"file":"MultiSelect.d.ts","sourceRoot":"","sources":["../../../../src/components/01-atoms/MultiSelect/MultiSelect.tsx"],"names":[],"mappings":"AAGA,OAAO,EAEL,KAAK,cAAc,EAEnB,SAAS,EAIV,MAAM,OAAO,CAAC;AASf,MAAM,MAAM,UAAU,GAAG;IACvB,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,gBAAgB,GAAG;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,UAAU,EAAE,CAAC;IACtB,KAAK,CAAC,EAAE,UAAU,EAAE,CAAC;IACrB,QAAQ,CAAC,EAAE,CAAC,eAAe,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;IACnD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B,GAAG,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,SAAS,CAAC,CAAC;AAIpD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,wBAAgB,WAAW,CAAC,EAC1B,OAAO,EACP,KAAqB,EACrB,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,UAAU,EACV,KAAK,EACL,gBAAgB,EAChB,oBAAoB,EACpB,GAAG,SAAS,EACb,EAAE,gBAAgB,GAAG,SAAS,CAmU9B"}
|
|
@@ -39,12 +39,13 @@ const EMPTY_OPTIONS = [];
|
|
|
39
39
|
* @param {boolean} [props.disabled] - Boolean to disable the multi-select input.
|
|
40
40
|
* @param {string} [props.helperText] - Helper text to be displayed below the input.
|
|
41
41
|
* @param {string} [props.error] - Error message to be displayed below the input.
|
|
42
|
+
* @param {boolean} [props.isMutedWhenEmpty] - Renders the border and label in gray while nothing is selected.
|
|
42
43
|
* @param {string} [props.clearButtonAriaLabel] - Accessible label for the button that clears the selection.
|
|
43
44
|
* @param {HTMLAttributes<HTMLDivElement>} [props.restProps] - Additional HTML attributes for the container div.
|
|
44
45
|
*
|
|
45
46
|
* @returns {ReactNode} The rendered MultiSelect component.
|
|
46
47
|
*/
|
|
47
|
-
export function MultiSelect({ options, value = EMPTY_OPTIONS, onChange, label, disabled, helperText, error, clearButtonAriaLabel, ...restProps }) {
|
|
48
|
+
export function MultiSelect({ options, value = EMPTY_OPTIONS, onChange, label, disabled, helperText, error, isMutedWhenEmpty, clearButtonAriaLabel, ...restProps }) {
|
|
48
49
|
const [id, setId] = useState('');
|
|
49
50
|
const [filteredOptions, setFilteredOptions] = useState([]);
|
|
50
51
|
const [selectedOptions, setSelectedOptions] = useState(value);
|
|
@@ -56,7 +57,10 @@ export function MultiSelect({ options, value = EMPTY_OPTIONS, onChange, label, d
|
|
|
56
57
|
const listboxId = `${id}-listbox`;
|
|
57
58
|
const feedbackId = `${id}-feedback`;
|
|
58
59
|
const inputClasses = clsx('peer disabled:text-gray-3 dark:disabled:text-gray-2 pointer-events-none h-full w-full rounded-full bg-transparent px-5 text-sm font-normal text-black outline-0 transition-all select-none focus:text-black dark:text-white dark:focus:text-white');
|
|
59
|
-
const
|
|
60
|
+
const isMuted = Boolean(isMutedWhenEmpty) && !selectedOptions.length;
|
|
61
|
+
const { labelProps, legendClasses, fieldsetClasses } = generateBorder(error, {
|
|
62
|
+
isMuted,
|
|
63
|
+
});
|
|
60
64
|
const handleToggleDropdown = () => {
|
|
61
65
|
if (disabled) {
|
|
62
66
|
return;
|
|
@@ -166,11 +170,19 @@ export function MultiSelect({ options, value = EMPTY_OPTIONS, onChange, label, d
|
|
|
166
170
|
<input ref={triggerRef} id={id} role="combobox" placeholder=" " value={selectedOptions.length
|
|
167
171
|
? `${selectedOptions.length} seleccionado(s)`
|
|
168
172
|
: ''} readOnly className={inputClasses} disabled={disabled} aria-expanded={isOpen} aria-haspopup="listbox" aria-controls={listboxId} aria-invalid={Boolean(error)} aria-describedby={error || helperText ? feedbackId : undefined} onKeyDown={handleTriggerKeyDown}/>
|
|
169
|
-
<label {...labelProps} htmlFor={id || undefined} className={clsx(labelProps.className, 'dark:peer-disabled:text-gray-2', error
|
|
173
|
+
<label {...labelProps} htmlFor={id || undefined} className={clsx(labelProps.className, 'dark:peer-disabled:text-gray-2', error
|
|
174
|
+
? 'dark:text-error-dark'
|
|
175
|
+
: isMuted
|
|
176
|
+
? 'dark:text-gray-2'
|
|
177
|
+
: 'dark:text-white')}>
|
|
170
178
|
{label}
|
|
171
179
|
</label>
|
|
172
|
-
<FaSortDown aria-hidden="true" className=
|
|
173
|
-
<fieldset className={clsx(fieldsetClasses, 'dark:peer-disabled:border-gray-2', error
|
|
180
|
+
<FaSortDown aria-hidden="true" className={clsx('absolute top-2 right-4', isMuted ? 'text-gray-2 dark:text-gray-2' : 'dark:text-white')}/>
|
|
181
|
+
<fieldset className={clsx(fieldsetClasses, 'dark:peer-disabled:border-gray-2', error
|
|
182
|
+
? 'dark:border-error-dark'
|
|
183
|
+
: isMuted
|
|
184
|
+
? 'dark:border-gray-2'
|
|
185
|
+
: 'dark:border-white')}>
|
|
174
186
|
<legend className={legendClasses}>{label}</legend>
|
|
175
187
|
</fieldset>
|
|
176
188
|
</div>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiSelect.jsx","sourceRoot":"","sources":["../../../../src/components/01-atoms/MultiSelect/MultiSelect.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAKL,SAAS,EACT,MAAM,EACN,QAAQ,GACT,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,sBAAsB,EAAE,MAAM,gBAAgB,CAAC;AACrE,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAE,uBAAuB,EAAE,MAAM,wCAAwC,CAAC;
|
|
1
|
+
{"version":3,"file":"MultiSelect.jsx","sourceRoot":"","sources":["../../../../src/components/01-atoms/MultiSelect/MultiSelect.tsx"],"names":[],"mappings":"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"}
|