demio-ui 1.0.27 → 1.0.28
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/cjs/index.css +1 -1
- package/dist/cjs/index.js +2 -2
- package/dist/cjs/types/src/components/Checkbox/Checkbox.d.ts +15 -0
- package/dist/cjs/types/src/components/Checkbox/index.d.ts +1 -0
- package/dist/cjs/types/src/components/InputHint/InputHint.d.ts +0 -3
- package/dist/cjs/types/src/components/Label/Label.d.ts +2 -1
- package/dist/cjs/types/src/components/RadioGroup/RadioGroup.d.ts +2 -1
- package/dist/cjs/types/src/icons/index.d.ts +3 -1
- package/dist/esm/index.css +1 -1
- package/dist/esm/index.js +2 -2
- package/dist/esm/types/src/components/Checkbox/Checkbox.d.ts +15 -0
- package/dist/esm/types/src/components/Checkbox/index.d.ts +1 -0
- package/dist/esm/types/src/components/InputHint/InputHint.d.ts +0 -3
- package/dist/esm/types/src/components/Label/Label.d.ts +2 -1
- package/dist/esm/types/src/components/RadioGroup/RadioGroup.d.ts +2 -1
- package/dist/esm/types/src/icons/index.d.ts +3 -1
- package/dist/types.d.ts +87 -26
- package/package.json +2 -1
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
type Props = {
|
|
3
|
+
children: React.ReactNode;
|
|
4
|
+
disabled?: boolean;
|
|
5
|
+
id: string;
|
|
6
|
+
defaultChecked?: boolean;
|
|
7
|
+
checked?: boolean;
|
|
8
|
+
onChange?: (checked: boolean) => void;
|
|
9
|
+
name?: string;
|
|
10
|
+
};
|
|
11
|
+
/**
|
|
12
|
+
* Checkbox component documentation.
|
|
13
|
+
**/
|
|
14
|
+
declare function Checkbox({ children, id, checked, onChange, disabled, defaultChecked, name, ...props }: Props): React.JSX.Element;
|
|
15
|
+
export default Checkbox;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './Checkbox';
|
|
@@ -3,6 +3,7 @@ type Props = {
|
|
|
3
3
|
htmlFor: string;
|
|
4
4
|
children: React.ReactNode;
|
|
5
5
|
className?: string;
|
|
6
|
+
weight?: 'regular' | 'semiBold';
|
|
6
7
|
};
|
|
7
|
-
declare function Label({ htmlFor, children, className }: Props): React.JSX.Element;
|
|
8
|
+
declare function Label({ htmlFor, children, className, weight }: Props): React.JSX.Element;
|
|
8
9
|
export default Label;
|
|
@@ -12,6 +12,7 @@ type Props = {
|
|
|
12
12
|
hint?: string;
|
|
13
13
|
onChange?: (value: string) => void;
|
|
14
14
|
disabled?: boolean;
|
|
15
|
+
value?: string;
|
|
15
16
|
};
|
|
16
|
-
declare function RadioGroup({ items, error, defaultValue, ariaLabel, hint, onChange, disabled, ...props }: Props): React.JSX.Element;
|
|
17
|
+
declare function RadioGroup({ items, error, defaultValue, ariaLabel, hint, onChange, disabled, value, ...props }: Props): React.JSX.Element;
|
|
17
18
|
export default RadioGroup;
|
|
@@ -3,6 +3,8 @@ import ArrowDownIcon from './keyboard_arrow_down.svg';
|
|
|
3
3
|
import BlockIcon from './block.svg';
|
|
4
4
|
import BlurOnIcon from './blur_on.svg';
|
|
5
5
|
import CachedIcon from './cached.svg';
|
|
6
|
+
import CheckboxIcon from './checkbox.svg';
|
|
7
|
+
import CheckboxUncheckIcon from './checkbox_uncheck.svg';
|
|
6
8
|
import CheckCircleIcon from './check_circle.svg';
|
|
7
9
|
import CloseIcon from './close.svg';
|
|
8
10
|
import DeleteIcon from './delete.svg';
|
|
@@ -23,4 +25,4 @@ import VolumeUpIcon from './volume_up-1.svg';
|
|
|
23
25
|
import VolumeUpSolidIcon from './volume_up.svg';
|
|
24
26
|
import WarningIcon from './warning-1.svg';
|
|
25
27
|
import WarningSolidIcon from './warning.svg';
|
|
26
|
-
export { AddIcon, ArrowDownIcon, BlockIcon, BlurOnIcon, CachedIcon, CheckCircleIcon, CloseIcon, DeleteIcon, InfoIcon, InfoSolidIcon, MicOffIcon, MicOffSolidIcon, MicOnfIcon, MicOnSolidIcon, PlayIcon, VideoCamOffIcon, VideoCamOffSolidIcon, VideoCamOnIcon, VideoCamOnSolidIcon, VolumeOffIcon, VolumeOffSolidIcon, VolumeUpIcon, VolumeUpSolidIcon, WarningIcon, WarningSolidIcon, };
|
|
28
|
+
export { AddIcon, ArrowDownIcon, BlockIcon, BlurOnIcon, CachedIcon, CheckboxIcon, CheckboxUncheckIcon, CheckCircleIcon, CloseIcon, DeleteIcon, InfoIcon, InfoSolidIcon, MicOffIcon, MicOffSolidIcon, MicOnfIcon, MicOnSolidIcon, PlayIcon, VideoCamOffIcon, VideoCamOffSolidIcon, VideoCamOnIcon, VideoCamOnSolidIcon, VolumeOffIcon, VolumeOffSolidIcon, VolumeUpIcon, VolumeUpSolidIcon, WarningIcon, WarningSolidIcon, };
|
package/dist/types.d.ts
CHANGED
|
@@ -126,8 +126,9 @@ type Props$3 = {
|
|
|
126
126
|
htmlFor: string;
|
|
127
127
|
children: React__default.ReactNode;
|
|
128
128
|
className?: string;
|
|
129
|
+
weight?: 'regular' | 'semiBold';
|
|
129
130
|
};
|
|
130
|
-
declare function Label({ htmlFor, children, className }: Props$3): React__default.JSX.Element;
|
|
131
|
+
declare function Label({ htmlFor, children, className, weight }: Props$3): React__default.JSX.Element;
|
|
131
132
|
|
|
132
133
|
type Props$2 = {
|
|
133
134
|
children: React__default.ReactNode;
|
|
@@ -159,10 +160,10 @@ type Props = {
|
|
|
159
160
|
};
|
|
160
161
|
declare function Alert({ onOpenChange, open, actionText, onActionClick, cancelText, onCancelClick, title, description, }: Props): React__default.JSX.Element;
|
|
161
162
|
|
|
162
|
-
var _path$
|
|
163
|
-
function _extends$
|
|
163
|
+
var _path$q, _g$p;
|
|
164
|
+
function _extends$q() { _extends$q = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$q.apply(this, arguments); }
|
|
164
165
|
var SvgAdd = function SvgAdd(props) {
|
|
165
|
-
return /*#__PURE__*/React.createElement("svg", _extends$
|
|
166
|
+
return /*#__PURE__*/React.createElement("svg", _extends$q({
|
|
166
167
|
xmlns: "http://www.w3.org/2000/svg",
|
|
167
168
|
width: 24,
|
|
168
169
|
height: 24,
|
|
@@ -177,10 +178,10 @@ var SvgAdd = function SvgAdd(props) {
|
|
|
177
178
|
style: {
|
|
178
179
|
maskType: "alpha"
|
|
179
180
|
}
|
|
180
|
-
}, _path$
|
|
181
|
+
}, _path$q || (_path$q = /*#__PURE__*/React.createElement("path", {
|
|
181
182
|
fill: "#D9D9D9",
|
|
182
183
|
d: "M0 0h24v24H0z"
|
|
183
|
-
}))), _g$
|
|
184
|
+
}))), _g$p || (_g$p = /*#__PURE__*/React.createElement("g", {
|
|
184
185
|
mask: "url(#add_svg__a)"
|
|
185
186
|
}, /*#__PURE__*/React.createElement("path", {
|
|
186
187
|
fill: "#2C3336",
|
|
@@ -188,10 +189,10 @@ var SvgAdd = function SvgAdd(props) {
|
|
|
188
189
|
}))));
|
|
189
190
|
};
|
|
190
191
|
|
|
191
|
-
var _path$
|
|
192
|
-
function _extends$
|
|
192
|
+
var _path$p, _g$o;
|
|
193
|
+
function _extends$p() { _extends$p = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$p.apply(this, arguments); }
|
|
193
194
|
var SvgKeyboardArrowDown = function SvgKeyboardArrowDown(props) {
|
|
194
|
-
return /*#__PURE__*/React.createElement("svg", _extends$
|
|
195
|
+
return /*#__PURE__*/React.createElement("svg", _extends$p({
|
|
195
196
|
xmlns: "http://www.w3.org/2000/svg",
|
|
196
197
|
fill: "none",
|
|
197
198
|
viewBox: "0 0 24 24"
|
|
@@ -205,10 +206,10 @@ var SvgKeyboardArrowDown = function SvgKeyboardArrowDown(props) {
|
|
|
205
206
|
style: {
|
|
206
207
|
maskType: "alpha"
|
|
207
208
|
}
|
|
208
|
-
}, _path$
|
|
209
|
+
}, _path$p || (_path$p = /*#__PURE__*/React.createElement("path", {
|
|
209
210
|
fill: "#D9D9D9",
|
|
210
211
|
d: "M0 0h24v24H0z"
|
|
211
|
-
}))), _g$
|
|
212
|
+
}))), _g$o || (_g$o = /*#__PURE__*/React.createElement("g", {
|
|
212
213
|
mask: "url(#keyboard_arrow_down_svg__a)"
|
|
213
214
|
}, /*#__PURE__*/React.createElement("path", {
|
|
214
215
|
fill: "#2C3336",
|
|
@@ -216,10 +217,10 @@ var SvgKeyboardArrowDown = function SvgKeyboardArrowDown(props) {
|
|
|
216
217
|
}))));
|
|
217
218
|
};
|
|
218
219
|
|
|
219
|
-
var _path$
|
|
220
|
-
function _extends$
|
|
220
|
+
var _path$o, _g$n;
|
|
221
|
+
function _extends$o() { _extends$o = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$o.apply(this, arguments); }
|
|
221
222
|
var SvgBlock = function SvgBlock(props) {
|
|
222
|
-
return /*#__PURE__*/React.createElement("svg", _extends$
|
|
223
|
+
return /*#__PURE__*/React.createElement("svg", _extends$o({
|
|
223
224
|
xmlns: "http://www.w3.org/2000/svg",
|
|
224
225
|
width: 24,
|
|
225
226
|
height: 24,
|
|
@@ -234,10 +235,10 @@ var SvgBlock = function SvgBlock(props) {
|
|
|
234
235
|
style: {
|
|
235
236
|
maskType: "alpha"
|
|
236
237
|
}
|
|
237
|
-
}, _path$
|
|
238
|
+
}, _path$o || (_path$o = /*#__PURE__*/React.createElement("path", {
|
|
238
239
|
fill: "#D9D9D9",
|
|
239
240
|
d: "M0 0h24v24H0z"
|
|
240
|
-
}))), _g$
|
|
241
|
+
}))), _g$n || (_g$n = /*#__PURE__*/React.createElement("g", {
|
|
241
242
|
mask: "url(#block_svg__a)"
|
|
242
243
|
}, /*#__PURE__*/React.createElement("path", {
|
|
243
244
|
fill: "#42454B",
|
|
@@ -245,10 +246,10 @@ var SvgBlock = function SvgBlock(props) {
|
|
|
245
246
|
}))));
|
|
246
247
|
};
|
|
247
248
|
|
|
248
|
-
var _path$
|
|
249
|
-
function _extends$
|
|
249
|
+
var _path$n, _g$m;
|
|
250
|
+
function _extends$n() { _extends$n = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$n.apply(this, arguments); }
|
|
250
251
|
var SvgBlurOn = function SvgBlurOn(props) {
|
|
251
|
-
return /*#__PURE__*/React.createElement("svg", _extends$
|
|
252
|
+
return /*#__PURE__*/React.createElement("svg", _extends$n({
|
|
252
253
|
xmlns: "http://www.w3.org/2000/svg",
|
|
253
254
|
width: 24,
|
|
254
255
|
height: 24,
|
|
@@ -263,10 +264,10 @@ var SvgBlurOn = function SvgBlurOn(props) {
|
|
|
263
264
|
style: {
|
|
264
265
|
maskType: "alpha"
|
|
265
266
|
}
|
|
266
|
-
}, _path$
|
|
267
|
+
}, _path$n || (_path$n = /*#__PURE__*/React.createElement("path", {
|
|
267
268
|
fill: "#D9D9D9",
|
|
268
269
|
d: "M0 0h24v24H0z"
|
|
269
|
-
}))), _g$
|
|
270
|
+
}))), _g$m || (_g$m = /*#__PURE__*/React.createElement("g", {
|
|
270
271
|
mask: "url(#blur_on_svg__a)"
|
|
271
272
|
}, /*#__PURE__*/React.createElement("path", {
|
|
272
273
|
fill: "#2C3336",
|
|
@@ -274,10 +275,10 @@ var SvgBlurOn = function SvgBlurOn(props) {
|
|
|
274
275
|
}))));
|
|
275
276
|
};
|
|
276
277
|
|
|
277
|
-
var _path$
|
|
278
|
-
function _extends$
|
|
278
|
+
var _path$m, _g$l;
|
|
279
|
+
function _extends$m() { _extends$m = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$m.apply(this, arguments); }
|
|
279
280
|
var SvgCached = function SvgCached(props) {
|
|
280
|
-
return /*#__PURE__*/React.createElement("svg", _extends$
|
|
281
|
+
return /*#__PURE__*/React.createElement("svg", _extends$m({
|
|
281
282
|
xmlns: "http://www.w3.org/2000/svg",
|
|
282
283
|
width: 24,
|
|
283
284
|
height: 24,
|
|
@@ -292,10 +293,10 @@ var SvgCached = function SvgCached(props) {
|
|
|
292
293
|
style: {
|
|
293
294
|
maskType: "alpha"
|
|
294
295
|
}
|
|
295
|
-
}, _path$
|
|
296
|
+
}, _path$m || (_path$m = /*#__PURE__*/React.createElement("path", {
|
|
296
297
|
fill: "#D9D9D9",
|
|
297
298
|
d: "M0 0h24v24H0z"
|
|
298
|
-
}))), _g$
|
|
299
|
+
}))), _g$l || (_g$l = /*#__PURE__*/React.createElement("g", {
|
|
299
300
|
mask: "url(#cached_svg__a)"
|
|
300
301
|
}, /*#__PURE__*/React.createElement("path", {
|
|
301
302
|
fill: "#2C3336",
|
|
@@ -303,6 +304,64 @@ var SvgCached = function SvgCached(props) {
|
|
|
303
304
|
}))));
|
|
304
305
|
};
|
|
305
306
|
|
|
307
|
+
var _path$l, _g$k;
|
|
308
|
+
function _extends$l() { _extends$l = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$l.apply(this, arguments); }
|
|
309
|
+
var SvgCheckbox = function SvgCheckbox(props) {
|
|
310
|
+
return /*#__PURE__*/React.createElement("svg", _extends$l({
|
|
311
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
312
|
+
width: 24,
|
|
313
|
+
height: 24,
|
|
314
|
+
fill: "none"
|
|
315
|
+
}, props), /*#__PURE__*/React.createElement("mask", {
|
|
316
|
+
id: "checkbox_svg__a",
|
|
317
|
+
width: 24,
|
|
318
|
+
height: 24,
|
|
319
|
+
x: 0,
|
|
320
|
+
y: 0,
|
|
321
|
+
maskUnits: "userSpaceOnUse",
|
|
322
|
+
style: {
|
|
323
|
+
maskType: "alpha"
|
|
324
|
+
}
|
|
325
|
+
}, _path$l || (_path$l = /*#__PURE__*/React.createElement("path", {
|
|
326
|
+
fill: "#D9D9D9",
|
|
327
|
+
d: "M0 0h24v24H0z"
|
|
328
|
+
}))), _g$k || (_g$k = /*#__PURE__*/React.createElement("g", {
|
|
329
|
+
mask: "url(#checkbox_svg__a)"
|
|
330
|
+
}, /*#__PURE__*/React.createElement("path", {
|
|
331
|
+
fill: "#02BF6F",
|
|
332
|
+
d: "m10.6 13.4-2.15-2.15a.948.948 0 0 0-.7-.275.948.948 0 0 0-.7.275.948.948 0 0 0-.275.7c0 .283.092.517.275.7L9.9 15.5c.2.2.433.3.7.3.267 0 .5-.1.7-.3l5.65-5.65a.948.948 0 0 0 .275-.7.948.948 0 0 0-.275-.7.948.948 0 0 0-.7-.275.948.948 0 0 0-.7.275L10.6 13.4ZM5 21c-.55 0-1.02-.196-1.413-.587A1.926 1.926 0 0 1 3 19V5c0-.55.196-1.02.587-1.413A1.926 1.926 0 0 1 5 3h14c.55 0 1.02.196 1.413.587C20.803 3.98 21 4.45 21 5v14c0 .55-.196 1.02-.587 1.413A1.926 1.926 0 0 1 19 21H5Z"
|
|
333
|
+
}))));
|
|
334
|
+
};
|
|
335
|
+
|
|
336
|
+
var _path$k, _g$j;
|
|
337
|
+
function _extends$k() { _extends$k = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$k.apply(this, arguments); }
|
|
338
|
+
var SvgCheckboxUncheck = function SvgCheckboxUncheck(props) {
|
|
339
|
+
return /*#__PURE__*/React.createElement("svg", _extends$k({
|
|
340
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
341
|
+
width: 24,
|
|
342
|
+
height: 24,
|
|
343
|
+
fill: "none"
|
|
344
|
+
}, props), /*#__PURE__*/React.createElement("mask", {
|
|
345
|
+
id: "checkbox_uncheck_svg__a",
|
|
346
|
+
width: 24,
|
|
347
|
+
height: 24,
|
|
348
|
+
x: 0,
|
|
349
|
+
y: 0,
|
|
350
|
+
maskUnits: "userSpaceOnUse",
|
|
351
|
+
style: {
|
|
352
|
+
maskType: "alpha"
|
|
353
|
+
}
|
|
354
|
+
}, _path$k || (_path$k = /*#__PURE__*/React.createElement("path", {
|
|
355
|
+
fill: "#D9D9D9",
|
|
356
|
+
d: "M0 0h24v24H0z"
|
|
357
|
+
}))), _g$j || (_g$j = /*#__PURE__*/React.createElement("g", {
|
|
358
|
+
mask: "url(#checkbox_uncheck_svg__a)"
|
|
359
|
+
}, /*#__PURE__*/React.createElement("path", {
|
|
360
|
+
fill: "#838B97",
|
|
361
|
+
d: "M5 21c-.55 0-1.02-.196-1.413-.587A1.926 1.926 0 0 1 3 19V5c0-.55.196-1.02.587-1.413A1.926 1.926 0 0 1 5 3h14c.55 0 1.02.196 1.413.587C20.803 3.98 21 4.45 21 5v14c0 .55-.196 1.02-.587 1.413A1.926 1.926 0 0 1 19 21H5Zm0-2h14V5H5v14Z"
|
|
362
|
+
}))));
|
|
363
|
+
};
|
|
364
|
+
|
|
306
365
|
var _path$j, _g$i;
|
|
307
366
|
function _extends$j() { _extends$j = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$j.apply(this, arguments); }
|
|
308
367
|
var SvgCheckCircle = function SvgCheckCircle(props) {
|
|
@@ -870,6 +929,8 @@ declare namespace index {
|
|
|
870
929
|
SvgBlurOn as BlurOnIcon,
|
|
871
930
|
SvgCached as CachedIcon,
|
|
872
931
|
SvgCheckCircle as CheckCircleIcon,
|
|
932
|
+
SvgCheckbox as CheckboxIcon,
|
|
933
|
+
SvgCheckboxUncheck as CheckboxUncheckIcon,
|
|
873
934
|
SvgClose as CloseIcon,
|
|
874
935
|
SvgDelete as DeleteIcon,
|
|
875
936
|
SvgInfo as InfoIcon,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "demio-ui",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.28",
|
|
4
4
|
"description": "",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -45,6 +45,7 @@
|
|
|
45
45
|
},
|
|
46
46
|
"dependencies": {
|
|
47
47
|
"@radix-ui/react-alert-dialog": "^1.0.4",
|
|
48
|
+
"@radix-ui/react-checkbox": "^1.0.4",
|
|
48
49
|
"@radix-ui/react-dialog": "^1.0.4",
|
|
49
50
|
"@radix-ui/react-label": "^2.0.2",
|
|
50
51
|
"@radix-ui/react-progress": "^1.0.3",
|