@openameba/spindle-ui 0.43.1 → 0.46.0

package/DropdownMenu/DropdownMenu.mjs

@@ -0,0 +1,82 @@
+import React, { useEffect, useCallback, useRef, useState } from 'react';
+export const BLOCK_NAME = 'spui-DropdownMenu';
+const FADE_IN_ANIMATION = 'spui-DropdownMenu-fade-in';
+const Caption = ({ children }) => {
+    return React.createElement("p", { className: `${BLOCK_NAME}-caption` }, children);
+};
+const Frame = ({ children }) => {
+    return React.createElement("div", { className: `${BLOCK_NAME}` }, children);
+};
+const List = ({ children, id, onClose, open, position = 'left', triggerRef, variant = 'text', }) => {
+    const CLOSE_KEY_LIST = ['Escape', 'Esc'];
+    const menuEl = useRef(null);
+    const [fadeOut, setFadeOut] = useState(false);
+    const onClickBody = useCallback((e) => {
+        if (!open)
+            return;
+        if (triggerRef.current && e.composedPath().includes(triggerRef.current))
+            return;
+        const menuEl = document.querySelector(`.${BLOCK_NAME}-menu`);
+        if (menuEl && e.composedPath().includes(menuEl))
+            return;
+        setFadeOut(true);
+    }, [open, setFadeOut, triggerRef]);
+    const onClickCloser = useCallback(() => {
+        setFadeOut(true);
+        triggerRef.current?.focus();
+    }, [setFadeOut, triggerRef]);
+    const handleKeyDown = useCallback((e) => {
+        if (CLOSE_KEY_LIST.includes(e.key)) {
+            onClickCloser();
+        }
+    }, [onClickCloser]);
+    const handleAnimationEnd = useCallback((event) => {
+        if (event.animationName === FADE_IN_ANIMATION)
+            return;
+        onClose();
+        setFadeOut(false);
+    }, [onClose, setFadeOut]);
+    useEffect(() => {
+        menuEl.current?.addEventListener('animationend', handleAnimationEnd, false);
+        return () => menuEl.current?.removeEventListener('animationend', handleAnimationEnd, false);
+    }, [menuEl, handleAnimationEnd]);
+    useEffect(() => {
+        window.addEventListener('click', onClickBody, false);
+        return () => {
+            window.removeEventListener('click', onClickBody, false);
+        };
+    }, [onClickBody]);
+    useEffect(() => {
+        window.addEventListener('keydown', handleKeyDown);
+        return () => {
+            window.removeEventListener('keydown', handleKeyDown);
+        };
+    }, [handleKeyDown]);
+    if (!open) {
+        return React.createElement(React.Fragment, null);
+    }
+    return (React.createElement("ul", { id: id, onClick: onClickCloser, className: [
+            `${BLOCK_NAME}-menu`,
+            `${BLOCK_NAME}-menu--${variant}`,
+            position === 'right' && `${BLOCK_NAME}-menu--right`,
+            fadeOut && 'is-fade-out',
+        ]
+            .filter(Boolean)
+            .join(' '), ref: menuEl, role: "menu" }, children));
+};
+const ListItem = ({ children, icon, onClick }) => {
+    return (React.createElement("li", { className: `${BLOCK_NAME}-menuItem`, role: "menuItem" },
+        React.createElement("button", { className: `${BLOCK_NAME}-menuButton`, onClick: onClick },
+            icon && React.createElement("div", { className: `${BLOCK_NAME}-iconContainer` }, icon),
+            React.createElement("div", { className: `${BLOCK_NAME}-textContainer` }, children))));
+};
+const Title = ({ children }) => {
+    return React.createElement("p", { className: `${BLOCK_NAME}-title` }, children);
+};
+export const DropdownMenu = {
+    Caption,
+    Frame,
+    List,
+    ListItem,
+    Title,
+};

package/DropdownMenu/index.d.ts

@@ -0,0 +1,2 @@
+export { DropdownMenu } from './DropdownMenu';
+//# sourceMappingURL=index.d.ts.map

package/DropdownMenu/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC"}

package/DropdownMenu/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DropdownMenu = void 0;
+var DropdownMenu_1 = require("./DropdownMenu");
+Object.defineProperty(exports, "DropdownMenu", { enumerable: true, get: function () { return DropdownMenu_1.DropdownMenu; } });
+//# sourceMappingURL=index.js.map

package/DropdownMenu/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/DropdownMenu/index.ts"],"names":[],"mappings":";;;AAAA,+CAA8C;AAArC,4GAAA,YAAY,OAAA"}

package/DropdownMenu/index.mjs

@@ -0,0 +1 @@
+export { DropdownMenu } from './DropdownMenu';

package/Form/Checkbox.js

@@ -12,7 +12,11 @@ var __assign = (this && this.__assign) || function () {
 };
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -45,13 +49,13 @@ exports.Checkbox = void 0;
 var react_1 = __importStar(require("react"));
 var Icon_1 = require("../Icon");
 var BLOCK_NAME = 'spui-Checkbox';
-exports.Checkbox = react_1.forwardRef(function Checkbox(_a, ref) {
+exports.Checkbox = (0, react_1.forwardRef)(function Checkbox(_a, ref) {
     var children = _a.children, rest = __rest(_a, ["children"]);
-    return (react_1.default.createElement("label", { className: BLOCK_NAME + "-label" },
-        react_1.default.createElement("input", __assign({ className: BLOCK_NAME + "-input", ref: ref, type: "checkbox" }, rest)),
-        react_1.default.createElement("span", { className: BLOCK_NAME + "-icon" },
+    return (react_1.default.createElement("label", { className: "".concat(BLOCK_NAME, "-label") },
+        react_1.default.createElement("input", __assign({ className: "".concat(BLOCK_NAME, "-input"), ref: ref, type: "checkbox" }, rest)),
+        react_1.default.createElement("span", { className: "".concat(BLOCK_NAME, "-icon") },
             react_1.default.createElement(Icon_1.CheckBold, { "aria-hidden": "true" })),
-        react_1.default.createElement("span", { className: BLOCK_NAME + "-outline" }),
-        children && react_1.default.createElement("span", { className: BLOCK_NAME + "-text" }, children)));
+        react_1.default.createElement("span", { className: "".concat(BLOCK_NAME, "-outline") }),
+        children && react_1.default.createElement("span", { className: "".concat(BLOCK_NAME, "-text") }, children)));
 });
 //# sourceMappingURL=Checkbox.js.map

package/Form/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../src/Form/Checkbox.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA0C;AAE1C,gCAAoC;AAOpC,IAAM,UAAU,GAAG,eAAe,CAAC;AAEtB,QAAA,QAAQ,GAAG,kBAAU,CAA0B,SAAS,QAAQ,CAC3E,EAA4B,EAC5B,GAAG;IADD,IAAA,QAAQ,cAAA,EAAK,IAAI,cAAnB,YAAqB,CAAF;IAGnB,OAAO,CACL,yCAAO,SAAS,EAAK,UAAU,WAAQ;QACrC,kDACE,SAAS,EAAK,UAAU,WAAQ,EAChC,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,UAAU,IACX,IAAI,EACR;QACF,wCAAM,SAAS,EAAK,UAAU,UAAO;YACnC,8BAAC,gBAAS,mBAAa,MAAM,GAAG,CAC3B;QACP,wCAAM,SAAS,EAAK,UAAU,aAAU,GAAS;QAChD,QAAQ,IAAI,wCAAM,SAAS,EAAK,UAAU,UAAO,IAAG,QAAQ,CAAQ,CAC/D,CACT,CAAC;AACJ,CAAC,CAAC,CAAC"}
+{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../src/Form/Checkbox.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA0C;AAE1C,gCAAoC;AAOpC,IAAM,UAAU,GAAG,eAAe,CAAC;AAEtB,QAAA,QAAQ,GAAG,IAAA,kBAAU,EAA0B,SAAS,QAAQ,CAC3E,EAA4B,EAC5B,GAAG;IADD,IAAA,QAAQ,cAAA,EAAK,IAAI,cAAnB,YAAqB,CAAF;IAGnB,OAAO,CACL,yCAAO,SAAS,EAAE,UAAG,UAAU,WAAQ;QACrC,kDACE,SAAS,EAAE,UAAG,UAAU,WAAQ,EAChC,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,UAAU,IACX,IAAI,EACR;QACF,wCAAM,SAAS,EAAE,UAAG,UAAU,UAAO;YACnC,8BAAC,gBAAS,mBAAa,MAAM,GAAG,CAC3B;QACP,wCAAM,SAAS,EAAE,UAAG,UAAU,aAAU,GAAS;QAChD,QAAQ,IAAI,wCAAM,SAAS,EAAE,UAAG,UAAU,UAAO,IAAG,QAAQ,CAAQ,CAC/D,CACT,CAAC;AACJ,CAAC,CAAC,CAAC"}

package/Form/Checkbox.mjs

@@ -3,7 +3,7 @@ import { CheckBold } from '../Icon';
 const BLOCK_NAME = 'spui-Checkbox';
 export const Checkbox = forwardRef(function Checkbox({ children, ...rest }, ref) {
     return (React.createElement("label", { className: `${BLOCK_NAME}-label` },
-        React.createElement("input", Object.assign({ className: `${BLOCK_NAME}-input`, ref: ref, type: "checkbox" }, rest)),
+        React.createElement("input", { className: `${BLOCK_NAME}-input`, ref: ref, type: "checkbox", ...rest }),
         React.createElement("span", { className: `${BLOCK_NAME}-icon` },
             React.createElement(CheckBold, { "aria-hidden": "true" })),
         React.createElement("span", { className: `${BLOCK_NAME}-outline` }),

package/Form/DropDown.js

@@ -12,7 +12,11 @@ var __assign = (this && this.__assign) || function () {
 };
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -40,20 +44,17 @@ 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.DropDown = void 0;
 var react_1 = __importStar(require("react"));
-var react_merge_refs_1 = __importDefault(require("react-merge-refs"));
+var react_merge_refs_1 = require("react-merge-refs");
 var Icon_1 = require("../Icon");
 var BLOCK_NAME = 'spui-DropDown';
-exports.DropDown = react_1.forwardRef(function DropDown(_a, ref) {
+exports.DropDown = (0, react_1.forwardRef)(function DropDown(_a, ref) {
     var children = _a.children, _b = _a.hasError, hasError = _b === void 0 ? false : _b, onChange = _a.onChange, rest = __rest(_a, ["children", "hasError", "onChange"]);
-    var selectEl = react_1.useRef(null);
-    var _c = react_1.useState(''), text = _c[0], setText = _c[1];
-    var _d = react_1.useState(false), disabled = _d[0], setDisabled = _d[1];
+    var selectEl = (0, react_1.useRef)(null);
+    var _c = (0, react_1.useState)(''), text = _c[0], setText = _c[1];
+    var _d = (0, react_1.useState)(false), disabled = _d[0], setDisabled = _d[1];
     var update = function () {
         if (selectEl && selectEl.current) {
             var selectedEl = selectEl.current.options[selectEl.current.selectedIndex];
@@ -70,18 +71,18 @@ exports.DropDown = react_1.forwardRef(function DropDown(_a, ref) {
         update();
     };
     // Update text once
-    react_1.useEffect(update, []);
+    (0, react_1.useEffect)(update, []);
     return (react_1.default.createElement("label", { className: [
-            BLOCK_NAME + "-label",
+            "".concat(BLOCK_NAME, "-label"),
             !disabled ? 'is-active' : '',
             hasError ? 'is-error' : '',
         ]
             .filter(Boolean)
             .join(' ') },
-        react_1.default.createElement("span", { className: BLOCK_NAME + "-visual" }, text),
-        react_1.default.createElement("span", { className: BLOCK_NAME + "-icon" },
+        react_1.default.createElement("span", { className: "".concat(BLOCK_NAME, "-visual") }, text),
+        react_1.default.createElement("span", { className: "".concat(BLOCK_NAME, "-icon") },
             react_1.default.createElement(Icon_1.ChevronDownBold, { "aria-hidden": "true" })),
-        react_1.default.createElement("select", __assign({ className: BLOCK_NAME + "-select", ref: react_merge_refs_1.default([selectEl, ref]), onChange: handleChange }, rest), children),
-        react_1.default.createElement("span", { className: BLOCK_NAME + "-outline" })));
+        react_1.default.createElement("select", __assign({ className: "".concat(BLOCK_NAME, "-select"), ref: (0, react_merge_refs_1.mergeRefs)([selectEl, ref]), onChange: handleChange }, rest), children),
+        react_1.default.createElement("span", { className: "".concat(BLOCK_NAME, "-outline") })));
 });
 //# sourceMappingURL=DropDown.js.map

package/Form/DropDown.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropDown.js","sourceRoot":"","sources":["../../src/Form/DropDown.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAAuE;AACvE,sEAAyC;AAEzC,gCAA0C;AAS1C,IAAM,UAAU,GAAG,eAAe,CAAC;AAEtB,QAAA,QAAQ,GAAG,kBAAU,CAA2B,SAAS,QAAQ,CAC5E,EAAwD,EACxD,GAAG;IADD,IAAA,QAAQ,cAAA,EAAE,gBAAgB,EAAhB,QAAQ,mBAAG,KAAK,KAAA,EAAE,QAAQ,cAAA,EAAK,IAAI,cAA/C,oCAAiD,CAAF;IAG/C,IAAM,QAAQ,GAAG,cAAM,CAAoB,IAAI,CAAC,CAAC;IAE3C,IAAA,KAAkB,gBAAQ,CAAC,EAAE,CAAC,EAA7B,IAAI,QAAA,EAAE,OAAO,QAAgB,CAAC;IAC/B,IAAA,KAA0B,gBAAQ,CAAC,KAAK,CAAC,EAAxC,QAAQ,QAAA,EAAE,WAAW,QAAmB,CAAC;IAEhD,IAAM,MAAM,GAAG;QACb,IAAI,QAAQ,IAAI,QAAQ,CAAC,OAAO,EAAE;YAChC,IAAM,UAAU,GACd,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;YAC3D,IAAM,KAAK,GAAG,UAAU,CAAC,IAAI,CAAC;YAC9B,IAAM,UAAQ,GAAG,UAAU,CAAC,QAAQ,CAAC;YACrC,OAAO,CAAC,KAAK,CAAC,CAAC;YACf,WAAW,CAAC,UAAQ,CAAC,CAAC;SACvB;IACH,CAAC,CAAC;IAEF,IAAM,YAAY,GAAG,UAAC,KAA2C;QAC/D,IAAI,OAAO,QAAQ,KAAK,UAAU,EAAE;YAClC,QAAQ,CAAC,KAAK,CAAC,CAAC;SACjB;QACD,MAAM,EAAE,CAAC;IACX,CAAC,CAAC;IAEF,mBAAmB;IACnB,iBAAS,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC;IAEtB,OAAO,CACL,yCACE,SAAS,EAAE;YACN,UAAU,WAAQ;YACrB,CAAC,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE;YAC5B,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE;SAC3B;aACE,MAAM,CAAC,OAAO,CAAC;aACf,IAAI,CAAC,GAAG,CAAC;QAEZ,wCAAM,SAAS,EAAK,UAAU,YAAS,IAAG,IAAI,CAAQ;QACtD,wCAAM,SAAS,EAAK,UAAU,UAAO;YACnC,8BAAC,sBAAe,mBAAa,MAAM,GAAG,CACjC;QACP,mDACE,SAAS,EAAK,UAAU,YAAS,EACjC,GAAG,EAAE,0BAAS,CAAC,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,EAC/B,QAAQ,EAAE,YAAY,IAClB,IAAI,GAEP,QAAQ,CACF;QACT,wCAAM,SAAS,EAAK,UAAU,aAAU,GAAS,CAC3C,CACT,CAAC;AACJ,CAAC,CAAC,CAAC"}
+{"version":3,"file":"DropDown.js","sourceRoot":"","sources":["../../src/Form/DropDown.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAAuE;AACvE,qDAA6C;AAE7C,gCAA0C;AAS1C,IAAM,UAAU,GAAG,eAAe,CAAC;AAEtB,QAAA,QAAQ,GAAG,IAAA,kBAAU,EAA2B,SAAS,QAAQ,CAC5E,EAAwD,EACxD,GAAG;IADD,IAAA,QAAQ,cAAA,EAAE,gBAAgB,EAAhB,QAAQ,mBAAG,KAAK,KAAA,EAAE,QAAQ,cAAA,EAAK,IAAI,cAA/C,oCAAiD,CAAF;IAG/C,IAAM,QAAQ,GAAG,IAAA,cAAM,EAAoB,IAAI,CAAC,CAAC;IAE3C,IAAA,KAAkB,IAAA,gBAAQ,EAAC,EAAE,CAAC,EAA7B,IAAI,QAAA,EAAE,OAAO,QAAgB,CAAC;IAC/B,IAAA,KAA0B,IAAA,gBAAQ,EAAC,KAAK,CAAC,EAAxC,QAAQ,QAAA,EAAE,WAAW,QAAmB,CAAC;IAEhD,IAAM,MAAM,GAAG;QACb,IAAI,QAAQ,IAAI,QAAQ,CAAC,OAAO,EAAE;YAChC,IAAM,UAAU,GACd,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;YAC3D,IAAM,KAAK,GAAG,UAAU,CAAC,IAAI,CAAC;YAC9B,IAAM,UAAQ,GAAG,UAAU,CAAC,QAAQ,CAAC;YACrC,OAAO,CAAC,KAAK,CAAC,CAAC;YACf,WAAW,CAAC,UAAQ,CAAC,CAAC;SACvB;IACH,CAAC,CAAC;IAEF,IAAM,YAAY,GAAG,UAAC,KAA2C;QAC/D,IAAI,OAAO,QAAQ,KAAK,UAAU,EAAE;YAClC,QAAQ,CAAC,KAAK,CAAC,CAAC;SACjB;QACD,MAAM,EAAE,CAAC;IACX,CAAC,CAAC;IAEF,mBAAmB;IACnB,IAAA,iBAAS,EAAC,MAAM,EAAE,EAAE,CAAC,CAAC;IAEtB,OAAO,CACL,yCACE,SAAS,EAAE;YACT,UAAG,UAAU,WAAQ;YACrB,CAAC,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE;YAC5B,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE;SAC3B;aACE,MAAM,CAAC,OAAO,CAAC;aACf,IAAI,CAAC,GAAG,CAAC;QAEZ,wCAAM,SAAS,EAAE,UAAG,UAAU,YAAS,IAAG,IAAI,CAAQ;QACtD,wCAAM,SAAS,EAAE,UAAG,UAAU,UAAO;YACnC,8BAAC,sBAAe,mBAAa,MAAM,GAAG,CACjC;QACP,mDACE,SAAS,EAAE,UAAG,UAAU,YAAS,EACjC,GAAG,EAAE,IAAA,4BAAS,EAAC,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,EAC/B,QAAQ,EAAE,YAAY,IAClB,IAAI,GAEP,QAAQ,CACF;QACT,wCAAM,SAAS,EAAE,UAAG,UAAU,aAAU,GAAS,CAC3C,CACT,CAAC;AACJ,CAAC,CAAC,CAAC"}

package/Form/DropDown.mjs

@@ -1,5 +1,5 @@
 import React, { forwardRef, useEffect, useRef, useState } from 'react';
-import mergeRefs from 'react-merge-refs';
+import { mergeRefs } from 'react-merge-refs';
 import { ChevronDownBold } from '../Icon';
 const BLOCK_NAME = 'spui-DropDown';
 export const DropDown = forwardRef(function DropDown({ children, hasError = false, onChange, ...rest }, ref) {
@@ -33,6 +33,6 @@ export const DropDown = forwardRef(function DropDown({ children, hasError = fals
         React.createElement("span", { className: `${BLOCK_NAME}-visual` }, text),
         React.createElement("span", { className: `${BLOCK_NAME}-icon` },
             React.createElement(ChevronDownBold, { "aria-hidden": "true" })),
-        React.createElement("select", Object.assign({ className: `${BLOCK_NAME}-select`, ref: mergeRefs([selectEl, ref]), onChange: handleChange }, rest), children),
+        React.createElement("select", { className: `${BLOCK_NAME}-select`, ref: mergeRefs([selectEl, ref]), onChange: handleChange, ...rest }, children),
         React.createElement("span", { className: `${BLOCK_NAME}-outline` })));
 });

package/Form/InlineDropDown.js

@@ -12,7 +12,11 @@ var __assign = (this && this.__assign) || function () {
 };
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -40,19 +44,16 @@ 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.InlineDropDown = void 0;
 var react_1 = __importStar(require("react"));
-var react_merge_refs_1 = __importDefault(require("react-merge-refs"));
+var react_merge_refs_1 = require("react-merge-refs");
 var Icon_1 = require("../Icon");
 var BLOCK_NAME = 'spui-InlineDropDown';
-exports.InlineDropDown = react_1.forwardRef(function InlineDropDown(_a, ref) {
+exports.InlineDropDown = (0, react_1.forwardRef)(function InlineDropDown(_a, ref) {
     var children = _a.children, _b = _a.visualSize, visualSize = _b === void 0 ? 'medium' : _b, onChange = _a.onChange, rest = __rest(_a, ["children", "visualSize", "onChange"]);
-    var selectEl = react_1.useRef(null);
-    var _c = react_1.useState(''), text = _c[0], setText = _c[1];
+    var selectEl = (0, react_1.useRef)(null);
+    var _c = (0, react_1.useState)(''), text = _c[0], setText = _c[1];
     var update = function () {
         if (selectEl && selectEl.current) {
             var selectedEl = selectEl.current.options[selectEl.current.selectedIndex];
@@ -67,13 +68,13 @@ exports.InlineDropDown = react_1.forwardRef(function InlineDropDown(_a, ref) {
         update();
     };
     // Update text once
-    react_1.useEffect(update, []);
-    return (react_1.default.createElement("label", { className: [BLOCK_NAME + "-label"].filter(Boolean).join(' ') },
-        react_1.default.createElement("span", { className: BLOCK_NAME + "-visual" },
-            react_1.default.createElement("span", { className: BLOCK_NAME + "-text " + BLOCK_NAME + "-text--" + visualSize }, text),
-            react_1.default.createElement("span", { className: BLOCK_NAME + "-icon " + BLOCK_NAME + "-icon--" + visualSize },
+    (0, react_1.useEffect)(update, []);
+    return (react_1.default.createElement("label", { className: ["".concat(BLOCK_NAME, "-label")].filter(Boolean).join(' ') },
+        react_1.default.createElement("span", { className: "".concat(BLOCK_NAME, "-visual") },
+            react_1.default.createElement("span", { className: "".concat(BLOCK_NAME, "-text ").concat(BLOCK_NAME, "-text--").concat(visualSize) }, text),
+            react_1.default.createElement("span", { className: "".concat(BLOCK_NAME, "-icon ").concat(BLOCK_NAME, "-icon--").concat(visualSize) },
                 react_1.default.createElement(Icon_1.ChevronDownBold, { "aria-hidden": "true" }))),
-        react_1.default.createElement("select", __assign({ className: BLOCK_NAME + "-select " + BLOCK_NAME + "-select--" + visualSize, ref: react_merge_refs_1.default([selectEl, ref]), onChange: handleChange }, rest), children),
-        react_1.default.createElement("span", { className: BLOCK_NAME + "-outline" })));
+        react_1.default.createElement("select", __assign({ className: "".concat(BLOCK_NAME, "-select ").concat(BLOCK_NAME, "-select--").concat(visualSize), ref: (0, react_merge_refs_1.mergeRefs)([selectEl, ref]), onChange: handleChange }, rest), children),
+        react_1.default.createElement("span", { className: "".concat(BLOCK_NAME, "-outline") })));
 });
 //# sourceMappingURL=InlineDropDown.js.map

package/Form/InlineDropDown.js.map

@@ -1 +1 @@
-{"version":3,"file":"InlineDropDown.js","sourceRoot":"","sources":["../../src/Form/InlineDropDown.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAAuE;AACvE,sEAAyC;AAEzC,gCAA0C;AAW1C,IAAM,UAAU,GAAG,qBAAqB,CAAC;AAE5B,QAAA,cAAc,GAAG,kBAAU,CACtC,SAAS,cAAc,CACrB,EAA6D,EAC7D,GAAG;IADD,IAAA,QAAQ,cAAA,EAAE,kBAAqB,EAArB,UAAU,mBAAG,QAAQ,KAAA,EAAE,QAAQ,cAAA,EAAK,IAAI,cAApD,sCAAsD,CAAF;IAGpD,IAAM,QAAQ,GAAG,cAAM,CAAoB,IAAI,CAAC,CAAC;IAE3C,IAAA,KAAkB,gBAAQ,CAAC,EAAE,CAAC,EAA7B,IAAI,QAAA,EAAE,OAAO,QAAgB,CAAC;IAErC,IAAM,MAAM,GAAG;QACb,IAAI,QAAQ,IAAI,QAAQ,CAAC,OAAO,EAAE;YAChC,IAAM,UAAU,GACd,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;YAC3D,IAAM,KAAK,GAAG,UAAU,CAAC,IAAI,CAAC;YAC9B,OAAO,CAAC,KAAK,CAAC,CAAC;SAChB;IACH,CAAC,CAAC;IAEF,IAAM,YAAY,GAAG,UAAC,KAA2C;QAC/D,IAAI,OAAO,QAAQ,KAAK,UAAU,EAAE;YAClC,QAAQ,CAAC,KAAK,CAAC,CAAC;SACjB;QACD,MAAM,EAAE,CAAC;IACX,CAAC,CAAC;IAEF,mBAAmB;IACnB,iBAAS,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC;IAEtB,OAAO,CACL,yCAAO,SAAS,EAAE,CAAI,UAAU,WAAQ,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC;QACjE,wCAAM,SAAS,EAAK,UAAU,YAAS;YACrC,wCACE,SAAS,EAAK,UAAU,cAAS,UAAU,eAAU,UAAY,IAEhE,IAAI,CACA;YACP,wCACE,SAAS,EAAK,UAAU,cAAS,UAAU,eAAU,UAAY;gBAEjE,8BAAC,sBAAe,mBAAa,MAAM,GAAG,CACjC,CACF;QACP,mDACE,SAAS,EAAK,UAAU,gBAAW,UAAU,iBAAY,UAAY,EACrE,GAAG,EAAE,0BAAS,CAAC,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,EAC/B,QAAQ,EAAE,YAAY,IAClB,IAAI,GAEP,QAAQ,CACF;QACT,wCAAM,SAAS,EAAK,UAAU,aAAU,GAAS,CAC3C,CACT,CAAC;AACJ,CAAC,CACF,CAAC"}
+{"version":3,"file":"InlineDropDown.js","sourceRoot":"","sources":["../../src/Form/InlineDropDown.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAAuE;AACvE,qDAA6C;AAE7C,gCAA0C;AAW1C,IAAM,UAAU,GAAG,qBAAqB,CAAC;AAE5B,QAAA,cAAc,GAAG,IAAA,kBAAU,EACtC,SAAS,cAAc,CACrB,EAA6D,EAC7D,GAAG;IADD,IAAA,QAAQ,cAAA,EAAE,kBAAqB,EAArB,UAAU,mBAAG,QAAQ,KAAA,EAAE,QAAQ,cAAA,EAAK,IAAI,cAApD,sCAAsD,CAAF;IAGpD,IAAM,QAAQ,GAAG,IAAA,cAAM,EAAoB,IAAI,CAAC,CAAC;IAE3C,IAAA,KAAkB,IAAA,gBAAQ,EAAC,EAAE,CAAC,EAA7B,IAAI,QAAA,EAAE,OAAO,QAAgB,CAAC;IAErC,IAAM,MAAM,GAAG;QACb,IAAI,QAAQ,IAAI,QAAQ,CAAC,OAAO,EAAE;YAChC,IAAM,UAAU,GACd,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;YAC3D,IAAM,KAAK,GAAG,UAAU,CAAC,IAAI,CAAC;YAC9B,OAAO,CAAC,KAAK,CAAC,CAAC;SAChB;IACH,CAAC,CAAC;IAEF,IAAM,YAAY,GAAG,UAAC,KAA2C;QAC/D,IAAI,OAAO,QAAQ,KAAK,UAAU,EAAE;YAClC,QAAQ,CAAC,KAAK,CAAC,CAAC;SACjB;QACD,MAAM,EAAE,CAAC;IACX,CAAC,CAAC;IAEF,mBAAmB;IACnB,IAAA,iBAAS,EAAC,MAAM,EAAE,EAAE,CAAC,CAAC;IAEtB,OAAO,CACL,yCAAO,SAAS,EAAE,CAAC,UAAG,UAAU,WAAQ,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC;QACjE,wCAAM,SAAS,EAAE,UAAG,UAAU,YAAS;YACrC,wCACE,SAAS,EAAE,UAAG,UAAU,mBAAS,UAAU,oBAAU,UAAU,CAAE,IAEhE,IAAI,CACA;YACP,wCACE,SAAS,EAAE,UAAG,UAAU,mBAAS,UAAU,oBAAU,UAAU,CAAE;gBAEjE,8BAAC,sBAAe,mBAAa,MAAM,GAAG,CACjC,CACF;QACP,mDACE,SAAS,EAAE,UAAG,UAAU,qBAAW,UAAU,sBAAY,UAAU,CAAE,EACrE,GAAG,EAAE,IAAA,4BAAS,EAAC,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,EAC/B,QAAQ,EAAE,YAAY,IAClB,IAAI,GAEP,QAAQ,CACF;QACT,wCAAM,SAAS,EAAE,UAAG,UAAU,aAAU,GAAS,CAC3C,CACT,CAAC;AACJ,CAAC,CACF,CAAC"}

package/Form/InlineDropDown.mjs

@@ -1,5 +1,5 @@
 import React, { forwardRef, useEffect, useRef, useState } from 'react';
-import mergeRefs from 'react-merge-refs';
+import { mergeRefs } from 'react-merge-refs';
 import { ChevronDownBold } from '../Icon';
 const BLOCK_NAME = 'spui-InlineDropDown';
 export const InlineDropDown = forwardRef(function InlineDropDown({ children, visualSize = 'medium', onChange, ...rest }, ref) {
@@ -25,6 +25,6 @@ export const InlineDropDown = forwardRef(function InlineDropDown({ children, vis
             React.createElement("span", { className: `${BLOCK_NAME}-text ${BLOCK_NAME}-text--${visualSize}` }, text),
             React.createElement("span", { className: `${BLOCK_NAME}-icon ${BLOCK_NAME}-icon--${visualSize}` },
                 React.createElement(ChevronDownBold, { "aria-hidden": "true" }))),
-        React.createElement("select", Object.assign({ className: `${BLOCK_NAME}-select ${BLOCK_NAME}-select--${visualSize}`, ref: mergeRefs([selectEl, ref]), onChange: handleChange }, rest), children),
+        React.createElement("select", { className: `${BLOCK_NAME}-select ${BLOCK_NAME}-select--${visualSize}`, ref: mergeRefs([selectEl, ref]), onChange: handleChange, ...rest }, children),
         React.createElement("span", { className: `${BLOCK_NAME}-outline` })));
 });

package/Form/InputLabel.js

@@ -28,8 +28,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.InputLabel = void 0;
 var react_1 = __importDefault(require("react"));
 var BLOCK_NAME = 'spui-InputLabel';
-exports.InputLabel = function (_a) {
+var InputLabel = function (_a) {
     var children = _a.children, _b = _a.id, id = _b === void 0 ? '' : _b, rest = __rest(_a, ["children", "id"]);
     return (react_1.default.createElement("label", __assign({ className: BLOCK_NAME, htmlFor: id }, rest), children));
 };
+exports.InputLabel = InputLabel;
 //# sourceMappingURL=InputLabel.js.map

package/Form/InputLabel.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputLabel.js","sourceRoot":"","sources":["../../src/Form/InputLabel.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,gDAA0B;AAQ1B,IAAM,UAAU,GAAG,iBAAiB,CAAC;AAExB,QAAA,UAAU,GAAoB,UAAC,EAIpC;IAHN,IAAA,QAAQ,cAAA,EACR,UAAO,EAAP,EAAE,mBAAG,EAAE,KAAA,EACJ,IAAI,cAHmC,kBAI3C,CADQ;IAEP,OAAO,CACL,kDAAO,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,EAAE,IAAM,IAAI,GAChD,QAAQ,CACH,CACT,CAAC;AACJ,CAAC,CAAC"}
+{"version":3,"file":"InputLabel.js","sourceRoot":"","sources":["../../src/Form/InputLabel.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,gDAA0B;AAQ1B,IAAM,UAAU,GAAG,iBAAiB,CAAC;AAE9B,IAAM,UAAU,GAAoB,UAAC,EAIpC;IAHN,IAAA,QAAQ,cAAA,EACR,UAAO,EAAP,EAAE,mBAAG,EAAE,KAAA,EACJ,IAAI,cAHmC,kBAI3C,CADQ;IAEP,OAAO,CACL,kDAAO,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,EAAE,IAAM,IAAI,GAChD,QAAQ,CACH,CACT,CAAC;AACJ,CAAC,CAAC;AAVW,QAAA,UAAU,cAUrB"}

package/Form/InputLabel.mjs

@@ -1,5 +1,5 @@
 import React from 'react';
 const BLOCK_NAME = 'spui-InputLabel';
 export const InputLabel = ({ children, id = '', ...rest }) => {
-    return (React.createElement("label", Object.assign({ className: BLOCK_NAME, htmlFor: id }, rest), children));
+    return (React.createElement("label", { className: BLOCK_NAME, htmlFor: id, ...rest }, children));
 };

package/Form/InvalidMessage.js

@@ -29,11 +29,12 @@ exports.InvalidMessage = void 0;
 var react_1 = __importDefault(require("react"));
 var Icon_1 = require("../Icon");
 var BLOCK_NAME = 'spui-InvalidMessage';
-exports.InvalidMessage = function (_a) {
+var InvalidMessage = function (_a) {
     var children = _a.children, _b = _a.visible, visible = _b === void 0 ? false : _b, rest = __rest(_a, ["children", "visible"]);
     return (react_1.default.createElement("p", __assign({ className: BLOCK_NAME, hidden: !visible }, rest),
-        react_1.default.createElement("span", { className: BLOCK_NAME + "-icon" },
+        react_1.default.createElement("span", { className: "".concat(BLOCK_NAME, "-icon") },
             react_1.default.createElement(Icon_1.ExclamationmarkCircleFill, { "aria-hidden": "true" })),
-        react_1.default.createElement("span", { className: BLOCK_NAME + "-body" }, children)));
+        react_1.default.createElement("span", { className: "".concat(BLOCK_NAME, "-body") }, children)));
 };
+exports.InvalidMessage = InvalidMessage;
 //# sourceMappingURL=InvalidMessage.js.map

package/Form/InvalidMessage.js.map

@@ -1 +1 @@
-{"version":3,"file":"InvalidMessage.js","sourceRoot":"","sources":["../../src/Form/InvalidMessage.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,gDAA0B;AAE1B,gCAAoD;AAQpD,IAAM,UAAU,GAAG,qBAAqB,CAAC;AAE5B,QAAA,cAAc,GAAoB,UAAC,EAIxC;IAHN,IAAA,QAAQ,cAAA,EACR,eAAe,EAAf,OAAO,mBAAG,KAAK,KAAA,EACZ,IAAI,cAHuC,uBAI/C,CADQ;IAEP,OAAO,CACL,8CAAG,SAAS,EAAE,UAAU,EAAE,MAAM,EAAE,CAAC,OAAO,IAAM,IAAI;QAClD,wCAAM,SAAS,EAAK,UAAU,UAAO;YACnC,8BAAC,gCAAyB,mBAAa,MAAM,GAAG,CAC3C;QACP,wCAAM,SAAS,EAAK,UAAU,UAAO,IAAG,QAAQ,CAAQ,CACtD,CACL,CAAC;AACJ,CAAC,CAAC"}
+{"version":3,"file":"InvalidMessage.js","sourceRoot":"","sources":["../../src/Form/InvalidMessage.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,gDAA0B;AAE1B,gCAAoD;AAQpD,IAAM,UAAU,GAAG,qBAAqB,CAAC;AAElC,IAAM,cAAc,GAAoB,UAAC,EAIxC;IAHN,IAAA,QAAQ,cAAA,EACR,eAAe,EAAf,OAAO,mBAAG,KAAK,KAAA,EACZ,IAAI,cAHuC,uBAI/C,CADQ;IAEP,OAAO,CACL,8CAAG,SAAS,EAAE,UAAU,EAAE,MAAM,EAAE,CAAC,OAAO,IAAM,IAAI;QAClD,wCAAM,SAAS,EAAE,UAAG,UAAU,UAAO;YACnC,8BAAC,gCAAyB,mBAAa,MAAM,GAAG,CAC3C;QACP,wCAAM,SAAS,EAAE,UAAG,UAAU,UAAO,IAAG,QAAQ,CAAQ,CACtD,CACL,CAAC;AACJ,CAAC,CAAC;AAbW,QAAA,cAAc,kBAazB"}

package/Form/InvalidMessage.mjs

@@ -2,7 +2,7 @@ import React from 'react';
 import { ExclamationmarkCircleFill } from '../Icon';
 const BLOCK_NAME = 'spui-InvalidMessage';
 export const InvalidMessage = ({ children, visible = false, ...rest }) => {
-    return (React.createElement("p", Object.assign({ className: BLOCK_NAME, hidden: !visible }, rest),
+    return (React.createElement("p", { className: BLOCK_NAME, hidden: !visible, ...rest },
         React.createElement("span", { className: `${BLOCK_NAME}-icon` },
             React.createElement(ExclamationmarkCircleFill, { "aria-hidden": "true" })),
         React.createElement("span", { className: `${BLOCK_NAME}-body` }, children)));

package/Form/Radio.js

@@ -12,7 +12,11 @@ var __assign = (this && this.__assign) || function () {
 };
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -45,13 +49,13 @@ exports.Radio = void 0;
 var react_1 = __importStar(require("react"));
 var Icon_1 = require("../Icon");
 var BLOCK_NAME = 'spui-Radio';
-exports.Radio = react_1.forwardRef(function Radio(_a, ref) {
+exports.Radio = (0, react_1.forwardRef)(function Radio(_a, ref) {
     var children = _a.children, _b = _a.id, id = _b === void 0 ? '' : _b, rest = __rest(_a, ["children", "id"]);
-    return (react_1.default.createElement("label", { className: BLOCK_NAME + "-label", htmlFor: id },
-        react_1.default.createElement("input", __assign({ className: BLOCK_NAME + "-input", id: id, ref: ref, type: "radio" }, rest)),
-        react_1.default.createElement("span", { className: BLOCK_NAME + "-icon" },
+    return (react_1.default.createElement("label", { className: "".concat(BLOCK_NAME, "-label"), htmlFor: id },
+        react_1.default.createElement("input", __assign({ className: "".concat(BLOCK_NAME, "-input"), id: id, ref: ref, type: "radio" }, rest)),
+        react_1.default.createElement("span", { className: "".concat(BLOCK_NAME, "-icon") },
             react_1.default.createElement(Icon_1.CheckBold, { "aria-hidden": "true" })),
-        react_1.default.createElement("span", { className: BLOCK_NAME + "-outline" }),
-        children && react_1.default.createElement("span", { className: BLOCK_NAME + "-text" }, children)));
+        react_1.default.createElement("span", { className: "".concat(BLOCK_NAME, "-outline") }),
+        children && react_1.default.createElement("span", { className: "".concat(BLOCK_NAME, "-text") }, children)));
 });
 //# sourceMappingURL=Radio.js.map

package/Form/Radio.js.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.js","sourceRoot":"","sources":["../../src/Form/Radio.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA0C;AAE1C,gCAAoC;AAQpC,IAAM,UAAU,GAAG,YAAY,CAAC;AAEnB,QAAA,KAAK,GAAG,kBAAU,CAA0B,SAAS,KAAK,CACrE,EAAqC,EACrC,GAAG;IADD,IAAA,QAAQ,cAAA,EAAE,UAAO,EAAP,EAAE,mBAAG,EAAE,KAAA,EAAK,IAAI,cAA5B,kBAA8B,CAAF;IAG5B,OAAO,CACL,yCAAO,SAAS,EAAK,UAAU,WAAQ,EAAE,OAAO,EAAE,EAAE;QAClD,kDACE,SAAS,EAAK,UAAU,WAAQ,EAChC,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,OAAO,IACR,IAAI,EACR;QACF,wCAAM,SAAS,EAAK,UAAU,UAAO;YACnC,8BAAC,gBAAS,mBAAa,MAAM,GAAG,CAC3B;QACP,wCAAM,SAAS,EAAK,UAAU,aAAU,GAAS;QAChD,QAAQ,IAAI,wCAAM,SAAS,EAAK,UAAU,UAAO,IAAG,QAAQ,CAAQ,CAC/D,CACT,CAAC;AACJ,CAAC,CAAC,CAAC"}
+{"version":3,"file":"Radio.js","sourceRoot":"","sources":["../../src/Form/Radio.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA0C;AAE1C,gCAAoC;AAQpC,IAAM,UAAU,GAAG,YAAY,CAAC;AAEnB,QAAA,KAAK,GAAG,IAAA,kBAAU,EAA0B,SAAS,KAAK,CACrE,EAAqC,EACrC,GAAG;IADD,IAAA,QAAQ,cAAA,EAAE,UAAO,EAAP,EAAE,mBAAG,EAAE,KAAA,EAAK,IAAI,cAA5B,kBAA8B,CAAF;IAG5B,OAAO,CACL,yCAAO,SAAS,EAAE,UAAG,UAAU,WAAQ,EAAE,OAAO,EAAE,EAAE;QAClD,kDACE,SAAS,EAAE,UAAG,UAAU,WAAQ,EAChC,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,OAAO,IACR,IAAI,EACR;QACF,wCAAM,SAAS,EAAE,UAAG,UAAU,UAAO;YACnC,8BAAC,gBAAS,mBAAa,MAAM,GAAG,CAC3B;QACP,wCAAM,SAAS,EAAE,UAAG,UAAU,aAAU,GAAS;QAChD,QAAQ,IAAI,wCAAM,SAAS,EAAE,UAAG,UAAU,UAAO,IAAG,QAAQ,CAAQ,CAC/D,CACT,CAAC;AACJ,CAAC,CAAC,CAAC"}

package/Form/Radio.mjs

@@ -3,7 +3,7 @@ import { CheckBold } from '../Icon';
 const BLOCK_NAME = 'spui-Radio';
 export const Radio = forwardRef(function Radio({ children, id = '', ...rest }, ref) {
     return (React.createElement("label", { className: `${BLOCK_NAME}-label`, htmlFor: id },
-        React.createElement("input", Object.assign({ className: `${BLOCK_NAME}-input`, id: id, ref: ref, type: "radio" }, rest)),
+        React.createElement("input", { className: `${BLOCK_NAME}-input`, id: id, ref: ref, type: "radio", ...rest }),
         React.createElement("span", { className: `${BLOCK_NAME}-icon` },
             React.createElement(CheckBold, { "aria-hidden": "true" })),
         React.createElement("span", { className: `${BLOCK_NAME}-outline` }),

package/Form/TextArea.js

@@ -12,7 +12,11 @@ var __assign = (this && this.__assign) || function () {
 };
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -44,8 +48,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.TextArea = void 0;
 var react_1 = __importStar(require("react"));
 var BLOCK_NAME = 'spui-TextArea';
-exports.TextArea = react_1.forwardRef(function TextArea(_a, ref) {
+exports.TextArea = (0, react_1.forwardRef)(function TextArea(_a, ref) {
     var children = _a.children, _b = _a.hasError, hasError = _b === void 0 ? false : _b, _c = _a.id, id = _c === void 0 ? '' : _c, rest = __rest(_a, ["children", "hasError", "id"]);
-    return (react_1.default.createElement("textarea", __assign({ className: ["" + BLOCK_NAME, hasError ? 'is-error' : ''].join(' '), id: id, ref: ref }, rest), children));
+    return (react_1.default.createElement("textarea", __assign({ className: ["".concat(BLOCK_NAME), hasError ? 'is-error' : ''].join(' '), id: id, ref: ref }, rest), children));
 });
 //# sourceMappingURL=TextArea.js.map

package/Form/TextArea.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../../src/Form/TextArea.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA0C;AAS1C,IAAM,UAAU,GAAG,eAAe,CAAC;AAEtB,QAAA,QAAQ,GAAG,kBAAU,CAChC,SAAS,QAAQ,CACf,EAAuD,EACvD,GAAG;IADD,IAAA,QAAQ,cAAA,EAAE,gBAAgB,EAAhB,QAAQ,mBAAG,KAAK,KAAA,EAAE,UAAO,EAAP,EAAE,mBAAG,EAAE,KAAA,EAAK,IAAI,cAA9C,8BAAgD,CAAF;IAG9C,OAAO,CACL,qDACE,SAAS,EAAE,CAAC,KAAG,UAAY,EAAE,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAClE,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAAG,IACJ,IAAI,GAEP,QAAQ,CACA,CACZ,CAAC;AACJ,CAAC,CACF,CAAC"}
+{"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../../src/Form/TextArea.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA0C;AAS1C,IAAM,UAAU,GAAG,eAAe,CAAC;AAEtB,QAAA,QAAQ,GAAG,IAAA,kBAAU,EAChC,SAAS,QAAQ,CACf,EAAuD,EACvD,GAAG;IADD,IAAA,QAAQ,cAAA,EAAE,gBAAgB,EAAhB,QAAQ,mBAAG,KAAK,KAAA,EAAE,UAAO,EAAP,EAAE,mBAAG,EAAE,KAAA,EAAK,IAAI,cAA9C,8BAAgD,CAAF;IAG9C,OAAO,CACL,qDACE,SAAS,EAAE,CAAC,UAAG,UAAU,CAAE,EAAE,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAClE,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAAG,IACJ,IAAI,GAEP,QAAQ,CACA,CACZ,CAAC;AACJ,CAAC,CACF,CAAC"}

package/Form/TextArea.mjs

@@ -1,5 +1,5 @@
 import React, { forwardRef } from 'react';
 const BLOCK_NAME = 'spui-TextArea';
 export const TextArea = forwardRef(function TextArea({ children, hasError = false, id = '', ...rest }, ref) {
-    return (React.createElement("textarea", Object.assign({ className: [`${BLOCK_NAME}`, hasError ? 'is-error' : ''].join(' '), id: id, ref: ref }, rest), children));
+    return (React.createElement("textarea", { className: [`${BLOCK_NAME}`, hasError ? 'is-error' : ''].join(' '), id: id, ref: ref, ...rest }, children));
 });

package/Form/TextField.js

@@ -12,7 +12,11 @@ var __assign = (this && this.__assign) || function () {
 };
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -44,11 +48,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.TextField = void 0;
 var react_1 = __importStar(require("react"));
 var BLOCK_NAME = 'spui-TextField';
-exports.TextField = react_1.forwardRef(function TextField(_a, ref) {
+exports.TextField = (0, react_1.forwardRef)(function TextField(_a, ref) {
     var _b = _a.hasError, hasError = _b === void 0 ? false : _b, _c = _a.id, id = _c === void 0 ? '' : _c, _d = _a.variant, variant = _d === void 0 ? 'medium' : _d, rest = __rest(_a, ["hasError", "id", "variant"]);
     return (react_1.default.createElement("input", __assign({ className: [
-            "" + BLOCK_NAME,
-            BLOCK_NAME + "--" + variant,
+            "".concat(BLOCK_NAME),
+            "".concat(BLOCK_NAME, "--").concat(variant),
             hasError ? 'is-error' : '',
         ].join(' '), id: id, ref: ref }, rest)));
 });

package/Form/TextField.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextField.js","sourceRoot":"","sources":["../../src/Form/TextField.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA0C;AAW1C,IAAM,UAAU,GAAG,gBAAgB,CAAC;AAEvB,QAAA,SAAS,GAAG,kBAAU,CAA0B,SAAS,SAAS,CAC7E,EAAiE,EACjE,GAAG;IADD,IAAA,gBAAgB,EAAhB,QAAQ,mBAAG,KAAK,KAAA,EAAE,UAAO,EAAP,EAAE,mBAAG,EAAE,KAAA,EAAE,eAAkB,EAAlB,OAAO,mBAAG,QAAQ,KAAA,EAAK,IAAI,cAAxD,6BAA0D,CAAF;IAGxD,OAAO,CACL,kDACE,SAAS,EAAE;YACT,KAAG,UAAY;YACZ,UAAU,UAAK,OAAS;YAC3B,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE;SAC3B,CAAC,IAAI,CAAC,GAAG,CAAC,EACX,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAAG,IACJ,IAAI,EACR,CACH,CAAC;AACJ,CAAC,CAAC,CAAC"}
+{"version":3,"file":"TextField.js","sourceRoot":"","sources":["../../src/Form/TextField.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA0C;AAW1C,IAAM,UAAU,GAAG,gBAAgB,CAAC;AAEvB,QAAA,SAAS,GAAG,IAAA,kBAAU,EAA0B,SAAS,SAAS,CAC7E,EAAiE,EACjE,GAAG;IADD,IAAA,gBAAgB,EAAhB,QAAQ,mBAAG,KAAK,KAAA,EAAE,UAAO,EAAP,EAAE,mBAAG,EAAE,KAAA,EAAE,eAAkB,EAAlB,OAAO,mBAAG,QAAQ,KAAA,EAAK,IAAI,cAAxD,6BAA0D,CAAF;IAGxD,OAAO,CACL,kDACE,SAAS,EAAE;YACT,UAAG,UAAU,CAAE;YACf,UAAG,UAAU,eAAK,OAAO,CAAE;YAC3B,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE;SAC3B,CAAC,IAAI,CAAC,GAAG,CAAC,EACX,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAAG,IACJ,IAAI,EACR,CACH,CAAC;AACJ,CAAC,CAAC,CAAC"}

package/Form/TextField.mjs

@@ -1,9 +1,9 @@
 import React, { forwardRef } from 'react';
 const BLOCK_NAME = 'spui-TextField';
 export const TextField = forwardRef(function TextField({ hasError = false, id = '', variant = 'medium', ...rest }, ref) {
-    return (React.createElement("input", Object.assign({ className: [
+    return (React.createElement("input", { className: [
             `${BLOCK_NAME}`,
             `${BLOCK_NAME}--${variant}`,
             hasError ? 'is-error' : '',
-        ].join(' '), id: id, ref: ref }, rest)));
+        ].join(' '), id: id, ref: ref, ...rest }));
 });

package/Form/ToggleSwitch.js

@@ -12,7 +12,11 @@ var __assign = (this && this.__assign) || function () {
 };
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -44,11 +48,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ToggleSwitch = void 0;
 var react_1 = __importStar(require("react"));
 var BLOCK_NAME = 'spui-ToggleSwitch';
-exports.ToggleSwitch = react_1.forwardRef(function ToggleSwitch(_a, ref) {
+exports.ToggleSwitch = (0, react_1.forwardRef)(function ToggleSwitch(_a, ref) {
     var _b = _a.id, id = _b === void 0 ? '' : _b, rest = __rest(_a, ["id"]);
     return (react_1.default.createElement("label", { className: BLOCK_NAME },
-        react_1.default.createElement("input", __assign({ className: BLOCK_NAME + "-input", id: id, ref: ref, type: "checkbox" }, rest)),
-        react_1.default.createElement("span", { className: BLOCK_NAME + "-visual" }),
-        react_1.default.createElement("span", { className: BLOCK_NAME + "-outline" })));
+        react_1.default.createElement("input", __assign({ className: "".concat(BLOCK_NAME, "-input"), id: id, ref: ref, type: "checkbox" }, rest)),
+        react_1.default.createElement("span", { className: "".concat(BLOCK_NAME, "-visual") }),
+        react_1.default.createElement("span", { className: "".concat(BLOCK_NAME, "-outline") })));
 });
 //# sourceMappingURL=ToggleSwitch.js.map

package/Form/ToggleSwitch.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToggleSwitch.js","sourceRoot":"","sources":["../../src/Form/ToggleSwitch.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA0C;AAO1C,IAAM,UAAU,GAAG,mBAAmB,CAAC;AAE1B,QAAA,YAAY,GAAG,kBAAU,CACpC,SAAS,YAAY,CAAC,EAA2B,EAAE,GAAG;IAA9B,IAAA,UAAO,EAAP,EAAE,mBAAG,EAAE,KAAA,EAAK,IAAI,cAAlB,MAAoB,CAAF;IACtC,OAAO,CACL,yCAAO,SAAS,EAAE,UAAU;QAC1B,kDACE,SAAS,EAAK,UAAU,WAAQ,EAChC,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,UAAU,IACX,IAAI,EACR;QACF,wCAAM,SAAS,EAAK,UAAU,YAAS,GAAS;QAChD,wCAAM,SAAS,EAAK,UAAU,aAAU,GAAS,CAC3C,CACT,CAAC;AACJ,CAAC,CACF,CAAC"}
+{"version":3,"file":"ToggleSwitch.js","sourceRoot":"","sources":["../../src/Form/ToggleSwitch.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA0C;AAO1C,IAAM,UAAU,GAAG,mBAAmB,CAAC;AAE1B,QAAA,YAAY,GAAG,IAAA,kBAAU,EACpC,SAAS,YAAY,CAAC,EAA2B,EAAE,GAAG;IAA9B,IAAA,UAAO,EAAP,EAAE,mBAAG,EAAE,KAAA,EAAK,IAAI,cAAlB,MAAoB,CAAF;IACtC,OAAO,CACL,yCAAO,SAAS,EAAE,UAAU;QAC1B,kDACE,SAAS,EAAE,UAAG,UAAU,WAAQ,EAChC,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,UAAU,IACX,IAAI,EACR;QACF,wCAAM,SAAS,EAAE,UAAG,UAAU,YAAS,GAAS;QAChD,wCAAM,SAAS,EAAE,UAAG,UAAU,aAAU,GAAS,CAC3C,CACT,CAAC;AACJ,CAAC,CACF,CAAC"}

package/Form/ToggleSwitch.mjs

@@ -2,7 +2,7 @@ import React, { forwardRef } from 'react';
 const BLOCK_NAME = 'spui-ToggleSwitch';
 export const ToggleSwitch = forwardRef(function ToggleSwitch({ id = '', ...rest }, ref) {
     return (React.createElement("label", { className: BLOCK_NAME },
-        React.createElement("input", Object.assign({ className: `${BLOCK_NAME}-input`, id: id, ref: ref, type: "checkbox" }, rest)),
+        React.createElement("input", { className: `${BLOCK_NAME}-input`, id: id, ref: ref, type: "checkbox", ...rest }),
         React.createElement("span", { className: `${BLOCK_NAME}-visual` }),
         React.createElement("span", { className: `${BLOCK_NAME}-outline` })));
 });