@peculiar/react-components 0.3.15-alpha.1 → 0.3.15

package/dist/cjs/TextField/text_field.js

@@ -44,31 +44,40 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TextField = void 0;
 var React = __importStar(require("react"));
-var styled_1 = __importDefault(require("@emotion/styled"));
+var styles_1 = require("../styles");
 var Typography_1 = require("../Typography");
-/**
- *
- */
-/**
- * Styles.
- */
-var TextFieldInput = (0, styled_1.default)(Typography_1.Typography)(function (props) { return (__assign(__assign(__assign({ fontFamily: 'inherit', outline: 'none', boxSizing: 'border-box', width: '100%', borderRadius: '4px', padding: '0 var(--pv-size-base-2)', backgroundColor: 'var(--pv-color-gray-1)', borderStyle: 'solid', borderWidth: '1px', borderColor: 'var(--pv-color-gray-8)', transition: 'background-color 200ms, color 200ms, border-color 200ms', display: 'inline-flex', appearance: 'none', '&::placeholder': {
+var stylesInputBase = function () { return (0, styles_1.css)({
+    label: 'TextField',
+    fontFamily: 'inherit',
+    outline: 'none',
+    boxSizing: 'border-box',
+    width: '100%',
+    borderRadius: '4px',
+    padding: '0 var(--pv-size-base-2)',
+    backgroundColor: 'var(--pv-color-gray-1)',
+    borderStyle: 'solid',
+    borderWidth: '1px',
+    borderColor: 'var(--pv-color-gray-8)',
+    transition: 'background-color 200ms, color 200ms, border-color 200ms',
+    display: 'inline-flex',
+    appearance: 'none',
+    '&::placeholder': {
         color: 'var(--pv-color-gray-9)',
-    }, '&:hover': {
+    },
+    '&:hover': {
         backgroundColor: 'var(--pv-color-gray-3)',
         borderColor: 'var(--pv-color-gray-7)',
-    }, '&:disabled': {
+    },
+    '&:disabled': {
         cursor: 'not-allowed',
         backgroundColor: 'var(--pv-color-gray-1)',
         borderColor: 'var(--pv-color-gray-5)',
         color: 'var(--pv-color-gray-7)',
-    }, '&:not(:disabled)': {
+    },
+    '&:not(:disabled)': {
         '&[aria-invalid]': {
             backgroundColor: 'var(--pv-color-wrong-tint-5)',
             borderColor: 'var(--pv-color-wrong-tint-3)',
@@ -77,33 +86,49 @@ var TextFieldInput = (0, styled_1.default)(Typography_1.Typography)(function (pr
             backgroundColor: 'var(--pv-color-secondary-tint-5)',
             borderColor: 'var(--pv-color-secondary-tint-3)',
         },
-    } }, (props.size === 'small' && {
+    },
+}); };
+var stylesInputSizeSmall = function () { return (0, styles_1.css)({
+    label: 'small',
     height: 'var(--pv-size-base-6)',
-})), (props.size === 'medium' && {
+}); };
+var stylesInputSizeMedium = function () { return (0, styles_1.css)({
+    label: 'medium',
     height: 'var(--pv-size-base-7)',
-})), (props.size === 'large' && {
+}); };
+var stylesInputSizeLarge = function () { return (0, styles_1.css)({
+    label: 'large',
     height: 'var(--pv-size-base-8)',
-}))); });
-var TextFieldLabel = (0, styled_1.default)('label')({
+}); };
+var stylesLabel = function () { return (0, styles_1.css)({
     label: 'TextField-label',
     marginBottom: '2px',
     display: 'inline-block',
-});
-var TextFieldError = (0, styled_1.default)(Typography_1.Typography)({
+}); };
+var stylesError = function () { return (0, styles_1.css)({
+    label: 'TextField-error',
     marginTop: '2px',
-});
-/**
- *
- */
+}); };
 exports.TextField = React.forwardRef(function (props, ref) {
-    var size = props.size, label = props.label, _a = props.inputProps, inputProps = _a === void 0 ? {} : _a, disabled = props.disabled, defaultValue = props.defaultValue, id = props.id, value = props.value, placeholder = props.placeholder, required = props.required, name = props.name, inputRef = props.inputRef, error = props.error, errorText = props.errorText, autoFocus = props.autoFocus, readOnly = props.readOnly, _b = props.type, type = _b === void 0 ? 'text' : _b, onChange = props.onChange, other = __rest(props, ["size", "label", "inputProps", "disabled", "defaultValue", "id", "value", "placeholder", "required", "name", "inputRef", "error", "errorText", "autoFocus", "readOnly", "type", "onChange"]);
-    return (React.createElement("div", __assign({ ref: ref }, other),
-        label && (React.createElement(TextFieldLabel, { htmlFor: id },
+    var _a, _b, _c;
+    var size = props.size, className = props.className, label = props.label, _d = props.inputProps, inputProps = _d === void 0 ? {} : _d, disabled = props.disabled, defaultValue = props.defaultValue, id = props.id, value = props.value, placeholder = props.placeholder, required = props.required, name = props.name, inputRef = props.inputRef, error = props.error, errorText = props.errorText, autoFocus = props.autoFocus, readOnly = props.readOnly, _e = props.type, type = _e === void 0 ? 'text' : _e, onChange = props.onChange, other = __rest(props, ["size", "className", "label", "inputProps", "disabled", "defaultValue", "id", "value", "placeholder", "required", "name", "inputRef", "error", "errorText", "autoFocus", "readOnly", "type", "onChange"]);
+    return (React.createElement("div", __assign({}, other, { ref: ref, className: className }),
+        label && (React.createElement("label", { htmlFor: id, className: (0, styles_1.cx)((_a = {},
+                _a[stylesLabel()] = true,
+                _a)) },
             React.createElement(Typography_1.Typography, { component: "span", variant: "c2", color: "gray-10" }, label))),
-        React.createElement(TextFieldInput, __assign({}, inputProps, { 
-            // @ts-ignore
-            component: "input", color: "black", variant: size === 'small' ? 'c1' : 'b3', size: size, type: type, disabled: disabled, defaultValue: defaultValue, id: id, value: value, required: required, name: name, ref: inputRef, autoFocus: autoFocus, "aria-invalid": error || undefined, onChange: onChange, placeholder: placeholder, readOnly: readOnly })),
-        error && errorText && (React.createElement(TextFieldError, { variant: "c2", color: "wrong" }, errorText))));
+        React.createElement(Typography_1.Typography, __assign({}, inputProps, { component: "input", color: "black", variant: size === 'small' ? 'c1' : 'b3', type: type, disabled: disabled, defaultValue: defaultValue, id: id, value: value, required: required, name: name, ref: inputRef, 
+            // eslint-disable-next-line jsx-a11y/no-autofocus
+            autoFocus: autoFocus, className: (0, styles_1.cx)((_b = {},
+                _b[stylesInputBase()] = true,
+                _b[stylesInputSizeSmall()] = size === 'small',
+                _b[stylesInputSizeMedium()] = size === 'medium',
+                _b[stylesInputSizeLarge()] = size === 'large',
+                _b[inputProps.className] = !!inputProps.className,
+                _b)), "aria-invalid": error || undefined, onChange: onChange, placeholder: placeholder, readOnly: readOnly })),
+        error && errorText && (React.createElement(Typography_1.Typography, { variant: "c2", color: "wrong", className: (0, styles_1.cx)((_c = {},
+                _c[stylesError()] = true,
+                _c)) }, errorText))));
 });
 exports.TextField.displayName = 'TextField';
 exports.TextField.defaultProps = {

package/dist/cjs/TextField/text_field.js.map

@@ -1 +1 @@
-{"version":3,"file":"text_field.js","sourceRoot":"","sources":["../../../src/TextField/text_field.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"text_field.js","sourceRoot":"","sources":["../../../src/TextField/text_field.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/TextareaField/textarea_field.js

@@ -44,31 +44,42 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TextareaField = void 0;
 var React = __importStar(require("react"));
-var styled_1 = __importDefault(require("@emotion/styled"));
+var styles_1 = require("../styles");
 var Typography_1 = require("../Typography");
-/**
- *
- */
-/**
- * Styles.
- */
-var TextareaFieldInput = (0, styled_1.default)('textarea')(function (props) { return (__assign(__assign(__assign({ fontFamily: 'inherit', outline: 'none', boxSizing: 'border-box', width: '100%', borderRadius: '4px', padding: 'var(--pv-size-base) var(--pv-size-base-2)', color: 'var(--pv-color-black)', backgroundColor: 'var(--pv-color-gray-1)', borderStyle: 'solid', borderWidth: '1px', borderColor: 'var(--pv-color-gray-8)', transition: 'background-color 200ms, color 200ms, border-color 200ms', display: 'block', appearance: 'none', resize: 'none', fontWeight: 'var(--pv-text-c1-weight)', fontSize: 'var(--pv-text-c1-size)', lineHeight: 'var(--pv-text-c1-height)', letterSpacing: 'var(--pv-text-c1-spacing)', '&::placeholder': {
+var stylesInputBase = function () { return (0, styles_1.css)({
+    label: 'TextareaField',
+    fontFamily: 'inherit',
+    outline: 'none',
+    boxSizing: 'border-box',
+    width: '100%',
+    borderRadius: '4px',
+    padding: 'var(--pv-size-base) var(--pv-size-base-2)',
+    color: 'var(--pv-color-black)',
+    backgroundColor: 'var(--pv-color-gray-1)',
+    borderStyle: 'solid',
+    borderWidth: '1px',
+    borderColor: 'var(--pv-color-gray-8)',
+    transition: 'background-color 200ms, color 200ms, border-color 200ms',
+    display: 'block',
+    appearance: 'none',
+    resize: 'none',
+    '&::placeholder': {
         color: 'var(--pv-color-gray-9)',
-    }, '&:hover': {
+    },
+    '&:hover': {
         backgroundColor: 'var(--pv-color-gray-3)',
         borderColor: 'var(--pv-color-gray-7)',
-    }, '&:disabled': {
+    },
+    '&:disabled': {
         cursor: 'not-allowed',
         backgroundColor: 'var(--pv-color-gray-1)',
         borderColor: 'var(--pv-color-gray-5)',
         color: 'var(--pv-color-gray-7)',
-    }, '&:not(:disabled)': {
+    },
+    '&:not(:disabled)': {
         '&[aria-invalid]': {
             backgroundColor: 'var(--pv-color-wrong-tint-5)',
             borderColor: 'var(--pv-color-wrong-tint-3)',
@@ -77,30 +88,53 @@ var TextareaFieldInput = (0, styled_1.default)('textarea')(function (props) { re
             backgroundColor: 'var(--pv-color-secondary-tint-5)',
             borderColor: 'var(--pv-color-secondary-tint-3)',
         },
-    } }, (props.size === 'small' && {
+    },
+}, {
+    fontWeight: 'var(--pv-text-c1-weight)',
+    fontSize: 'var(--pv-text-c1-size)',
+    lineHeight: 'var(--pv-text-c1-height)',
+    letterSpacing: 'var(--pv-text-c1-spacing)',
+}); };
+var stylesInputSizeSmall = function () { return (0, styles_1.css)({
+    label: 'small',
     minHeight: 'var(--pv-size-base-12)',
-})), (props.size === 'medium' && {
+}); };
+var stylesInputSizeMedium = function () { return (0, styles_1.css)({
+    label: 'medium',
     minHeight: 'var(--pv-size-base-14)',
-})), (props.size === 'large' && {
+}); };
+var stylesInputSizeLarge = function () { return (0, styles_1.css)({
+    label: 'large',
     minHeight: 'var(--pv-size-base-16)',
-}))); });
-var TextareaFieldLabel = (0, styled_1.default)('label')({
+}); };
+var stylesLabel = function () { return (0, styles_1.css)({
+    label: 'TextareaField-label',
     marginBottom: '2px',
     display: 'inline-block',
-});
-var TextareaFieldError = (0, styled_1.default)(Typography_1.Typography)({
+}); };
+var stylesError = function () { return (0, styles_1.css)({
+    label: 'TextareaField-error',
     marginTop: '2px',
-});
-/**
- *
- */
+}); };
 exports.TextareaField = React.forwardRef(function (props, ref) {
-    var size = props.size, label = props.label, inputProps = props.inputProps, disabled = props.disabled, defaultValue = props.defaultValue, id = props.id, value = props.value, placeholder = props.placeholder, required = props.required, name = props.name, inputRef = props.inputRef, error = props.error, errorText = props.errorText, autoFocus = props.autoFocus, readOnly = props.readOnly, onChange = props.onChange, other = __rest(props, ["size", "label", "inputProps", "disabled", "defaultValue", "id", "value", "placeholder", "required", "name", "inputRef", "error", "errorText", "autoFocus", "readOnly", "onChange"]);
-    return (React.createElement("div", __assign({ ref: ref }, other),
-        label && (React.createElement(TextareaFieldLabel, { htmlFor: id },
+    var _a, _b, _c;
+    var size = props.size, className = props.className, label = props.label, onChange = props.onChange, inputProps = props.inputProps, disabled = props.disabled, defaultValue = props.defaultValue, id = props.id, value = props.value, placeholder = props.placeholder, required = props.required, name = props.name, inputRef = props.inputRef, error = props.error, errorText = props.errorText, autoFocus = props.autoFocus, readOnly = props.readOnly, other = __rest(props, ["size", "className", "label", "onChange", "inputProps", "disabled", "defaultValue", "id", "value", "placeholder", "required", "name", "inputRef", "error", "errorText", "autoFocus", "readOnly"]);
+    return (React.createElement("div", __assign({}, other, { ref: ref, className: className }),
+        label && (React.createElement("label", { htmlFor: id, className: (0, styles_1.cx)((_a = {},
+                _a[stylesLabel()] = true,
+                _a)) },
             React.createElement(Typography_1.Typography, { component: "span", variant: "c2", color: "gray-10" }, label))),
-        React.createElement(TextareaFieldInput, __assign({}, inputProps, { size: size, disabled: disabled, defaultValue: defaultValue, id: id, value: value, required: required, name: name, ref: inputRef, autoFocus: autoFocus, "aria-invalid": error || undefined, onChange: onChange, placeholder: placeholder, readOnly: readOnly })),
-        error && errorText && (React.createElement(TextareaFieldError, { variant: "c2", color: "wrong" }, errorText))));
+        React.createElement("textarea", __assign({}, inputProps, { disabled: disabled, defaultValue: defaultValue, id: id, value: value, required: required, name: name, ref: inputRef, 
+            // eslint-disable-next-line jsx-a11y/no-autofocus
+            autoFocus: autoFocus, className: (0, styles_1.cx)((_b = {},
+                _b[stylesInputBase()] = true,
+                _b[stylesInputSizeSmall()] = size === 'small',
+                _b[stylesInputSizeMedium()] = size === 'medium',
+                _b[stylesInputSizeLarge()] = size === 'large',
+                _b)), "aria-invalid": error || undefined, onChange: onChange, placeholder: placeholder, readOnly: readOnly })),
+        error && errorText && (React.createElement(Typography_1.Typography, { variant: "c2", color: "wrong", className: (0, styles_1.cx)((_c = {},
+                _c[stylesError()] = true,
+                _c)) }, errorText))));
 });
 exports.TextareaField.displayName = 'TextareaField';
 exports.TextareaField.defaultProps = {

package/dist/cjs/TextareaField/textarea_field.js.map

@@ -1 +1 @@
-{"version":3,"file":"textarea_field.js","sourceRoot":"","sources":["../../../src/TextareaField/textarea_field.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"textarea_field.js","sourceRoot":"","sources":["../../../src/TextareaField/textarea_field.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+B;AAC/B,oCAAoC;AACpC,4CAA2C;AA8E3C,IAAM,eAAe,GAAG,cAAM,OAAA,IAAA,YAAG,EAAC;IAChC,KAAK,EAAE,eAAe;IACtB,UAAU,EAAE,SAAS;IACrB,OAAO,EAAE,MAAM;IACf,SAAS,EAAE,YAAY;IACvB,KAAK,EAAE,MAAM;IACb,YAAY,EAAE,KAAK;IACnB,OAAO,EAAE,2CAA2C;IACpD,KAAK,EAAE,uBAAuB;IAC9B,eAAe,EAAE,wBAAwB;IACzC,WAAW,EAAE,OAAO;IACpB,WAAW,EAAE,KAAK;IAClB,WAAW,EAAE,wBAAwB;IACrC,UAAU,EAAE,yDAAyD;IACrE,OAAO,EAAE,OAAO;IAChB,UAAU,EAAE,MAAM;IAClB,MAAM,EAAE,MAAM;IACd,gBAAgB,EAAE;QAChB,KAAK,EAAE,wBAAwB;KAChC;IACD,SAAS,EAAE;QACT,eAAe,EAAE,wBAAwB;QACzC,WAAW,EAAE,wBAAwB;KACtC;IACD,YAAY,EAAE;QACZ,MAAM,EAAE,aAAa;QACrB,eAAe,EAAE,wBAAwB;QACzC,WAAW,EAAE,wBAAwB;QACrC,KAAK,EAAE,wBAAwB;KAChC;IACD,kBAAkB,EAAE;QAClB,iBAAiB,EAAE;YACjB,eAAe,EAAE,8BAA8B;YAC/C,WAAW,EAAE,8BAA8B;SAC5C;QACD,SAAS,EAAE;YACT,eAAe,EAAE,kCAAkC;YACnD,WAAW,EAAE,kCAAkC;SAChD;KACF;CACF,EAAE;IACD,UAAU,EAAE,0BAA0B;IACtC,QAAQ,EAAE,wBAAwB;IAClC,UAAU,EAAE,0BAA0B;IACtC,aAAa,EAAE,2BAA2B;CACpC,CAAC,EA7CqB,CA6CrB,CAAC;AAEV,IAAM,oBAAoB,GAAG,cAAM,OAAA,IAAA,YAAG,EAAC;IACrC,KAAK,EAAE,OAAO;IACd,SAAS,EAAE,wBAAwB;CACpC,CAAC,EAHiC,CAGjC,CAAC;AAEH,IAAM,qBAAqB,GAAG,cAAM,OAAA,IAAA,YAAG,EAAC;IACtC,KAAK,EAAE,QAAQ;IACf,SAAS,EAAE,wBAAwB;CACpC,CAAC,EAHkC,CAGlC,CAAC;AAEH,IAAM,oBAAoB,GAAG,cAAM,OAAA,IAAA,YAAG,EAAC;IACrC,KAAK,EAAE,OAAO;IACd,SAAS,EAAE,wBAAwB;CACpC,CAAC,EAHiC,CAGjC,CAAC;AAEH,IAAM,WAAW,GAAG,cAAM,OAAA,IAAA,YAAG,EAAC;IAC5B,KAAK,EAAE,qBAAqB;IAC5B,YAAY,EAAE,KAAK;IACnB,OAAO,EAAE,cAAc;CACxB,CAAC,EAJwB,CAIxB,CAAC;AAEH,IAAM,WAAW,GAAG,cAAM,OAAA,IAAA,YAAG,EAAC;IAC5B,KAAK,EAAE,qBAAqB;IAC5B,SAAS,EAAE,KAAK;CACjB,CAAC,EAHwB,CAGxB,CAAC;AAEU,QAAA,aAAa,GAAG,KAAK,CAAC,UAAU,CAAqC,UAAC,KAAK,EAAE,GAAG;;IAEzF,IAAA,IAAI,GAkBF,KAAK,KAlBH,EACJ,SAAS,GAiBP,KAAK,UAjBE,EACT,KAAK,GAgBH,KAAK,MAhBF,EACL,QAAQ,GAeN,KAAK,SAfC,EACR,UAAU,GAcR,KAAK,WAdG,EACV,QAAQ,GAaN,KAAK,SAbC,EACR,YAAY,GAYV,KAAK,aAZK,EACZ,EAAE,GAWA,KAAK,GAXL,EACF,KAAK,GAUH,KAAK,MAVF,EACL,WAAW,GAST,KAAK,YATI,EACX,QAAQ,GAQN,KAAK,SARC,EACR,IAAI,GAOF,KAAK,KAPH,EACJ,QAAQ,GAMN,KAAK,SANC,EACR,KAAK,GAKH,KAAK,MALF,EACL,SAAS,GAIP,KAAK,UAJE,EACT,SAAS,GAGP,KAAK,UAHE,EACT,QAAQ,GAEN,KAAK,SAFC,EACL,KAAK,UACN,KAAK,EAnBH,iMAmBL,CADS,CACA;IAEV,OAAO,CACL,wCACM,KAAK,IACT,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,SAAS;QAEnB,KAAK,IAAI,CACR,+BACE,OAAO,EAAE,EAAE,EACX,SAAS,EAAE,IAAA,WAAE;gBACX,GAAC,WAAW,EAAE,IAAG,IAAI;oBACrB;YAEF,oBAAC,uBAAU,IACT,SAAS,EAAC,MAAM,EAChB,OAAO,EAAC,IAAI,EACZ,KAAK,EAAC,SAAS,IAEd,KAAK,CACK,CACP,CACT;QACD,6CACM,UAAU,IACd,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAC1B,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,GAAG,EAAE,QAAQ;YACb,iDAAiD;YACjD,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE,IAAA,WAAE;gBACX,GAAC,eAAe,EAAE,IAAG,IAAI;gBACzB,GAAC,oBAAoB,EAAE,IAAG,IAAI,KAAK,OAAO;gBAC1C,GAAC,qBAAqB,EAAE,IAAG,IAAI,KAAK,QAAQ;gBAC5C,GAAC,oBAAoB,EAAE,IAAG,IAAI,KAAK,OAAO;oBAC1C,kBACY,KAAK,IAAI,SAAS,EAChC,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,IAClB;QACD,KAAK,IAAI,SAAS,IAAI,CACrB,oBAAC,uBAAU,IACT,OAAO,EAAC,IAAI,EACZ,KAAK,EAAC,OAAO,EACb,SAAS,EAAE,IAAA,WAAE;gBACX,GAAC,WAAW,EAAE,IAAG,IAAI;oBACrB,IAED,SAAS,CACC,CACd,CACG,CACP,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,qBAAa,CAAC,WAAW,GAAG,eAAe,CAAC;AAE5C,qBAAa,CAAC,YAAY,GAAG;IAC3B,QAAQ,EAAE,KAAK;IACf,IAAI,EAAE,QAAQ;CACf,CAAC"}

package/dist/cjs/Toast/toast.js

@@ -38,9 +38,6 @@ exports.Toast = void 0;
 var React = __importStar(require("react"));
 var Alert_1 = require("../Alert");
 var Fade_1 = require("../Fade");
-/**
- *
- */
 var Toast = function (props) {
     var id = props.id, duration = props.duration, isClosable = props.isClosable, alertProps = props.alertProps, children = props.children, onClose = props.onClose;
     var handleClose = function () {
@@ -53,7 +50,7 @@ var Toast = function (props) {
                 clearTimeout(timeout_1);
             };
         }
-        return undefined;
+        return null;
     });
     return (React.createElement(Fade_1.Fade, { in: true },
         React.createElement(Alert_1.Alert, __assign({}, alertProps, { onClose: isClosable ? handleClose : undefined }), children)));

package/dist/cjs/Toast/toast.js.map

@@ -1 +1 @@
-{"version":3,"file":"toast.js","sourceRoot":"","sources":["../../../src/Toast/toast.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+B;AAC/B,kCAA6C;AAC7C,gCAA+B;AA+B/B;;GAEG;AAEI,IAAM,KAAK,GAA4B,UAAC,KAAK;IAEhD,IAAA,EAAE,GAMA,KAAK,GANL,EACF,QAAQ,GAKN,KAAK,SALC,EACR,UAAU,GAIR,KAAK,WAJG,EACV,UAAU,GAGR,KAAK,WAHG,EACV,QAAQ,GAEN,KAAK,SAFC,EACR,OAAO,GACL,KAAK,QADA,CACC;IAEV,IAAM,WAAW,GAAG;QAClB,OAAO,CAAC,EAAE,CAAC,CAAC;IACd,CAAC,CAAC;IAEF,KAAK,CAAC,SAAS,CAAC;QACd,IAAI,QAAQ,GAAG,CAAC,EAAE;YAChB,IAAM,SAAO,GAAG,MAAM,CAAC,UAAU,CAC/B,WAAW,EACX,QAAQ,CACT,CAAC;YAEF,OAAO;gBACL,YAAY,CAAC,SAAO,CAAC,CAAC;YACxB,CAAC,CAAC;SACH;QAED,OAAO,SAAS,CAAC;IACnB,CAAC,CAAC,CAAC;IAEH,OAAO,CACL,oBAAC,WAAI,IAAC,EAAE;QACN,oBAAC,aAAK,eACA,UAAU,IACd,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,KAE5C,QAAQ,CACH,CACH,CACR,CAAC;AACJ,CAAC,CAAC;AAvCW,QAAA,KAAK,SAuChB;AAEF,aAAK,CAAC,WAAW,GAAG,OAAO,CAAC;AAE5B,aAAK,CAAC,YAAY,GAAG;IACnB,QAAQ,EAAE,IAAI;CACf,CAAC"}
+{"version":3,"file":"toast.js","sourceRoot":"","sources":["../../../src/Toast/toast.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+B;AAC/B,kCAA6C;AAC7C,gCAA+B;AA6BxB,IAAM,KAAK,GAAwB,UAAC,KAAK;IAE5C,IAAA,EAAE,GAMA,KAAK,GANL,EACF,QAAQ,GAKN,KAAK,SALC,EACR,UAAU,GAIR,KAAK,WAJG,EACV,UAAU,GAGR,KAAK,WAHG,EACV,QAAQ,GAEN,KAAK,SAFC,EACR,OAAO,GACL,KAAK,QADA,CACC;IAEV,IAAM,WAAW,GAAG;QAClB,OAAO,CAAC,EAAE,CAAC,CAAC;IACd,CAAC,CAAC;IAEF,KAAK,CAAC,SAAS,CAAC;QACd,IAAI,QAAQ,GAAG,CAAC,EAAE;YAChB,IAAM,SAAO,GAAG,MAAM,CAAC,UAAU,CAC/B,WAAW,EACX,QAAQ,CACT,CAAC;YAEF,OAAO;gBACL,YAAY,CAAC,SAAO,CAAC,CAAC;YACxB,CAAC,CAAC;SACH;QAED,OAAO,IAAI,CAAC;IACd,CAAC,CAAC,CAAC;IAEH,OAAO,CACL,oBAAC,WAAI,IAAC,EAAE;QACN,oBAAC,aAAK,eACA,UAAU,IACd,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,KAE5C,QAAQ,CACH,CACH,CACR,CAAC;AACJ,CAAC,CAAC;AAvCW,QAAA,KAAK,SAuChB;AAEF,aAAK,CAAC,WAAW,GAAG,OAAO,CAAC;AAE5B,aAAK,CAAC,YAAY,GAAG;IACnB,QAAQ,EAAE,IAAI;CACf,CAAC"}

package/dist/cjs/Toast/toast_container.js

@@ -44,20 +44,12 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ToastContainer = void 0;
 var React = __importStar(require("react"));
-var styled_1 = __importDefault(require("@emotion/styled"));
-/**
- *
- */
-/**
- * Styles.
- */
-var ToastContainerRoot = (0, styled_1.default)('div')({
+var styles_1 = require("../styles");
+var stylesBase = function () { return (0, styles_1.css)({
+    label: 'ToastContainer',
     position: 'fixed',
     bottom: 0,
     padding: '10px',
@@ -70,13 +62,14 @@ var ToastContainerRoot = (0, styled_1.default)('div')({
     '& > * + *': {
         marginTop: '10px',
     },
-});
-/**
- *
- */
+}); };
 var ToastContainer = function (props) {
-    var children = props.children, other = __rest(props, ["children"]);
-    return (React.createElement(ToastContainerRoot, __assign({}, other), children));
+    var _a;
+    var children = props.children, className = props.className, other = __rest(props, ["children", "className"]);
+    return (React.createElement("div", __assign({ className: (0, styles_1.cx)((_a = {},
+            _a[stylesBase()] = true,
+            _a[className] = !!className,
+            _a)) }, other), children));
 };
 exports.ToastContainer = ToastContainer;
 exports.ToastContainer.displayName = 'ToastContainer';

package/dist/cjs/Toast/toast_container.js.map

@@ -1 +1 @@
-{"version":3,"file":"toast_container.js","sourceRoot":"","sources":["../../../src/Toast/toast_container.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+B;AAC/B,2DAAqC;AAarC;;GAEG;AAEH;;GAEG;AACH,IAAM,kBAAkB,GAAG,IAAA,gBAAM,EAAC,KAAK,CAAC,CAAC;IACvC,QAAQ,EAAE,OAAO;IACjB,MAAM,EAAE,CAAC;IACT,OAAO,EAAE,MAAM;IACf,MAAM,EAAE,IAAI;IACZ,KAAK,EAAE,MAAM;IACb,QAAQ,EAAE,OAAO;IACjB,SAAS,EAAE,YAAY;IACvB,IAAI,EAAE,KAAK;IACX,SAAS,EAAE,kBAAkB;IAC7B,WAAW,EAAE;QACX,SAAS,EAAE,MAAM;KAClB;CACF,CAAC,CAAC;AACH;;GAEG;AAEI,IAAM,cAAc,GAAkC,UAAC,KAAK;IACzD,IAAA,QAAQ,GAAe,KAAK,SAApB,EAAK,KAAK,UAAK,KAAK,EAA9B,YAAsB,CAAF,CAAW;IAErC,OAAO,CACL,oBAAC,kBAAkB,eACb,KAAK,GAER,QAAQ,CACU,CACtB,CAAC;AACJ,CAAC,CAAC;AAVW,QAAA,cAAc,kBAUzB;AAEF,sBAAc,CAAC,WAAW,GAAG,gBAAgB,CAAC"}
+{"version":3,"file":"toast_container.js","sourceRoot":"","sources":["../../../src/Toast/toast_container.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+B;AAC/B,oCAAoC;AAWpC,IAAM,UAAU,GAAG,cAAM,OAAA,IAAA,YAAG,EAAC;IAC3B,KAAK,EAAE,gBAAgB;IACvB,QAAQ,EAAE,OAAO;IACjB,MAAM,EAAE,CAAC;IACT,OAAO,EAAE,MAAM;IACf,MAAM,EAAE,IAAI;IACZ,KAAK,EAAE,MAAM;IACb,QAAQ,EAAE,OAAO;IACjB,SAAS,EAAE,YAAY;IACvB,IAAI,EAAE,KAAK;IACX,SAAS,EAAE,kBAAkB;IAC7B,WAAW,EAAE;QACX,SAAS,EAAE,MAAM;KAClB;CACF,CAAC,EAduB,CAcvB,CAAC;AAEI,IAAM,cAAc,GAAkC,UAAC,KAAK;;IACzD,IAAA,QAAQ,GAA0B,KAAK,SAA/B,EAAE,SAAS,GAAe,KAAK,UAApB,EAAK,KAAK,UAAK,KAAK,EAAzC,yBAAiC,CAAF,CAAW;IAEhD,OAAO,CACL,sCACE,SAAS,EAAE,IAAA,WAAE;YACX,GAAC,UAAU,EAAE,IAAG,IAAI;YACpB,GAAC,SAAS,IAAG,CAAC,CAAC,SAAS;gBACxB,IACE,KAAK,GAER,QAAQ,CACL,CACP,CAAC;AACJ,CAAC,CAAC;AAdW,QAAA,cAAc,kBAczB;AAEF,sBAAc,CAAC,WAAW,GAAG,gBAAgB,CAAC"}

package/dist/cjs/Tooltip/tooltip.js

@@ -31,26 +31,25 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Tooltip = void 0;
 var react_1 = __importDefault(require("react"));
-var react_2 = require("@emotion/react");
-var styled_1 = __importDefault(require("@emotion/styled"));
-var is_prop_valid_1 = __importDefault(require("@emotion/is-prop-valid"));
 var Popper_1 = require("../Popper");
 var Box_1 = require("../Box");
 var hooks_1 = require("../hooks");
 var Typography_1 = require("../Typography");
+var styles_1 = require("../styles");
 /**
  *
  */
 /**
  * Styles.
  */
-var stylesKeyframeOpacity = (0, react_2.keyframes)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n"], ["\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n"])));
-var TooltipRoot = (0, styled_1.default)(Box_1.Box)(function (props) { return (__assign(__assign({ boxShadow: 'var(--pv-shadow-light-low)', maxWidth: '300px', wordWrap: 'break-word', fontSize: 0, animation: "".concat(stylesKeyframeOpacity, " 225ms"), position: 'relative' }, (props.size === 'small' && {
+var stylesKeyframeOpacity = (0, styles_1.keyframes)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n"], ["\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n"])));
+var stylesTooltip = function (props) { return (0, styles_1.css)(__assign(__assign({ label: 'Tooltip', boxShadow: 'var(--pv-shadow-light-low)', maxWidth: '300px', wordWrap: 'break-word', fontSize: 0, animation: "".concat(stylesKeyframeOpacity, " 225ms"), position: 'relative' }, (props.size === 'small' && {
     padding: '5px 8px',
 })), (props.size === 'large' && {
     padding: '8px 10px',
-}))); });
-var TooltipPopper = (0, styled_1.default)(Popper_1.Popper)(function (props) { return ({
+}))); };
+var stylesPopper = function (props) { return (0, styles_1.css)({
+    label: 'Popper',
     pointerEvents: props.interactive ? 'auto' : 'none',
     zIndex: 1500,
     '&[data-popper-placement^="bottom"]': {
@@ -77,10 +76,9 @@ var TooltipPopper = (0, styled_1.default)(Popper_1.Popper)(function (props) { re
             marginRight: '-4px',
         },
     },
-}); });
-var TooltipArrow = (0, styled_1.default)('span', {
-    shouldForwardProp: function (prop) { return (0, is_prop_valid_1.default)(prop) && prop !== 'color'; },
-})(function (props) { return ({
+}); };
+var stylesArrow = function (props) { return (0, styles_1.css)({
+    label: 'arrow',
     width: '8px',
     height: '8px',
     background: 'transparent',
@@ -96,12 +94,12 @@ var TooltipArrow = (0, styled_1.default)('span', {
         backgroundColor: 'currentColor',
         transform: 'rotate(45deg)',
     },
-}); });
+}); };
 /**
  *
  */
 var Tooltip = function (props) {
-    var openProp = props.open, children = props.children, title = props.title, placement = props.placement, disableFocusListener = props.disableFocusListener, disableHoverListener = props.disableHoverListener, disableTouchListener = props.disableTouchListener, interactive = props.interactive, size = props.size, color = props.color, disablePortal = props.disablePortal, enterDelay = props.enterDelay, leaveDelay = props.leaveDelay, arrow = props.arrow, offset = props.offset, other = __rest(props, ["open", "children", "title", "placement", "disableFocusListener", "disableHoverListener", "disableTouchListener", "interactive", "size", "color", "disablePortal", "enterDelay", "leaveDelay", "arrow", "offset"]);
+    var openProp = props.open, children = props.children, title = props.title, placement = props.placement, className = props.className, disableFocusListener = props.disableFocusListener, disableHoverListener = props.disableHoverListener, disableTouchListener = props.disableTouchListener, interactive = props.interactive, size = props.size, color = props.color, disablePortal = props.disablePortal, enterDelay = props.enterDelay, leaveDelay = props.leaveDelay, arrow = props.arrow, offset = props.offset, other = __rest(props, ["open", "children", "title", "placement", "className", "disableFocusListener", "disableHoverListener", "disableTouchListener", "interactive", "size", "color", "disablePortal", "enterDelay", "leaveDelay", "arrow", "offset"]);
     var _a = (0, hooks_1.useControllableState)({
         value: openProp,
         defaultValue: false,
@@ -155,7 +153,7 @@ var Tooltip = function (props) {
     }
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.cloneElement(children, childrenProps),
-        react_1.default.createElement(TooltipPopper, __assign({ anchorEl: nodeRef.current, open: title && open, placement: placement, disablePortal: disablePortal, modifiers: [
+        react_1.default.createElement(Popper_1.Popper, __assign({ anchorEl: nodeRef.current, open: title && open, placement: placement, className: stylesPopper(props), disablePortal: disablePortal, modifiers: [
                 {
                     name: 'arrow',
                     enabled: Boolean(arrowRef),
@@ -170,11 +168,17 @@ var Tooltip = function (props) {
                         offset: [0, offset],
                     },
                 },
-            ] }, popperProps), function (style) { return (react_1.default.createElement(TooltipRoot, __assign({ background: color === 'black' ? 'gray-10' : 'white', borderRadius: 4, size: size }, other),
-            react_1.default.createElement(Typography_1.Typography, { component: "span", variant: size === 'small' ? 'c2' : 'b3', color: color === 'black' ? 'white' : 'black' }, title),
-            arrow
-                ? (react_1.default.createElement(TooltipArrow, { "data-popper-arrow": true, ref: setArrowRef, style: style, color: color }))
-                : null)); })));
+            ] }, popperProps), function (style) {
+            var _a;
+            return (react_1.default.createElement(Box_1.Box, __assign({}, other, { background: color === 'black' ? 'gray-10' : 'white', borderRadius: 4, className: (0, styles_1.cx)((_a = {},
+                    _a[stylesTooltip(props)] = true,
+                    _a[className] = !!className,
+                    _a)) }),
+                react_1.default.createElement(Typography_1.Typography, { component: "span", variant: size === 'small' ? 'c2' : 'b3', color: color === 'black' ? 'white' : 'black' }, title),
+                arrow
+                    ? (react_1.default.createElement("span", { className: stylesArrow(props), "data-popper-arrow": true, ref: setArrowRef, style: style }))
+                    : null));
+        })));
 };
 exports.Tooltip = Tooltip;
 exports.Tooltip.displayName = 'Tooltip';

package/dist/cjs/Tooltip/tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.js","sourceRoot":"","sources":["../../../src/Tooltip/tooltip.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"tooltip.js","sourceRoot":"","sources":["../../../src/Tooltip/tooltip.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/Typography/typography.js

@@ -44,27 +44,37 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Typography = void 0;
 var React = __importStar(require("react"));
-var styled_1 = __importDefault(require("@emotion/styled"));
-var is_prop_valid_1 = __importDefault(require("@emotion/is-prop-valid"));
+var styles_1 = require("../styles");
 /**
  *
  */
 /**
  * Styles.
  */
-var TypographyRoot = (0, styled_1.default)('p', {
-    shouldForwardProp: function (prop) { return (0, is_prop_valid_1.default)(prop) && prop !== 'color'; },
-})(function (props) { return (__assign({ margin: 0, color: props.color === 'inherit' ? 'inherit' : "var(--pv-color-".concat(props.color, ")"), fontWeight: "var(--pv-text-".concat(props.variant, "-weight)"), fontSize: "var(--pv-text-".concat(props.variant, "-size)"), lineHeight: "var(--pv-text-".concat(props.variant, "-height)"), letterSpacing: "var(--pv-text-".concat(props.variant, "-spacing)") }, (props.noWrap && {
+var stylesBase = function () { return (0, styles_1.css)({
+    label: 'Typography',
+    margin: 0,
+}); };
+var stylesVariant = function (variant) { return (0, styles_1.css)({
+    label: variant,
+    fontWeight: "var(--pv-text-".concat(variant, "-weight)"),
+    fontSize: "var(--pv-text-".concat(variant, "-size)"),
+    lineHeight: "var(--pv-text-".concat(variant, "-height)"),
+    letterSpacing: "var(--pv-text-".concat(variant, "-spacing)"),
+}); };
+var stylesColor = function (color) { return (0, styles_1.css)({
+    label: color,
+    color: color === 'inherit' ? 'inherit' : "var(--pv-color-".concat(color, ")"),
+}); };
+var stylesNoWrap = function () { return (0, styles_1.css)({
+    label: 'noWrap',
     overflow: 'hidden',
     whiteSpace: 'nowrap',
     textOverflow: 'ellipsis',
-}))); });
+}); };
 /**
  *
  */
@@ -85,9 +95,16 @@ var variantMapping = {
     c2: 'p',
 };
 exports.Typography = React.forwardRef(function (props, ref) {
-    var variant = props.variant, component = props.component, other = __rest(props, ["variant", "component"]);
+    var _a;
+    var variant = props.variant, className = props.className, color = props.color, noWrap = props.noWrap, component = props.component, other = __rest(props, ["variant", "className", "color", "noWrap", "component"]);
     var Component = component || variantMapping[variant] || 'p';
-    return (React.createElement(TypographyRoot, __assign({ as: Component, ref: ref, variant: variant }, other)));
+    return (React.createElement(Component, __assign({}, other, { ref: ref, className: (0, styles_1.cx)((_a = {},
+            _a[stylesBase()] = true,
+            _a[stylesVariant(variant)] = !!variant,
+            _a[stylesColor(color)] = !!color,
+            _a[stylesNoWrap()] = noWrap,
+            _a[className] = !!className,
+            _a)) })));
 });
 exports.Typography.displayName = 'Typography';
 exports.Typography.defaultProps = {

package/dist/cjs/Typography/typography.js.map

@@ -1 +1 @@
-{"version":3,"file":"typography.js","sourceRoot":"","sources":["../../../src/Typography/typography.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+B;AAC/B,2DAAqC;AACrC,yEAAiD;AAyCjD;;GAEG;AAEH;;GAEG;AACH,IAAM,cAAc,GAAG,IAAA,gBAAM,EAAC,GAAG,EAAE;IACjC,iBAAiB,EAAE,UAAC,IAAI,IAAK,OAAA,IAAA,uBAAW,EAAC,IAAI,CAAC,IAAI,IAAI,KAAK,OAAO,EAArC,CAAqC;CACnE,CAAC,CAAqB,UAAC,KAAK,IAAK,OAAA,YAChC,MAAM,EAAE,CAAC,EACT,KAAK,EAAE,KAAK,CAAC,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,yBAAkB,KAAK,CAAC,KAAK,MAAG,EAC/E,UAAU,EAAE,wBAAiB,KAAK,CAAC,OAAO,aAAsB,EAChE,QAAQ,EAAE,wBAAiB,KAAK,CAAC,OAAO,WAAQ,EAChD,UAAU,EAAE,wBAAiB,KAAK,CAAC,OAAO,aAAU,EACpD,aAAa,EAAE,wBAAiB,KAAK,CAAC,OAAO,cAAW,IACrD,CAAC,KAAK,CAAC,MAAM,IAAI;IAClB,QAAQ,EAAE,QAAQ;IAClB,UAAU,EAAE,QAAQ;IACpB,YAAY,EAAE,UAAU;CACzB,CAAC,EACF,EAZgC,CAYhC,CAAC,CAAC;AACJ;;GAEG;AAEH,IAAM,cAAc,GAAmF;IACrG,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,GAAG;IACP,EAAE,EAAE,GAAG;IACP,EAAE,EAAE,GAAG;IACP,IAAI,EAAE,MAAM;IACZ,IAAI,EAAE,MAAM;IACZ,EAAE,EAAE,GAAG;IACP,EAAE,EAAE,GAAG;CACR,CAAC;AAEW,QAAA,UAAU,GAAG,KAAK,CAAC,UAAU,CAAuB,UAAC,KAAK,EAAE,GAAG;IAExE,IAAA,OAAO,GAGL,KAAK,QAHA,EACP,SAAS,GAEP,KAAK,UAFE,EACN,KAAK,UACN,KAAK,EAJH,wBAIL,CADS,CACA;IAEV,IAAM,SAAS,GAAG,SAAS,IAAI,cAAc,CAAC,OAAO,CAAC,IAAI,GAAG,CAAC;IAE9D,OAAO,CACL,oBAAC,cAAc,aACb,EAAE,EAAE,SAAS,EACb,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,OAAO,IACZ,KAAK,EACT,CACH,CAAC;AACJ,CAAC,CAA4C,CAAC;AAE9C,kBAAU,CAAC,WAAW,GAAG,YAAY,CAAC;AAEtC,kBAAU,CAAC,YAAY,GAAG;IACxB,OAAO,EAAE,IAAI;IACb,KAAK,EAAE,OAAO;CACf,CAAC"}
+{"version":3,"file":"typography.js","sourceRoot":"","sources":["../../../src/Typography/typography.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+B;AAE/B,oCAKmB;AAoCnB;;GAEG;AAEH;;GAEG;AACH,IAAM,UAAU,GAAG,cAAM,OAAA,IAAA,YAAG,EAAC;IAC3B,KAAK,EAAE,YAAY;IACnB,MAAM,EAAE,CAAC;CACV,CAAC,EAHuB,CAGvB,CAAC;AAEH,IAAM,aAAa,GAAG,UAAC,OAAmC,IAAK,OAAA,IAAA,YAAG,EAAC;IACjE,KAAK,EAAE,OAAO;IACd,UAAU,EAAE,wBAAiB,OAAO,aAAU;IAC9C,QAAQ,EAAE,wBAAiB,OAAO,WAAQ;IAC1C,UAAU,EAAE,wBAAiB,OAAO,aAAU;IAC9C,aAAa,EAAE,wBAAiB,OAAO,cAAW;CAC5C,CAAC,EANsD,CAMtD,CAAC;AAEV,IAAM,WAAW,GAAG,UAAC,KAA+B,IAAK,OAAA,IAAA,YAAG,EAAC;IAC3D,KAAK,EAAE,KAAK;IACZ,KAAK,EAAE,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,yBAAkB,KAAK,MAAG;CACpE,CAAC,EAHuD,CAGvD,CAAC;AAEH,IAAM,YAAY,GAAG,cAAM,OAAA,IAAA,YAAG,EAAC;IAC7B,KAAK,EAAE,QAAQ;IACf,QAAQ,EAAE,QAAQ;IAClB,UAAU,EAAE,QAAQ;IACpB,YAAY,EAAE,UAAU;CACzB,CAAC,EALyB,CAKzB,CAAC;AACH;;GAEG;AAEH,IAAM,cAAc,GAAmF;IACrG,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,GAAG;IACP,EAAE,EAAE,GAAG;IACP,EAAE,EAAE,GAAG;IACP,IAAI,EAAE,MAAM;IACZ,IAAI,EAAE,MAAM;IACZ,EAAE,EAAE,GAAG;IACP,EAAE,EAAE,GAAG;CACR,CAAC;AAEW,QAAA,UAAU,GAAG,KAAK,CAAC,UAAU,CAAuB,UAAC,KAAK,EAAE,GAAG;;IAExE,IAAA,OAAO,GAML,KAAK,QANA,EACP,SAAS,GAKP,KAAK,UALE,EACT,KAAK,GAIH,KAAK,MAJF,EACL,MAAM,GAGJ,KAAK,OAHD,EACN,SAAS,GAEP,KAAK,UAFE,EACN,KAAK,UACN,KAAK,EAPH,wDAOL,CADS,CACA;IAEV,IAAM,SAAS,GAAG,SAAS,IAAI,cAAc,CAAC,OAAO,CAAC,IAAI,GAAG,CAAC;IAE9D,OAAO,CACL,oBAAC,SAAS,eACJ,KAAK,IACT,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,WAAE;YACX,GAAC,UAAU,EAAE,IAAG,IAAI;YACpB,GAAC,aAAa,CAAC,OAAO,CAAC,IAAG,CAAC,CAAC,OAAO;YACnC,GAAC,WAAW,CAAC,KAAK,CAAC,IAAG,CAAC,CAAC,KAAK;YAC7B,GAAC,YAAY,EAAE,IAAG,MAAM;YACxB,GAAC,SAAS,IAAG,CAAC,CAAC,SAAS;gBACxB,IACF,CACH,CAAC;AACJ,CAAC,CAA4C,CAAC;AAE9C,kBAAU,CAAC,WAAW,GAAG,YAAY,CAAC;AAEtC,kBAAU,CAAC,YAAY,GAAG;IACxB,OAAO,EAAE,IAAI;IACb,KAAK,EAAE,OAAO;CACf,CAAC"}

package/dist/cjs/styles/colors/additional.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.additional = void 0;
+exports.additional = {
+    'extra-1': '#826FF6',
+    'extra-2': '#DC6CDF',
+};
+//# sourceMappingURL=additional.js.map

package/dist/cjs/styles/colors/additional.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"additional.js","sourceRoot":"","sources":["../../../../src/styles/colors/additional.ts"],"names":[],"mappings":";;;AAAa,QAAA,UAAU,GAAG;IACxB,SAAS,EAAE,SAAS;IACpB,SAAS,EAAE,SAAS;CACrB,CAAC"}