@nattstack/ui 0.0.89 → 0.0.90
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 -14
- 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/otp-field/otp-field-input.css +4 -4
- 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 +8 -8
- 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,10 +1,10 @@
|
|
|
1
1
|
@layer components {
|
|
2
|
-
.select-content-
|
|
2
|
+
.select-content-module_positioner_T-MXlW {
|
|
3
3
|
isolation: isolate;
|
|
4
4
|
z-index: 50;
|
|
5
5
|
}
|
|
6
6
|
|
|
7
|
-
.select-content-
|
|
7
|
+
.select-content-module_base_T-MXlW {
|
|
8
8
|
background-color: var(--color-bg-shell-inner);
|
|
9
9
|
box-shadow: 0 0 0 1px var(--color-border) inset,
|
|
10
10
|
0 .5px 0 oklab(0% none none / .03),
|
|
@@ -32,28 +32,28 @@
|
|
|
32
32
|
overflow: auto;
|
|
33
33
|
}
|
|
34
34
|
|
|
35
|
-
.select-content-
|
|
35
|
+
.select-content-module_base_T-MXlW:focus-visible {
|
|
36
36
|
outline-width: 2px;
|
|
37
37
|
}
|
|
38
38
|
|
|
39
|
-
.select-content-
|
|
39
|
+
.select-content-module_base_T-MXlW[data-ending-style], .select-content-module_base_T-MXlW[data-starting-style] {
|
|
40
40
|
opacity: 0;
|
|
41
41
|
transform: scale(.975);
|
|
42
42
|
}
|
|
43
43
|
|
|
44
|
-
.select-content-
|
|
44
|
+
.select-content-module_base_T-MXlW[data-side="top"][data-ending-style], .select-content-module_base_T-MXlW[data-side="top"][data-starting-style] {
|
|
45
45
|
transform: scale(.975) translateY(4px);
|
|
46
46
|
}
|
|
47
47
|
|
|
48
|
-
.select-content-
|
|
48
|
+
.select-content-module_base_T-MXlW[data-side="bottom"][data-ending-style], .select-content-module_base_T-MXlW[data-side="bottom"][data-starting-style] {
|
|
49
49
|
transform: scale(.975) translateY(-4px);
|
|
50
50
|
}
|
|
51
51
|
|
|
52
|
-
.select-content-
|
|
52
|
+
.select-content-module_base_T-MXlW[data-side="left"][data-ending-style], .select-content-module_base_T-MXlW[data-side="left"][data-starting-style], .select-content-module_base_T-MXlW[data-side="inline-start"][data-ending-style], .select-content-module_base_T-MXlW[data-side="inline-start"][data-starting-style] {
|
|
53
53
|
transform: scale(.975) translateX(4px);
|
|
54
54
|
}
|
|
55
55
|
|
|
56
|
-
.select-content-
|
|
56
|
+
.select-content-module_base_T-MXlW[data-side="right"][data-ending-style], .select-content-module_base_T-MXlW[data-side="right"][data-starting-style], .select-content-module_base_T-MXlW[data-side="inline-end"][data-ending-style], .select-content-module_base_T-MXlW[data-side="inline-end"][data-starting-style] {
|
|
57
57
|
transform: scale(.975) translateX(-4px);
|
|
58
58
|
}
|
|
59
59
|
}
|
|
@@ -4,7 +4,7 @@ import { jsx } from "react/jsx-runtime";
|
|
|
4
4
|
import { Select } from "@base-ui/react";
|
|
5
5
|
//#region src/components/select/select-content.tsx
|
|
6
6
|
function SelectContent(props) {
|
|
7
|
-
const { align = "start", alignItemWithTrigger = false, alignOffset = void 0, anchor = void 0, arrowPadding = void 0, children, className: customClassName = "", collisionAvoidance = void 0, collisionBoundary = void 0, collisionPadding = void 0, container = void 0, disableAnchorTracking = void 0, positionMethod = void 0, side = "bottom", sideOffset =
|
|
7
|
+
const { align = "start", alignItemWithTrigger = false, alignOffset = void 0, anchor = void 0, arrowPadding = void 0, children, className: customClassName = "", collisionAvoidance = void 0, collisionBoundary = void 0, collisionPadding = void 0, container = void 0, disableAnchorTracking = void 0, positionMethod = void 0, side = "bottom", sideOffset = 6, sticky = void 0, ...rest } = props;
|
|
8
8
|
const combinedClassName = selectContentVariants({ className: customClassName });
|
|
9
9
|
return /* @__PURE__ */ jsx(Select.Portal, {
|
|
10
10
|
container,
|
|
@@ -15,7 +15,7 @@ function SelectContent(props) {
|
|
|
15
15
|
alignOffset,
|
|
16
16
|
anchor,
|
|
17
17
|
arrowPadding,
|
|
18
|
-
className: select_content_module_default.
|
|
18
|
+
className: select_content_module_default.positioner,
|
|
19
19
|
collisionAvoidance,
|
|
20
20
|
collisionBoundary,
|
|
21
21
|
collisionPadding,
|
|
@@ -34,6 +34,6 @@ function SelectContent(props) {
|
|
|
34
34
|
})
|
|
35
35
|
});
|
|
36
36
|
}
|
|
37
|
-
const selectContentVariants = cva(select_content_module_default.
|
|
37
|
+
const selectContentVariants = cva(select_content_module_default.base);
|
|
38
38
|
//#endregion
|
|
39
39
|
export { SelectContent, selectContentVariants };
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import './select-content.css';
|
|
2
2
|
//#region src/components/select/select-content.module.css
|
|
3
3
|
var select_content_module_default = {
|
|
4
|
-
"
|
|
5
|
-
"
|
|
4
|
+
"base": "select-content-module_base_T-MXlW",
|
|
5
|
+
"positioner": "select-content-module_positioner_T-MXlW"
|
|
6
6
|
};
|
|
7
7
|
//#endregion
|
|
8
8
|
export { select_content_module_default as default };
|
|
@@ -12,6 +12,6 @@ function SelectGroupLabel(props) {
|
|
|
12
12
|
...rest
|
|
13
13
|
});
|
|
14
14
|
}
|
|
15
|
-
const selectGroupLabelVariants = cva(select_group_label_module_default.
|
|
15
|
+
const selectGroupLabelVariants = cva(select_group_label_module_default.base);
|
|
16
16
|
//#endregion
|
|
17
17
|
export { SelectGroupLabel, selectGroupLabelVariants };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import './select-group-label.css';
|
|
2
2
|
//#region src/components/select/select-group-label.module.css
|
|
3
|
-
var select_group_label_module_default = { "
|
|
3
|
+
var select_group_label_module_default = { "base": "select-group-label-module_base_SHogxq" };
|
|
4
4
|
//#endregion
|
|
5
5
|
export { select_group_label_module_default as default };
|
|
@@ -12,6 +12,6 @@ function SelectGroup(props) {
|
|
|
12
12
|
...rest
|
|
13
13
|
});
|
|
14
14
|
}
|
|
15
|
-
const selectGroupVariants = cva(select_group_module_default.
|
|
15
|
+
const selectGroupVariants = cva(select_group_module_default.base);
|
|
16
16
|
//#endregion
|
|
17
17
|
export { SelectGroup, selectGroupVariants };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import './select-group.css';
|
|
2
2
|
//#region src/components/select/select-group.module.css
|
|
3
|
-
var select_group_module_default = { "
|
|
3
|
+
var select_group_module_default = { "base": "select-group-module_base_1Igl6W" };
|
|
4
4
|
//#endregion
|
|
5
5
|
export { select_group_module_default as default };
|
|
@@ -1,47 +1,43 @@
|
|
|
1
1
|
@layer components {
|
|
2
|
-
.select-item-
|
|
3
|
-
color: var(--color-text-primary);
|
|
2
|
+
.select-item-module_base_YQBXPq {
|
|
4
3
|
cursor: pointer;
|
|
5
4
|
user-select: none;
|
|
6
5
|
border-radius: 8px;
|
|
7
6
|
outline: none;
|
|
8
|
-
|
|
9
|
-
align-items:
|
|
7
|
+
flex-shrink: 0;
|
|
8
|
+
align-items: center;
|
|
10
9
|
column-gap: 8px;
|
|
11
|
-
|
|
12
|
-
padding: 0
|
|
13
|
-
|
|
14
|
-
font-weight: 450;
|
|
15
|
-
line-height: 1.5;
|
|
16
|
-
display: grid;
|
|
17
|
-
position: relative;
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
.select-item-module_select_item_YQBXPq[data-highlighted] {
|
|
21
|
-
background-color: var(--color-gray-3);
|
|
10
|
+
height: 36px;
|
|
11
|
+
padding: 0 12px;
|
|
12
|
+
display: flex;
|
|
22
13
|
}
|
|
23
14
|
|
|
24
|
-
.select-item-
|
|
15
|
+
.select-item-module_base_YQBXPq[data-disabled] {
|
|
25
16
|
cursor: not-allowed;
|
|
26
17
|
opacity: .5;
|
|
27
18
|
}
|
|
28
19
|
|
|
29
|
-
.select-item-
|
|
30
|
-
color: var(--color-
|
|
31
|
-
grid-column-start: 1;
|
|
32
|
-
justify-content: safe center;
|
|
33
|
-
align-items: safe center;
|
|
34
|
-
display: flex;
|
|
20
|
+
.select-item-module_base_YQBXPq[data-highlighted] {
|
|
21
|
+
background-color: var(--color-gray-3);
|
|
35
22
|
}
|
|
36
23
|
|
|
37
|
-
.select-item-
|
|
24
|
+
.select-item-module_label_YQBXPq {
|
|
25
|
+
color: var(--color-text-primary);
|
|
38
26
|
text-overflow: ellipsis;
|
|
39
27
|
white-space: nowrap;
|
|
40
|
-
|
|
28
|
+
font-size: 14px;
|
|
29
|
+
font-weight: 450;
|
|
30
|
+
overflow-x: hidden;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
.select-item-module_indicator_YQBXPq {
|
|
34
|
+
color: var(--color-primary-9);
|
|
35
|
+
flex-shrink: 0;
|
|
36
|
+
justify-content: center;
|
|
41
37
|
align-items: center;
|
|
42
|
-
|
|
43
|
-
|
|
38
|
+
width: 16px;
|
|
39
|
+
height: 16px;
|
|
40
|
+
margin-left: auto;
|
|
44
41
|
display: flex;
|
|
45
|
-
overflow: hidden;
|
|
46
42
|
}
|
|
47
43
|
}
|
|
@@ -11,8 +11,12 @@ function SelectItem(props) {
|
|
|
11
11
|
"data-slot": "select-item",
|
|
12
12
|
disabled: isDisabled,
|
|
13
13
|
...rest,
|
|
14
|
-
children: [/* @__PURE__ */ jsx(Select.
|
|
15
|
-
className: select_item_module_default.
|
|
14
|
+
children: [/* @__PURE__ */ jsx(Select.ItemText, {
|
|
15
|
+
className: select_item_module_default.label,
|
|
16
|
+
"data-slot": "select-item-text",
|
|
17
|
+
children
|
|
18
|
+
}), /* @__PURE__ */ jsx(Select.ItemIndicator, {
|
|
19
|
+
className: select_item_module_default.indicator,
|
|
16
20
|
"data-slot": "select-item-indicator",
|
|
17
21
|
children: /* @__PURE__ */ jsx("svg", {
|
|
18
22
|
height: "14px",
|
|
@@ -30,13 +34,9 @@ function SelectItem(props) {
|
|
|
30
34
|
strokeWidth: "1.5"
|
|
31
35
|
})
|
|
32
36
|
})
|
|
33
|
-
}), /* @__PURE__ */ jsx(Select.ItemText, {
|
|
34
|
-
className: select_item_module_default.select_item__label,
|
|
35
|
-
"data-slot": "select-item-text",
|
|
36
|
-
children
|
|
37
37
|
})]
|
|
38
38
|
});
|
|
39
39
|
}
|
|
40
|
-
const selectItemVariants = cva(select_item_module_default.
|
|
40
|
+
const selectItemVariants = cva(select_item_module_default.base);
|
|
41
41
|
//#endregion
|
|
42
42
|
export { SelectItem, selectItemVariants };
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import './select-item.css';
|
|
2
2
|
//#region src/components/select/select-item.module.css
|
|
3
3
|
var select_item_module_default = {
|
|
4
|
-
"
|
|
5
|
-
"
|
|
6
|
-
"
|
|
4
|
+
"base": "select-item-module_base_YQBXPq",
|
|
5
|
+
"indicator": "select-item-module_indicator_YQBXPq",
|
|
6
|
+
"label": "select-item-module_label_YQBXPq"
|
|
7
7
|
};
|
|
8
8
|
//#endregion
|
|
9
9
|
export { select_item_module_default as default };
|
|
@@ -12,6 +12,6 @@ function SelectSeparator(props) {
|
|
|
12
12
|
...rest
|
|
13
13
|
});
|
|
14
14
|
}
|
|
15
|
-
const selectSeparatorVariants = cva(select_separator_module_default.
|
|
15
|
+
const selectSeparatorVariants = cva(select_separator_module_default.base);
|
|
16
16
|
//#endregion
|
|
17
17
|
export { SelectSeparator, selectSeparatorVariants };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import './select-separator.css';
|
|
2
2
|
//#region src/components/select/select-separator.module.css
|
|
3
|
-
var select_separator_module_default = { "
|
|
3
|
+
var select_separator_module_default = { "base": "select-separator-module_base_6poQtG" };
|
|
4
4
|
//#endregion
|
|
5
5
|
export { select_separator_module_default as default };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
@layer components {
|
|
2
|
-
.select-trigger-
|
|
2
|
+
.select-trigger-module_base_eqPLgq {
|
|
3
3
|
background-color: var(--color-bg-shell-inner);
|
|
4
4
|
box-shadow: 0 0 0 1px var(--color-border) inset;
|
|
5
5
|
cursor: pointer;
|
|
@@ -16,17 +16,17 @@
|
|
|
16
16
|
overflow: hidden;
|
|
17
17
|
}
|
|
18
18
|
|
|
19
|
-
.select-trigger-
|
|
19
|
+
.select-trigger-module_base_eqPLgq:disabled {
|
|
20
20
|
cursor: not-allowed;
|
|
21
21
|
opacity: .5;
|
|
22
22
|
background-color: var(--color-gray-3);
|
|
23
23
|
}
|
|
24
24
|
|
|
25
|
-
.select-trigger-
|
|
25
|
+
.select-trigger-module_base_eqPLgq:focus-visible {
|
|
26
26
|
outline-color: var(--color-primary);
|
|
27
27
|
}
|
|
28
28
|
|
|
29
|
-
.select-trigger-
|
|
29
|
+
.select-trigger-module_base_eqPLgq:hover:not(:disabled), .select-trigger-module_base_eqPLgq[data-popup-open] {
|
|
30
30
|
background-color: var(--color-gray-3);
|
|
31
31
|
}
|
|
32
32
|
|
|
@@ -59,29 +59,18 @@
|
|
|
59
59
|
border-radius: 9999px;
|
|
60
60
|
}
|
|
61
61
|
|
|
62
|
-
.select-trigger-
|
|
63
|
-
|
|
64
|
-
text-overflow: ellipsis;
|
|
65
|
-
white-space: nowrap;
|
|
62
|
+
.select-trigger-module_icon_eqPLgq {
|
|
63
|
+
justify-content: center;
|
|
66
64
|
align-items: center;
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
font-weight: 450;
|
|
70
|
-
display: inline-flex;
|
|
71
|
-
overflow-x: hidden;
|
|
72
|
-
}
|
|
73
|
-
|
|
74
|
-
.select-trigger-module_select_trigger__value_eqPLgq[data-placeholder] {
|
|
75
|
-
color: var(--color-gray-9);
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
.select-trigger-module_select_trigger__icon_eqPLgq {
|
|
65
|
+
width: 16px;
|
|
66
|
+
height: 16px;
|
|
79
67
|
margin-left: auto;
|
|
80
68
|
transition-property: rotate;
|
|
81
69
|
transition-duration: .15s;
|
|
70
|
+
display: flex;
|
|
82
71
|
}
|
|
83
72
|
|
|
84
|
-
.select-trigger-
|
|
73
|
+
.select-trigger-module_base_eqPLgq[data-popup-open] .select-trigger-module_icon_eqPLgq {
|
|
85
74
|
rotate: 180deg;
|
|
86
75
|
}
|
|
87
76
|
}
|
|
@@ -2,10 +2,8 @@ import { VariantProps } from "class-variance-authority";
|
|
|
2
2
|
import { Select } from "@base-ui/react";
|
|
3
3
|
import { JSX } from "react";
|
|
4
4
|
//#region src/components/select/select-trigger.d.ts
|
|
5
|
-
interface SelectTriggerProps extends
|
|
6
|
-
children?: Select.Value.Props["children"];
|
|
5
|
+
interface SelectTriggerProps extends Select.Trigger.Props {
|
|
7
6
|
isRounded?: VariantProps<typeof selectTriggerVariants>["isRounded"];
|
|
8
|
-
placeholder?: Select.Value.Props["placeholder"];
|
|
9
7
|
size?: VariantProps<typeof selectTriggerVariants>["size"];
|
|
10
8
|
}
|
|
11
9
|
declare function SelectTrigger(props: SelectTriggerProps): JSX.Element;
|
|
@@ -4,7 +4,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
|
|
|
4
4
|
import { Select } from "@base-ui/react";
|
|
5
5
|
//#region src/components/select/select-trigger.tsx
|
|
6
6
|
function SelectTrigger(props) {
|
|
7
|
-
const { children = void 0, className: customClassName = "", isRounded = false,
|
|
7
|
+
const { children = void 0, className: customClassName = "", isRounded = false, size = 40, ...rest } = props;
|
|
8
8
|
const combinedClassName = selectTriggerVariants({
|
|
9
9
|
className: customClassName,
|
|
10
10
|
isRounded,
|
|
@@ -14,13 +14,8 @@ function SelectTrigger(props) {
|
|
|
14
14
|
className: combinedClassName,
|
|
15
15
|
"data-slot": "select-trigger",
|
|
16
16
|
...rest,
|
|
17
|
-
children: [/* @__PURE__ */ jsx(Select.
|
|
18
|
-
className: select_trigger_module_default.
|
|
19
|
-
"data-slot": "select-value",
|
|
20
|
-
placeholder,
|
|
21
|
-
children
|
|
22
|
-
}), /* @__PURE__ */ jsx(Select.Icon, {
|
|
23
|
-
className: select_trigger_module_default.select_trigger__icon,
|
|
17
|
+
children: [children, /* @__PURE__ */ jsx(Select.Icon, {
|
|
18
|
+
className: select_trigger_module_default.icon,
|
|
24
19
|
"data-slot": "select-icon",
|
|
25
20
|
children: /* @__PURE__ */ jsx("svg", {
|
|
26
21
|
height: "14",
|
|
@@ -39,7 +34,7 @@ function SelectTrigger(props) {
|
|
|
39
34
|
})]
|
|
40
35
|
});
|
|
41
36
|
}
|
|
42
|
-
const selectTriggerVariants = cva(select_trigger_module_default.
|
|
37
|
+
const selectTriggerVariants = cva(select_trigger_module_default.base, { variants: {
|
|
43
38
|
isRounded: { true: select_trigger_module_default.rounded_full },
|
|
44
39
|
size: {
|
|
45
40
|
32: select_trigger_module_default.size_32,
|
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
import './select-trigger.css';
|
|
2
2
|
//#region src/components/select/select-trigger.module.css
|
|
3
3
|
var select_trigger_module_default = {
|
|
4
|
+
"base": "select-trigger-module_base_eqPLgq",
|
|
5
|
+
"icon": "select-trigger-module_icon_eqPLgq",
|
|
4
6
|
"rounded_full": "select-trigger-module_rounded_full_eqPLgq",
|
|
5
|
-
"select_trigger": "select-trigger-module_select_trigger_eqPLgq",
|
|
6
|
-
"select_trigger__icon": "select-trigger-module_select_trigger__icon_eqPLgq",
|
|
7
|
-
"select_trigger__value": "select-trigger-module_select_trigger__value_eqPLgq",
|
|
8
7
|
"size_32": "select-trigger-module_size_32_eqPLgq",
|
|
9
8
|
"size_36": "select-trigger-module_size_36_eqPLgq",
|
|
10
9
|
"size_40": "select-trigger-module_size_40_eqPLgq",
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
@layer components {
|
|
2
|
+
.select-value-module_base_j4ZBgq {
|
|
3
|
+
color: var(--color-text-primary);
|
|
4
|
+
text-overflow: ellipsis;
|
|
5
|
+
white-space: nowrap;
|
|
6
|
+
font-size: 14px;
|
|
7
|
+
font-weight: 450;
|
|
8
|
+
overflow-x: hidden;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
.select-value-module_base_j4ZBgq[data-placeholder] {
|
|
12
|
+
color: var(--color-gray-9);
|
|
13
|
+
}
|
|
14
|
+
}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { Select } from "@base-ui/react";
|
|
2
|
+
import { JSX } from "react";
|
|
3
|
+
//#region src/components/select/select-value.d.ts
|
|
4
|
+
interface SelectValueProps extends Select.Value.Props {}
|
|
5
|
+
declare function SelectValue(props: SelectValueProps): JSX.Element;
|
|
6
|
+
declare const selectValueVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
7
|
+
//#endregion
|
|
8
|
+
export { SelectValue, SelectValueProps, selectValueVariants };
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import select_value_module_default from "./select-value.module.js";
|
|
2
|
+
import { cva } from "class-variance-authority";
|
|
3
|
+
import { jsx } from "react/jsx-runtime";
|
|
4
|
+
import { Select } from "@base-ui/react";
|
|
5
|
+
//#region src/components/select/select-value.tsx
|
|
6
|
+
function SelectValue(props) {
|
|
7
|
+
const { className: customClassName = "", render = /* @__PURE__ */ jsx("div", {}), ...rest } = props;
|
|
8
|
+
const combinedClassName = selectValueVariants({ className: customClassName });
|
|
9
|
+
return /* @__PURE__ */ jsx(Select.Value, {
|
|
10
|
+
className: combinedClassName,
|
|
11
|
+
"data-slot": "select-value",
|
|
12
|
+
render,
|
|
13
|
+
...rest
|
|
14
|
+
});
|
|
15
|
+
}
|
|
16
|
+
const selectValueVariants = cva(select_value_module_default.base);
|
|
17
|
+
//#endregion
|
|
18
|
+
export { SelectValue, selectValueVariants };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { Select } from "@base-ui/react";
|
|
2
2
|
import { JSX } from "react";
|
|
3
3
|
//#region src/components/select/select.d.ts
|
|
4
|
-
interface SelectProps extends Select.Root.Props<
|
|
5
|
-
declare function Select$1(props: SelectProps): JSX.Element;
|
|
4
|
+
interface SelectProps<Value, Multiple extends boolean | undefined = false> extends Select.Root.Props<Value, Multiple> {}
|
|
5
|
+
declare function Select$1<Value, Multiple extends boolean | undefined = false>(props: SelectProps<Value, Multiple>): JSX.Element;
|
|
6
6
|
//#endregion
|
|
7
7
|
export { Select$1 as Select, SelectProps };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import './spacer.css';
|
|
2
2
|
//#region src/components/spacer/spacer.module.css
|
|
3
|
-
var spacer_module_default = { "
|
|
3
|
+
var spacer_module_default = { "base": "spacer-module_base_liXYKW" };
|
|
4
4
|
//#endregion
|
|
5
5
|
export { spacer_module_default as default };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
@layer components {
|
|
2
|
-
.switch-
|
|
2
|
+
.switch-module_base_K0d9Sa {
|
|
3
3
|
background-color: var(--color-gray-6);
|
|
4
4
|
cursor: pointer;
|
|
5
5
|
outline-color: var(--color-primary-9);
|
|
@@ -14,20 +14,20 @@
|
|
|
14
14
|
overflow: hidden;
|
|
15
15
|
}
|
|
16
16
|
|
|
17
|
-
.switch-
|
|
17
|
+
.switch-module_base_K0d9Sa:focus-visible {
|
|
18
18
|
outline-width: 2px;
|
|
19
19
|
}
|
|
20
20
|
|
|
21
|
-
.switch-
|
|
21
|
+
.switch-module_base_K0d9Sa[data-checked] {
|
|
22
22
|
background-color: var(--color-primary-9);
|
|
23
23
|
}
|
|
24
24
|
|
|
25
|
-
.switch-
|
|
25
|
+
.switch-module_base_K0d9Sa[data-disabled] {
|
|
26
26
|
cursor: not-allowed;
|
|
27
27
|
opacity: .5;
|
|
28
28
|
}
|
|
29
29
|
|
|
30
|
-
.switch-
|
|
30
|
+
.switch-module_thumb_K0d9Sa {
|
|
31
31
|
aspect-ratio: 1;
|
|
32
32
|
background-color: #fff;
|
|
33
33
|
border-radius: 9999px;
|
|
@@ -36,17 +36,17 @@
|
|
|
36
36
|
transition-duration: .15s;
|
|
37
37
|
}
|
|
38
38
|
|
|
39
|
-
.switch-
|
|
39
|
+
.switch-module_thumb_K0d9Sa[data-checked] {
|
|
40
40
|
transform: translateX(var(--translateX));
|
|
41
41
|
}
|
|
42
42
|
|
|
43
|
-
.switch-
|
|
43
|
+
.switch-module_size_18_K0d9Sa {
|
|
44
44
|
--translateX: 12px;
|
|
45
45
|
width: 30px;
|
|
46
46
|
height: 18px;
|
|
47
47
|
}
|
|
48
48
|
|
|
49
|
-
.switch-
|
|
49
|
+
.switch-module_size_24_K0d9Sa {
|
|
50
50
|
--translateX: 16px;
|
|
51
51
|
width: 40px;
|
|
52
52
|
height: 24px;
|
|
@@ -18,14 +18,14 @@ function Switch$1(props) {
|
|
|
18
18
|
readOnly: isReadOnly,
|
|
19
19
|
required: isRequired,
|
|
20
20
|
...rest,
|
|
21
|
-
children: /* @__PURE__ */ jsx(Switch.Thumb, { className: switch_module_default.
|
|
21
|
+
children: /* @__PURE__ */ jsx(Switch.Thumb, { className: switch_module_default.thumb })
|
|
22
22
|
});
|
|
23
23
|
}
|
|
24
|
-
const switchVariants = cva(switch_module_default.
|
|
24
|
+
const switchVariants = cva(switch_module_default.base, {
|
|
25
25
|
defaultVariants: { size: 24 },
|
|
26
26
|
variants: { size: {
|
|
27
|
-
18: switch_module_default.
|
|
28
|
-
24: switch_module_default.
|
|
27
|
+
18: switch_module_default.size_18,
|
|
28
|
+
24: switch_module_default.size_24
|
|
29
29
|
} }
|
|
30
30
|
});
|
|
31
31
|
//#endregion
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import './switch.css';
|
|
2
2
|
//#region src/components/switch/switch.module.css
|
|
3
3
|
var switch_module_default = {
|
|
4
|
-
"
|
|
5
|
-
"
|
|
6
|
-
"
|
|
7
|
-
"
|
|
4
|
+
"base": "switch-module_base_K0d9Sa",
|
|
5
|
+
"size_18": "switch-module_size_18_K0d9Sa",
|
|
6
|
+
"size_24": "switch-module_size_24_K0d9Sa",
|
|
7
|
+
"thumb": "switch-module_thumb_K0d9Sa"
|
|
8
8
|
};
|
|
9
9
|
//#endregion
|
|
10
10
|
export { switch_module_default as default };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
@layer components {
|
|
2
|
-
.tabs-panel-
|
|
2
|
+
.tabs-panel-module_base_AXj2FW {
|
|
3
3
|
outline-color: var(--color-primary-9);
|
|
4
4
|
outline-offset: -2px;
|
|
5
5
|
outline-width: 0;
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
display: flex;
|
|
9
9
|
}
|
|
10
10
|
|
|
11
|
-
.tabs-panel-
|
|
11
|
+
.tabs-panel-module_base_AXj2FW:focus-visible {
|
|
12
12
|
outline-width: 2px;
|
|
13
13
|
}
|
|
14
14
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import './tabs-panel.css';
|
|
2
2
|
//#region src/components/tabs/tabs-panel.module.css
|
|
3
|
-
var tabs_panel_module_default = { "
|
|
3
|
+
var tabs_panel_module_default = { "base": "tabs-panel-module_base_AXj2FW" };
|
|
4
4
|
//#endregion
|
|
5
5
|
export { tabs_panel_module_default as default };
|