@ndla/primitives 0.0.9 → 0.0.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/panda.buildinfo.json +71 -9
- package/dist/styles.css +277 -32
- package/es/Button.js +4 -0
- package/es/Combobox.js +226 -0
- package/es/Figure.js +75 -0
- package/es/Select.js +197 -0
- package/es/TagsInput.js +121 -0
- package/es/index.js +4 -0
- package/es/storybookHelpers/data.js +212 -0
- package/lib/Button.js +4 -0
- package/lib/Combobox.d.ts +59 -0
- package/lib/Combobox.js +236 -0
- package/lib/Dialog.d.ts +1 -1
- package/lib/Figure.d.ts +11 -0
- package/lib/Figure.js +81 -0
- package/lib/Select.d.ts +51 -0
- package/lib/Select.js +204 -0
- package/lib/TagsInput.d.ts +41 -0
- package/lib/TagsInput.js +127 -0
- package/lib/index.d.ts +7 -0
- package/lib/index.js +232 -0
- package/lib/storybookHelpers/data.d.ts +23 -0
- package/lib/storybookHelpers/data.js +218 -0
- package/package.json +3 -3
package/lib/Select.js
ADDED
|
@@ -0,0 +1,204 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.SelectValueText = exports.SelectTrigger = exports.SelectRoot = exports.SelectPositioner = exports.SelectLabel = exports.SelectItemText = exports.SelectItemIndicator = exports.SelectItemGroupLabel = exports.SelectItemGroup = exports.SelectItem = exports.SelectIndicator = exports.SelectControl = exports.SelectContent = exports.SelectClearTrigger = void 0;
|
|
7
|
+
var _react = require("react");
|
|
8
|
+
var _react2 = require("@ark-ui/react");
|
|
9
|
+
var _css = require("@ndla/styled-system/css");
|
|
10
|
+
var _createStyleContext = require("./createStyleContext");
|
|
11
|
+
var _Label = require("./Label");
|
|
12
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
13
|
+
/**
|
|
14
|
+
* Copyright (c) 2024-present, NDLA.
|
|
15
|
+
*
|
|
16
|
+
* This source code is licensed under the GPLv3 license found in the
|
|
17
|
+
* LICENSE file in the root directory of this source tree.
|
|
18
|
+
*
|
|
19
|
+
*/
|
|
20
|
+
|
|
21
|
+
const selectRecipe = (0, _css.sva)({
|
|
22
|
+
slots: _react2.selectAnatomy.keys(),
|
|
23
|
+
base: {
|
|
24
|
+
root: {
|
|
25
|
+
display: "flex",
|
|
26
|
+
flexDirection: "column",
|
|
27
|
+
gap: "3xsmall"
|
|
28
|
+
},
|
|
29
|
+
control: {
|
|
30
|
+
display: "flex",
|
|
31
|
+
gap: "4xsmall",
|
|
32
|
+
alignItems: "center"
|
|
33
|
+
},
|
|
34
|
+
content: {
|
|
35
|
+
display: "flex",
|
|
36
|
+
gap: "4xsmall",
|
|
37
|
+
flexDirection: "column",
|
|
38
|
+
zIndex: "dropdown",
|
|
39
|
+
background: "surface.default",
|
|
40
|
+
borderRadius: "xsmall",
|
|
41
|
+
boxShadow: "large",
|
|
42
|
+
padding: "xsmall",
|
|
43
|
+
overflowY: "auto",
|
|
44
|
+
maxHeight: "surface.xsmall",
|
|
45
|
+
_focusVisible: {
|
|
46
|
+
outlineOffset: "-1"
|
|
47
|
+
},
|
|
48
|
+
_open: {
|
|
49
|
+
animation: "fade-shift-in 0.25s ease-out"
|
|
50
|
+
},
|
|
51
|
+
_closed: {
|
|
52
|
+
animation: "fade-shift-out 0.25s ease-out"
|
|
53
|
+
}
|
|
54
|
+
},
|
|
55
|
+
item: {
|
|
56
|
+
display: "flex",
|
|
57
|
+
alignItems: "center",
|
|
58
|
+
justifyContent: "space-between",
|
|
59
|
+
padding: "xsmall",
|
|
60
|
+
background: "surface.default",
|
|
61
|
+
borderRadius: "xsmall",
|
|
62
|
+
cursor: "pointer",
|
|
63
|
+
transitionDuration: "fast",
|
|
64
|
+
transitionProperty: "background, color",
|
|
65
|
+
transitionTimingFunction: "default",
|
|
66
|
+
_hover: {
|
|
67
|
+
background: "surface.hover"
|
|
68
|
+
},
|
|
69
|
+
_selected: {
|
|
70
|
+
background: "surface.selected",
|
|
71
|
+
_hover: {
|
|
72
|
+
background: "surface.hover"
|
|
73
|
+
},
|
|
74
|
+
_highlighted: {
|
|
75
|
+
background: "surface.hover"
|
|
76
|
+
}
|
|
77
|
+
},
|
|
78
|
+
_highlighted: {
|
|
79
|
+
background: "surface.hover",
|
|
80
|
+
_hover: {
|
|
81
|
+
background: "surface.hover"
|
|
82
|
+
}
|
|
83
|
+
},
|
|
84
|
+
_disabled: {
|
|
85
|
+
cursor: "not-allowed",
|
|
86
|
+
color: "text.disabled",
|
|
87
|
+
background: "surface.disabled",
|
|
88
|
+
_highlighted: {
|
|
89
|
+
color: "text.disabled",
|
|
90
|
+
background: "surface.disabled"
|
|
91
|
+
},
|
|
92
|
+
_selected: {
|
|
93
|
+
color: "text.disabled",
|
|
94
|
+
background: "surface.disabled"
|
|
95
|
+
},
|
|
96
|
+
_hover: {
|
|
97
|
+
color: "text.disabled",
|
|
98
|
+
background: "surface.disabled"
|
|
99
|
+
}
|
|
100
|
+
}
|
|
101
|
+
},
|
|
102
|
+
indicator: {
|
|
103
|
+
color: "icon.default",
|
|
104
|
+
transformOrigin: "center",
|
|
105
|
+
transitionDuration: "normal",
|
|
106
|
+
transitionProperty: "transform",
|
|
107
|
+
transitionTimingFunction: "default",
|
|
108
|
+
_open: {
|
|
109
|
+
transform: "rotate(180deg)"
|
|
110
|
+
}
|
|
111
|
+
},
|
|
112
|
+
itemIndicator: {
|
|
113
|
+
color: "stroke.default"
|
|
114
|
+
},
|
|
115
|
+
itemText: {
|
|
116
|
+
_checked: {
|
|
117
|
+
textDecoration: "underline"
|
|
118
|
+
},
|
|
119
|
+
_highlighted: {
|
|
120
|
+
textDecoration: "underline"
|
|
121
|
+
}
|
|
122
|
+
},
|
|
123
|
+
trigger: {
|
|
124
|
+
justifyContent: "space-between",
|
|
125
|
+
width: "surface.small",
|
|
126
|
+
_ariaInvalid: {
|
|
127
|
+
boxShadowColor: "stroke.error"
|
|
128
|
+
}
|
|
129
|
+
},
|
|
130
|
+
itemGroup: {
|
|
131
|
+
display: "flex",
|
|
132
|
+
flexDirection: "column",
|
|
133
|
+
gap: "4xsmall"
|
|
134
|
+
}
|
|
135
|
+
}
|
|
136
|
+
});
|
|
137
|
+
const {
|
|
138
|
+
withProvider,
|
|
139
|
+
withContext
|
|
140
|
+
} = (0, _createStyleContext.createStyleContext)(selectRecipe);
|
|
141
|
+
const InternalSelectRoot = withProvider(_react2.Select.Root, "root");
|
|
142
|
+
const SelectRoot = _ref => {
|
|
143
|
+
let {
|
|
144
|
+
lazyMount = true,
|
|
145
|
+
unmountOnExit = true,
|
|
146
|
+
...props
|
|
147
|
+
} = _ref;
|
|
148
|
+
return (
|
|
149
|
+
/*#__PURE__*/
|
|
150
|
+
//@ts-expect-error -- T does not necessarily match Select.CollectionItem. However, we prefer to use T over Select.CollectionItem to get the correct type during use.
|
|
151
|
+
(0, _jsxRuntime.jsx)(InternalSelectRoot, {
|
|
152
|
+
lazyMount: lazyMount,
|
|
153
|
+
unmountOnExit: unmountOnExit,
|
|
154
|
+
...props
|
|
155
|
+
})
|
|
156
|
+
);
|
|
157
|
+
};
|
|
158
|
+
exports.SelectRoot = SelectRoot;
|
|
159
|
+
const SelectClearTrigger = exports.SelectClearTrigger = withContext(_react2.Select.ClearTrigger, "clearTrigger");
|
|
160
|
+
const SelectContent = exports.SelectContent = withContext(_react2.Select.Content, "content");
|
|
161
|
+
const SelectControl = exports.SelectControl = withContext(_react2.Select.Control, "control");
|
|
162
|
+
const SelectIndicator = exports.SelectIndicator = withContext(_react2.Select.Indicator, "indicator");
|
|
163
|
+
const SelectItemGroupLabel = exports.SelectItemGroupLabel = /*#__PURE__*/(0, _react.forwardRef)((_ref2, ref) => {
|
|
164
|
+
let {
|
|
165
|
+
children,
|
|
166
|
+
...props
|
|
167
|
+
} = _ref2;
|
|
168
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(InternalSelectItemGroupLabel, {
|
|
169
|
+
asChild: true,
|
|
170
|
+
forwardCssProp: true,
|
|
171
|
+
ref: ref,
|
|
172
|
+
...props,
|
|
173
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Label.Label, {
|
|
174
|
+
asChild: true,
|
|
175
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
176
|
+
children: children
|
|
177
|
+
})
|
|
178
|
+
})
|
|
179
|
+
});
|
|
180
|
+
});
|
|
181
|
+
const InternalSelectItemGroupLabel = withContext(_react2.Select.ItemGroupLabel, "itemGroupLabel");
|
|
182
|
+
const SelectItemGroup = exports.SelectItemGroup = withContext(_react2.Select.ItemGroup, "itemGroup");
|
|
183
|
+
const SelectItemIndicator = exports.SelectItemIndicator = withContext(_react2.Select.ItemIndicator, "itemIndicator");
|
|
184
|
+
const SelectItem = exports.SelectItem = withContext(_react2.Select.Item, "item");
|
|
185
|
+
const SelectItemText = exports.SelectItemText = withContext(_react2.Select.ItemText, "itemText");
|
|
186
|
+
const InternalSelectLabel = withContext(_react2.Select.Label, "label");
|
|
187
|
+
const SelectLabel = exports.SelectLabel = /*#__PURE__*/(0, _react.forwardRef)((_ref3, ref) => {
|
|
188
|
+
let {
|
|
189
|
+
children,
|
|
190
|
+
...props
|
|
191
|
+
} = _ref3;
|
|
192
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(InternalSelectLabel, {
|
|
193
|
+
asChild: true,
|
|
194
|
+
forwardCssProp: true,
|
|
195
|
+
ref: ref,
|
|
196
|
+
...props,
|
|
197
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Label.Label, {
|
|
198
|
+
children: children
|
|
199
|
+
})
|
|
200
|
+
});
|
|
201
|
+
});
|
|
202
|
+
const SelectPositioner = exports.SelectPositioner = withContext(_react2.Select.Positioner, "positioner");
|
|
203
|
+
const SelectTrigger = exports.SelectTrigger = withContext(_react2.Select.Trigger, "trigger");
|
|
204
|
+
const SelectValueText = exports.SelectValueText = withContext(_react2.Select.ValueText, "valueText");
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright (c) 2024-present, NDLA.
|
|
3
|
+
*
|
|
4
|
+
* This source code is licensed under the GPLv3 license found in the
|
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
|
6
|
+
*
|
|
7
|
+
*/
|
|
8
|
+
import { TagsInput } from "@ark-ui/react";
|
|
9
|
+
import { JsxStyleProps } from "@ndla/styled-system/types";
|
|
10
|
+
import { TextProps } from "./Text";
|
|
11
|
+
export type TagsInputRootProps = TagsInput.RootProps & JsxStyleProps;
|
|
12
|
+
export declare const TagsInputRoot: import("react").ForwardRefExoticComponent<TagsInput.RootProps & {
|
|
13
|
+
forwardCssProp?: boolean | undefined;
|
|
14
|
+
} & import("@ndla/styled-system/types").WithCss & import("react").RefAttributes<HTMLDivElement>>;
|
|
15
|
+
export declare const TagsInputClearTrigger: import("react").ForwardRefExoticComponent<TagsInput.ClearTriggerProps & {
|
|
16
|
+
forwardCssProp?: boolean | undefined;
|
|
17
|
+
} & import("@ndla/styled-system/types").WithCss & import("react").RefAttributes<HTMLButtonElement>>;
|
|
18
|
+
export declare const TagsInputControl: import("react").ForwardRefExoticComponent<TagsInput.ControlProps & {
|
|
19
|
+
forwardCssProp?: boolean | undefined;
|
|
20
|
+
} & import("@ndla/styled-system/types").WithCss & import("react").RefAttributes<HTMLDivElement>>;
|
|
21
|
+
export declare const TagsInputInput: import("react").ForwardRefExoticComponent<TagsInput.InputProps & {
|
|
22
|
+
forwardCssProp?: boolean | undefined;
|
|
23
|
+
} & import("@ndla/styled-system/types").WithCss & import("react").RefAttributes<HTMLInputElement>>;
|
|
24
|
+
export declare const TagsInputItemDeleteTrigger: import("react").ForwardRefExoticComponent<TagsInput.ItemDeleteTriggerProps & {
|
|
25
|
+
forwardCssProp?: boolean | undefined;
|
|
26
|
+
} & import("@ndla/styled-system/types").WithCss & import("react").RefAttributes<HTMLButtonElement>>;
|
|
27
|
+
export declare const TagsInputItemInput: import("react").ForwardRefExoticComponent<TagsInput.ItemInputProps & {
|
|
28
|
+
forwardCssProp?: boolean | undefined;
|
|
29
|
+
} & import("@ndla/styled-system/types").WithCss & import("react").RefAttributes<HTMLInputElement>>;
|
|
30
|
+
export declare const TagsInputItemPreview: import("react").ForwardRefExoticComponent<TagsInput.ItemPreviewProps & {
|
|
31
|
+
forwardCssProp?: boolean | undefined;
|
|
32
|
+
} & import("@ndla/styled-system/types").WithCss & import("react").RefAttributes<HTMLDivElement>>;
|
|
33
|
+
export declare const TagsInputItem: import("react").ForwardRefExoticComponent<TagsInput.ItemProps & {
|
|
34
|
+
forwardCssProp?: boolean | undefined;
|
|
35
|
+
} & import("@ndla/styled-system/types").WithCss & import("react").RefAttributes<HTMLDivElement>>;
|
|
36
|
+
export declare const TagsInputItemText: import("react").ForwardRefExoticComponent<TagsInput.ItemTextProps & {
|
|
37
|
+
forwardCssProp?: boolean | undefined;
|
|
38
|
+
} & import("@ndla/styled-system/types").WithCss & import("react").RefAttributes<HTMLSpanElement>>;
|
|
39
|
+
export declare const TagsInputLabel: import("react").ForwardRefExoticComponent<TagsInput.LabelProps & {
|
|
40
|
+
forwardCssProp?: boolean | undefined;
|
|
41
|
+
} & import("@ndla/styled-system/types").WithCss & TextProps & import("react").RefAttributes<HTMLLabelElement>>;
|
package/lib/TagsInput.js
ADDED
|
@@ -0,0 +1,127 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.TagsInputRoot = exports.TagsInputLabel = exports.TagsInputItemText = exports.TagsInputItemPreview = exports.TagsInputItemInput = exports.TagsInputItemDeleteTrigger = exports.TagsInputItem = exports.TagsInputInput = exports.TagsInputControl = exports.TagsInputClearTrigger = void 0;
|
|
7
|
+
var _react = require("react");
|
|
8
|
+
var _react2 = require("@ark-ui/react");
|
|
9
|
+
var _css = require("@ndla/styled-system/css");
|
|
10
|
+
var _createStyleContext = require("./createStyleContext");
|
|
11
|
+
var _Label = require("./Label");
|
|
12
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
13
|
+
/**
|
|
14
|
+
* Copyright (c) 2024-present, NDLA.
|
|
15
|
+
*
|
|
16
|
+
* This source code is licensed under the GPLv3 license found in the
|
|
17
|
+
* LICENSE file in the root directory of this source tree.
|
|
18
|
+
*
|
|
19
|
+
*/
|
|
20
|
+
|
|
21
|
+
const tagsInputRecipe = (0, _css.sva)({
|
|
22
|
+
slots: _react2.tagsInputAnatomy.keys(),
|
|
23
|
+
base: {
|
|
24
|
+
root: {
|
|
25
|
+
display: "flex",
|
|
26
|
+
flexDirection: "column",
|
|
27
|
+
gap: "xxsmall",
|
|
28
|
+
width: "full"
|
|
29
|
+
},
|
|
30
|
+
control: {
|
|
31
|
+
display: "inline-flex",
|
|
32
|
+
gap: "xxsmall",
|
|
33
|
+
alignItems: "center",
|
|
34
|
+
flexWrap: "wrap"
|
|
35
|
+
},
|
|
36
|
+
item: {
|
|
37
|
+
paddingBlock: "3xsmall"
|
|
38
|
+
},
|
|
39
|
+
itemPreview: {
|
|
40
|
+
display: "flex",
|
|
41
|
+
gap: "1",
|
|
42
|
+
paddingBlock: "4xsmall",
|
|
43
|
+
paddingInlineEnd: "3xsmall",
|
|
44
|
+
paddingInlineStart: "xsmall",
|
|
45
|
+
cursor: "initial",
|
|
46
|
+
borderRadius: "large",
|
|
47
|
+
outline: "1px solid",
|
|
48
|
+
outlineColor: "transparent",
|
|
49
|
+
backgroundColor: "surface.actionSubtle.selected",
|
|
50
|
+
color: "text.onAction",
|
|
51
|
+
transitionDuration: "normal",
|
|
52
|
+
transitionProperty: "background, outline-color, color",
|
|
53
|
+
transitionTimingFunction: "default",
|
|
54
|
+
textStyle: "label.medium",
|
|
55
|
+
_hover: {
|
|
56
|
+
backgroundColor: "surface.actionSubtle.hover",
|
|
57
|
+
outlineColor: "stroke.hover",
|
|
58
|
+
color: "text.default",
|
|
59
|
+
"& svg": {
|
|
60
|
+
color: "stroke.hover"
|
|
61
|
+
}
|
|
62
|
+
},
|
|
63
|
+
_highlighted: {
|
|
64
|
+
backgroundColor: "surface.actionSubtle.hover",
|
|
65
|
+
outlineWidth: "3px",
|
|
66
|
+
outlineOffset: "-1px",
|
|
67
|
+
outlineColor: "stroke.hover",
|
|
68
|
+
color: "text.default",
|
|
69
|
+
"& svg": {
|
|
70
|
+
color: "stroke.hover"
|
|
71
|
+
}
|
|
72
|
+
}
|
|
73
|
+
},
|
|
74
|
+
input: {
|
|
75
|
+
flex: "1"
|
|
76
|
+
},
|
|
77
|
+
itemDeleteTrigger: {
|
|
78
|
+
paddingBottom: "1",
|
|
79
|
+
cursor: "pointer",
|
|
80
|
+
"& span": {
|
|
81
|
+
display: "inline-block"
|
|
82
|
+
},
|
|
83
|
+
"& svg": {
|
|
84
|
+
marginInline: "0",
|
|
85
|
+
marginBlock: "0",
|
|
86
|
+
width: "medium",
|
|
87
|
+
height: "medium"
|
|
88
|
+
}
|
|
89
|
+
},
|
|
90
|
+
itemText: {
|
|
91
|
+
paddingBottom: "1"
|
|
92
|
+
},
|
|
93
|
+
itemInput: {
|
|
94
|
+
outline: "none",
|
|
95
|
+
background: "transparent"
|
|
96
|
+
}
|
|
97
|
+
}
|
|
98
|
+
});
|
|
99
|
+
const {
|
|
100
|
+
withProvider,
|
|
101
|
+
withContext
|
|
102
|
+
} = (0, _createStyleContext.createStyleContext)(tagsInputRecipe);
|
|
103
|
+
const TagsInputRoot = exports.TagsInputRoot = withProvider(_react2.TagsInput.Root, "root");
|
|
104
|
+
const TagsInputClearTrigger = exports.TagsInputClearTrigger = withContext(_react2.TagsInput.ClearTrigger, "clearTrigger");
|
|
105
|
+
const TagsInputControl = exports.TagsInputControl = withContext(_react2.TagsInput.Control, "control");
|
|
106
|
+
const TagsInputInput = exports.TagsInputInput = withContext(_react2.TagsInput.Input, "input");
|
|
107
|
+
const TagsInputItemDeleteTrigger = exports.TagsInputItemDeleteTrigger = withContext(_react2.TagsInput.ItemDeleteTrigger, "itemDeleteTrigger");
|
|
108
|
+
const TagsInputItemInput = exports.TagsInputItemInput = withContext(_react2.TagsInput.ItemInput, "itemInput");
|
|
109
|
+
const TagsInputItemPreview = exports.TagsInputItemPreview = withContext(_react2.TagsInput.ItemPreview, "itemPreview");
|
|
110
|
+
const TagsInputItem = exports.TagsInputItem = withContext(_react2.TagsInput.Item, "item");
|
|
111
|
+
const TagsInputItemText = exports.TagsInputItemText = withContext(_react2.TagsInput.ItemText, "itemText");
|
|
112
|
+
const InternalTagsInputLabel = withContext(_react2.TagsInput.Label, "label");
|
|
113
|
+
const TagsInputLabel = exports.TagsInputLabel = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
|
|
114
|
+
let {
|
|
115
|
+
children,
|
|
116
|
+
...props
|
|
117
|
+
} = _ref;
|
|
118
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(InternalTagsInputLabel, {
|
|
119
|
+
asChild: true,
|
|
120
|
+
forwardCssProp: true,
|
|
121
|
+
ref: ref,
|
|
122
|
+
...props,
|
|
123
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Label.Label, {
|
|
124
|
+
children: children
|
|
125
|
+
})
|
|
126
|
+
});
|
|
127
|
+
});
|
package/lib/index.d.ts
CHANGED
|
@@ -17,6 +17,8 @@ export type { ButtonProps, ButtonVariantProps, IconButtonProps, IconButtonVarian
|
|
|
17
17
|
export { Button, IconButton } from "./Button";
|
|
18
18
|
export type { CheckboxVariantProps, CheckboxRootProps } from "./Checkbox";
|
|
19
19
|
export { CheckboxRoot, CheckboxIndicator, CheckboxLabel, CheckboxControl, CheckboxGroup, CheckboxHiddenInput, } from "./Checkbox";
|
|
20
|
+
export type { ComboboxVariantProps, ComboboxRootProps } from "./Combobox";
|
|
21
|
+
export { ComboboxRoot, ComboboxClearTrigger, ComboboxContent, ComboboxControl, ComboboxInput, ComboboxItemGroupLabel, ComboboxItemGroup, ComboboxItemIndicator, ComboboxItem, ComboboxItemText, ComboboxLabel, ComboboxPositioner, ComboboxTrigger, } from "./Combobox";
|
|
20
22
|
export type { DialogVariantProps, DialogRootProps } from "./Dialog";
|
|
21
23
|
export { DialogRoot, DialogBackdrop, DialogStandaloneContent, DialogPositioner, DialogContent, DialogDescription, DialogTitle, DialogTrigger, DialogCloseTrigger, DialogHeader, DialogBody, } from "./Dialog";
|
|
22
24
|
export type { ExpandableBoxProps, ExpandableBoxSummaryProps } from "./ExpandableBox";
|
|
@@ -24,6 +26,7 @@ export { ExpandableBox, ExpandableBoxSummary } from "./ExpandableBox";
|
|
|
24
26
|
export { FieldRoot } from "./Field";
|
|
25
27
|
export { FieldErrorMessage } from "./FieldErrorMessage";
|
|
26
28
|
export { FieldHelper } from "./FieldHelper";
|
|
29
|
+
export { Figure } from "./Figure";
|
|
27
30
|
export type { FramedContentVariantProps, FramedContentProps } from "./FramedContent";
|
|
28
31
|
export { FramedContent } from "./FramedContent";
|
|
29
32
|
export { Input, FieldInput, InputContainer, TextArea, FieldTextArea } from "./Input";
|
|
@@ -41,6 +44,8 @@ export type { PopoverRootProps } from "./Popover";
|
|
|
41
44
|
export { PopoverRoot, PopoverAnchor, PopoverArrowStandalone, PopoverArrow, PopoverArrowTip, PopoverCloseTrigger, PopoverContentStandalone, PopoverContent, PopoverDescription, PopoverIndicator, PopoverPositioner, PopoverTitle, PopoverTrigger, } from "./Popover";
|
|
42
45
|
export type { RadioGroupRootProps } from "./RadioGroup";
|
|
43
46
|
export { RadioGroupRoot, RadioGroupIndicator, RadioGroupItemControl, RadioGroupItem, RadioGroupItemText, RadioGroupLabel, RadioGroupItemHiddenInput, } from "./RadioGroup";
|
|
47
|
+
export type { SelectRootProps } from "./Select";
|
|
48
|
+
export { SelectRoot, SelectClearTrigger, SelectContent, SelectControl, SelectIndicator, SelectItemGroupLabel, SelectItemGroup, SelectItemIndicator, SelectItem, SelectItemText, SelectLabel, SelectPositioner, SelectTrigger, SelectValueText, } from "./Select";
|
|
44
49
|
export type { SkeletonProps } from "./Skeleton";
|
|
45
50
|
export { Skeleton } from "./Skeleton";
|
|
46
51
|
export type { SliderRootProps } from "./Slider";
|
|
@@ -51,6 +56,8 @@ export type { SwitchVariantProps, SwitchRootProps } from "./Switch";
|
|
|
51
56
|
export { SwitchRoot, SwitchControl, SwitchThumb, SwitchLabel, SwitchHiddenInput } from "./Switch";
|
|
52
57
|
export type { TableProps } from "./Table";
|
|
53
58
|
export { Table } from "./Table";
|
|
59
|
+
export type { TagsInputRootProps } from "./TagsInput";
|
|
60
|
+
export { TagsInputRoot, TagsInputClearTrigger, TagsInputControl, TagsInputInput, TagsInputItemDeleteTrigger, TagsInputItemInput, TagsInputItemPreview, TagsInputItem, TagsInputItemText, TagsInputLabel, } from "./TagsInput";
|
|
54
61
|
export type { TabsVariantProps, TabsRootProps } from "./Tabs";
|
|
55
62
|
export { TabsRoot, TabsContent, TabsIndicator, TabsList, TabsTrigger } from "./Tabs";
|
|
56
63
|
export type { TextProps } from "./Text";
|
package/lib/index.js
CHANGED
|
@@ -87,6 +87,84 @@ Object.defineProperty(exports, "CheckboxRoot", {
|
|
|
87
87
|
return _Checkbox.CheckboxRoot;
|
|
88
88
|
}
|
|
89
89
|
});
|
|
90
|
+
Object.defineProperty(exports, "ComboboxClearTrigger", {
|
|
91
|
+
enumerable: true,
|
|
92
|
+
get: function () {
|
|
93
|
+
return _Combobox.ComboboxClearTrigger;
|
|
94
|
+
}
|
|
95
|
+
});
|
|
96
|
+
Object.defineProperty(exports, "ComboboxContent", {
|
|
97
|
+
enumerable: true,
|
|
98
|
+
get: function () {
|
|
99
|
+
return _Combobox.ComboboxContent;
|
|
100
|
+
}
|
|
101
|
+
});
|
|
102
|
+
Object.defineProperty(exports, "ComboboxControl", {
|
|
103
|
+
enumerable: true,
|
|
104
|
+
get: function () {
|
|
105
|
+
return _Combobox.ComboboxControl;
|
|
106
|
+
}
|
|
107
|
+
});
|
|
108
|
+
Object.defineProperty(exports, "ComboboxInput", {
|
|
109
|
+
enumerable: true,
|
|
110
|
+
get: function () {
|
|
111
|
+
return _Combobox.ComboboxInput;
|
|
112
|
+
}
|
|
113
|
+
});
|
|
114
|
+
Object.defineProperty(exports, "ComboboxItem", {
|
|
115
|
+
enumerable: true,
|
|
116
|
+
get: function () {
|
|
117
|
+
return _Combobox.ComboboxItem;
|
|
118
|
+
}
|
|
119
|
+
});
|
|
120
|
+
Object.defineProperty(exports, "ComboboxItemGroup", {
|
|
121
|
+
enumerable: true,
|
|
122
|
+
get: function () {
|
|
123
|
+
return _Combobox.ComboboxItemGroup;
|
|
124
|
+
}
|
|
125
|
+
});
|
|
126
|
+
Object.defineProperty(exports, "ComboboxItemGroupLabel", {
|
|
127
|
+
enumerable: true,
|
|
128
|
+
get: function () {
|
|
129
|
+
return _Combobox.ComboboxItemGroupLabel;
|
|
130
|
+
}
|
|
131
|
+
});
|
|
132
|
+
Object.defineProperty(exports, "ComboboxItemIndicator", {
|
|
133
|
+
enumerable: true,
|
|
134
|
+
get: function () {
|
|
135
|
+
return _Combobox.ComboboxItemIndicator;
|
|
136
|
+
}
|
|
137
|
+
});
|
|
138
|
+
Object.defineProperty(exports, "ComboboxItemText", {
|
|
139
|
+
enumerable: true,
|
|
140
|
+
get: function () {
|
|
141
|
+
return _Combobox.ComboboxItemText;
|
|
142
|
+
}
|
|
143
|
+
});
|
|
144
|
+
Object.defineProperty(exports, "ComboboxLabel", {
|
|
145
|
+
enumerable: true,
|
|
146
|
+
get: function () {
|
|
147
|
+
return _Combobox.ComboboxLabel;
|
|
148
|
+
}
|
|
149
|
+
});
|
|
150
|
+
Object.defineProperty(exports, "ComboboxPositioner", {
|
|
151
|
+
enumerable: true,
|
|
152
|
+
get: function () {
|
|
153
|
+
return _Combobox.ComboboxPositioner;
|
|
154
|
+
}
|
|
155
|
+
});
|
|
156
|
+
Object.defineProperty(exports, "ComboboxRoot", {
|
|
157
|
+
enumerable: true,
|
|
158
|
+
get: function () {
|
|
159
|
+
return _Combobox.ComboboxRoot;
|
|
160
|
+
}
|
|
161
|
+
});
|
|
162
|
+
Object.defineProperty(exports, "ComboboxTrigger", {
|
|
163
|
+
enumerable: true,
|
|
164
|
+
get: function () {
|
|
165
|
+
return _Combobox.ComboboxTrigger;
|
|
166
|
+
}
|
|
167
|
+
});
|
|
90
168
|
Object.defineProperty(exports, "DefinitionList", {
|
|
91
169
|
enumerable: true,
|
|
92
170
|
get: function () {
|
|
@@ -207,6 +285,12 @@ Object.defineProperty(exports, "FieldTextArea", {
|
|
|
207
285
|
return _Input.FieldTextArea;
|
|
208
286
|
}
|
|
209
287
|
});
|
|
288
|
+
Object.defineProperty(exports, "Figure", {
|
|
289
|
+
enumerable: true,
|
|
290
|
+
get: function () {
|
|
291
|
+
return _Figure.Figure;
|
|
292
|
+
}
|
|
293
|
+
});
|
|
210
294
|
Object.defineProperty(exports, "FramedContent", {
|
|
211
295
|
enumerable: true,
|
|
212
296
|
get: function () {
|
|
@@ -477,6 +561,90 @@ Object.defineProperty(exports, "RadioGroupRoot", {
|
|
|
477
561
|
return _RadioGroup.RadioGroupRoot;
|
|
478
562
|
}
|
|
479
563
|
});
|
|
564
|
+
Object.defineProperty(exports, "SelectClearTrigger", {
|
|
565
|
+
enumerable: true,
|
|
566
|
+
get: function () {
|
|
567
|
+
return _Select.SelectClearTrigger;
|
|
568
|
+
}
|
|
569
|
+
});
|
|
570
|
+
Object.defineProperty(exports, "SelectContent", {
|
|
571
|
+
enumerable: true,
|
|
572
|
+
get: function () {
|
|
573
|
+
return _Select.SelectContent;
|
|
574
|
+
}
|
|
575
|
+
});
|
|
576
|
+
Object.defineProperty(exports, "SelectControl", {
|
|
577
|
+
enumerable: true,
|
|
578
|
+
get: function () {
|
|
579
|
+
return _Select.SelectControl;
|
|
580
|
+
}
|
|
581
|
+
});
|
|
582
|
+
Object.defineProperty(exports, "SelectIndicator", {
|
|
583
|
+
enumerable: true,
|
|
584
|
+
get: function () {
|
|
585
|
+
return _Select.SelectIndicator;
|
|
586
|
+
}
|
|
587
|
+
});
|
|
588
|
+
Object.defineProperty(exports, "SelectItem", {
|
|
589
|
+
enumerable: true,
|
|
590
|
+
get: function () {
|
|
591
|
+
return _Select.SelectItem;
|
|
592
|
+
}
|
|
593
|
+
});
|
|
594
|
+
Object.defineProperty(exports, "SelectItemGroup", {
|
|
595
|
+
enumerable: true,
|
|
596
|
+
get: function () {
|
|
597
|
+
return _Select.SelectItemGroup;
|
|
598
|
+
}
|
|
599
|
+
});
|
|
600
|
+
Object.defineProperty(exports, "SelectItemGroupLabel", {
|
|
601
|
+
enumerable: true,
|
|
602
|
+
get: function () {
|
|
603
|
+
return _Select.SelectItemGroupLabel;
|
|
604
|
+
}
|
|
605
|
+
});
|
|
606
|
+
Object.defineProperty(exports, "SelectItemIndicator", {
|
|
607
|
+
enumerable: true,
|
|
608
|
+
get: function () {
|
|
609
|
+
return _Select.SelectItemIndicator;
|
|
610
|
+
}
|
|
611
|
+
});
|
|
612
|
+
Object.defineProperty(exports, "SelectItemText", {
|
|
613
|
+
enumerable: true,
|
|
614
|
+
get: function () {
|
|
615
|
+
return _Select.SelectItemText;
|
|
616
|
+
}
|
|
617
|
+
});
|
|
618
|
+
Object.defineProperty(exports, "SelectLabel", {
|
|
619
|
+
enumerable: true,
|
|
620
|
+
get: function () {
|
|
621
|
+
return _Select.SelectLabel;
|
|
622
|
+
}
|
|
623
|
+
});
|
|
624
|
+
Object.defineProperty(exports, "SelectPositioner", {
|
|
625
|
+
enumerable: true,
|
|
626
|
+
get: function () {
|
|
627
|
+
return _Select.SelectPositioner;
|
|
628
|
+
}
|
|
629
|
+
});
|
|
630
|
+
Object.defineProperty(exports, "SelectRoot", {
|
|
631
|
+
enumerable: true,
|
|
632
|
+
get: function () {
|
|
633
|
+
return _Select.SelectRoot;
|
|
634
|
+
}
|
|
635
|
+
});
|
|
636
|
+
Object.defineProperty(exports, "SelectTrigger", {
|
|
637
|
+
enumerable: true,
|
|
638
|
+
get: function () {
|
|
639
|
+
return _Select.SelectTrigger;
|
|
640
|
+
}
|
|
641
|
+
});
|
|
642
|
+
Object.defineProperty(exports, "SelectValueText", {
|
|
643
|
+
enumerable: true,
|
|
644
|
+
get: function () {
|
|
645
|
+
return _Select.SelectValueText;
|
|
646
|
+
}
|
|
647
|
+
});
|
|
480
648
|
Object.defineProperty(exports, "Skeleton", {
|
|
481
649
|
enumerable: true,
|
|
482
650
|
get: function () {
|
|
@@ -597,6 +765,66 @@ Object.defineProperty(exports, "TabsTrigger", {
|
|
|
597
765
|
return _Tabs.TabsTrigger;
|
|
598
766
|
}
|
|
599
767
|
});
|
|
768
|
+
Object.defineProperty(exports, "TagsInputClearTrigger", {
|
|
769
|
+
enumerable: true,
|
|
770
|
+
get: function () {
|
|
771
|
+
return _TagsInput.TagsInputClearTrigger;
|
|
772
|
+
}
|
|
773
|
+
});
|
|
774
|
+
Object.defineProperty(exports, "TagsInputControl", {
|
|
775
|
+
enumerable: true,
|
|
776
|
+
get: function () {
|
|
777
|
+
return _TagsInput.TagsInputControl;
|
|
778
|
+
}
|
|
779
|
+
});
|
|
780
|
+
Object.defineProperty(exports, "TagsInputInput", {
|
|
781
|
+
enumerable: true,
|
|
782
|
+
get: function () {
|
|
783
|
+
return _TagsInput.TagsInputInput;
|
|
784
|
+
}
|
|
785
|
+
});
|
|
786
|
+
Object.defineProperty(exports, "TagsInputItem", {
|
|
787
|
+
enumerable: true,
|
|
788
|
+
get: function () {
|
|
789
|
+
return _TagsInput.TagsInputItem;
|
|
790
|
+
}
|
|
791
|
+
});
|
|
792
|
+
Object.defineProperty(exports, "TagsInputItemDeleteTrigger", {
|
|
793
|
+
enumerable: true,
|
|
794
|
+
get: function () {
|
|
795
|
+
return _TagsInput.TagsInputItemDeleteTrigger;
|
|
796
|
+
}
|
|
797
|
+
});
|
|
798
|
+
Object.defineProperty(exports, "TagsInputItemInput", {
|
|
799
|
+
enumerable: true,
|
|
800
|
+
get: function () {
|
|
801
|
+
return _TagsInput.TagsInputItemInput;
|
|
802
|
+
}
|
|
803
|
+
});
|
|
804
|
+
Object.defineProperty(exports, "TagsInputItemPreview", {
|
|
805
|
+
enumerable: true,
|
|
806
|
+
get: function () {
|
|
807
|
+
return _TagsInput.TagsInputItemPreview;
|
|
808
|
+
}
|
|
809
|
+
});
|
|
810
|
+
Object.defineProperty(exports, "TagsInputItemText", {
|
|
811
|
+
enumerable: true,
|
|
812
|
+
get: function () {
|
|
813
|
+
return _TagsInput.TagsInputItemText;
|
|
814
|
+
}
|
|
815
|
+
});
|
|
816
|
+
Object.defineProperty(exports, "TagsInputLabel", {
|
|
817
|
+
enumerable: true,
|
|
818
|
+
get: function () {
|
|
819
|
+
return _TagsInput.TagsInputLabel;
|
|
820
|
+
}
|
|
821
|
+
});
|
|
822
|
+
Object.defineProperty(exports, "TagsInputRoot", {
|
|
823
|
+
enumerable: true,
|
|
824
|
+
get: function () {
|
|
825
|
+
return _TagsInput.TagsInputRoot;
|
|
826
|
+
}
|
|
827
|
+
});
|
|
600
828
|
Object.defineProperty(exports, "Text", {
|
|
601
829
|
enumerable: true,
|
|
602
830
|
get: function () {
|
|
@@ -693,11 +921,13 @@ var _Badge = require("./Badge");
|
|
|
693
921
|
var _BlockQuote = require("./BlockQuote");
|
|
694
922
|
var _Button = require("./Button");
|
|
695
923
|
var _Checkbox = require("./Checkbox");
|
|
924
|
+
var _Combobox = require("./Combobox");
|
|
696
925
|
var _Dialog = require("./Dialog");
|
|
697
926
|
var _ExpandableBox = require("./ExpandableBox");
|
|
698
927
|
var _Field = require("./Field");
|
|
699
928
|
var _FieldErrorMessage = require("./FieldErrorMessage");
|
|
700
929
|
var _FieldHelper = require("./FieldHelper");
|
|
930
|
+
var _Figure = require("./Figure");
|
|
701
931
|
var _FramedContent = require("./FramedContent");
|
|
702
932
|
var _Input = require("./Input");
|
|
703
933
|
var _Label = require("./Label");
|
|
@@ -707,11 +937,13 @@ var _NdlaLogo = require("./NdlaLogo");
|
|
|
707
937
|
var _Pagination = require("./Pagination");
|
|
708
938
|
var _Popover = require("./Popover");
|
|
709
939
|
var _RadioGroup = require("./RadioGroup");
|
|
940
|
+
var _Select = require("./Select");
|
|
710
941
|
var _Skeleton = require("./Skeleton");
|
|
711
942
|
var _Slider = require("./Slider");
|
|
712
943
|
var _Spinner = require("./Spinner");
|
|
713
944
|
var _Switch = require("./Switch");
|
|
714
945
|
var _Table = require("./Table");
|
|
946
|
+
var _TagsInput = require("./TagsInput");
|
|
715
947
|
var _Tabs = require("./Tabs");
|
|
716
948
|
var _Text = require("./Text");
|
|
717
949
|
var _Toast = require("./Toast");
|