@nattstack/ui 0.0.89 → 0.0.91
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/checkbox/checkbox.css +4 -4
- package/dist/components/checkbox/checkbox.js +1 -1
- package/dist/components/checkbox/checkbox.module.js +1 -1
- package/dist/components/column/column.css +1 -1
- package/dist/components/column/column.js +1 -1
- package/dist/components/column/column.module.js +1 -1
- package/dist/components/dialog-responsive/dialog-responsive-backdrop.css +5 -5
- package/dist/components/dialog-responsive/dialog-responsive-backdrop.js +1 -1
- package/dist/components/dialog-responsive/dialog-responsive-backdrop.module.js +1 -1
- package/dist/components/dialog-responsive/dialog-responsive-bar.css +2 -2
- package/dist/components/dialog-responsive/dialog-responsive-bar.js +1 -1
- package/dist/components/dialog-responsive/dialog-responsive-bar.module.js +1 -1
- package/dist/components/dialog-responsive/dialog-responsive-popup.css +7 -7
- package/dist/components/dialog-responsive/dialog-responsive-popup.js +1 -1
- package/dist/components/dialog-responsive/dialog-responsive-popup.module.js +1 -1
- package/dist/components/dialog-responsive/dialog-responsive-portal.css +1 -1
- package/dist/components/dialog-responsive/dialog-responsive-portal.js +1 -1
- package/dist/components/dialog-responsive/dialog-responsive-portal.module.js +1 -1
- package/dist/components/dialog-responsive/dialog-responsive-viewport.css +2 -2
- package/dist/components/dialog-responsive/dialog-responsive-viewport.js +1 -1
- package/dist/components/dialog-responsive/dialog-responsive-viewport.module.js +1 -1
- package/dist/components/index.d.ts +2 -1
- package/dist/components/index.js +2 -1
- package/dist/components/input/input.css +14 -15
- package/dist/components/input/input.js +8 -8
- package/dist/components/input/input.module.js +8 -8
- package/dist/components/label/label.css +1 -1
- package/dist/components/label/label.js +1 -1
- package/dist/components/label/label.module.js +1 -1
- package/dist/components/menu/menu.css +0 -2
- package/dist/components/otp-field/otp-field-input.css +4 -5
- package/dist/components/otp-field/otp-field-input.js +1 -1
- package/dist/components/otp-field/otp-field-input.module.js +1 -1
- package/dist/components/otp-field/otp-field.css +2 -2
- package/dist/components/otp-field/otp-field.js +2 -2
- package/dist/components/otp-field/otp-field.module.js +2 -2
- package/dist/components/row/row.css +1 -1
- package/dist/components/row/row.js +1 -1
- package/dist/components/row/row.module.js +1 -1
- package/dist/components/select/select-content.css +11 -11
- package/dist/components/select/select-content.js +3 -3
- package/dist/components/select/select-content.module.js +2 -2
- package/dist/components/select/select-group-label.css +2 -2
- package/dist/components/select/select-group-label.js +1 -1
- package/dist/components/select/select-group-label.module.js +1 -1
- package/dist/components/select/select-group.css +1 -1
- package/dist/components/select/select-group.js +1 -1
- package/dist/components/select/select-group.module.js +1 -1
- package/dist/components/select/select-item.css +23 -27
- package/dist/components/select/select-item.js +7 -7
- package/dist/components/select/select-item.module.js +3 -3
- package/dist/components/select/select-separator.css +1 -1
- package/dist/components/select/select-separator.js +1 -1
- package/dist/components/select/select-separator.module.js +1 -1
- package/dist/components/select/select-trigger.css +10 -21
- package/dist/components/select/select-trigger.d.ts +1 -3
- package/dist/components/select/select-trigger.js +4 -9
- package/dist/components/select/select-trigger.module.js +2 -3
- package/dist/components/select/select-value.css +14 -0
- package/dist/components/select/select-value.d.ts +8 -0
- package/dist/components/select/select-value.js +18 -0
- package/dist/components/select/select-value.module.js +5 -0
- package/dist/components/select/select.d.ts +2 -2
- package/dist/components/spacer/spacer.css +1 -1
- package/dist/components/spacer/spacer.js +1 -1
- package/dist/components/spacer/spacer.module.js +1 -1
- package/dist/components/switch/switch.css +8 -8
- package/dist/components/switch/switch.js +4 -4
- package/dist/components/switch/switch.module.js +4 -4
- package/dist/components/tabs/tabs-panel.css +2 -2
- package/dist/components/tabs/tabs-panel.js +1 -1
- package/dist/components/tabs/tabs-panel.module.js +1 -1
- package/dist/components/tabs/tabs.css +1 -1
- package/dist/components/tabs/tabs.js +1 -1
- package/dist/components/tabs/tabs.module.js +1 -1
- package/dist/components/tabs-pill/tabs-pill-indicator.css +1 -1
- package/dist/components/tabs-pill/tabs-pill-indicator.js +1 -1
- package/dist/components/tabs-pill/tabs-pill-indicator.module.js +1 -1
- package/dist/components/tabs-pill/tabs-pill-list.css +1 -1
- package/dist/components/tabs-pill/tabs-pill-list.js +1 -1
- package/dist/components/tabs-pill/tabs-pill-list.module.js +1 -1
- package/dist/components/tabs-pill/tabs-pill-tab.css +9 -9
- package/dist/components/tabs-pill/tabs-pill-tab.js +3 -3
- package/dist/components/tabs-pill/tabs-pill-tab.module.js +3 -3
- package/dist/components/tabs-segmented/tabs-segmented-indicator.css +1 -1
- package/dist/components/tabs-segmented/tabs-segmented-indicator.js +1 -1
- package/dist/components/tabs-segmented/tabs-segmented-indicator.module.js +1 -1
- package/dist/components/tabs-segmented/tabs-segmented-list.css +1 -1
- package/dist/components/tabs-segmented/tabs-segmented-list.js +1 -1
- package/dist/components/tabs-segmented/tabs-segmented-list.module.js +1 -1
- package/dist/components/tabs-segmented/tabs-segmented-tab.css +4 -4
- package/dist/components/tabs-segmented/tabs-segmented-tab.js +1 -1
- package/dist/components/tabs-segmented/tabs-segmented-tab.module.js +1 -1
- package/dist/components/tabs-underline/tabs-underline-indicator.css +1 -1
- package/dist/components/tabs-underline/tabs-underline-indicator.js +1 -1
- package/dist/components/tabs-underline/tabs-underline-indicator.module.js +1 -1
- package/dist/components/tabs-underline/tabs-underline-list.css +1 -1
- package/dist/components/tabs-underline/tabs-underline-list.js +1 -1
- package/dist/components/tabs-underline/tabs-underline-list.module.js +1 -1
- package/dist/components/tabs-underline/tabs-underline-tab.css +4 -4
- package/dist/components/tabs-underline/tabs-underline-tab.js +1 -1
- package/dist/components/tabs-underline/tabs-underline-tab.module.js +1 -1
- package/dist/components/textarea/textarea.css +1 -1
- package/dist/components/textarea/textarea.js +3 -3
- package/dist/components/textarea/textarea.module.js +1 -1
- package/dist/components/toggle-group/toggle-group-item.css +6 -6
- package/dist/components/toggle-group/toggle-group-item.js +1 -1
- package/dist/components/toggle-group/toggle-group-item.module.js +1 -1
- package/dist/components/toggle-group/toggle-group.css +1 -1
- package/dist/components/toggle-group/toggle-group.js +1 -1
- package/dist/components/toggle-group/toggle-group.module.js +1 -1
- package/dist/components/tooltip/tooltip-popup.css +5 -5
- package/dist/components/tooltip/tooltip-popup.js +2 -2
- package/dist/components/tooltip/tooltip-popup.module.js +2 -2
- package/package.json +1 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
@layer components {
|
|
2
|
-
.checkbox-
|
|
2
|
+
.checkbox-module_base_tQ0i7W {
|
|
3
3
|
--size: 16px;
|
|
4
4
|
background-color: var(--color-bg-shell-inner);
|
|
5
5
|
border: 1px solid var(--color-border);
|
|
@@ -18,16 +18,16 @@
|
|
|
18
18
|
display: flex;
|
|
19
19
|
}
|
|
20
20
|
|
|
21
|
-
.checkbox-
|
|
21
|
+
.checkbox-module_base_tQ0i7W:focus-visible {
|
|
22
22
|
outline-width: 2px;
|
|
23
23
|
}
|
|
24
24
|
|
|
25
|
-
.checkbox-
|
|
25
|
+
.checkbox-module_base_tQ0i7W:hover {
|
|
26
26
|
background-color: var(--color-gray-3);
|
|
27
27
|
border-color: var(--color-gray-6);
|
|
28
28
|
}
|
|
29
29
|
|
|
30
|
-
.checkbox-
|
|
30
|
+
.checkbox-module_base_tQ0i7W[data-checked] {
|
|
31
31
|
background-color: var(--color-primary);
|
|
32
32
|
border-color: #0000;
|
|
33
33
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import './checkbox.css';
|
|
2
2
|
//#region src/components/checkbox/checkbox.module.css
|
|
3
3
|
var checkbox_module_default = {
|
|
4
|
-
"
|
|
4
|
+
"base": "checkbox-module_base_tQ0i7W",
|
|
5
5
|
"icon": "checkbox-module_icon_tQ0i7W",
|
|
6
6
|
"indicator": "checkbox-module_indicator_tQ0i7W"
|
|
7
7
|
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import './column.css';
|
|
2
2
|
//#region src/components/column/column.module.css
|
|
3
|
-
var column_module_default = { "
|
|
3
|
+
var column_module_default = { "base": "column-module_base_CgFaGG" };
|
|
4
4
|
//#endregion
|
|
5
5
|
export { column_module_default as default };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
@layer components {
|
|
2
|
-
.dialog-responsive-backdrop-
|
|
2
|
+
.dialog-responsive-backdrop-module_base_-X7FOq {
|
|
3
3
|
--backdrop-opacity: .25;
|
|
4
4
|
opacity: calc(var(--backdrop-opacity) * (1 - var(--drawer-swipe-progress)));
|
|
5
5
|
outline-color: var(--color-primary-9);
|
|
@@ -10,19 +10,19 @@
|
|
|
10
10
|
inset: 0;
|
|
11
11
|
}
|
|
12
12
|
|
|
13
|
-
.dialog-responsive-backdrop-
|
|
13
|
+
.dialog-responsive-backdrop-module_base_-X7FOq[data-ending-style], .dialog-responsive-backdrop-module_base_-X7FOq[data-starting-style] {
|
|
14
14
|
opacity: 0;
|
|
15
15
|
}
|
|
16
16
|
|
|
17
|
-
.dialog-responsive-backdrop-
|
|
17
|
+
.dialog-responsive-backdrop-module_base_-X7FOq[data-ending-style] {
|
|
18
18
|
transition-duration: calc(var(--drawer-swipe-strength) * .4s);
|
|
19
19
|
}
|
|
20
20
|
|
|
21
|
-
.dialog-responsive-backdrop-
|
|
21
|
+
.dialog-responsive-backdrop-module_base_-X7FOq[data-swiping] {
|
|
22
22
|
transition-duration: 0s;
|
|
23
23
|
}
|
|
24
24
|
|
|
25
|
-
.dark .dialog-responsive-backdrop-
|
|
25
|
+
.dark .dialog-responsive-backdrop-module_base_-X7FOq {
|
|
26
26
|
--backdrop-opacity: .75;
|
|
27
27
|
}
|
|
28
28
|
}
|
|
@@ -12,6 +12,6 @@ function DialogResponsiveBackdrop(props) {
|
|
|
12
12
|
...rest
|
|
13
13
|
});
|
|
14
14
|
}
|
|
15
|
-
const dialogResponsiveBackdropVariants = cva(dialog_responsive_backdrop_module_default.
|
|
15
|
+
const dialogResponsiveBackdropVariants = cva(dialog_responsive_backdrop_module_default.base);
|
|
16
16
|
//#endregion
|
|
17
17
|
export { DialogResponsiveBackdrop, dialogResponsiveBackdropVariants };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import './dialog-responsive-backdrop.css';
|
|
2
2
|
//#region src/components/dialog-responsive/dialog-responsive-backdrop.module.css
|
|
3
|
-
var dialog_responsive_backdrop_module_default = { "
|
|
3
|
+
var dialog_responsive_backdrop_module_default = { "base": "dialog-responsive-backdrop-module_base_-X7FOq" };
|
|
4
4
|
//#endregion
|
|
5
5
|
export { dialog_responsive_backdrop_module_default as default };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
@layer components {
|
|
2
|
-
.dialog-responsive-bar-
|
|
2
|
+
.dialog-responsive-bar-module_base_iUwUCq {
|
|
3
3
|
background-color: var(--color-gray-4);
|
|
4
4
|
border-radius: 9999px;
|
|
5
5
|
width: 48px;
|
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
}
|
|
10
10
|
|
|
11
11
|
@media (width <= 640px) {
|
|
12
|
-
.dialog-responsive-bar-
|
|
12
|
+
.dialog-responsive-bar-module_base_iUwUCq {
|
|
13
13
|
display: block;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
@@ -10,6 +10,6 @@ function DialogResponsiveBar(props) {
|
|
|
10
10
|
...rest
|
|
11
11
|
});
|
|
12
12
|
}
|
|
13
|
-
const dialogResponsiveBarVariants = cva(dialog_responsive_bar_module_default.
|
|
13
|
+
const dialogResponsiveBarVariants = cva(dialog_responsive_bar_module_default.base);
|
|
14
14
|
//#endregion
|
|
15
15
|
export { DialogResponsiveBar, dialogResponsiveBarVariants };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import './dialog-responsive-bar.css';
|
|
2
2
|
//#region src/components/dialog-responsive/dialog-responsive-bar.module.css
|
|
3
|
-
var dialog_responsive_bar_module_default = { "
|
|
3
|
+
var dialog_responsive_bar_module_default = { "base": "dialog-responsive-bar-module_base_iUwUCq" };
|
|
4
4
|
//#endregion
|
|
5
5
|
export { dialog_responsive_bar_module_default as default };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
@layer components {
|
|
2
|
-
.dialog-responsive-popup-
|
|
2
|
+
.dialog-responsive-popup-module_base_cgfWTq {
|
|
3
3
|
background-color: var(--color-gray-1);
|
|
4
4
|
cursor: auto;
|
|
5
5
|
outline-color: var(--color-primary-9);
|
|
@@ -17,21 +17,21 @@
|
|
|
17
17
|
display: flex;
|
|
18
18
|
}
|
|
19
19
|
|
|
20
|
-
.dialog-responsive-popup-
|
|
20
|
+
.dialog-responsive-popup-module_base_cgfWTq:focus-visible {
|
|
21
21
|
outline-width: 2px;
|
|
22
22
|
}
|
|
23
23
|
|
|
24
|
-
.dialog-responsive-popup-
|
|
24
|
+
.dialog-responsive-popup-module_base_cgfWTq[data-ending-style], .dialog-responsive-popup-module_base_cgfWTq[data-starting-style] {
|
|
25
25
|
opacity: 0;
|
|
26
26
|
transform: scale(.975);
|
|
27
27
|
}
|
|
28
28
|
|
|
29
|
-
.dialog-responsive-popup-
|
|
29
|
+
.dialog-responsive-popup-module_base_cgfWTq[data-swiping] {
|
|
30
30
|
user-select: none;
|
|
31
31
|
}
|
|
32
32
|
|
|
33
33
|
@media (width <= 640px) {
|
|
34
|
-
.dialog-responsive-popup-
|
|
34
|
+
.dialog-responsive-popup-module_base_cgfWTq {
|
|
35
35
|
--radius-mobile: 24px;
|
|
36
36
|
border-bottom-right-radius: 0;
|
|
37
37
|
border-bottom-left-radius: 0;
|
|
@@ -44,12 +44,12 @@
|
|
|
44
44
|
transition-timing-function: cubic-bezier(.32, .72, 0, 1);
|
|
45
45
|
}
|
|
46
46
|
|
|
47
|
-
.dialog-responsive-popup-
|
|
47
|
+
.dialog-responsive-popup-module_base_cgfWTq[data-ending-style], .dialog-responsive-popup-module_base_cgfWTq[data-starting-style] {
|
|
48
48
|
opacity: 1;
|
|
49
49
|
transform: scale(1) translateY(100%);
|
|
50
50
|
}
|
|
51
51
|
|
|
52
|
-
.dialog-responsive-popup-
|
|
52
|
+
.dialog-responsive-popup-module_base_cgfWTq[data-ending-style] {
|
|
53
53
|
transition-duration: calc(var(--drawer-swipe-strength) * .3s);
|
|
54
54
|
}
|
|
55
55
|
}
|
|
@@ -17,6 +17,6 @@ function DialogResponsivePopup(props) {
|
|
|
17
17
|
children: [/* @__PURE__ */ jsx(DialogResponsiveBar, {}), children]
|
|
18
18
|
}) })] });
|
|
19
19
|
}
|
|
20
|
-
const dialogResponsivePopupVariants = cva(dialog_responsive_popup_module_default.
|
|
20
|
+
const dialogResponsivePopupVariants = cva(dialog_responsive_popup_module_default.base);
|
|
21
21
|
//#endregion
|
|
22
22
|
export { DialogResponsivePopup, dialogResponsivePopupVariants };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import './dialog-responsive-popup.css';
|
|
2
2
|
//#region src/components/dialog-responsive/dialog-responsive-popup.module.css
|
|
3
|
-
var dialog_responsive_popup_module_default = { "
|
|
3
|
+
var dialog_responsive_popup_module_default = { "base": "dialog-responsive-popup-module_base_cgfWTq" };
|
|
4
4
|
//#endregion
|
|
5
5
|
export { dialog_responsive_popup_module_default as default };
|
|
@@ -12,6 +12,6 @@ function DialogResponsivePortal(props) {
|
|
|
12
12
|
...rest
|
|
13
13
|
});
|
|
14
14
|
}
|
|
15
|
-
const dialogResponsivePortalVariants = cva(dialog_responsive_portal_module_default.
|
|
15
|
+
const dialogResponsivePortalVariants = cva(dialog_responsive_portal_module_default.base);
|
|
16
16
|
//#endregion
|
|
17
17
|
export { DialogResponsivePortal, dialogResponsivePortalVariants };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import './dialog-responsive-portal.css';
|
|
2
2
|
//#region src/components/dialog-responsive/dialog-responsive-portal.module.css
|
|
3
|
-
var dialog_responsive_portal_module_default = { "
|
|
3
|
+
var dialog_responsive_portal_module_default = { "base": "dialog-responsive-portal-module_base_keH0Tq" };
|
|
4
4
|
//#endregion
|
|
5
5
|
export { dialog_responsive_portal_module_default as default };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
@layer components {
|
|
2
|
-
.dialog-responsive-viewport-
|
|
2
|
+
.dialog-responsive-viewport-module_base_b5ZINa {
|
|
3
3
|
cursor: pointer;
|
|
4
4
|
justify-content: safe center;
|
|
5
5
|
align-items: safe center;
|
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
}
|
|
11
11
|
|
|
12
12
|
@media (width <= 640px) {
|
|
13
|
-
.dialog-responsive-viewport-
|
|
13
|
+
.dialog-responsive-viewport-module_base_b5ZINa {
|
|
14
14
|
align-items: safe flex-end;
|
|
15
15
|
padding: 48px 0 0;
|
|
16
16
|
}
|
|
@@ -12,6 +12,6 @@ function DialogResponsiveViewport(props) {
|
|
|
12
12
|
...rest
|
|
13
13
|
});
|
|
14
14
|
}
|
|
15
|
-
const dialogResponsiveViewportVariants = cva(dialog_responsive_viewport_module_default.
|
|
15
|
+
const dialogResponsiveViewportVariants = cva(dialog_responsive_viewport_module_default.base);
|
|
16
16
|
//#endregion
|
|
17
17
|
export { DialogResponsiveViewport, dialogResponsiveViewportVariants };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import './dialog-responsive-viewport.css';
|
|
2
2
|
//#region src/components/dialog-responsive/dialog-responsive-viewport.module.css
|
|
3
|
-
var dialog_responsive_viewport_module_default = { "
|
|
3
|
+
var dialog_responsive_viewport_module_default = { "base": "dialog-responsive-viewport-module_base_b5ZINa" };
|
|
4
4
|
//#endregion
|
|
5
5
|
export { dialog_responsive_viewport_module_default as default };
|
|
@@ -33,6 +33,7 @@ import { SelectGroupLabel, SelectGroupLabelProps, selectGroupLabelVariants } fro
|
|
|
33
33
|
import { SelectItem, SelectItemProps, selectItemVariants } from "./select/select-item.js";
|
|
34
34
|
import { SelectSeparator, SelectSeparatorProps, selectSeparatorVariants } from "./select/select-separator.js";
|
|
35
35
|
import { SelectTrigger, SelectTriggerProps, selectTriggerVariants } from "./select/select-trigger.js";
|
|
36
|
+
import { SelectValue, SelectValueProps, selectValueVariants } from "./select/select-value.js";
|
|
36
37
|
import { Spacer, SpacerProps, spacerVariants } from "./spacer/spacer.js";
|
|
37
38
|
import { Switch, SwitchProps, switchVariants } from "./switch/switch.js";
|
|
38
39
|
import { TabsPillList, TabsPillListProps, tabsPillListVariants } from "./tabs-pill/tabs-pill-list.js";
|
|
@@ -50,4 +51,4 @@ import { Tooltip, TooltipProps } from "./tooltip/tooltip.js";
|
|
|
50
51
|
import { TooltipPopup, TooltipPopupProps, tooltipPopupVariants } from "./tooltip/tooltip-popup.js";
|
|
51
52
|
import { TooltipProvider, TooltipProviderProps } from "./tooltip/tooltip-provider.js";
|
|
52
53
|
import { TooltipTrigger, TooltipTriggerProps } from "./tooltip/tooltip-trigger.js";
|
|
53
|
-
export { Button, ButtonLink, ButtonLinkProps, ButtonProps, Checkbox, CheckboxProps, Column, ColumnProps, DialogResponsive, DialogResponsivePopup, DialogResponsivePopupProps, DialogResponsiveProps, DialogResponsiveTrigger, DialogResponsiveTriggerProps, IconButton, IconButtonProps, Input, InputProps, Label, LabelProps, MENU_CLASS_NAME, Menu, MenuCheckboxItem, MenuCheckboxItemProps, MenuContent, MenuContentProps, MenuGroup, MenuGroupLabel, MenuGroupLabelProps, MenuGroupProps, MenuItem, MenuItemProps, MenuLinkItem, MenuLinkItemProps, MenuProps, MenuRadioGroup, MenuRadioGroupProps, MenuRadioItem, MenuRadioItemProps, MenuSeparator, MenuSeparatorProps, MenuSubmenu, MenuSubmenuProps, MenuSubmenuTrigger, MenuSubmenuTriggerProps, MenuTrigger, MenuTriggerProps, MenuViewport, MenuViewportProps, OTPField, OTPFieldInput, Row, RowProps, Select, SelectContent, SelectContentProps, SelectGroup, SelectGroupLabel, SelectGroupLabelProps, SelectGroupProps, SelectItem, SelectItemProps, SelectProps, SelectSeparator, SelectSeparatorProps, SelectTrigger, SelectTriggerProps, Spacer, SpacerProps, Switch, SwitchProps, Tabs, TabsPanel, TabsPanelProps, TabsPillList, TabsPillListProps, TabsPillTab, TabsPillTabProps, TabsProps, TabsSegmentedList, TabsSegmentedListProps, TabsSegmentedTab, TabsSegmentedTabProps, TabsUnderlineList, TabsUnderlineListProps, TabsUnderlineTab, TabsUnderlineTabProps, Textarea, TextareaProps, ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, Tooltip, TooltipPopup, TooltipPopupProps, TooltipProps, TooltipProvider, TooltipProviderProps, TooltipTrigger, TooltipTriggerProps, button, checkboxVariants, columnVariants, createMenuHandle, dialogResponsivePopupVariants, iconButton, inputVariants, labelVariants, otpFieldInputVariants, otpFieldVariants, rowVariants, selectContentVariants, selectGroupLabelVariants, selectGroupVariants, selectItemVariants, selectSeparatorVariants, selectTriggerVariants, spacerVariants, switchVariants, tabsPanelVariants, tabsPillListVariants, tabsPillTabVariants, tabsSegmentedListVariants, tabsSegmentedTabVariants, tabsUnderlineListVariants, tabsUnderlineTabVariants, tabsVariants, textareaVariants, toggleGroupItemVariants, toggleGroupVariants, tooltipPopupVariants };
|
|
54
|
+
export { Button, ButtonLink, ButtonLinkProps, ButtonProps, Checkbox, CheckboxProps, Column, ColumnProps, DialogResponsive, DialogResponsivePopup, DialogResponsivePopupProps, DialogResponsiveProps, DialogResponsiveTrigger, DialogResponsiveTriggerProps, IconButton, IconButtonProps, Input, InputProps, Label, LabelProps, MENU_CLASS_NAME, Menu, MenuCheckboxItem, MenuCheckboxItemProps, MenuContent, MenuContentProps, MenuGroup, MenuGroupLabel, MenuGroupLabelProps, MenuGroupProps, MenuItem, MenuItemProps, MenuLinkItem, MenuLinkItemProps, MenuProps, MenuRadioGroup, MenuRadioGroupProps, MenuRadioItem, MenuRadioItemProps, MenuSeparator, MenuSeparatorProps, MenuSubmenu, MenuSubmenuProps, MenuSubmenuTrigger, MenuSubmenuTriggerProps, MenuTrigger, MenuTriggerProps, MenuViewport, MenuViewportProps, OTPField, OTPFieldInput, Row, RowProps, Select, SelectContent, SelectContentProps, SelectGroup, SelectGroupLabel, SelectGroupLabelProps, SelectGroupProps, SelectItem, SelectItemProps, SelectProps, SelectSeparator, SelectSeparatorProps, SelectTrigger, SelectTriggerProps, SelectValue, SelectValueProps, Spacer, SpacerProps, Switch, SwitchProps, Tabs, TabsPanel, TabsPanelProps, TabsPillList, TabsPillListProps, TabsPillTab, TabsPillTabProps, TabsProps, TabsSegmentedList, TabsSegmentedListProps, TabsSegmentedTab, TabsSegmentedTabProps, TabsUnderlineList, TabsUnderlineListProps, TabsUnderlineTab, TabsUnderlineTabProps, Textarea, TextareaProps, ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, Tooltip, TooltipPopup, TooltipPopupProps, TooltipProps, TooltipProvider, TooltipProviderProps, TooltipTrigger, TooltipTriggerProps, button, checkboxVariants, columnVariants, createMenuHandle, dialogResponsivePopupVariants, iconButton, inputVariants, labelVariants, otpFieldInputVariants, otpFieldVariants, rowVariants, selectContentVariants, selectGroupLabelVariants, selectGroupVariants, selectItemVariants, selectSeparatorVariants, selectTriggerVariants, selectValueVariants, spacerVariants, switchVariants, tabsPanelVariants, tabsPillListVariants, tabsPillTabVariants, tabsSegmentedListVariants, tabsSegmentedTabVariants, tabsUnderlineListVariants, tabsUnderlineTabVariants, tabsVariants, textareaVariants, toggleGroupItemVariants, toggleGroupVariants, tooltipPopupVariants };
|
package/dist/components/index.js
CHANGED
|
@@ -33,6 +33,7 @@ import { SelectGroupLabel, selectGroupLabelVariants } from "./select/select-grou
|
|
|
33
33
|
import { SelectItem, selectItemVariants } from "./select/select-item.js";
|
|
34
34
|
import { SelectSeparator, selectSeparatorVariants } from "./select/select-separator.js";
|
|
35
35
|
import { SelectTrigger, selectTriggerVariants } from "./select/select-trigger.js";
|
|
36
|
+
import { SelectValue, selectValueVariants } from "./select/select-value.js";
|
|
36
37
|
import { Spacer, spacerVariants } from "./spacer/spacer.js";
|
|
37
38
|
import { Switch, switchVariants } from "./switch/switch.js";
|
|
38
39
|
import { TabsPillList, tabsPillListVariants } from "./tabs-pill/tabs-pill-list.js";
|
|
@@ -50,4 +51,4 @@ import { Tooltip } from "./tooltip/tooltip.js";
|
|
|
50
51
|
import { TooltipPopup, tooltipPopupVariants } from "./tooltip/tooltip-popup.js";
|
|
51
52
|
import { TooltipProvider } from "./tooltip/tooltip-provider.js";
|
|
52
53
|
import { TooltipTrigger } from "./tooltip/tooltip-trigger.js";
|
|
53
|
-
export { Button, ButtonLink, Checkbox, Column, DialogResponsive, DialogResponsivePopup, DialogResponsiveTrigger, IconButton, Input, Label, MENU_CLASS_NAME, Menu, MenuCheckboxItem, MenuContent, MenuGroup, MenuGroupLabel, MenuItem, MenuLinkItem, MenuRadioGroup, MenuRadioItem, MenuSeparator, MenuSubmenu, MenuSubmenuTrigger, MenuTrigger, MenuViewport, OTPField, OTPFieldInput, Row, Select, SelectContent, SelectGroup, SelectGroupLabel, SelectItem, SelectSeparator, SelectTrigger, Spacer, Switch, Tabs, TabsPanel, TabsPillList, TabsPillTab, TabsSegmentedList, TabsSegmentedTab, TabsUnderlineList, TabsUnderlineTab, Textarea, ToggleGroup, ToggleGroupItem, Tooltip, TooltipPopup, TooltipProvider, TooltipTrigger, button, checkboxVariants, columnVariants, createMenuHandle, dialogResponsivePopupVariants, iconButton, inputVariants, labelVariants, otpFieldInputVariants, otpFieldVariants, rowVariants, selectContentVariants, selectGroupLabelVariants, selectGroupVariants, selectItemVariants, selectSeparatorVariants, selectTriggerVariants, spacerVariants, switchVariants, tabsPanelVariants, tabsPillListVariants, tabsPillTabVariants, tabsSegmentedListVariants, tabsSegmentedTabVariants, tabsUnderlineListVariants, tabsUnderlineTabVariants, tabsVariants, textareaVariants, toggleGroupItemVariants, toggleGroupVariants, tooltipPopupVariants };
|
|
54
|
+
export { Button, ButtonLink, Checkbox, Column, DialogResponsive, DialogResponsivePopup, DialogResponsiveTrigger, IconButton, Input, Label, MENU_CLASS_NAME, Menu, MenuCheckboxItem, MenuContent, MenuGroup, MenuGroupLabel, MenuItem, MenuLinkItem, MenuRadioGroup, MenuRadioItem, MenuSeparator, MenuSubmenu, MenuSubmenuTrigger, MenuTrigger, MenuViewport, OTPField, OTPFieldInput, Row, Select, SelectContent, SelectGroup, SelectGroupLabel, SelectItem, SelectSeparator, SelectTrigger, SelectValue, Spacer, Switch, Tabs, TabsPanel, TabsPillList, TabsPillTab, TabsSegmentedList, TabsSegmentedTab, TabsUnderlineList, TabsUnderlineTab, Textarea, ToggleGroup, ToggleGroupItem, Tooltip, TooltipPopup, TooltipProvider, TooltipTrigger, button, checkboxVariants, columnVariants, createMenuHandle, dialogResponsivePopupVariants, iconButton, inputVariants, labelVariants, otpFieldInputVariants, otpFieldVariants, rowVariants, selectContentVariants, selectGroupLabelVariants, selectGroupVariants, selectItemVariants, selectSeparatorVariants, selectTriggerVariants, selectValueVariants, spacerVariants, switchVariants, tabsPanelVariants, tabsPillListVariants, tabsPillTabVariants, tabsSegmentedListVariants, tabsSegmentedTabVariants, tabsUnderlineListVariants, tabsUnderlineTabVariants, tabsVariants, textareaVariants, toggleGroupItemVariants, toggleGroupVariants, tooltipPopupVariants };
|
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
@layer components {
|
|
2
|
-
.input-
|
|
2
|
+
.input-module_base_o34hyq {
|
|
3
3
|
appearance: none;
|
|
4
4
|
background-color: var(--color-bg-shell-inner);
|
|
5
5
|
box-shadow: 0 0 0 1px var(--color-border) inset;
|
|
6
6
|
color: var(--color-text-primary);
|
|
7
7
|
cursor: text;
|
|
8
|
-
font-family: var(--font-body);
|
|
9
8
|
outline-offset: -2px;
|
|
10
9
|
border-style: none;
|
|
11
10
|
outline: 2px solid #0000;
|
|
@@ -18,65 +17,65 @@
|
|
|
18
17
|
transition-duration: .15s;
|
|
19
18
|
}
|
|
20
19
|
|
|
21
|
-
.input-
|
|
20
|
+
.input-module_base_o34hyq::placeholder {
|
|
22
21
|
color: var(--color-gray-9);
|
|
23
22
|
user-select: none;
|
|
24
23
|
}
|
|
25
24
|
|
|
26
|
-
.input-
|
|
25
|
+
.input-module_base_o34hyq:disabled {
|
|
27
26
|
cursor: not-allowed;
|
|
28
27
|
opacity: .5;
|
|
29
28
|
}
|
|
30
29
|
|
|
31
|
-
.input-
|
|
30
|
+
.input-module_base_o34hyq:enabled:active, .input-module_base_o34hyq:enabled:focus, .input-module_base_o34hyq:enabled:hover, .input-module_base_o34hyq:enabled[data-is-active="true"] {
|
|
32
31
|
box-shadow: 0 0 0 1px var(--color-gray-6) inset;
|
|
33
32
|
}
|
|
34
33
|
|
|
35
|
-
.input-
|
|
34
|
+
.input-module_base_o34hyq[data-is-valid="true"] {
|
|
36
35
|
outline-color: #30a46c;
|
|
37
36
|
}
|
|
38
37
|
|
|
39
|
-
.input-
|
|
38
|
+
.input-module_base_o34hyq[data-is-invalid="true"] {
|
|
40
39
|
outline-color: #e5484d;
|
|
41
40
|
}
|
|
42
41
|
|
|
43
|
-
.input-
|
|
42
|
+
.input-module_base_o34hyq:focus-visible {
|
|
44
43
|
outline-color: var(--color-outline);
|
|
45
44
|
}
|
|
46
45
|
|
|
47
|
-
.input-
|
|
46
|
+
.input-module_rounded_base_o34hyq {
|
|
48
47
|
border-radius: 12px;
|
|
49
48
|
}
|
|
50
49
|
|
|
51
|
-
.input-
|
|
50
|
+
.input-module_base_o34hyq.input-module_rounded_full_o34hyq {
|
|
52
51
|
border-radius: 9999px;
|
|
53
52
|
}
|
|
54
53
|
|
|
55
|
-
.input-
|
|
54
|
+
.input-module_size_32_o34hyq {
|
|
56
55
|
border-radius: 8px;
|
|
57
56
|
min-height: 32px;
|
|
58
57
|
padding: 0 8px;
|
|
59
58
|
}
|
|
60
59
|
|
|
61
|
-
.input-
|
|
60
|
+
.input-module_size_36_o34hyq {
|
|
62
61
|
border-radius: 9px;
|
|
63
62
|
min-height: 36px;
|
|
64
63
|
padding: 0 10px;
|
|
65
64
|
}
|
|
66
65
|
|
|
67
|
-
.input-
|
|
66
|
+
.input-module_size_40_o34hyq {
|
|
68
67
|
border-radius: 10px;
|
|
69
68
|
min-height: 40px;
|
|
70
69
|
padding: 0 12px;
|
|
71
70
|
}
|
|
72
71
|
|
|
73
|
-
.input-
|
|
72
|
+
.input-module_size_44_o34hyq {
|
|
74
73
|
border-radius: 11px;
|
|
75
74
|
min-height: 44px;
|
|
76
75
|
padding: 0 14px;
|
|
77
76
|
}
|
|
78
77
|
|
|
79
|
-
.input-
|
|
78
|
+
.input-module_size_48_o34hyq {
|
|
80
79
|
border-radius: 12px;
|
|
81
80
|
min-height: 48px;
|
|
82
81
|
padding: 0 16px;
|
|
@@ -22,22 +22,22 @@ function Input(props) {
|
|
|
22
22
|
...rest
|
|
23
23
|
});
|
|
24
24
|
}
|
|
25
|
-
const inputVariants = cva(input_module_default.
|
|
25
|
+
const inputVariants = cva(input_module_default.base, {
|
|
26
26
|
defaultVariants: {
|
|
27
27
|
isRounded: false,
|
|
28
28
|
size: 48
|
|
29
29
|
},
|
|
30
30
|
variants: {
|
|
31
31
|
isRounded: {
|
|
32
|
-
false: input_module_default.
|
|
33
|
-
true: input_module_default.
|
|
32
|
+
false: input_module_default.rounded_base,
|
|
33
|
+
true: input_module_default.rounded_full
|
|
34
34
|
},
|
|
35
35
|
size: {
|
|
36
|
-
32: input_module_default.
|
|
37
|
-
36: input_module_default.
|
|
38
|
-
40: input_module_default.
|
|
39
|
-
44: input_module_default.
|
|
40
|
-
48: input_module_default.
|
|
36
|
+
32: input_module_default.size_32,
|
|
37
|
+
36: input_module_default.size_36,
|
|
38
|
+
40: input_module_default.size_40,
|
|
39
|
+
44: input_module_default.size_44,
|
|
40
|
+
48: input_module_default.size_48
|
|
41
41
|
}
|
|
42
42
|
}
|
|
43
43
|
});
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import './input.css';
|
|
2
2
|
//#region src/components/input/input.module.css
|
|
3
3
|
var input_module_default = {
|
|
4
|
-
"
|
|
5
|
-
"
|
|
6
|
-
"
|
|
7
|
-
"
|
|
8
|
-
"
|
|
9
|
-
"
|
|
10
|
-
"
|
|
11
|
-
"
|
|
4
|
+
"base": "input-module_base_o34hyq",
|
|
5
|
+
"rounded_base": "input-module_rounded_base_o34hyq",
|
|
6
|
+
"rounded_full": "input-module_rounded_full_o34hyq",
|
|
7
|
+
"size_32": "input-module_size_32_o34hyq",
|
|
8
|
+
"size_36": "input-module_size_36_o34hyq",
|
|
9
|
+
"size_40": "input-module_size_40_o34hyq",
|
|
10
|
+
"size_44": "input-module_size_44_o34hyq",
|
|
11
|
+
"size_48": "input-module_size_48_o34hyq"
|
|
12
12
|
};
|
|
13
13
|
//#endregion
|
|
14
14
|
export { input_module_default as default };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import './label.css';
|
|
2
2
|
//#region src/components/label/label.module.css
|
|
3
|
-
var label_module_default = { "
|
|
3
|
+
var label_module_default = { "base": "label-module_base_iQZ4sG" };
|
|
4
4
|
//#endregion
|
|
5
5
|
export { label_module_default as default };
|
|
@@ -4,7 +4,6 @@
|
|
|
4
4
|
box-shadow: 0 0 0 1px var(--color-gray-4) inset;
|
|
5
5
|
color: var(--color-text-primary);
|
|
6
6
|
cursor: pointer;
|
|
7
|
-
font-family: var(--font-body);
|
|
8
7
|
outline-color: var(--color-primary-9);
|
|
9
8
|
outline-offset: 2px;
|
|
10
9
|
user-select: none;
|
|
@@ -66,7 +65,6 @@
|
|
|
66
65
|
box-shadow: 0 0 0 1px var(--color-border) inset,
|
|
67
66
|
0 16px 32px oklab(0% none none / .16);
|
|
68
67
|
color: var(--color-text-primary);
|
|
69
|
-
font-family: var(--font-body);
|
|
70
68
|
max-height: min(var(--available-height), 480px);
|
|
71
69
|
max-width: min(var(--available-width), 320px);
|
|
72
70
|
outline-color: var(--color-primary-9);
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
@layer components {
|
|
2
|
-
.otp-field-input-
|
|
2
|
+
.otp-field-input-module_base_7VaNVa {
|
|
3
3
|
background-color: var(--color-gray-3);
|
|
4
4
|
box-shadow: 0 0 0 1px var(--color-border) inset;
|
|
5
5
|
color: var(--color-text-primary);
|
|
6
|
-
font-family: var(--font-body);
|
|
7
6
|
outline-color: var(--color-outline);
|
|
8
7
|
outline-offset: -2px;
|
|
9
8
|
text-align: center;
|
|
@@ -18,16 +17,16 @@
|
|
|
18
17
|
transition-duration: .15s;
|
|
19
18
|
}
|
|
20
19
|
|
|
21
|
-
.otp-field-input-
|
|
20
|
+
.otp-field-input-module_base_7VaNVa:enabled:hover {
|
|
22
21
|
box-shadow: 0 0 0 1px var(--color-gray-6) inset;
|
|
23
22
|
}
|
|
24
23
|
|
|
25
|
-
.otp-field-input-
|
|
24
|
+
.otp-field-input-module_base_7VaNVa:disabled {
|
|
26
25
|
cursor: not-allowed;
|
|
27
26
|
opacity: .5;
|
|
28
27
|
}
|
|
29
28
|
|
|
30
|
-
.otp-field-input-
|
|
29
|
+
.otp-field-input-module_base_7VaNVa:focus-visible {
|
|
31
30
|
outline-width: 2px;
|
|
32
31
|
}
|
|
33
32
|
}
|
|
@@ -12,6 +12,6 @@ function OTPFieldInput(props) {
|
|
|
12
12
|
...rest
|
|
13
13
|
});
|
|
14
14
|
}
|
|
15
|
-
const otpFieldInputVariants = cva(otp_field_input_module_default.
|
|
15
|
+
const otpFieldInputVariants = cva(otp_field_input_module_default.base);
|
|
16
16
|
//#endregion
|
|
17
17
|
export { OTPFieldInput, otpFieldInputVariants };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import './otp-field-input.css';
|
|
2
2
|
//#region src/components/otp-field/otp-field-input.module.css
|
|
3
|
-
var otp_field_input_module_default = { "
|
|
3
|
+
var otp_field_input_module_default = { "base": "otp-field-input-module_base_7VaNVa" };
|
|
4
4
|
//#endregion
|
|
5
5
|
export { otp_field_input_module_default as default };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
@layer components {
|
|
2
|
-
.otp-field-
|
|
2
|
+
.otp-field-module_base_6ylpka {
|
|
3
3
|
flex-wrap: wrap;
|
|
4
4
|
justify-content: center;
|
|
5
5
|
gap: 8px;
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
display: flex;
|
|
8
8
|
}
|
|
9
9
|
|
|
10
|
-
.otp-field-
|
|
10
|
+
.otp-field-module_masked_6ylpka > input {
|
|
11
11
|
font-family: var(--font-code);
|
|
12
12
|
}
|
|
13
13
|
}
|
|
@@ -17,11 +17,11 @@ function OTPField$1(props) {
|
|
|
17
17
|
...rest
|
|
18
18
|
});
|
|
19
19
|
}
|
|
20
|
-
const otpFieldVariants = cva(otp_field_module_default.
|
|
20
|
+
const otpFieldVariants = cva(otp_field_module_default.base, {
|
|
21
21
|
defaultVariants: { isMasked: false },
|
|
22
22
|
variants: { isMasked: {
|
|
23
23
|
false: "",
|
|
24
|
-
true: otp_field_module_default.
|
|
24
|
+
true: otp_field_module_default.masked
|
|
25
25
|
} }
|
|
26
26
|
});
|
|
27
27
|
//#endregion
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import './otp-field.css';
|
|
2
2
|
//#region src/components/otp-field/otp-field.module.css
|
|
3
3
|
var otp_field_module_default = {
|
|
4
|
-
"
|
|
5
|
-
"
|
|
4
|
+
"base": "otp-field-module_base_6ylpka",
|
|
5
|
+
"masked": "otp-field-module_masked_6ylpka"
|
|
6
6
|
};
|
|
7
7
|
//#endregion
|
|
8
8
|
export { otp_field_module_default as default };
|