@elaraai/east-ui 0.0.1-beta.3 → 0.0.1-beta.4
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/src/buttons/button/index.d.ts +57 -0
- package/dist/src/buttons/button/index.d.ts.map +1 -1
- package/dist/src/buttons/button/index.js +57 -0
- package/dist/src/buttons/button/index.js.map +1 -1
- package/dist/src/buttons/icon-button/index.d.ts +62 -0
- package/dist/src/buttons/icon-button/index.d.ts.map +1 -1
- package/dist/src/buttons/icon-button/index.js +62 -0
- package/dist/src/buttons/icon-button/index.js.map +1 -1
- package/dist/src/charts/index.d.ts +603 -18
- package/dist/src/charts/index.d.ts.map +1 -1
- package/dist/src/charts/index.js +603 -20
- package/dist/src/charts/index.js.map +1 -1
- package/dist/src/charts/sparkline/index.d.ts +47 -0
- package/dist/src/charts/sparkline/index.d.ts.map +1 -1
- package/dist/src/charts/sparkline/index.js +47 -0
- package/dist/src/charts/sparkline/index.js.map +1 -1
- package/dist/src/collections/data-list/index.d.ts +89 -0
- package/dist/src/collections/data-list/index.d.ts.map +1 -1
- package/dist/src/collections/data-list/index.js +89 -0
- package/dist/src/collections/data-list/index.js.map +1 -1
- package/dist/src/collections/gantt/index.d.ts +177 -4
- package/dist/src/collections/gantt/index.d.ts.map +1 -1
- package/dist/src/collections/gantt/index.js +177 -4
- package/dist/src/collections/gantt/index.js.map +1 -1
- package/dist/src/collections/table/index.d.ts +99 -0
- package/dist/src/collections/table/index.d.ts.map +1 -1
- package/dist/src/collections/table/index.js +99 -0
- package/dist/src/collections/table/index.js.map +1 -1
- package/dist/src/collections/tree-view/index.d.ts +170 -0
- package/dist/src/collections/tree-view/index.d.ts.map +1 -1
- package/dist/src/collections/tree-view/index.js +170 -0
- package/dist/src/collections/tree-view/index.js.map +1 -1
- package/dist/src/container/card/index.d.ts +60 -0
- package/dist/src/container/card/index.d.ts.map +1 -1
- package/dist/src/container/card/index.js +60 -0
- package/dist/src/container/card/index.js.map +1 -1
- package/dist/src/disclosure/accordion/index.d.ts +83 -0
- package/dist/src/disclosure/accordion/index.d.ts.map +1 -1
- package/dist/src/disclosure/accordion/index.js +83 -0
- package/dist/src/disclosure/accordion/index.js.map +1 -1
- package/dist/src/disclosure/carousel/index.d.ts +60 -4
- package/dist/src/disclosure/carousel/index.d.ts.map +1 -1
- package/dist/src/disclosure/carousel/index.js +60 -4
- package/dist/src/disclosure/carousel/index.js.map +1 -1
- package/dist/src/disclosure/tabs/index.d.ts +179 -0
- package/dist/src/disclosure/tabs/index.d.ts.map +1 -1
- package/dist/src/disclosure/tabs/index.js +179 -0
- package/dist/src/disclosure/tabs/index.js.map +1 -1
- package/dist/src/display/avatar/index.d.ts +35 -0
- package/dist/src/display/avatar/index.d.ts.map +1 -1
- package/dist/src/display/avatar/index.js +35 -0
- package/dist/src/display/avatar/index.js.map +1 -1
- package/dist/src/display/badge/index.d.ts +35 -0
- package/dist/src/display/badge/index.d.ts.map +1 -1
- package/dist/src/display/badge/index.js +35 -0
- package/dist/src/display/badge/index.js.map +1 -1
- package/dist/src/display/icon/index.d.ts +78 -6
- package/dist/src/display/icon/index.d.ts.map +1 -1
- package/dist/src/display/icon/index.js +78 -6
- package/dist/src/display/icon/index.js.map +1 -1
- package/dist/src/display/stat/index.d.ts +67 -2
- package/dist/src/display/stat/index.d.ts.map +1 -1
- package/dist/src/display/stat/index.js +68 -3
- package/dist/src/display/stat/index.js.map +1 -1
- package/dist/src/display/tag/index.d.ts +48 -0
- package/dist/src/display/tag/index.d.ts.map +1 -1
- package/dist/src/display/tag/index.js +48 -0
- package/dist/src/display/tag/index.js.map +1 -1
- package/dist/src/feedback/alert/index.d.ts +64 -0
- package/dist/src/feedback/alert/index.d.ts.map +1 -1
- package/dist/src/feedback/alert/index.js +64 -0
- package/dist/src/feedback/alert/index.js.map +1 -1
- package/dist/src/feedback/progress/index.d.ts +54 -0
- package/dist/src/feedback/progress/index.d.ts.map +1 -1
- package/dist/src/feedback/progress/index.js +54 -0
- package/dist/src/feedback/progress/index.js.map +1 -1
- package/dist/src/forms/checkbox/index.d.ts +38 -0
- package/dist/src/forms/checkbox/index.d.ts.map +1 -1
- package/dist/src/forms/checkbox/index.js +38 -0
- package/dist/src/forms/checkbox/index.js.map +1 -1
- package/dist/src/forms/field/index.d.ts +42 -0
- package/dist/src/forms/field/index.d.ts.map +1 -1
- package/dist/src/forms/field/index.js +42 -0
- package/dist/src/forms/field/index.js.map +1 -1
- package/dist/src/forms/fieldset/index.d.ts +30 -3
- package/dist/src/forms/fieldset/index.d.ts.map +1 -1
- package/dist/src/forms/fieldset/index.js +30 -3
- package/dist/src/forms/fieldset/index.js.map +1 -1
- package/dist/src/forms/file-upload/index.d.ts +48 -4
- package/dist/src/forms/file-upload/index.d.ts.map +1 -1
- package/dist/src/forms/file-upload/index.js +48 -4
- package/dist/src/forms/file-upload/index.js.map +1 -1
- package/dist/src/forms/input/index.d.ts +93 -14
- package/dist/src/forms/input/index.d.ts.map +1 -1
- package/dist/src/forms/input/index.js +93 -14
- package/dist/src/forms/input/index.js.map +1 -1
- package/dist/src/forms/select/index.d.ts +10 -6
- package/dist/src/forms/select/index.d.ts.map +1 -1
- package/dist/src/forms/select/index.js +10 -6
- package/dist/src/forms/select/index.js.map +1 -1
- package/dist/src/forms/slider/index.d.ts +15 -0
- package/dist/src/forms/slider/index.d.ts.map +1 -1
- package/dist/src/forms/slider/index.js +15 -0
- package/dist/src/forms/slider/index.js.map +1 -1
- package/dist/src/forms/switch/index.d.ts +20 -0
- package/dist/src/forms/switch/index.d.ts.map +1 -1
- package/dist/src/forms/switch/index.js +20 -0
- package/dist/src/forms/switch/index.js.map +1 -1
- package/dist/src/forms/tags-input/index.d.ts +33 -4
- package/dist/src/forms/tags-input/index.d.ts.map +1 -1
- package/dist/src/forms/tags-input/index.js +33 -4
- package/dist/src/forms/tags-input/index.js.map +1 -1
- package/dist/src/forms/textarea/index.d.ts +36 -4
- package/dist/src/forms/textarea/index.d.ts.map +1 -1
- package/dist/src/forms/textarea/index.js +36 -4
- package/dist/src/forms/textarea/index.js.map +1 -1
- package/dist/src/layout/box/index.d.ts +135 -0
- package/dist/src/layout/box/index.d.ts.map +1 -1
- package/dist/src/layout/box/index.js +135 -0
- package/dist/src/layout/box/index.js.map +1 -1
- package/dist/src/layout/grid/index.d.ts +103 -0
- package/dist/src/layout/grid/index.d.ts.map +1 -1
- package/dist/src/layout/grid/index.js +103 -0
- package/dist/src/layout/grid/index.js.map +1 -1
- package/dist/src/layout/separator/index.d.ts +41 -0
- package/dist/src/layout/separator/index.d.ts.map +1 -1
- package/dist/src/layout/separator/index.js +41 -0
- package/dist/src/layout/separator/index.js.map +1 -1
- package/dist/src/layout/splitter/index.d.ts +92 -0
- package/dist/src/layout/splitter/index.d.ts.map +1 -1
- package/dist/src/layout/splitter/index.js +92 -0
- package/dist/src/layout/splitter/index.js.map +1 -1
- package/dist/src/layout/stack/index.d.ts +158 -0
- package/dist/src/layout/stack/index.d.ts.map +1 -1
- package/dist/src/layout/stack/index.js +158 -0
- package/dist/src/layout/stack/index.js.map +1 -1
- package/dist/src/overlays/action-bar/index.d.ts +105 -0
- package/dist/src/overlays/action-bar/index.d.ts.map +1 -1
- package/dist/src/overlays/action-bar/index.js +105 -0
- package/dist/src/overlays/action-bar/index.js.map +1 -1
- package/dist/src/overlays/dialog/index.d.ts +88 -0
- package/dist/src/overlays/dialog/index.d.ts.map +1 -1
- package/dist/src/overlays/dialog/index.js +88 -0
- package/dist/src/overlays/dialog/index.js.map +1 -1
- package/dist/src/overlays/drawer/index.d.ts +64 -0
- package/dist/src/overlays/drawer/index.d.ts.map +1 -1
- package/dist/src/overlays/drawer/index.js +64 -0
- package/dist/src/overlays/drawer/index.js.map +1 -1
- package/dist/src/overlays/hover-card/index.d.ts +77 -0
- package/dist/src/overlays/hover-card/index.d.ts.map +1 -1
- package/dist/src/overlays/hover-card/index.js +77 -0
- package/dist/src/overlays/hover-card/index.js.map +1 -1
- package/dist/src/overlays/menu/index.d.ts +132 -8
- package/dist/src/overlays/menu/index.d.ts.map +1 -1
- package/dist/src/overlays/menu/index.js +132 -8
- package/dist/src/overlays/menu/index.js.map +1 -1
- package/dist/src/overlays/popover/index.d.ts +84 -0
- package/dist/src/overlays/popover/index.d.ts.map +1 -1
- package/dist/src/overlays/popover/index.js +84 -0
- package/dist/src/overlays/popover/index.js.map +1 -1
- package/dist/src/overlays/toggle-tip/index.d.ts +67 -0
- package/dist/src/overlays/toggle-tip/index.d.ts.map +1 -1
- package/dist/src/overlays/toggle-tip/index.js +67 -0
- package/dist/src/overlays/toggle-tip/index.js.map +1 -1
- package/dist/src/overlays/tooltip/index.d.ts +78 -0
- package/dist/src/overlays/tooltip/index.d.ts.map +1 -1
- package/dist/src/overlays/tooltip/index.js +78 -0
- package/dist/src/overlays/tooltip/index.js.map +1 -1
- package/dist/src/typography/index.d.ts +39 -0
- package/dist/src/typography/index.d.ts.map +1 -1
- package/dist/src/typography/index.js +39 -0
- package/dist/src/typography/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/display/avatar/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EACH,KAAK,QAAQ,EAGb,UAAU,EAEb,MAAM,eAAe,CAAC;AAGvB,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAc,KAAK,WAAW,EAAE,MAAM,YAAY,CAAC;AAG1D,OAAO,EAAE,UAAU,EAAE,KAAK,WAAW,EAAE,MAAM,YAAY,CAAC;AAM1D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,iBAAS,YAAY,CAAC,KAAK,CAAC,EAAE,WAAW,GAAG,QAAQ,CAAC,eAAe,CAAC,CA+BpE;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,MAAM
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/display/avatar/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EACH,KAAK,QAAQ,EAGb,UAAU,EAEb,MAAM,eAAe,CAAC;AAGvB,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAc,KAAK,WAAW,EAAE,MAAM,YAAY,CAAC;AAG1D,OAAO,EAAE,UAAU,EAAE,KAAK,WAAW,EAAE,MAAM,YAAY,CAAC;AAM1D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,iBAAS,YAAY,CAAC,KAAK,CAAC,EAAE,WAAW,GAAG,QAAQ,CAAC,eAAe,CAAC,CA+BpE;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,MAAM;IACf;;;;;;;;;;;;;;;;;;;;;;OAsBG;;;QAGC;;;;;;;;;;;WAWG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAGD,CAAC"}
|
|
@@ -96,8 +96,43 @@ function createAvatar(style) {
|
|
|
96
96
|
* ```
|
|
97
97
|
*/
|
|
98
98
|
export const Avatar = {
|
|
99
|
+
/**
|
|
100
|
+
* Creates an Avatar component with optional image and fallback.
|
|
101
|
+
*
|
|
102
|
+
* @param style - Avatar configuration and styling
|
|
103
|
+
* @returns An East expression representing the avatar component
|
|
104
|
+
*
|
|
105
|
+
* @remarks
|
|
106
|
+
* Avatar displays user profile images. When no image is provided or fails
|
|
107
|
+
* to load, it shows initials from the name or a default icon.
|
|
108
|
+
*
|
|
109
|
+
* @example
|
|
110
|
+
* ```ts
|
|
111
|
+
* import { East } from "@elaraai/east";
|
|
112
|
+
* import { Avatar, UIComponentType } from "@elaraai/east-ui";
|
|
113
|
+
*
|
|
114
|
+
* const example = East.function([], UIComponentType, $ => {
|
|
115
|
+
* return Avatar.Root({
|
|
116
|
+
* name: "Jane Smith",
|
|
117
|
+
* colorPalette: "blue",
|
|
118
|
+
* });
|
|
119
|
+
* });
|
|
120
|
+
* ```
|
|
121
|
+
*/
|
|
99
122
|
Root: createAvatar,
|
|
100
123
|
Types: {
|
|
124
|
+
/**
|
|
125
|
+
* Type for Avatar component data.
|
|
126
|
+
*
|
|
127
|
+
* @remarks
|
|
128
|
+
* Avatar displays user profile images or initials/icons as fallback.
|
|
129
|
+
*
|
|
130
|
+
* @property src - Image URL for the avatar
|
|
131
|
+
* @property name - User name (used for initials fallback)
|
|
132
|
+
* @property size - Size of the avatar
|
|
133
|
+
* @property variant - Visual variant (solid, subtle, outline)
|
|
134
|
+
* @property colorPalette - Color scheme for fallback avatar
|
|
135
|
+
*/
|
|
101
136
|
Avatar: AvatarType,
|
|
102
137
|
},
|
|
103
138
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/display/avatar/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAGH,IAAI,EACJ,UAAU,EACV,OAAO,GACV,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,eAAe,EAAE,gBAAgB,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC7E,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,UAAU,EAAoB,MAAM,YAAY,CAAC;AAE1D,kBAAkB;AAClB,OAAO,EAAE,UAAU,EAAoB,MAAM,YAAY,CAAC;AAE1D,+EAA+E;AAC/E,kBAAkB;AAClB,+EAA+E;AAE/E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,SAAS,YAAY,CAAC,KAAmB;IACrC,MAAM,cAAc,GAAG,CAAC,GAA+C,EAAE,EAAE;QACvE,IAAI,GAAG,KAAK,SAAS;YAAE,OAAO,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;QACpD,OAAO,OAAO,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAChC,CAAC,CAAC;IAEF,MAAM,SAAS,GAAG,KAAK,EAAE,IAAI;QACzB,CAAC,CAAC,CAAC,OAAO,KAAK,CAAC,IAAI,KAAK,QAAQ;YAC7B,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,QAAQ,CAAC;YACjD,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC;QACjB,CAAC,CAAC,SAAS,CAAC;IAEhB,MAAM,YAAY,GAAG,KAAK,EAAE,OAAO;QAC/B,CAAC,CAAC,CAAC,OAAO,KAAK,CAAC,OAAO,KAAK,QAAQ;YAChC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC,EAAE,gBAAgB,CAAC;YAC5D,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC;QACpB,CAAC,CAAC,SAAS,CAAC;IAEhB,MAAM,iBAAiB,GAAG,KAAK,EAAE,YAAY;QACzC,CAAC,CAAC,CAAC,OAAO,KAAK,CAAC,YAAY,KAAK,QAAQ;YACrC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,YAAY,EAAE,IAAI,CAAC,EAAE,eAAe,CAAC;YAChE,CAAC,CAAC,KAAK,CAAC,YAAY,CAAC;QACzB,CAAC,CAAC,SAAS,CAAC;IAEhB,OAAO,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,QAAQ,EAAE;QAChC,GAAG,EAAE,cAAc,CAAC,KAAK,EAAE,GAAG,CAAC;QAC/B,IAAI,EAAE,cAAc,CAAC,KAAK,EAAE,IAAI,CAAC;QACjC,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC;QACpE,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC;QAC7E,YAAY,EAAE,iBAAiB,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,iBAAiB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC;KAC/F,CAAC,EAAE,eAAe,CAAC,CAAC;AACzB,CAAC;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG;IAClB,IAAI,EAAE,YAAY;IAClB,KAAK,EAAE;QACH,MAAM,EAAE,UAAU;KACrB;CACK,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/display/avatar/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAGH,IAAI,EACJ,UAAU,EACV,OAAO,GACV,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,eAAe,EAAE,gBAAgB,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC7E,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,UAAU,EAAoB,MAAM,YAAY,CAAC;AAE1D,kBAAkB;AAClB,OAAO,EAAE,UAAU,EAAoB,MAAM,YAAY,CAAC;AAE1D,+EAA+E;AAC/E,kBAAkB;AAClB,+EAA+E;AAE/E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,SAAS,YAAY,CAAC,KAAmB;IACrC,MAAM,cAAc,GAAG,CAAC,GAA+C,EAAE,EAAE;QACvE,IAAI,GAAG,KAAK,SAAS;YAAE,OAAO,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;QACpD,OAAO,OAAO,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAChC,CAAC,CAAC;IAEF,MAAM,SAAS,GAAG,KAAK,EAAE,IAAI;QACzB,CAAC,CAAC,CAAC,OAAO,KAAK,CAAC,IAAI,KAAK,QAAQ;YAC7B,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,QAAQ,CAAC;YACjD,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC;QACjB,CAAC,CAAC,SAAS,CAAC;IAEhB,MAAM,YAAY,GAAG,KAAK,EAAE,OAAO;QAC/B,CAAC,CAAC,CAAC,OAAO,KAAK,CAAC,OAAO,KAAK,QAAQ;YAChC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC,EAAE,gBAAgB,CAAC;YAC5D,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC;QACpB,CAAC,CAAC,SAAS,CAAC;IAEhB,MAAM,iBAAiB,GAAG,KAAK,EAAE,YAAY;QACzC,CAAC,CAAC,CAAC,OAAO,KAAK,CAAC,YAAY,KAAK,QAAQ;YACrC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,YAAY,EAAE,IAAI,CAAC,EAAE,eAAe,CAAC;YAChE,CAAC,CAAC,KAAK,CAAC,YAAY,CAAC;QACzB,CAAC,CAAC,SAAS,CAAC;IAEhB,OAAO,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,QAAQ,EAAE;QAChC,GAAG,EAAE,cAAc,CAAC,KAAK,EAAE,GAAG,CAAC;QAC/B,IAAI,EAAE,cAAc,CAAC,KAAK,EAAE,IAAI,CAAC;QACjC,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC;QACpE,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC;QAC7E,YAAY,EAAE,iBAAiB,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,iBAAiB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC;KAC/F,CAAC,EAAE,eAAe,CAAC,CAAC;AACzB,CAAC;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG;IAClB;;;;;;;;;;;;;;;;;;;;;;OAsBG;IACH,IAAI,EAAE,YAAY;IAClB,KAAK,EAAE;QACH;;;;;;;;;;;WAWG;QACH,MAAM,EAAE,UAAU;KACrB;CACK,CAAC"}
|
|
@@ -53,8 +53,43 @@ declare function createBadge(value: SubtypeExprOrValue<StringType>, style?: Badg
|
|
|
53
53
|
* ```
|
|
54
54
|
*/
|
|
55
55
|
export declare const Badge: {
|
|
56
|
+
/**
|
|
57
|
+
* Creates a Badge component with value and optional styling.
|
|
58
|
+
*
|
|
59
|
+
* @param value - The badge text content
|
|
60
|
+
* @param style - Optional styling configuration
|
|
61
|
+
* @returns An East expression representing the badge component
|
|
62
|
+
*
|
|
63
|
+
* @remarks
|
|
64
|
+
* Badge is used to display short labels, counts, or status indicators.
|
|
65
|
+
* Common uses include notification counts, status labels, and category tags.
|
|
66
|
+
*
|
|
67
|
+
* @example
|
|
68
|
+
* ```ts
|
|
69
|
+
* import { East } from "@elaraai/east";
|
|
70
|
+
* import { Badge, UIComponentType } from "@elaraai/east-ui";
|
|
71
|
+
*
|
|
72
|
+
* const example = East.function([], UIComponentType, $ => {
|
|
73
|
+
* return Badge.Root("Active", {
|
|
74
|
+
* colorPalette: "green",
|
|
75
|
+
* variant: "solid",
|
|
76
|
+
* });
|
|
77
|
+
* });
|
|
78
|
+
* ```
|
|
79
|
+
*/
|
|
56
80
|
readonly Root: typeof createBadge;
|
|
57
81
|
readonly Types: {
|
|
82
|
+
/**
|
|
83
|
+
* Type for Badge component data.
|
|
84
|
+
*
|
|
85
|
+
* @remarks
|
|
86
|
+
* Badge displays short labels, counts, or status indicators.
|
|
87
|
+
*
|
|
88
|
+
* @property value - The badge text content
|
|
89
|
+
* @property variant - Visual variant (solid, subtle, outline)
|
|
90
|
+
* @property colorPalette - Color scheme for the badge
|
|
91
|
+
* @property size - Size of the badge
|
|
92
|
+
*/
|
|
58
93
|
readonly Badge: import("@elaraai/east").StructType<{
|
|
59
94
|
value: StringType;
|
|
60
95
|
variant: import("@elaraai/east").OptionType<import("@elaraai/east").VariantType<{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/display/badge/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EACH,KAAK,QAAQ,EACb,KAAK,kBAAkB,EAEvB,UAAU,EAEb,MAAM,eAAe,CAAC;AAGvB,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAa,KAAK,UAAU,EAAE,MAAM,YAAY,CAAC;AAGxD,OAAO,EAAE,SAAS,EAAE,KAAK,UAAU,EAAE,MAAM,YAAY,CAAC;AAMxD;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,iBAAS,WAAW,CAChB,KAAK,EAAE,kBAAkB,CAAC,UAAU,CAAC,EACrC,KAAK,CAAC,EAAE,UAAU,GACnB,QAAQ,CAAC,eAAe,CAAC,CAyB3B;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,KAAK
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/display/badge/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EACH,KAAK,QAAQ,EACb,KAAK,kBAAkB,EAEvB,UAAU,EAEb,MAAM,eAAe,CAAC;AAGvB,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAa,KAAK,UAAU,EAAE,MAAM,YAAY,CAAC;AAGxD,OAAO,EAAE,SAAS,EAAE,KAAK,UAAU,EAAE,MAAM,YAAY,CAAC;AAMxD;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,iBAAS,WAAW,CAChB,KAAK,EAAE,kBAAkB,CAAC,UAAU,CAAC,EACrC,KAAK,CAAC,EAAE,UAAU,GACnB,QAAQ,CAAC,eAAe,CAAC,CAyB3B;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,KAAK;IACd;;;;;;;;;;;;;;;;;;;;;;;OAuBG;;;QAGC;;;;;;;;;;WAUG;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAGD,CAAC"}
|
|
@@ -80,8 +80,43 @@ function createBadge(value, style) {
|
|
|
80
80
|
* ```
|
|
81
81
|
*/
|
|
82
82
|
export const Badge = {
|
|
83
|
+
/**
|
|
84
|
+
* Creates a Badge component with value and optional styling.
|
|
85
|
+
*
|
|
86
|
+
* @param value - The badge text content
|
|
87
|
+
* @param style - Optional styling configuration
|
|
88
|
+
* @returns An East expression representing the badge component
|
|
89
|
+
*
|
|
90
|
+
* @remarks
|
|
91
|
+
* Badge is used to display short labels, counts, or status indicators.
|
|
92
|
+
* Common uses include notification counts, status labels, and category tags.
|
|
93
|
+
*
|
|
94
|
+
* @example
|
|
95
|
+
* ```ts
|
|
96
|
+
* import { East } from "@elaraai/east";
|
|
97
|
+
* import { Badge, UIComponentType } from "@elaraai/east-ui";
|
|
98
|
+
*
|
|
99
|
+
* const example = East.function([], UIComponentType, $ => {
|
|
100
|
+
* return Badge.Root("Active", {
|
|
101
|
+
* colorPalette: "green",
|
|
102
|
+
* variant: "solid",
|
|
103
|
+
* });
|
|
104
|
+
* });
|
|
105
|
+
* ```
|
|
106
|
+
*/
|
|
83
107
|
Root: createBadge,
|
|
84
108
|
Types: {
|
|
109
|
+
/**
|
|
110
|
+
* Type for Badge component data.
|
|
111
|
+
*
|
|
112
|
+
* @remarks
|
|
113
|
+
* Badge displays short labels, counts, or status indicators.
|
|
114
|
+
*
|
|
115
|
+
* @property value - The badge text content
|
|
116
|
+
* @property variant - Visual variant (solid, subtle, outline)
|
|
117
|
+
* @property colorPalette - Color scheme for the badge
|
|
118
|
+
* @property size - Size of the badge
|
|
119
|
+
*/
|
|
85
120
|
Badge: BadgeType,
|
|
86
121
|
},
|
|
87
122
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/display/badge/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAGH,IAAI,EACJ,UAAU,EACV,OAAO,GACV,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,QAAQ,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAC7E,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,SAAS,EAAmB,MAAM,YAAY,CAAC;AAExD,kBAAkB;AAClB,OAAO,EAAE,SAAS,EAAmB,MAAM,YAAY,CAAC;AAExD,+EAA+E;AAC/E,iBAAiB;AACjB,+EAA+E;AAE/E;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,SAAS,WAAW,CAChB,KAAqC,EACrC,KAAkB;IAElB,MAAM,YAAY,GAAG,KAAK,EAAE,OAAO;QAC/B,CAAC,CAAC,CAAC,OAAO,KAAK,CAAC,OAAO,KAAK,QAAQ;YAChC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC,EAAE,gBAAgB,CAAC;YAC5D,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC;QACpB,CAAC,CAAC,SAAS,CAAC;IAEhB,MAAM,iBAAiB,GAAG,KAAK,EAAE,YAAY;QACzC,CAAC,CAAC,CAAC,OAAO,KAAK,CAAC,YAAY,KAAK,QAAQ;YACrC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,YAAY,EAAE,IAAI,CAAC,EAAE,eAAe,CAAC;YAChE,CAAC,CAAC,KAAK,CAAC,YAAY,CAAC;QACzB,CAAC,CAAC,SAAS,CAAC;IAEhB,MAAM,SAAS,GAAG,KAAK,EAAE,IAAI;QACzB,CAAC,CAAC,CAAC,OAAO,KAAK,CAAC,IAAI,KAAK,QAAQ;YAC7B,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,QAAQ,CAAC;YACjD,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC;QACjB,CAAC,CAAC,SAAS,CAAC;IAEhB,OAAO,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE;QAC/B,KAAK,EAAE,KAAK;QACZ,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC;QAC7E,YAAY,EAAE,iBAAiB,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,iBAAiB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC;QAC5F,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC;KACvE,CAAC,EAAE,eAAe,CAAC,CAAC;AACzB,CAAC;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG;IACjB,IAAI,EAAE,WAAW;IACjB,KAAK,EAAE;QACH,KAAK,EAAE,SAAS;KACnB;CACK,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/display/badge/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAGH,IAAI,EACJ,UAAU,EACV,OAAO,GACV,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,QAAQ,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAC7E,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,SAAS,EAAmB,MAAM,YAAY,CAAC;AAExD,kBAAkB;AAClB,OAAO,EAAE,SAAS,EAAmB,MAAM,YAAY,CAAC;AAExD,+EAA+E;AAC/E,iBAAiB;AACjB,+EAA+E;AAE/E;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,SAAS,WAAW,CAChB,KAAqC,EACrC,KAAkB;IAElB,MAAM,YAAY,GAAG,KAAK,EAAE,OAAO;QAC/B,CAAC,CAAC,CAAC,OAAO,KAAK,CAAC,OAAO,KAAK,QAAQ;YAChC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC,EAAE,gBAAgB,CAAC;YAC5D,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC;QACpB,CAAC,CAAC,SAAS,CAAC;IAEhB,MAAM,iBAAiB,GAAG,KAAK,EAAE,YAAY;QACzC,CAAC,CAAC,CAAC,OAAO,KAAK,CAAC,YAAY,KAAK,QAAQ;YACrC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,YAAY,EAAE,IAAI,CAAC,EAAE,eAAe,CAAC;YAChE,CAAC,CAAC,KAAK,CAAC,YAAY,CAAC;QACzB,CAAC,CAAC,SAAS,CAAC;IAEhB,MAAM,SAAS,GAAG,KAAK,EAAE,IAAI;QACzB,CAAC,CAAC,CAAC,OAAO,KAAK,CAAC,IAAI,KAAK,QAAQ;YAC7B,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,QAAQ,CAAC;YACjD,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC;QACjB,CAAC,CAAC,SAAS,CAAC;IAEhB,OAAO,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE;QAC/B,KAAK,EAAE,KAAK;QACZ,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC;QAC7E,YAAY,EAAE,iBAAiB,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,iBAAiB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC;QAC5F,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC;KACvE,CAAC,EAAE,eAAe,CAAC,CAAC;AACzB,CAAC;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG;IACjB;;;;;;;;;;;;;;;;;;;;;;;OAuBG;IACH,IAAI,EAAE,WAAW;IACjB,KAAK,EAAE;QACH;;;;;;;;;;WAUG;QACH,KAAK,EAAE,SAAS;KACnB;CACK,CAAC"}
|
|
@@ -73,11 +73,50 @@ declare function createIcon(prefix: IconPrefix, name: IconName, style?: IconStyl
|
|
|
73
73
|
* ```
|
|
74
74
|
*/
|
|
75
75
|
export declare const Icon: {
|
|
76
|
-
/**
|
|
76
|
+
/**
|
|
77
|
+
* Creates an Icon component.
|
|
78
|
+
*
|
|
79
|
+
* @param prefix - The Font Awesome icon prefix (e.g., "fas", "far", "fab")
|
|
80
|
+
* @param name - The Font Awesome icon name (e.g., "user", "home", "chevron-right")
|
|
81
|
+
* @param style - Optional styling configuration
|
|
82
|
+
* @returns An East expression representing the Icon component
|
|
83
|
+
*
|
|
84
|
+
* @remarks
|
|
85
|
+
* Both prefix and name are typesafe using Font Awesome's TypeScript types.
|
|
86
|
+
* Common prefixes:
|
|
87
|
+
* - `fas` - Solid icons (filled)
|
|
88
|
+
* - `far` - Regular icons (outlined)
|
|
89
|
+
* - `fab` - Brand icons (logos)
|
|
90
|
+
*
|
|
91
|
+
* @example
|
|
92
|
+
* ```ts
|
|
93
|
+
* import { East } from "@elaraai/east";
|
|
94
|
+
* import { Icon, UIComponentType } from "@elaraai/east-ui";
|
|
95
|
+
*
|
|
96
|
+
* const example = East.function([], UIComponentType, $ => {
|
|
97
|
+
* return Icon.Root("fas", "user");
|
|
98
|
+
* });
|
|
99
|
+
*
|
|
100
|
+
* const styledExample = East.function([], UIComponentType, $ => {
|
|
101
|
+
* return Icon.Root("fas", "heart", {
|
|
102
|
+
* color: "red.500",
|
|
103
|
+
* size: "xl",
|
|
104
|
+
* });
|
|
105
|
+
* });
|
|
106
|
+
* ```
|
|
107
|
+
*/
|
|
77
108
|
readonly Root: typeof createIcon;
|
|
78
|
-
/** Type definitions */
|
|
79
109
|
readonly Types: {
|
|
80
|
-
/**
|
|
110
|
+
/**
|
|
111
|
+
* Type for Icon component data.
|
|
112
|
+
*
|
|
113
|
+
* @remarks
|
|
114
|
+
* Icon displays a Font Awesome icon with optional styling.
|
|
115
|
+
*
|
|
116
|
+
* @property name - The Font Awesome icon name (e.g., "user", "home", "chevron-right")
|
|
117
|
+
* @property prefix - The Font Awesome prefix (e.g., "fas", "far", "fab")
|
|
118
|
+
* @property style - Optional styling configuration
|
|
119
|
+
*/
|
|
81
120
|
readonly Icon: import("@elaraai/east").StructType<{
|
|
82
121
|
name: import("@elaraai/east").StringType;
|
|
83
122
|
prefix: import("@elaraai/east").StringType;
|
|
@@ -112,7 +151,17 @@ export declare const Icon: {
|
|
|
112
151
|
}>>;
|
|
113
152
|
}>>;
|
|
114
153
|
}>;
|
|
115
|
-
/**
|
|
154
|
+
/**
|
|
155
|
+
* Style type for the Icon component.
|
|
156
|
+
*
|
|
157
|
+
* @remarks
|
|
158
|
+
* All properties are optional and wrapped in OptionType.
|
|
159
|
+
*
|
|
160
|
+
* @property size - Icon size (xs, sm, md, lg, xl, 2xl)
|
|
161
|
+
* @property variant - Icon style/weight (solid, regular, light, thin, brands)
|
|
162
|
+
* @property color - Icon color (CSS color or Chakra color token)
|
|
163
|
+
* @property colorPalette - Color scheme for the icon
|
|
164
|
+
*/
|
|
116
165
|
readonly Style: import("@elaraai/east").StructType<{
|
|
117
166
|
size: import("@elaraai/east").OptionType<import("@elaraai/east").VariantType<{
|
|
118
167
|
xs: import("@elaraai/east").NullType;
|
|
@@ -143,7 +192,19 @@ export declare const Icon: {
|
|
|
143
192
|
pink: import("@elaraai/east").NullType;
|
|
144
193
|
}>>;
|
|
145
194
|
}>;
|
|
146
|
-
/**
|
|
195
|
+
/**
|
|
196
|
+
* Size options for Icon component.
|
|
197
|
+
*
|
|
198
|
+
* @remarks
|
|
199
|
+
* Maps to Font Awesome size classes.
|
|
200
|
+
*
|
|
201
|
+
* @property xs - Extra small icon
|
|
202
|
+
* @property sm - Small icon
|
|
203
|
+
* @property md - Medium icon (default)
|
|
204
|
+
* @property lg - Large icon
|
|
205
|
+
* @property xl - Extra large icon
|
|
206
|
+
* @property 2xl - 2x large icon
|
|
207
|
+
*/
|
|
147
208
|
readonly Size: import("@elaraai/east").VariantType<{
|
|
148
209
|
xs: import("@elaraai/east").NullType;
|
|
149
210
|
sm: import("@elaraai/east").NullType;
|
|
@@ -152,7 +213,18 @@ export declare const Icon: {
|
|
|
152
213
|
xl: import("@elaraai/east").NullType;
|
|
153
214
|
"2xl": import("@elaraai/east").NullType;
|
|
154
215
|
}>;
|
|
155
|
-
/**
|
|
216
|
+
/**
|
|
217
|
+
* Font Awesome icon style/variant.
|
|
218
|
+
*
|
|
219
|
+
* @remarks
|
|
220
|
+
* Determines which icon set to use.
|
|
221
|
+
*
|
|
222
|
+
* @property solid - Solid filled icons (fas)
|
|
223
|
+
* @property regular - Regular outlined icons (far)
|
|
224
|
+
* @property light - Light weight icons (fal) - requires FA Pro
|
|
225
|
+
* @property thin - Thin weight icons (fat) - requires FA Pro
|
|
226
|
+
* @property brands - Brand logos (fab)
|
|
227
|
+
*/
|
|
156
228
|
readonly Variant: import("@elaraai/east").VariantType<{
|
|
157
229
|
solid: import("@elaraai/east").NullType;
|
|
158
230
|
regular: import("@elaraai/east").NullType;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/display/icon/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EACH,KAAK,QAAQ,EAChB,MAAM,eAAe,CAAC;AAEvB,OAAO,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,uCAAuC,CAAC;AAGlF,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAKH,KAAK,SAAS,EACjB,MAAM,YAAY,CAAC;AAGpB,OAAO,EACH,YAAY,EACZ,eAAe,EACf,aAAa,EACb,QAAQ,EACR,KAAK,eAAe,EACpB,KAAK,kBAAkB,EACvB,KAAK,SAAS,EACd,KAAK,QAAQ,GAChB,MAAM,YAAY,CAAC;AAMpB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AACH,iBAAS,UAAU,CACf,MAAM,EAAE,UAAU,EAClB,IAAI,EAAE,QAAQ,EACd,KAAK,CAAC,EAAE,SAAS,GAClB,QAAQ,CAAC,eAAe,CAAC,CA6B3B;AAMD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,IAAI;IACb
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/display/icon/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EACH,KAAK,QAAQ,EAChB,MAAM,eAAe,CAAC;AAEvB,OAAO,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,uCAAuC,CAAC;AAGlF,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAKH,KAAK,SAAS,EACjB,MAAM,YAAY,CAAC;AAGpB,OAAO,EACH,YAAY,EACZ,eAAe,EACf,aAAa,EACb,QAAQ,EACR,KAAK,eAAe,EACpB,KAAK,kBAAkB,EACvB,KAAK,SAAS,EACd,KAAK,QAAQ,GAChB,MAAM,YAAY,CAAC;AAMpB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AACH,iBAAS,UAAU,CACf,MAAM,EAAE,UAAU,EAClB,IAAI,EAAE,QAAQ,EACd,KAAK,CAAC,EAAE,SAAS,GAClB,QAAQ,CAAC,eAAe,CAAC,CA6B3B;AAMD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,IAAI;IACb;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA+BG;;;QAGC;;;;;;;;;WASG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAEH;;;;;;;;;;WAUG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAEH;;;;;;;;;;;;WAYG;;;;;;;;;QAEH;;;;;;;;;;;WAWG;;;;;;;;;CAGD,CAAC"}
|
|
@@ -106,17 +106,89 @@ function createIcon(prefix, name, style) {
|
|
|
106
106
|
* ```
|
|
107
107
|
*/
|
|
108
108
|
export const Icon = {
|
|
109
|
-
/**
|
|
109
|
+
/**
|
|
110
|
+
* Creates an Icon component.
|
|
111
|
+
*
|
|
112
|
+
* @param prefix - The Font Awesome icon prefix (e.g., "fas", "far", "fab")
|
|
113
|
+
* @param name - The Font Awesome icon name (e.g., "user", "home", "chevron-right")
|
|
114
|
+
* @param style - Optional styling configuration
|
|
115
|
+
* @returns An East expression representing the Icon component
|
|
116
|
+
*
|
|
117
|
+
* @remarks
|
|
118
|
+
* Both prefix and name are typesafe using Font Awesome's TypeScript types.
|
|
119
|
+
* Common prefixes:
|
|
120
|
+
* - `fas` - Solid icons (filled)
|
|
121
|
+
* - `far` - Regular icons (outlined)
|
|
122
|
+
* - `fab` - Brand icons (logos)
|
|
123
|
+
*
|
|
124
|
+
* @example
|
|
125
|
+
* ```ts
|
|
126
|
+
* import { East } from "@elaraai/east";
|
|
127
|
+
* import { Icon, UIComponentType } from "@elaraai/east-ui";
|
|
128
|
+
*
|
|
129
|
+
* const example = East.function([], UIComponentType, $ => {
|
|
130
|
+
* return Icon.Root("fas", "user");
|
|
131
|
+
* });
|
|
132
|
+
*
|
|
133
|
+
* const styledExample = East.function([], UIComponentType, $ => {
|
|
134
|
+
* return Icon.Root("fas", "heart", {
|
|
135
|
+
* color: "red.500",
|
|
136
|
+
* size: "xl",
|
|
137
|
+
* });
|
|
138
|
+
* });
|
|
139
|
+
* ```
|
|
140
|
+
*/
|
|
110
141
|
Root: createIcon,
|
|
111
|
-
/** Type definitions */
|
|
112
142
|
Types: {
|
|
113
|
-
/**
|
|
143
|
+
/**
|
|
144
|
+
* Type for Icon component data.
|
|
145
|
+
*
|
|
146
|
+
* @remarks
|
|
147
|
+
* Icon displays a Font Awesome icon with optional styling.
|
|
148
|
+
*
|
|
149
|
+
* @property name - The Font Awesome icon name (e.g., "user", "home", "chevron-right")
|
|
150
|
+
* @property prefix - The Font Awesome prefix (e.g., "fas", "far", "fab")
|
|
151
|
+
* @property style - Optional styling configuration
|
|
152
|
+
*/
|
|
114
153
|
Icon: IconType,
|
|
115
|
-
/**
|
|
154
|
+
/**
|
|
155
|
+
* Style type for the Icon component.
|
|
156
|
+
*
|
|
157
|
+
* @remarks
|
|
158
|
+
* All properties are optional and wrapped in OptionType.
|
|
159
|
+
*
|
|
160
|
+
* @property size - Icon size (xs, sm, md, lg, xl, 2xl)
|
|
161
|
+
* @property variant - Icon style/weight (solid, regular, light, thin, brands)
|
|
162
|
+
* @property color - Icon color (CSS color or Chakra color token)
|
|
163
|
+
* @property colorPalette - Color scheme for the icon
|
|
164
|
+
*/
|
|
116
165
|
Style: IconStyleType,
|
|
117
|
-
/**
|
|
166
|
+
/**
|
|
167
|
+
* Size options for Icon component.
|
|
168
|
+
*
|
|
169
|
+
* @remarks
|
|
170
|
+
* Maps to Font Awesome size classes.
|
|
171
|
+
*
|
|
172
|
+
* @property xs - Extra small icon
|
|
173
|
+
* @property sm - Small icon
|
|
174
|
+
* @property md - Medium icon (default)
|
|
175
|
+
* @property lg - Large icon
|
|
176
|
+
* @property xl - Extra large icon
|
|
177
|
+
* @property 2xl - 2x large icon
|
|
178
|
+
*/
|
|
118
179
|
Size: IconSizeType,
|
|
119
|
-
/**
|
|
180
|
+
/**
|
|
181
|
+
* Font Awesome icon style/variant.
|
|
182
|
+
*
|
|
183
|
+
* @remarks
|
|
184
|
+
* Determines which icon set to use.
|
|
185
|
+
*
|
|
186
|
+
* @property solid - Solid filled icons (fas)
|
|
187
|
+
* @property regular - Regular outlined icons (far)
|
|
188
|
+
* @property light - Light weight icons (fal) - requires FA Pro
|
|
189
|
+
* @property thin - Thin weight icons (fat) - requires FA Pro
|
|
190
|
+
* @property brands - Brand logos (fab)
|
|
191
|
+
*/
|
|
120
192
|
Variant: IconVariantType,
|
|
121
193
|
},
|
|
122
194
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/display/icon/index.ts"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/display/icon/index.ts"],"names":[],"mappings":"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"}
|
|
@@ -4,8 +4,8 @@
|
|
|
4
4
|
*/
|
|
5
5
|
import { type ExprType, type SubtypeExprOrValue, StringType } from "@elaraai/east";
|
|
6
6
|
import { UIComponentType } from "../../component.js";
|
|
7
|
-
import { type StatStyle } from "./types.js";
|
|
8
|
-
export {
|
|
7
|
+
import { StatIndicator, type StatStyle } from "./types.js";
|
|
8
|
+
export { type StatStyle, type StatIndicatorLiteral } from "./types.js";
|
|
9
9
|
/**
|
|
10
10
|
* Creates a Stat component with label, value, and optional trend info.
|
|
11
11
|
*
|
|
@@ -65,8 +65,64 @@ declare function createStat(label: SubtypeExprOrValue<StringType>, value: Subtyp
|
|
|
65
65
|
* ```
|
|
66
66
|
*/
|
|
67
67
|
export declare const Stat: {
|
|
68
|
+
/**
|
|
69
|
+
* Creates a Stat component with label, value, and optional trend info.
|
|
70
|
+
*
|
|
71
|
+
* @param label - The stat label/title
|
|
72
|
+
* @param value - The main stat value
|
|
73
|
+
* @param style - Optional styling configuration
|
|
74
|
+
* @returns An East expression representing the stat component
|
|
75
|
+
*
|
|
76
|
+
* @remarks
|
|
77
|
+
* Stat is used to display key metrics or KPIs with optional trend indicators
|
|
78
|
+
* and help text describing changes.
|
|
79
|
+
*
|
|
80
|
+
* @example
|
|
81
|
+
* ```ts
|
|
82
|
+
* import { East } from "@elaraai/east";
|
|
83
|
+
* import { Stat, UIComponentType } from "@elaraai/east-ui";
|
|
84
|
+
*
|
|
85
|
+
* const example = East.function([], UIComponentType, $ => {
|
|
86
|
+
* return Stat.Root("Growth", "+23.36%", {
|
|
87
|
+
* helpText: "From last week",
|
|
88
|
+
* indicator: "up",
|
|
89
|
+
* });
|
|
90
|
+
* });
|
|
91
|
+
* ```
|
|
92
|
+
*/
|
|
68
93
|
readonly Root: typeof createStat;
|
|
94
|
+
/**
|
|
95
|
+
* Helper function to create stat indicator values.
|
|
96
|
+
*
|
|
97
|
+
* @param direction - The indicator direction ("up" or "down")
|
|
98
|
+
* @returns An East expression representing the stat indicator
|
|
99
|
+
*
|
|
100
|
+
* @example
|
|
101
|
+
* ```ts
|
|
102
|
+
* import { Stat } from "@elaraai/east-ui";
|
|
103
|
+
*
|
|
104
|
+
* // Dynamic indicator based on value
|
|
105
|
+
* const stat = Stat.Root("Profit", value, {
|
|
106
|
+
* indicator: condition.ifElse(
|
|
107
|
+
* $ => Stat.Indicator("up"),
|
|
108
|
+
* $ => Stat.Indicator("down")
|
|
109
|
+
* ),
|
|
110
|
+
* });
|
|
111
|
+
* ```
|
|
112
|
+
*/
|
|
113
|
+
readonly Indicator: typeof StatIndicator;
|
|
69
114
|
readonly Types: {
|
|
115
|
+
/**
|
|
116
|
+
* Type for Stat component data.
|
|
117
|
+
*
|
|
118
|
+
* @remarks
|
|
119
|
+
* Stat displays a key metric with optional label, help text, and trend indicator.
|
|
120
|
+
*
|
|
121
|
+
* @property label - The stat label/title
|
|
122
|
+
* @property value - The main stat value
|
|
123
|
+
* @property helpText - Optional help text or trend description
|
|
124
|
+
* @property indicator - Optional trend indicator (up/down)
|
|
125
|
+
*/
|
|
70
126
|
readonly Stat: import("@elaraai/east").StructType<{
|
|
71
127
|
label: StringType;
|
|
72
128
|
value: StringType;
|
|
@@ -76,6 +132,15 @@ export declare const Stat: {
|
|
|
76
132
|
down: import("@elaraai/east").NullType;
|
|
77
133
|
}>>;
|
|
78
134
|
}>;
|
|
135
|
+
/**
|
|
136
|
+
* Indicator types for Stat component.
|
|
137
|
+
*
|
|
138
|
+
* @remarks
|
|
139
|
+
* Used to show trend direction.
|
|
140
|
+
*
|
|
141
|
+
* @property up - Positive trend (usually green)
|
|
142
|
+
* @property down - Negative trend (usually red)
|
|
143
|
+
*/
|
|
79
144
|
readonly Indicator: import("@elaraai/east").VariantType<{
|
|
80
145
|
up: import("@elaraai/east").NullType;
|
|
81
146
|
down: import("@elaraai/east").NullType;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/display/stat/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EACH,KAAK,QAAQ,EACb,KAAK,kBAAkB,EAEvB,UAAU,EAEb,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAA+B,KAAK,SAAS,EAAE,MAAM,YAAY,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/display/stat/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EACH,KAAK,QAAQ,EACb,KAAK,kBAAkB,EAEvB,UAAU,EAEb,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAA+B,aAAa,EAAE,KAAK,SAAS,EAAE,MAAM,YAAY,CAAC;AAGxF,OAAO,EAAE,KAAK,SAAS,EAAE,KAAK,oBAAoB,EAAE,MAAM,YAAY,CAAC;AAMvE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AACH,iBAAS,UAAU,CACf,KAAK,EAAE,kBAAkB,CAAC,UAAU,CAAC,EACrC,KAAK,EAAE,kBAAkB,CAAC,UAAU,CAAC,EACrC,KAAK,CAAC,EAAE,SAAS,GAClB,QAAQ,CAAC,eAAe,CAAC,CAkB3B;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,IAAI;IACb;;;;;;;;;;;;;;;;;;;;;;;;OAwBG;;IAEH;;;;;;;;;;;;;;;;;;OAkBG;;;QAGC;;;;;;;;;;WAUG;;;;;;;;;;QAEH;;;;;;;;WAQG;;;;;;CAGD,CAAC"}
|
|
@@ -4,9 +4,9 @@
|
|
|
4
4
|
*/
|
|
5
5
|
import { East, StringType, variant, } from "@elaraai/east";
|
|
6
6
|
import { UIComponentType } from "../../component.js";
|
|
7
|
-
import { StatType, StatIndicatorType } from "./types.js";
|
|
8
|
-
// Re-export types
|
|
9
|
-
export {
|
|
7
|
+
import { StatType, StatIndicatorType, StatIndicator } from "./types.js";
|
|
8
|
+
// Re-export types (only TypeScript interfaces, not East types - those go through Stat.Types)
|
|
9
|
+
export {} from "./types.js";
|
|
10
10
|
// ============================================================================
|
|
11
11
|
// Stat Function
|
|
12
12
|
// ============================================================================
|
|
@@ -86,9 +86,74 @@ function createStat(label, value, style) {
|
|
|
86
86
|
* ```
|
|
87
87
|
*/
|
|
88
88
|
export const Stat = {
|
|
89
|
+
/**
|
|
90
|
+
* Creates a Stat component with label, value, and optional trend info.
|
|
91
|
+
*
|
|
92
|
+
* @param label - The stat label/title
|
|
93
|
+
* @param value - The main stat value
|
|
94
|
+
* @param style - Optional styling configuration
|
|
95
|
+
* @returns An East expression representing the stat component
|
|
96
|
+
*
|
|
97
|
+
* @remarks
|
|
98
|
+
* Stat is used to display key metrics or KPIs with optional trend indicators
|
|
99
|
+
* and help text describing changes.
|
|
100
|
+
*
|
|
101
|
+
* @example
|
|
102
|
+
* ```ts
|
|
103
|
+
* import { East } from "@elaraai/east";
|
|
104
|
+
* import { Stat, UIComponentType } from "@elaraai/east-ui";
|
|
105
|
+
*
|
|
106
|
+
* const example = East.function([], UIComponentType, $ => {
|
|
107
|
+
* return Stat.Root("Growth", "+23.36%", {
|
|
108
|
+
* helpText: "From last week",
|
|
109
|
+
* indicator: "up",
|
|
110
|
+
* });
|
|
111
|
+
* });
|
|
112
|
+
* ```
|
|
113
|
+
*/
|
|
89
114
|
Root: createStat,
|
|
115
|
+
/**
|
|
116
|
+
* Helper function to create stat indicator values.
|
|
117
|
+
*
|
|
118
|
+
* @param direction - The indicator direction ("up" or "down")
|
|
119
|
+
* @returns An East expression representing the stat indicator
|
|
120
|
+
*
|
|
121
|
+
* @example
|
|
122
|
+
* ```ts
|
|
123
|
+
* import { Stat } from "@elaraai/east-ui";
|
|
124
|
+
*
|
|
125
|
+
* // Dynamic indicator based on value
|
|
126
|
+
* const stat = Stat.Root("Profit", value, {
|
|
127
|
+
* indicator: condition.ifElse(
|
|
128
|
+
* $ => Stat.Indicator("up"),
|
|
129
|
+
* $ => Stat.Indicator("down")
|
|
130
|
+
* ),
|
|
131
|
+
* });
|
|
132
|
+
* ```
|
|
133
|
+
*/
|
|
134
|
+
Indicator: StatIndicator,
|
|
90
135
|
Types: {
|
|
136
|
+
/**
|
|
137
|
+
* Type for Stat component data.
|
|
138
|
+
*
|
|
139
|
+
* @remarks
|
|
140
|
+
* Stat displays a key metric with optional label, help text, and trend indicator.
|
|
141
|
+
*
|
|
142
|
+
* @property label - The stat label/title
|
|
143
|
+
* @property value - The main stat value
|
|
144
|
+
* @property helpText - Optional help text or trend description
|
|
145
|
+
* @property indicator - Optional trend indicator (up/down)
|
|
146
|
+
*/
|
|
91
147
|
Stat: StatType,
|
|
148
|
+
/**
|
|
149
|
+
* Indicator types for Stat component.
|
|
150
|
+
*
|
|
151
|
+
* @remarks
|
|
152
|
+
* Used to show trend direction.
|
|
153
|
+
*
|
|
154
|
+
* @property up - Positive trend (usually green)
|
|
155
|
+
* @property down - Negative trend (usually red)
|
|
156
|
+
*/
|
|
92
157
|
Indicator: StatIndicatorType,
|
|
93
158
|
},
|
|
94
159
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/display/stat/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAGH,IAAI,EACJ,UAAU,EACV,OAAO,GACV,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,iBAAiB,EAAkB,MAAM,YAAY,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/display/stat/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAGH,IAAI,EACJ,UAAU,EACV,OAAO,GACV,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,iBAAiB,EAAE,aAAa,EAAkB,MAAM,YAAY,CAAC;AAExF,6FAA6F;AAC7F,OAAO,EAA6C,MAAM,YAAY,CAAC;AAEvE,+EAA+E;AAC/E,gBAAgB;AAChB,+EAA+E;AAE/E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AACH,SAAS,UAAU,CACf,KAAqC,EACrC,KAAqC,EACrC,KAAiB;IAEjB,MAAM,cAAc,GAAG,CAAC,GAA+C,EAAE,EAAE;QACvE,IAAI,GAAG,KAAK,SAAS;YAAE,OAAO,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;QACpD,OAAO,OAAO,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAChC,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,KAAK,EAAE,SAAS;QACnC,CAAC,CAAC,CAAC,OAAO,KAAK,CAAC,SAAS,KAAK,QAAQ;YAClC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,SAAS,EAAE,IAAI,CAAC,EAAE,iBAAiB,CAAC;YAC/D,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC;QACtB,CAAC,CAAC,SAAS,CAAC;IAEhB,OAAO,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM,EAAE;QAC9B,KAAK,EAAE,KAAK;QACZ,KAAK,EAAE,KAAK;QACZ,QAAQ,EAAE,cAAc,CAAC,KAAK,EAAE,QAAQ,CAAC;QACzC,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC;KACtF,CAAC,EAAE,eAAe,CAAC,CAAC;AACzB,CAAC;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,CAAC,MAAM,IAAI,GAAG;IAChB;;;;;;;;;;;;;;;;;;;;;;;;OAwBG;IACH,IAAI,EAAE,UAAU;IAChB;;;;;;;;;;;;;;;;;;OAkBG;IACH,SAAS,EAAE,aAAa;IACxB,KAAK,EAAE;QACH;;;;;;;;;;WAUG;QACH,IAAI,EAAE,QAAQ;QACd;;;;;;;;WAQG;QACH,SAAS,EAAE,iBAAiB;KAC/B;CACK,CAAC"}
|
|
@@ -59,8 +59,45 @@ declare function createTag(label: SubtypeExprOrValue<StringType>, style?: TagSty
|
|
|
59
59
|
* ```
|
|
60
60
|
*/
|
|
61
61
|
export declare const Tag: {
|
|
62
|
+
/**
|
|
63
|
+
* Creates a Tag component with label and optional styling.
|
|
64
|
+
*
|
|
65
|
+
* @param label - The tag text content
|
|
66
|
+
* @param style - Optional styling configuration
|
|
67
|
+
* @returns An East expression representing the tag component
|
|
68
|
+
*
|
|
69
|
+
* @remarks
|
|
70
|
+
* Tag is used for categorization and filtering. Common uses include
|
|
71
|
+
* filter chips, labels, and removable categories.
|
|
72
|
+
*
|
|
73
|
+
* @example
|
|
74
|
+
* ```ts
|
|
75
|
+
* import { East } from "@elaraai/east";
|
|
76
|
+
* import { Tag, UIComponentType } from "@elaraai/east-ui";
|
|
77
|
+
*
|
|
78
|
+
* const example = East.function([], UIComponentType, $ => {
|
|
79
|
+
* return Tag.Root("Featured", {
|
|
80
|
+
* colorPalette: "blue",
|
|
81
|
+
* variant: "solid",
|
|
82
|
+
* });
|
|
83
|
+
* });
|
|
84
|
+
* ```
|
|
85
|
+
*/
|
|
62
86
|
readonly Root: typeof createTag;
|
|
63
87
|
readonly Types: {
|
|
88
|
+
/**
|
|
89
|
+
* Type for Tag component data.
|
|
90
|
+
*
|
|
91
|
+
* @remarks
|
|
92
|
+
* Tag is used for categorization, filtering, and labeling items.
|
|
93
|
+
* Unlike Badge, Tags can be closable/removable.
|
|
94
|
+
*
|
|
95
|
+
* @property label - The tag text content
|
|
96
|
+
* @property variant - Visual variant (solid, subtle, outline)
|
|
97
|
+
* @property colorPalette - Color scheme for the tag
|
|
98
|
+
* @property size - Size of the tag (sm, md, lg, xl)
|
|
99
|
+
* @property closable - Whether the tag shows a close button
|
|
100
|
+
*/
|
|
64
101
|
readonly Tag: import("@elaraai/east").StructType<{
|
|
65
102
|
label: StringType;
|
|
66
103
|
variant: import("@elaraai/east").OptionType<import("@elaraai/east").VariantType<{
|
|
@@ -88,6 +125,17 @@ export declare const Tag: {
|
|
|
88
125
|
}>>;
|
|
89
126
|
closable: import("@elaraai/east").OptionType<BooleanType>;
|
|
90
127
|
}>;
|
|
128
|
+
/**
|
|
129
|
+
* Size variant type for Tag component.
|
|
130
|
+
*
|
|
131
|
+
* @remarks
|
|
132
|
+
* Tag supports sm, md, lg, and xl sizes (no xs).
|
|
133
|
+
*
|
|
134
|
+
* @property sm - Small size
|
|
135
|
+
* @property md - Medium size (default)
|
|
136
|
+
* @property lg - Large size
|
|
137
|
+
* @property xl - Extra large size
|
|
138
|
+
*/
|
|
91
139
|
readonly Size: import("@elaraai/east").VariantType<{
|
|
92
140
|
sm: import("@elaraai/east").NullType;
|
|
93
141
|
md: import("@elaraai/east").NullType;
|