@doist/reactist 15.1.0 → 15.3.0

package/lib/components/key-capturer/key-capturer.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var r,e=require("../../_virtual/_rollupPluginBabelHelpers.js"),o=require("react"),t=(r=o)&&"object"==typeof r&&"default"in r?r.default:r;const a={resolveByKey(r){switch(r){case"Left":case"ArrowLeft":return"ArrowLeft";case"Up":case"ArrowUp":return"ArrowUp";case"Right":case"ArrowRight":return"ArrowRight";case"Down":case"ArrowDown":return"ArrowDown";case"Enter":return"Enter";case"Backspace":return"Backspace";case"Esc":case"Escape":return"Escape";default:return null}},resolveByKeyCode(r){switch(r){case 37:return"ArrowLeft";case 38:return"ArrowUp";case 39:return"ArrowRight";case 40:return"ArrowDown";case 13:return"Enter";case 8:return"Backspace";case 27:return"Escape";default:return null}}},n={ArrowUp:"onArrowUp",ArrowDown:"onArrowDown",ArrowLeft:"onArrowLeft",ArrowRight:"onArrowRight",Enter:"onEnter",Backspace:"onBackspace",Escape:"onEscape"},c={ArrowUp:"propagateArrowUp",ArrowDown:"propagateArrowDown",ArrowLeft:"propagateArrowLeft",ArrowRight:"propagateArrowRight",Enter:"propagateEnter",Backspace:"propagateBackspace",Escape:"propagateEscape"};exports.KeyCapturer=function(r){const{children:s,eventName:p="onKeyDown"}=r,w=o.useRef(!1);return t.cloneElement(s,e.objectSpread2({[p]:function(e){const o=void 0!==e.key?a.resolveByKey(e.key):a.resolveByKeyCode(e.keyCode);if(!o)return;const t=r[c[o]]||!1,s=r[n[o]];"Enter"===o&&s&&(w.current||229===(e.keyCode||e.which))||s&&(s(e),t||(e.preventDefault(),e.stopPropagation()))}},r.onEnter?{onCompositionStart:()=>{w.current=!0},onCompositionEnd:()=>{w.current=!1}}:void 0))},exports.KeyCapturerResolver=a,exports.SUPPORTED_KEYS={ARROW_UP:"ArrowUp",ARROW_RIGHT:"ArrowRight",ARROW_DOWN:"ArrowDown",ARROW_LEFT:"ArrowLeft",ENTER:"Enter",BACKSPACE:"Backspace",ESCAPE:"Escape"};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var r=require("../../_virtual/_rollupPluginBabelHelpers.js"),e=require("react");const o={resolveByKey(r){switch(r){case"Left":case"ArrowLeft":return"ArrowLeft";case"Up":case"ArrowUp":return"ArrowUp";case"Right":case"ArrowRight":return"ArrowRight";case"Down":case"ArrowDown":return"ArrowDown";case"Enter":return"Enter";case"Backspace":return"Backspace";case"Esc":case"Escape":return"Escape";default:return null}},resolveByKeyCode(r){switch(r){case 37:return"ArrowLeft";case 38:return"ArrowUp";case 39:return"ArrowRight";case 40:return"ArrowDown";case 13:return"Enter";case 8:return"Backspace";case 27:return"Escape";default:return null}}},t={ArrowUp:"onArrowUp",ArrowDown:"onArrowDown",ArrowLeft:"onArrowLeft",ArrowRight:"onArrowRight",Enter:"onEnter",Backspace:"onBackspace",Escape:"onEscape"},n={ArrowUp:"propagateArrowUp",ArrowDown:"propagateArrowDown",ArrowLeft:"propagateArrowLeft",ArrowRight:"propagateArrowRight",Enter:"propagateEnter",Backspace:"propagateBackspace",Escape:"propagateEscape"};exports.KeyCapturer=function(a){const{children:c,eventName:s="onKeyDown"}=a,p=e.useRef(!1);return e.cloneElement(c,r.objectSpread2({[s]:function(r){const e=void 0!==r.key?o.resolveByKey(r.key):o.resolveByKeyCode(r.keyCode);if(!e)return;const c=a[n[e]]||!1,s=a[t[e]];"Enter"===e&&s&&(p.current||229===(r.keyCode||r.which))||s&&(s(r),c||(r.preventDefault(),r.stopPropagation()))}},a.onEnter?{onCompositionStart:()=>{p.current=!0},onCompositionEnd:()=>{p.current=!1}}:void 0))},exports.KeyCapturerResolver=o,exports.SUPPORTED_KEYS={ARROW_UP:"ArrowUp",ARROW_RIGHT:"ArrowRight",ARROW_DOWN:"ArrowDown",ARROW_LEFT:"ArrowLeft",ENTER:"Enter",BACKSPACE:"Backspace",ESCAPE:"Escape"};
 //# sourceMappingURL=key-capturer.js.map

package/lib/components/key-capturer/key-capturer.js.map

@@ -1 +1 @@
-{"version":3,"file":"key-capturer.js","sources":["../../../src/components/key-capturer/key-capturer.tsx"],"sourcesContent":["import React, { useRef } from 'react'\n\ntype Key = 'ArrowUp' | 'ArrowRight' | 'ArrowDown' | 'ArrowLeft' | 'Enter' | 'Backspace' | 'Escape'\n\nconst SUPPORTED_KEYS: Record<string, Key> = {\n    ARROW_UP: 'ArrowUp',\n    ARROW_RIGHT: 'ArrowRight',\n    ARROW_DOWN: 'ArrowDown',\n    ARROW_LEFT: 'ArrowLeft',\n    ENTER: 'Enter',\n    BACKSPACE: 'Backspace',\n    ESCAPE: 'Escape',\n}\n\nconst KeyCapturerResolver = {\n    resolveByKey(eventKey: string): Key | null {\n        switch (eventKey) {\n            case 'Left': // IE specific\n            case 'ArrowLeft': {\n                return 'ArrowLeft'\n            }\n            case 'Up': // IE specific\n            case 'ArrowUp': {\n                return 'ArrowUp'\n            }\n            case 'Right': // IE specific\n            case 'ArrowRight': {\n                return 'ArrowRight'\n            }\n            case 'Down': // IE specific\n            case 'ArrowDown': {\n                return 'ArrowDown'\n            }\n            case 'Enter': {\n                return 'Enter'\n            }\n            case 'Backspace': {\n                return 'Backspace'\n            }\n            case 'Esc': // IE specific\n            case 'Escape': {\n                return 'Escape'\n            }\n            default: {\n                return null\n            }\n        }\n    },\n\n    resolveByKeyCode(keyCode: number): Key | null {\n        switch (keyCode) {\n            case 37: {\n                return 'ArrowLeft'\n            }\n            case 38: {\n                return 'ArrowUp'\n            }\n            case 39: {\n                return 'ArrowRight'\n            }\n            case 40: {\n                return 'ArrowDown'\n            }\n            case 13: {\n                return 'Enter'\n            }\n            case 8: {\n                return 'Backspace'\n            }\n            case 27: {\n                return 'Escape'\n            }\n            default: {\n                return null\n            }\n        }\n    },\n}\n\ntype EventHandler = (event: React.SyntheticEvent) => void\n\ntype EventHandlerProps = {\n    onArrowUp?: EventHandler\n    onArrowDown?: EventHandler\n    onArrowLeft?: EventHandler\n    onArrowRight?: EventHandler\n    onEnter?: EventHandler\n    onBackspace?: EventHandler\n    onEscape?: EventHandler\n}\n\ntype PropagateProps = {\n    propagateArrowUp?: boolean\n    propagateArrowDown?: boolean\n    propagateArrowLeft?: boolean\n    propagateArrowRight?: boolean\n    propagateEnter?: boolean\n    propagateBackspace?: boolean\n    propagateEscape?: boolean\n}\n\nconst keyEventHandlerMapping: Record<Key, keyof EventHandlerProps> = {\n    ArrowUp: 'onArrowUp',\n    ArrowDown: 'onArrowDown',\n    ArrowLeft: 'onArrowLeft',\n    ArrowRight: 'onArrowRight',\n    Enter: 'onEnter',\n    Backspace: 'onBackspace',\n    Escape: 'onEscape',\n}\n\nconst keyPropagatePropMapping: Record<Key, keyof PropagateProps> = {\n    ArrowUp: 'propagateArrowUp',\n    ArrowDown: 'propagateArrowDown',\n    ArrowLeft: 'propagateArrowLeft',\n    ArrowRight: 'propagateArrowRight',\n    Enter: 'propagateEnter',\n    Backspace: 'propagateBackspace',\n    Escape: 'propagateEscape',\n}\n\ntype KeyCapturerProps = EventHandlerProps &\n    PropagateProps & {\n        eventName?: 'onKeyDown' | 'onKeyDownCapture' | 'onKeyUp' | 'onKeyUpCapture'\n        children: React.ReactElement<unknown>\n    }\n\n/**\n * Use this component to wrap anything you want to handle key events for (e.g. an input).\n * You can specify the `eventName` to capture (defaults to `onKeyDown`).\n * Check the SUPPORTED_KEYS map to see which keys are supported and supply the respective\n * `on${Key}` prop (i.e. `onEnter` or `onArrowDown`).\n * If you want the default behaviour to be preserved (i.e. only want to hook into the event\n * instead of replacing it) set the `propagate${Key}` prop (e.g. propagateBackspace).\n */\nfunction KeyCapturer(props: KeyCapturerProps) {\n    const { children, eventName = 'onKeyDown' } = props\n    const composingRef = useRef(false)\n    const composingEventHandlers = props.onEnter\n        ? {\n              onCompositionStart: () => {\n                  composingRef.current = true\n              },\n              onCompositionEnd: () => {\n                  composingRef.current = false\n              },\n          }\n        : undefined\n\n    function handleKeyEvent(event: React.KeyboardEvent<HTMLInputElement>) {\n        // https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode\n        const key =\n            event.key !== undefined\n                ? KeyCapturerResolver.resolveByKey(event.key)\n                : KeyCapturerResolver.resolveByKeyCode(event.keyCode)\n\n        if (!key) return\n        const propagateEvent = props[keyPropagatePropMapping[key]] || false\n        const eventHandler = props[keyEventHandlerMapping[key]]\n\n        if (key === 'Enter' && eventHandler) {\n            if (\n                composingRef.current ||\n                // Safari fires the onCompositionEnd event before the keydown event, so we\n                // have to rely on the 229 keycode, which is Enter when fired from an IME\n                // https://www.w3.org/TR/uievents/#determine-keydown-keyup-keyCode\n                (event.keyCode || event.which) === 229\n            ) {\n                return\n            }\n        }\n\n        if (eventHandler) {\n            eventHandler(event)\n            if (!propagateEvent) {\n                event.preventDefault()\n                event.stopPropagation()\n            }\n        }\n    }\n\n    return React.cloneElement(children, {\n        [eventName]: handleKeyEvent,\n        ...composingEventHandlers,\n    })\n}\n\nexport { KeyCapturer, KeyCapturerResolver, SUPPORTED_KEYS }\n"],"names":["KeyCapturerResolver","resolveByKey","eventKey","resolveByKeyCode","keyCode","keyEventHandlerMapping","ArrowUp","ArrowDown","ArrowLeft","ArrowRight","Enter","Backspace","Escape","keyPropagatePropMapping","props","children","eventName","composingRef","useRef","React","cloneElement","[object Object]","event","key","undefined","propagateEvent","eventHandler","current","which","preventDefault","stopPropagation","onEnter","onCompositionStart","onCompositionEnd","ARROW_UP","ARROW_RIGHT","ARROW_DOWN","ARROW_LEFT","ENTER","BACKSPACE","ESCAPE"],"mappings":"mNAcMA,EAAsB,CACxBC,aAAaC,GACT,OAAQA,GACJ,IAAK,OACL,IAAK,YACD,MAAO,YAEX,IAAK,KACL,IAAK,UACD,MAAO,UAEX,IAAK,QACL,IAAK,aACD,MAAO,aAEX,IAAK,OACL,IAAK,YACD,MAAO,YAEX,IAAK,QACD,MAAO,QAEX,IAAK,YACD,MAAO,YAEX,IAAK,MACL,IAAK,SACD,MAAO,SAEX,QACI,OAAO,OAKnBC,iBAAiBC,GACb,OAAQA,GACJ,KAAK,GACD,MAAO,YAEX,KAAK,GACD,MAAO,UAEX,KAAK,GACD,MAAO,aAEX,KAAK,GACD,MAAO,YAEX,KAAK,GACD,MAAO,QAEX,KAAK,EACD,MAAO,YAEX,KAAK,GACD,MAAO,SAEX,QACI,OAAO,QA4BjBC,EAA+D,CACjEC,QAAS,YACTC,UAAW,cACXC,UAAW,cACXC,WAAY,eACZC,MAAO,UACPC,UAAW,cACXC,OAAQ,YAGNC,EAA6D,CAC/DP,QAAS,mBACTC,UAAW,qBACXC,UAAW,qBACXC,WAAY,sBACZC,MAAO,iBACPC,UAAW,qBACXC,OAAQ,uCAiBZ,SAAqBE,GACjB,MAAMC,SAAEA,EAAFC,UAAYA,EAAY,aAAgBF,EACxCG,EAAeC,UAAO,GA4C5B,OAAOC,EAAMC,aAAaL,mBACtBM,CAACL,GAjCL,SAAwBM,GAEpB,MAAMC,OACYC,IAAdF,EAAMC,IACAvB,EAAoBC,aAAaqB,EAAMC,KACvCvB,EAAoBG,iBAAiBmB,EAAMlB,SAErD,IAAKmB,EAAK,OACV,MAAME,EAAiBX,EAAMD,EAAwBU,MAAS,EACxDG,EAAeZ,EAAMT,EAAuBkB,IAEtC,UAARA,GAAmBG,IAEfT,EAAaU,SAIsB,OAAlCL,EAAMlB,SAAWkB,EAAMM,SAM5BF,IACAA,EAAaJ,GACRG,IACDH,EAAMO,iBACNP,EAAMQ,sBAtCahB,EAAMiB,QAC/B,CACIC,mBAAoB,KAChBf,EAAaU,SAAU,GAE3BM,iBAAkB,KACdhB,EAAaU,SAAU,SAG/BH,0DA/IkC,CACxCU,SAAU,UACVC,YAAa,aACbC,WAAY,YACZC,WAAY,YACZC,MAAO,QACPC,UAAW,YACXC,OAAQ"}
+{"version":3,"file":"key-capturer.js","sources":["../../../src/components/key-capturer/key-capturer.tsx"],"sourcesContent":["import * as React from 'react'\n\ntype Key = 'ArrowUp' | 'ArrowRight' | 'ArrowDown' | 'ArrowLeft' | 'Enter' | 'Backspace' | 'Escape'\n\nconst SUPPORTED_KEYS: Record<string, Key> = {\n    ARROW_UP: 'ArrowUp',\n    ARROW_RIGHT: 'ArrowRight',\n    ARROW_DOWN: 'ArrowDown',\n    ARROW_LEFT: 'ArrowLeft',\n    ENTER: 'Enter',\n    BACKSPACE: 'Backspace',\n    ESCAPE: 'Escape',\n}\n\nconst KeyCapturerResolver = {\n    resolveByKey(eventKey: string): Key | null {\n        switch (eventKey) {\n            case 'Left': // IE specific\n            case 'ArrowLeft': {\n                return 'ArrowLeft'\n            }\n            case 'Up': // IE specific\n            case 'ArrowUp': {\n                return 'ArrowUp'\n            }\n            case 'Right': // IE specific\n            case 'ArrowRight': {\n                return 'ArrowRight'\n            }\n            case 'Down': // IE specific\n            case 'ArrowDown': {\n                return 'ArrowDown'\n            }\n            case 'Enter': {\n                return 'Enter'\n            }\n            case 'Backspace': {\n                return 'Backspace'\n            }\n            case 'Esc': // IE specific\n            case 'Escape': {\n                return 'Escape'\n            }\n            default: {\n                return null\n            }\n        }\n    },\n\n    resolveByKeyCode(keyCode: number): Key | null {\n        switch (keyCode) {\n            case 37: {\n                return 'ArrowLeft'\n            }\n            case 38: {\n                return 'ArrowUp'\n            }\n            case 39: {\n                return 'ArrowRight'\n            }\n            case 40: {\n                return 'ArrowDown'\n            }\n            case 13: {\n                return 'Enter'\n            }\n            case 8: {\n                return 'Backspace'\n            }\n            case 27: {\n                return 'Escape'\n            }\n            default: {\n                return null\n            }\n        }\n    },\n}\n\ntype EventHandler = (event: React.SyntheticEvent) => void\n\ntype EventHandlerProps = {\n    onArrowUp?: EventHandler\n    onArrowDown?: EventHandler\n    onArrowLeft?: EventHandler\n    onArrowRight?: EventHandler\n    onEnter?: EventHandler\n    onBackspace?: EventHandler\n    onEscape?: EventHandler\n}\n\ntype PropagateProps = {\n    propagateArrowUp?: boolean\n    propagateArrowDown?: boolean\n    propagateArrowLeft?: boolean\n    propagateArrowRight?: boolean\n    propagateEnter?: boolean\n    propagateBackspace?: boolean\n    propagateEscape?: boolean\n}\n\nconst keyEventHandlerMapping: Record<Key, keyof EventHandlerProps> = {\n    ArrowUp: 'onArrowUp',\n    ArrowDown: 'onArrowDown',\n    ArrowLeft: 'onArrowLeft',\n    ArrowRight: 'onArrowRight',\n    Enter: 'onEnter',\n    Backspace: 'onBackspace',\n    Escape: 'onEscape',\n}\n\nconst keyPropagatePropMapping: Record<Key, keyof PropagateProps> = {\n    ArrowUp: 'propagateArrowUp',\n    ArrowDown: 'propagateArrowDown',\n    ArrowLeft: 'propagateArrowLeft',\n    ArrowRight: 'propagateArrowRight',\n    Enter: 'propagateEnter',\n    Backspace: 'propagateBackspace',\n    Escape: 'propagateEscape',\n}\n\ntype KeyCapturerProps = EventHandlerProps &\n    PropagateProps & {\n        eventName?: 'onKeyDown' | 'onKeyDownCapture' | 'onKeyUp' | 'onKeyUpCapture'\n        children: React.ReactElement<unknown>\n    }\n\n/**\n * Use this component to wrap anything you want to handle key events for (e.g. an input).\n * You can specify the `eventName` to capture (defaults to `onKeyDown`).\n * Check the SUPPORTED_KEYS map to see which keys are supported and supply the respective\n * `on${Key}` prop (i.e. `onEnter` or `onArrowDown`).\n * If you want the default behaviour to be preserved (i.e. only want to hook into the event\n * instead of replacing it) set the `propagate${Key}` prop (e.g. propagateBackspace).\n */\nfunction KeyCapturer(props: KeyCapturerProps) {\n    const { children, eventName = 'onKeyDown' } = props\n    const composingRef = React.useRef(false)\n    const composingEventHandlers = props.onEnter\n        ? {\n              onCompositionStart: () => {\n                  composingRef.current = true\n              },\n              onCompositionEnd: () => {\n                  composingRef.current = false\n              },\n          }\n        : undefined\n\n    function handleKeyEvent(event: React.KeyboardEvent<HTMLInputElement>) {\n        // https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode\n        const key =\n            event.key !== undefined\n                ? KeyCapturerResolver.resolveByKey(event.key)\n                : KeyCapturerResolver.resolveByKeyCode(event.keyCode)\n\n        if (!key) return\n        const propagateEvent = props[keyPropagatePropMapping[key]] || false\n        const eventHandler = props[keyEventHandlerMapping[key]]\n\n        if (key === 'Enter' && eventHandler) {\n            if (\n                composingRef.current ||\n                // Safari fires the onCompositionEnd event before the keydown event, so we\n                // have to rely on the 229 keycode, which is Enter when fired from an IME\n                // https://www.w3.org/TR/uievents/#determine-keydown-keyup-keyCode\n                (event.keyCode || event.which) === 229\n            ) {\n                return\n            }\n        }\n\n        if (eventHandler) {\n            eventHandler(event)\n            if (!propagateEvent) {\n                event.preventDefault()\n                event.stopPropagation()\n            }\n        }\n    }\n\n    return React.cloneElement(children, {\n        [eventName]: handleKeyEvent,\n        ...composingEventHandlers,\n    })\n}\n\nexport { KeyCapturer, KeyCapturerResolver, SUPPORTED_KEYS }\n"],"names":["KeyCapturerResolver","resolveByKey","eventKey","resolveByKeyCode","keyCode","keyEventHandlerMapping","ArrowUp","ArrowDown","ArrowLeft","ArrowRight","Enter","Backspace","Escape","keyPropagatePropMapping","props","children","eventName","composingRef","React","[object Object]","event","key","undefined","propagateEvent","eventHandler","current","which","preventDefault","stopPropagation","onEnter","onCompositionStart","onCompositionEnd","ARROW_UP","ARROW_RIGHT","ARROW_DOWN","ARROW_LEFT","ENTER","BACKSPACE","ESCAPE"],"mappings":"0JAcMA,EAAsB,CACxBC,aAAaC,GACT,OAAQA,GACJ,IAAK,OACL,IAAK,YACD,MAAO,YAEX,IAAK,KACL,IAAK,UACD,MAAO,UAEX,IAAK,QACL,IAAK,aACD,MAAO,aAEX,IAAK,OACL,IAAK,YACD,MAAO,YAEX,IAAK,QACD,MAAO,QAEX,IAAK,YACD,MAAO,YAEX,IAAK,MACL,IAAK,SACD,MAAO,SAEX,QACI,OAAO,OAKnBC,iBAAiBC,GACb,OAAQA,GACJ,KAAK,GACD,MAAO,YAEX,KAAK,GACD,MAAO,UAEX,KAAK,GACD,MAAO,aAEX,KAAK,GACD,MAAO,YAEX,KAAK,GACD,MAAO,QAEX,KAAK,EACD,MAAO,YAEX,KAAK,GACD,MAAO,SAEX,QACI,OAAO,QA4BjBC,EAA+D,CACjEC,QAAS,YACTC,UAAW,cACXC,UAAW,cACXC,WAAY,eACZC,MAAO,UACPC,UAAW,cACXC,OAAQ,YAGNC,EAA6D,CAC/DP,QAAS,mBACTC,UAAW,qBACXC,UAAW,qBACXC,WAAY,sBACZC,MAAO,iBACPC,UAAW,qBACXC,OAAQ,uCAiBZ,SAAqBE,GACjB,MAAMC,SAAEA,EAAFC,UAAYA,EAAY,aAAgBF,EACxCG,EAAeC,UAAa,GA4ClC,OAAOA,eAAmBH,mBACtBI,CAACH,GAjCL,SAAwBI,GAEpB,MAAMC,OACYC,IAAdF,EAAMC,IACArB,EAAoBC,aAAamB,EAAMC,KACvCrB,EAAoBG,iBAAiBiB,EAAMhB,SAErD,IAAKiB,EAAK,OACV,MAAME,EAAiBT,EAAMD,EAAwBQ,MAAS,EACxDG,EAAeV,EAAMT,EAAuBgB,IAEtC,UAARA,GAAmBG,IAEfP,EAAaQ,SAIsB,OAAlCL,EAAMhB,SAAWgB,EAAMM,SAM5BF,IACAA,EAAaJ,GACRG,IACDH,EAAMO,iBACNP,EAAMQ,sBAtCad,EAAMe,QAC/B,CACIC,mBAAoB,KAChBb,EAAaQ,SAAU,GAE3BM,iBAAkB,KACdd,EAAaQ,SAAU,SAG/BH,0DA/IkC,CACxCU,SAAU,UACVC,YAAa,aACbC,WAAY,YACZC,WAAY,YACZC,MAAO,QACPC,UAAW,YACXC,OAAQ"}

package/lib/components/keyboard-shortcut/keyboard-shortcut.js

@@ -1,2 +1,2 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../_virtual/_rollupPluginBabelHelpers.js"),r=require("react"),a=(e(r),e(require("classnames")));const c=["children","className","translateKey","isMac"];let s=e=>e;function n(e){switch(e.toLowerCase()){case"cmd":case"mod":return"⌘";case"control":case"ctrl":return"⌃";case"alt":return"⌥";case"shift":return"⇧";case"space":return"␣";default:return e}}function l(e){var l,o;let{children:u,className:i,translateKey:p=s,isMac:d=null!=(l=null==(o=navigator.platform)?void 0:o.toUpperCase().includes("MAC"))&&l}=e,m=t.objectWithoutProperties(e,c);const f="string"==typeof u?[u]:u;return r.createElement("span",t.objectSpread2({className:a("reactist_keyboard_shortcut",i,{"reactist_keyboard_shortcut--macos":d})},m),f.map((e,t)=>r.createElement(r.Fragment,{key:t},0===t?null:", ",r.createElement("kbd",null,function(e,t,r){const a=t?n:r,c=/\b(mod|cmd|ctrl|control|alt|shift)\b/i.test(e);return t||(e=e.replace(/\b(mod|cmd)\b/i,"ctrl")),e.split(/\s*\+\s*/).map((function(e){return function(e){return/^(mod|cmd|ctrl|control|alt|shift|space|super)$/i.test(e)}(e)?function(e){return e.charAt(0).toUpperCase()+e.slice(1).toLowerCase()}(a(e)):c&&1===e.length?e.toUpperCase():e}))}(e,d,p).map((e,t)=>r.createElement("kbd",{key:t},e))))))}l.setTranslateKey=e=>{s=e},exports.KeyboardShortcut=l;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("../../_virtual/_rollupPluginBabelHelpers.js"),r=require("react"),a=(e=require("classnames"))&&"object"==typeof e&&"default"in e?e.default:e;const s=["children","className","translateKey","isMac"];let c=e=>e;function n(e){switch(e.toLowerCase()){case"cmd":case"mod":return"⌘";case"control":case"ctrl":return"⌃";case"alt":return"⌥";case"shift":return"⇧";case"space":return"␣";default:return e}}function l(e){var l,o;let{children:u,className:i,translateKey:p=c,isMac:d=null!=(l=null==(o=navigator.platform)?void 0:o.toUpperCase().includes("MAC"))&&l}=e,m=t.objectWithoutProperties(e,s);const f="string"==typeof u?[u]:u;return r.createElement("span",t.objectSpread2({className:a("reactist_keyboard_shortcut",i,{"reactist_keyboard_shortcut--macos":d})},m),f.map((e,t)=>r.createElement(r.Fragment,{key:t},0===t?null:", ",r.createElement("kbd",null,function(e,t,r){const a=t?n:r,s=/\b(mod|cmd|ctrl|control|alt|shift)\b/i.test(e);return t||(e=e.replace(/\b(mod|cmd)\b/i,"ctrl")),e.split(/\s*\+\s*/).map((function(e){return function(e){return/^(mod|cmd|ctrl|control|alt|shift|space|super)$/i.test(e)}(e)?function(e){return e.charAt(0).toUpperCase()+e.slice(1).toLowerCase()}(a(e)):s&&1===e.length?e.toUpperCase():e}))}(e,d,p).map((e,t)=>r.createElement("kbd",{key:t},e))))))}l.setTranslateKey=e=>{c=e},exports.KeyboardShortcut=l;
 //# sourceMappingURL=keyboard-shortcut.js.map

package/lib/components/keyboard-shortcut/keyboard-shortcut.js.map

@@ -1 +1 @@
-{"version":3,"file":"keyboard-shortcut.js","sources":["../../../src/components/keyboard-shortcut/keyboard-shortcut.tsx"],"sourcesContent":["import * as React from 'react'\nimport classNames from 'classnames'\n\n//\n// Support for setting up how to translate modifiers globally.\n//\n\nlet globalTranslateKey = (key: string) => key\n\ntype TranslateKey = typeof globalTranslateKey\n\nKeyboardShortcut.setTranslateKey = (tr: TranslateKey) => {\n    globalTranslateKey = tr\n}\n\nfunction translateKeyMac(key: string) {\n    switch (key.toLowerCase()) {\n        case 'cmd':\n        case 'mod':\n            return '⌘'\n        case 'control':\n        case 'ctrl':\n            return '⌃'\n        case 'alt':\n            return '⌥'\n        case 'shift':\n            return '⇧'\n        case 'space':\n            return '␣'\n        default:\n            return key\n    }\n}\n\n//\n// Some helpers\n//\n\nfunction capitalize(str: string) {\n    return str.charAt(0).toUpperCase() + str.slice(1).toLowerCase()\n}\n\nfunction hasModifiers(str: string) {\n    return /\\b(mod|cmd|ctrl|control|alt|shift)\\b/i.test(str)\n}\n\nfunction isSpecialKey(str: string) {\n    return /^(mod|cmd|ctrl|control|alt|shift|space|super)$/i.test(str)\n}\n\nfunction parseKeys(shortcut: string, isMac: boolean, translateKey: TranslateKey) {\n    const t = isMac ? translateKeyMac : translateKey\n    const _hasModifiers = hasModifiers(shortcut)\n\n    function mapIndividualKey(str: string) {\n        if (isSpecialKey(str)) {\n            return capitalize(t(str))\n        }\n        if (_hasModifiers && str.length === 1) {\n            return str.toUpperCase()\n        }\n        return str\n    }\n\n    if (!isMac) {\n        shortcut = shortcut.replace(/\\b(mod|cmd)\\b/i, 'ctrl')\n    }\n\n    return shortcut.split(/\\s*\\+\\s*/).map(mapIndividualKey)\n}\n\n//\n// The KeyboardShortcut component\n//\n\ntype NativeSpanProps = React.DetailedHTMLProps<\n    React.HTMLAttributes<HTMLSpanElement>,\n    HTMLSpanElement\n>\n\ntype Props = Omit<NativeSpanProps, 'children'> & {\n    /**\n     * The shortcut to be represented as markup. It supports an intuitive syntax where you can\n     * combine modifiers (cmd, ctrl, shift, alt) with single keys all concatenated with plus signs.\n     * You can also pass various shortcuts as an array, which will be depicted separated by commas.\n     */\n    children: string | string[]\n    /**\n     * A function that allows you to change how some key names are represented. This may be useful,\n     * for instance, to translate modifier names that are expressed differently in other languages\n     * (e.g. `Ctrl` is named `Strg` in German).\n     *\n     * It defaults to a global version that leaves the key as is. You can pass your version as a\n     * prop, or you can also set your own version of this global default one, so you don't need to\n     * pass your own on each invocation of this component.\n     *\n     * ```js\n     * import { KeyboardShortcut } from '@doist/reactist'\n     * KeyboardShortcut.setTranslateKey = key => { ... }\n     * ```\n     *\n     * Note: When the component detects the macOS operating system it bypasses key translation for\n     * most modifiers and uses macOS-specific symbols. See the `isMac` prop for details.\n     */\n    translateKey?: TranslateKey\n    /**\n     * This prop is not meant to be passed. The component will automatically initialize it to `true`\n     * if it detects that the current browser / operating system is on macOS, in which case modifier\n     * keys are represented using macOS' notation (e.g. ⌘ ⌃ ⌥ ⇧).\n     *\n     * Though it is discouraged, if you don't want this special treatment in macOS, you can pass\n     * `isMac={false}` in all invocations of this component.\n     */\n    isMac?: boolean\n}\n\nfunction KeyboardShortcut({\n    children,\n    className,\n    translateKey = globalTranslateKey,\n    isMac = navigator.platform?.toUpperCase().includes('MAC') ?? false,\n    ...props\n}: Props) {\n    const shortcuts = typeof children === 'string' ? [children] : children\n    return (\n        <span\n            className={classNames('reactist_keyboard_shortcut', className, {\n                'reactist_keyboard_shortcut--macos': isMac,\n            })}\n            {...props}\n        >\n            {shortcuts.map((shortcut, i) => (\n                <React.Fragment key={i}>\n                    {i === 0 ? null : ', '}\n                    <kbd>\n                        {parseKeys(shortcut, isMac, translateKey).map((key, j) => (\n                            <kbd key={j}>{key}</kbd>\n                        ))}\n                    </kbd>\n                </React.Fragment>\n            ))}\n        </span>\n    )\n}\n\nexport { KeyboardShortcut }\n"],"names":["globalTranslateKey","key","translateKeyMac","toLowerCase","KeyboardShortcut","children","className","translateKey","isMac","navigator","platform","_navigator$platform","toUpperCase","includes","props","shortcuts","React","classNames","reactist_keyboard_shortcut--macos","map","shortcut","i","t","_hasModifiers","test","replace","split","str","isSpecialKey","charAt","slice","capitalize","length","parseKeys","j","setTranslateKey","tr"],"mappings":"oTAOA,IAAIA,EAAsBC,GAAgBA,EAQ1C,SAASC,EAAgBD,GACrB,OAAQA,EAAIE,eACR,IAAK,MACL,IAAK,MACD,MAAO,IACX,IAAK,UACL,IAAK,OACD,MAAO,IACX,IAAK,MACD,MAAO,IACX,IAAK,QACD,MAAO,IACX,IAAK,QACD,MAAO,IACX,QACI,OAAOF,GAsFnB,SAASG,iBAAiBC,SACtBA,EADsBC,UAEtBA,EAFsBC,aAGtBA,EAAeP,EAHOQ,MAItBA,oBAAQC,UAAUC,iBAAVC,EAAoBC,cAAcC,SAAS,cAChDC,iCAEH,MAAMC,EAAgC,iBAAbV,EAAwB,CAACA,GAAYA,EAC9D,OACIW,wCACIV,UAAWW,EAAW,6BAA8BX,EAAW,CAC3DY,oCAAqCV,KAErCM,GAEHC,EAAUI,IAAI,CAACC,EAAUC,IACtBL,gBAACA,YAAef,IAAKoB,GACV,IAANA,EAAU,KAAO,KAClBL,2BApFpB,SAAmBI,EAAkBZ,EAAgBD,GACjD,MAAMe,EAAId,EAAQN,EAAkBK,EAC9BgB,EATC,wCAAwCC,KASZJ,GAgBnC,OAJKZ,IACDY,EAAWA,EAASK,QAAQ,iBAAkB,SAG3CL,EAASM,MAAM,YAAYP,KAdlC,SAA0BQ,GACtB,OATR,SAAsBA,GAClB,MAAO,kDAAkDH,KAAKG,GAQtDC,CAAaD,GAjBzB,SAAoBA,GAChB,OAAOA,EAAIE,OAAO,GAAGjB,cAAgBe,EAAIG,MAAM,GAAG3B,cAiBnC4B,CAAWT,EAAEK,IAEpBJ,GAAgC,IAAfI,EAAIK,OACdL,EAAIf,cAERe,KA0EUM,CAAUb,EAAUZ,EAAOD,GAAcY,IAAI,CAAClB,EAAKiC,IAChDlB,uBAAKf,IAAKiC,GAAIjC,QA7H1CG,EAAiB+B,gBAAmBC,IAChCpC,EAAqBoC"}
+{"version":3,"file":"keyboard-shortcut.js","sources":["../../../src/components/keyboard-shortcut/keyboard-shortcut.tsx"],"sourcesContent":["import * as React from 'react'\nimport classNames from 'classnames'\n\n//\n// Support for setting up how to translate modifiers globally.\n//\n\nlet globalTranslateKey = (key: string) => key\n\ntype TranslateKey = typeof globalTranslateKey\n\nKeyboardShortcut.setTranslateKey = (tr: TranslateKey) => {\n    globalTranslateKey = tr\n}\n\nfunction translateKeyMac(key: string) {\n    switch (key.toLowerCase()) {\n        case 'cmd':\n        case 'mod':\n            return '⌘'\n        case 'control':\n        case 'ctrl':\n            return '⌃'\n        case 'alt':\n            return '⌥'\n        case 'shift':\n            return '⇧'\n        case 'space':\n            return '␣'\n        default:\n            return key\n    }\n}\n\n//\n// Some helpers\n//\n\nfunction capitalize(str: string) {\n    return str.charAt(0).toUpperCase() + str.slice(1).toLowerCase()\n}\n\nfunction hasModifiers(str: string) {\n    return /\\b(mod|cmd|ctrl|control|alt|shift)\\b/i.test(str)\n}\n\nfunction isSpecialKey(str: string) {\n    return /^(mod|cmd|ctrl|control|alt|shift|space|super)$/i.test(str)\n}\n\nfunction parseKeys(shortcut: string, isMac: boolean, translateKey: TranslateKey) {\n    const t = isMac ? translateKeyMac : translateKey\n    const _hasModifiers = hasModifiers(shortcut)\n\n    function mapIndividualKey(str: string) {\n        if (isSpecialKey(str)) {\n            return capitalize(t(str))\n        }\n        if (_hasModifiers && str.length === 1) {\n            return str.toUpperCase()\n        }\n        return str\n    }\n\n    if (!isMac) {\n        shortcut = shortcut.replace(/\\b(mod|cmd)\\b/i, 'ctrl')\n    }\n\n    return shortcut.split(/\\s*\\+\\s*/).map(mapIndividualKey)\n}\n\n//\n// The KeyboardShortcut component\n//\n\ntype NativeSpanProps = React.DetailedHTMLProps<\n    React.HTMLAttributes<HTMLSpanElement>,\n    HTMLSpanElement\n>\n\ntype Props = Omit<NativeSpanProps, 'children'> & {\n    /**\n     * The shortcut to be represented as markup. It supports an intuitive syntax where you can\n     * combine modifiers (cmd, ctrl, shift, alt) with single keys all concatenated with plus signs.\n     * You can also pass various shortcuts as an array, which will be depicted separated by commas.\n     */\n    children: string | string[]\n    /**\n     * A function that allows you to change how some key names are represented. This may be useful,\n     * for instance, to translate modifier names that are expressed differently in other languages\n     * (e.g. `Ctrl` is named `Strg` in German).\n     *\n     * It defaults to a global version that leaves the key as is. You can pass your version as a\n     * prop, or you can also set your own version of this global default one, so you don't need to\n     * pass your own on each invocation of this component.\n     *\n     * ```js\n     * import { KeyboardShortcut } from '@doist/reactist'\n     * KeyboardShortcut.setTranslateKey = key => { ... }\n     * ```\n     *\n     * Note: When the component detects the macOS operating system it bypasses key translation for\n     * most modifiers and uses macOS-specific symbols. See the `isMac` prop for details.\n     */\n    translateKey?: TranslateKey\n    /**\n     * This prop is not meant to be passed. The component will automatically initialize it to `true`\n     * if it detects that the current browser / operating system is on macOS, in which case modifier\n     * keys are represented using macOS' notation (e.g. ⌘ ⌃ ⌥ ⇧).\n     *\n     * Though it is discouraged, if you don't want this special treatment in macOS, you can pass\n     * `isMac={false}` in all invocations of this component.\n     */\n    isMac?: boolean\n}\n\nfunction KeyboardShortcut({\n    children,\n    className,\n    translateKey = globalTranslateKey,\n    isMac = navigator.platform?.toUpperCase().includes('MAC') ?? false,\n    ...props\n}: Props) {\n    const shortcuts = typeof children === 'string' ? [children] : children\n    return (\n        <span\n            className={classNames('reactist_keyboard_shortcut', className, {\n                'reactist_keyboard_shortcut--macos': isMac,\n            })}\n            {...props}\n        >\n            {shortcuts.map((shortcut, i) => (\n                <React.Fragment key={i}>\n                    {i === 0 ? null : ', '}\n                    <kbd>\n                        {parseKeys(shortcut, isMac, translateKey).map((key, j) => (\n                            <kbd key={j}>{key}</kbd>\n                        ))}\n                    </kbd>\n                </React.Fragment>\n            ))}\n        </span>\n    )\n}\n\nexport { KeyboardShortcut }\n"],"names":["globalTranslateKey","key","translateKeyMac","toLowerCase","KeyboardShortcut","children","className","translateKey","isMac","navigator","platform","_navigator$platform","toUpperCase","includes","props","shortcuts","React","classNames","reactist_keyboard_shortcut--macos","map","shortcut","i","t","_hasModifiers","test","replace","split","str","isSpecialKey","charAt","slice","capitalize","length","parseKeys","j","setTranslateKey","tr"],"mappings":"yRAOA,IAAIA,EAAsBC,GAAgBA,EAQ1C,SAASC,EAAgBD,GACrB,OAAQA,EAAIE,eACR,IAAK,MACL,IAAK,MACD,MAAO,IACX,IAAK,UACL,IAAK,OACD,MAAO,IACX,IAAK,MACD,MAAO,IACX,IAAK,QACD,MAAO,IACX,IAAK,QACD,MAAO,IACX,QACI,OAAOF,GAsFnB,SAASG,iBAAiBC,SACtBA,EADsBC,UAEtBA,EAFsBC,aAGtBA,EAAeP,EAHOQ,MAItBA,oBAAQC,UAAUC,iBAAVC,EAAoBC,cAAcC,SAAS,cAChDC,iCAEH,MAAMC,EAAgC,iBAAbV,EAAwB,CAACA,GAAYA,EAC9D,OACIW,wCACIV,UAAWW,EAAW,6BAA8BX,EAAW,CAC3DY,oCAAqCV,KAErCM,GAEHC,EAAUI,IAAI,CAACC,EAAUC,IACtBL,gBAACA,YAAef,IAAKoB,GACV,IAANA,EAAU,KAAO,KAClBL,2BApFpB,SAAmBI,EAAkBZ,EAAgBD,GACjD,MAAMe,EAAId,EAAQN,EAAkBK,EAC9BgB,EATC,wCAAwCC,KASZJ,GAgBnC,OAJKZ,IACDY,EAAWA,EAASK,QAAQ,iBAAkB,SAG3CL,EAASM,MAAM,YAAYP,KAdlC,SAA0BQ,GACtB,OATR,SAAsBA,GAClB,MAAO,kDAAkDH,KAAKG,GAQtDC,CAAaD,GAjBzB,SAAoBA,GAChB,OAAOA,EAAIE,OAAO,GAAGjB,cAAgBe,EAAIG,MAAM,GAAG3B,cAiBnC4B,CAAWT,EAAEK,IAEpBJ,GAAgC,IAAfI,EAAIK,OACdL,EAAIf,cAERe,KA0EUM,CAAUb,EAAUZ,EAAOD,GAAcY,IAAI,CAAClB,EAAKiC,IAChDlB,uBAAKf,IAAKiC,GAAIjC,QA7H1CG,EAAiB+B,gBAAmBC,IAChCpC,EAAqBoC"}

package/lib/components/menu/menu.js

@@ -1,2 +1,2 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../_virtual/_rollupPluginBabelHelpers.js"),n=require("react"),o=(e(n),e(require("classnames"))),r=require("../../utils/polymorphism.js"),l=e(require("react-focus-lock")),a=require("ariakit/portal"),c=require("ariakit/menu");const s=["children","onItemSelect"],u=["exceptionallySetClassName"],i=["exceptionallySetClassName"],p=["value","children","onSelect","hideOnSelect","onClick","exceptionallySetClassName","as"],m=["label","children","exceptionallySetClassName"],d=n.createContext({});function b(e){let{children:o,onItemSelect:r}=e,l=t.objectWithoutProperties(e,s);const a=c.useMenuState(t.objectSpread2({focusLoop:!0,gutter:8,shift:4},l)),u=n.useCallback((function(e){r&&r(e)}),[r]),i=n.useMemo(()=>({state:a,handleItemSelect:u}),[a,u]);return n.createElement(d.Provider,{value:i},o)}const S=r.polymorphicComponent((function(e,r){let{exceptionallySetClassName:l}=e,a=t.objectWithoutProperties(e,u);const{state:s}=n.useContext(d);return n.createElement(c.MenuButton,t.objectSpread2(t.objectSpread2({},a),{},{state:s,ref:r,className:o("reactist_menubutton",l)}))})),h=r.polymorphicComponent((function(e,r){let{exceptionallySetClassName:s}=e,u=t.objectWithoutProperties(e,i);const{state:p}=n.useContext(d);return p.visible?n.createElement(a.Portal,{preserveTabOrder:!0},n.createElement(l,{returnFocus:!0},n.createElement(c.Menu,t.objectSpread2(t.objectSpread2({},u),{},{state:p,ref:r,className:o("reactist_menulist",s)})))):null})),C=r.polymorphicComponent((function(e,o){let{value:r,children:l,onSelect:a,hideOnSelect:s=!0,onClick:u,exceptionallySetClassName:i,as:m="button"}=e,b=t.objectWithoutProperties(e,p);const{handleItemSelect:S,state:h}=n.useContext(d),{hide:C}=h,f=n.useCallback((function(e){null==u||u(e);const t=!1!==(a&&!e.defaultPrevented?a():void 0)&&s;S(r),t&&C()}),[a,u,S,s,C,r]);return n.createElement(c.MenuItem,t.objectSpread2(t.objectSpread2({},b),{},{as:m,state:h,ref:o,onClick:f,className:i,hideOnClick:!1}),l)})),f=n.forwardRef((function({children:e,onItemSelect:r},l){const{handleItemSelect:a,state:s}=n.useContext(d),{hide:u}=s,i=n.useCallback((function(e){r&&r(e),a(e),u()}),[u,a,r]),[p,m]=n.Children.toArray(e),S=c.useMenuItem({state:s});return n.createElement(b,{onItemSelect:i},n.cloneElement(p,t.objectSpread2(t.objectSpread2({},S),{},{className:o(S.className,"reactist_submenu_button"),ref:l})),m)})),x=r.polymorphicComponent((function(e,o){let{label:r,children:l,exceptionallySetClassName:a}=e,s=t.objectWithoutProperties(e,m);const{state:u}=n.useContext(d);return n.createElement(c.MenuGroup,t.objectSpread2(t.objectSpread2({},s),{},{ref:o,state:u,className:a}),r?n.createElement("div",{role:"presentation",className:"reactist_menugroup__label"},r):null,l)}));exports.Menu=b,exports.MenuButton=S,exports.MenuGroup=x,exports.MenuItem=C,exports.MenuList=h,exports.SubMenu=f;
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../_virtual/_rollupPluginBabelHelpers.js"),n=require("react"),o=e(require("classnames")),r=require("../../utils/polymorphism.js"),l=e(require("react-focus-lock")),a=require("ariakit/portal"),c=require("ariakit/menu");const s=["children","onItemSelect"],u=["exceptionallySetClassName"],i=["exceptionallySetClassName"],p=["value","children","onSelect","hideOnSelect","onClick","exceptionallySetClassName","as"],m=["label","children","exceptionallySetClassName"],d=n.createContext({});function b(e){let{children:o,onItemSelect:r}=e,l=t.objectWithoutProperties(e,s);const a=c.useMenuState(t.objectSpread2({focusLoop:!0,gutter:8,shift:4},l)),u=n.useCallback((function(e){r&&r(e)}),[r]),i=n.useMemo(()=>({state:a,handleItemSelect:u}),[a,u]);return n.createElement(d.Provider,{value:i},o)}const S=r.polymorphicComponent((function(e,r){let{exceptionallySetClassName:l}=e,a=t.objectWithoutProperties(e,u);const{state:s}=n.useContext(d);return n.createElement(c.MenuButton,t.objectSpread2(t.objectSpread2({},a),{},{state:s,ref:r,className:o("reactist_menubutton",l)}))})),h=r.polymorphicComponent((function(e,r){let{exceptionallySetClassName:s}=e,u=t.objectWithoutProperties(e,i);const{state:p}=n.useContext(d);return p.visible?n.createElement(a.Portal,{preserveTabOrder:!0},n.createElement(l,{returnFocus:!0},n.createElement(c.Menu,t.objectSpread2(t.objectSpread2({},u),{},{state:p,ref:r,className:o("reactist_menulist",s)})))):null})),C=r.polymorphicComponent((function(e,o){let{value:r,children:l,onSelect:a,hideOnSelect:s=!0,onClick:u,exceptionallySetClassName:i,as:m="button"}=e,b=t.objectWithoutProperties(e,p);const{handleItemSelect:S,state:h}=n.useContext(d),{hide:C}=h,f=n.useCallback((function(e){null==u||u(e);const t=!1!==(a&&!e.defaultPrevented?a():void 0)&&s;S(r),t&&C()}),[a,u,S,s,C,r]);return n.createElement(c.MenuItem,t.objectSpread2(t.objectSpread2({},b),{},{as:m,state:h,ref:o,onClick:f,className:i,hideOnClick:!1}),l)})),f=n.forwardRef((function({children:e,onItemSelect:r},l){const{handleItemSelect:a,state:s}=n.useContext(d),{hide:u}=s,i=n.useCallback((function(e){r&&r(e),a(e),u()}),[u,a,r]),[p,m]=n.Children.toArray(e),S=c.useMenuItem({state:s});return n.createElement(b,{onItemSelect:i},n.cloneElement(p,t.objectSpread2(t.objectSpread2({},S),{},{className:o(S.className,"reactist_submenu_button"),ref:l})),m)})),x=r.polymorphicComponent((function(e,o){let{label:r,children:l,exceptionallySetClassName:a}=e,s=t.objectWithoutProperties(e,m);const{state:u}=n.useContext(d);return n.createElement(c.MenuGroup,t.objectSpread2(t.objectSpread2({},s),{},{ref:o,state:u,className:a}),r?n.createElement("div",{role:"presentation",className:"reactist_menugroup__label"},r):null,l)}));exports.Menu=b,exports.MenuButton=S,exports.MenuGroup=x,exports.MenuItem=C,exports.MenuList=h,exports.SubMenu=f;
 //# sourceMappingURL=menu.js.map

package/lib/components/menu/menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu.js","sources":["../../../src/components/menu/menu.tsx"],"sourcesContent":["import * as React from 'react'\nimport classNames from 'classnames'\nimport FocusLock from 'react-focus-lock'\n\nimport { polymorphicComponent } from '../../utils/polymorphism'\n\n//\n// Reactist menu is a thin wrapper around Ariakit's menu components. This may or may not be\n// temporary. Our goal is to make it transparent for the users of Reactist of this implementation\n// detail. We may change in the future the external lib we use, or even implement it all internally,\n// as long as we keep the same outer interface as intact as possible.\n//\n// Around the heavy lifting of the external lib we just add some features to better integrate the\n// menu to Reactist's more opinionated approach (e.g. using our button with its custom variants and\n// other features, easily show keyboard shortcuts in menu items, etc.)\n//\nimport * as Ariakit from 'ariakit/menu'\nimport { Portal } from 'ariakit/portal'\n\nimport './menu.less'\nimport { useMenuItem } from 'ariakit/menu'\n\ntype NativeProps<E extends HTMLElement> = React.DetailedHTMLProps<React.HTMLAttributes<E>, E>\n\ntype MenuContextState = {\n    state: Ariakit.MenuState\n    handleItemSelect: (value: string | null | undefined) => void\n}\n\nconst MenuContext = React.createContext<MenuContextState>(\n    // Ariakit gives us no means to obtain a valid initial/default value of type MenuStateReturn\n    // (it is normally obtained by calling useMenuState but we can't call hooks outside components).\n    // This is however of little consequence since this value is only used if some of the components\n    // are used outside Menu, something that should not happen and we do not support.\n    // @ts-expect-error\n    {},\n)\n\n//\n// Menu\n//\n\ntype MenuProps = Omit<Ariakit.MenuStateProps, 'visible'> & {\n    /**\n     * The `Menu` must contain a `MenuList` that defines the menu options. It must also contain a\n     * `MenuButton` that triggers the menu to be opened or closed.\n     */\n    children: React.ReactNode\n\n    /**\n     * An optional callback that will be called back whenever a menu item is selected. It receives\n     * the `value` of the selected `MenuItem`.\n     *\n     * If you pass down this callback, it is recommended that you properly memoize it so it does not\n     * change on every render.\n     */\n    onItemSelect?: (value: string | null | undefined) => void\n}\n\n/**\n * Wrapper component to control a menu. It does not render anything, only providing the state\n * management for the menu components inside it. Note that if you are relying on the `[role='menu']`\n * attribute to style the menu list, it is applied a `menubar` role instead in Safari.\n */\nfunction Menu({ children, onItemSelect, ...props }: MenuProps) {\n    const state = Ariakit.useMenuState({ focusLoop: true, gutter: 8, shift: 4, ...props })\n\n    const handleItemSelect = React.useCallback(\n        function handleItemSelect(value: string | null | undefined) {\n            if (onItemSelect) onItemSelect(value)\n        },\n        [onItemSelect],\n    )\n\n    const value: MenuContextState = React.useMemo(\n        () => ({\n            state,\n            handleItemSelect,\n        }),\n        [state, handleItemSelect],\n    )\n\n    return <MenuContext.Provider value={value}>{children}</MenuContext.Provider>\n}\n\n//\n// MenuButton\n//\n\ntype MenuButtonProps = Omit<Ariakit.MenuButtonProps, 'state' | 'className' | 'as'>\n\n/**\n * A button to toggle a dropdown menu open or closed.\n */\nconst MenuButton = polymorphicComponent<'button', MenuButtonProps>(function MenuButton(\n    { exceptionallySetClassName, ...props },\n    ref,\n) {\n    const { state } = React.useContext(MenuContext)\n    return (\n        <Ariakit.MenuButton\n            {...props}\n            state={state}\n            ref={ref}\n            className={classNames('reactist_menubutton', exceptionallySetClassName)}\n        />\n    )\n})\n\n//\n// MenuList\n//\n\ntype MenuListProps = Omit<Ariakit.MenuProps, 'state' | 'className'>\n\n/**\n * The dropdown menu itself, containing a list of menu items.\n */\nconst MenuList = polymorphicComponent<'div', MenuListProps>(function MenuList(\n    { exceptionallySetClassName, ...props },\n    ref,\n) {\n    const { state } = React.useContext(MenuContext)\n\n    return state.visible ? (\n        <Portal preserveTabOrder>\n            <FocusLock returnFocus>\n                <Ariakit.Menu\n                    {...props}\n                    state={state}\n                    ref={ref}\n                    className={classNames('reactist_menulist', exceptionallySetClassName)}\n                />\n            </FocusLock>\n        </Portal>\n    ) : null\n})\n\n//\n// MenuItem\n//\n\ntype MenuItemProps = {\n    /**\n     * An optional value given to this menu item. It is passed on to the parent `Menu`'s\n     * `onItemSelect` when you provide that instead of (or alongside) providing individual\n     * `onSelect` callbacks to each menu item.\n     */\n    value?: string\n    /**\n     * The content inside the menu item.\n     */\n    children: React.ReactNode\n    /**\n     * When `true` the menu item is disabled and won't be selectable or be part of the keyboard\n     * navigation across the menu options.\n     *\n     * @default true\n     */\n    disabled?: boolean\n    /**\n     * When `true` the menu will close when the menu item is selected, in addition to performing the\n     * action that the menu item is set out to do.\n     *\n     * Set this to `false` to make sure that a given menu item does not auto-closes the menu when\n     * selected. This should be the exception and not the norm, as the default is to auto-close.\n     *\n     * @default true\n     */\n    hideOnSelect?: boolean\n    /**\n     * The action to perform when the menu item is selected.\n     *\n     * If you return `false` from this function, the menu will not auto-close when this menu item\n     * is selected. Though you should use `hideOnSelect` for this purpose, this allows you to\n     * achieve the same effect conditionally and dynamically deciding at run time.\n     */\n    onSelect?: () => unknown\n    /**\n     * The event handler called when the menu item is clicked.\n     *\n     * This is similar to `onSelect`, but a bit different. You can certainly use it to trigger the\n     * action that the menu item represents. But in general you should prefer `onSelect` for that.\n     *\n     * The main use for this handler is to get access to the click event. This can be used, for\n     * example, to call `event.preventDefault()`, which will effectively prevent the rest of the\n     * consequences of the click, including preventing `onSelect` from being called. In particular,\n     * this is useful in menu items that are links, and you want the click to not trigger navigation\n     * under some circumstances.\n     */\n    onClick?: (event: React.MouseEvent) => void\n}\n\n/**\n * A menu item inside a menu list. It can be selected by the user, triggering the `onSelect`\n * callback.\n */\nconst MenuItem = polymorphicComponent<'button', MenuItemProps>(function MenuItem(\n    {\n        value,\n        children,\n        onSelect,\n        hideOnSelect = true,\n        onClick,\n        exceptionallySetClassName,\n        as = 'button',\n        ...props\n    },\n    ref,\n) {\n    const { handleItemSelect, state } = React.useContext(MenuContext)\n    const { hide } = state\n\n    const handleClick = React.useCallback(\n        function handleClick(event: React.MouseEvent<HTMLButtonElement>) {\n            onClick?.(event)\n            const onSelectResult: unknown =\n                onSelect && !event.defaultPrevented ? onSelect() : undefined\n            const shouldClose = onSelectResult !== false && hideOnSelect\n            handleItemSelect(value)\n            if (shouldClose) hide()\n        },\n        [onSelect, onClick, handleItemSelect, hideOnSelect, hide, value],\n    )\n\n    return (\n        <Ariakit.MenuItem\n            {...props}\n            as={as}\n            state={state}\n            ref={ref}\n            onClick={handleClick}\n            className={exceptionallySetClassName}\n            hideOnClick={false}\n        >\n            {children}\n        </Ariakit.MenuItem>\n    )\n})\n\n//\n// SubMenu\n//\n\ntype SubMenuProps = Pick<MenuProps, 'children' | 'onItemSelect'>\n\n/**\n * This component can be rendered alongside other `MenuItem` inside a `MenuList` in order to have\n * a sub-menu.\n *\n * Its children are expected to have the structure of a first level menu (a `MenuButton` and a\n * `MenuList`).\n *\n * ```jsx\n * <MenuItem label=\"Edit profile\" />\n * <SubMenu>\n *   <MenuButton>More options</MenuButton>\n *   <MenuList>\n *     <MenuItem label=\"Preferences\" />\n *     <MenuItem label=\"Sign out\" />\n *   </MenuList>\n * </SubMenu>\n * ```\n *\n * The `MenuButton` will become a menu item in the current menu items list, and it will lead to\n * opening a sub-menu with the menu items list below it.\n */\nconst SubMenu = React.forwardRef<HTMLButtonElement, SubMenuProps>(function SubMenu(\n    { children, onItemSelect },\n    ref,\n) {\n    const { handleItemSelect: parentMenuItemSelect, state } = React.useContext(MenuContext)\n    const { hide: parentMenuHide } = state\n\n    const handleSubItemSelect = React.useCallback(\n        function handleSubItemSelect(value: string | null | undefined) {\n            if (onItemSelect) onItemSelect(value)\n            parentMenuItemSelect(value)\n            parentMenuHide()\n        },\n        [parentMenuHide, parentMenuItemSelect, onItemSelect],\n    )\n\n    const [button, list] = React.Children.toArray(children)\n\n    const menuProps = useMenuItem({ state })\n\n    return (\n        <Menu onItemSelect={handleSubItemSelect}>\n            {React.cloneElement(button as React.ReactElement, {\n                ...menuProps,\n                className: classNames(menuProps.className, 'reactist_submenu_button'),\n                ref,\n            })}\n            {list}\n        </Menu>\n    )\n})\n\n//\n// MenuGroup\n//\n\ntype MenuGroupProps = Omit<NativeProps<HTMLDivElement>, 'className'> & {\n    /**\n     * A label to be shown visually and also used to semantically label the group.\n     */\n    label: string\n}\n\n/**\n * A way to semantically group some menu items.\n *\n * This group does not add any visual separator. You can do that yourself adding `<hr />` elements\n * before and/or after the group if you so wish.\n */\nconst MenuGroup = polymorphicComponent<'div', MenuGroupProps>(function MenuGroup(\n    { label, children, exceptionallySetClassName, ...props },\n    ref,\n) {\n    const { state } = React.useContext(MenuContext)\n    return (\n        <Ariakit.MenuGroup {...props} ref={ref} state={state} className={exceptionallySetClassName}>\n            {label ? (\n                <div role=\"presentation\" className=\"reactist_menugroup__label\">\n                    {label}\n                </div>\n            ) : null}\n            {children}\n        </Ariakit.MenuGroup>\n    )\n})\n\nexport { Menu, MenuButton, MenuList, MenuItem, SubMenu, MenuGroup }\nexport type { MenuButtonProps, MenuListProps, MenuItemProps, SubMenuProps, MenuGroupProps }\n"],"names":["MenuContext","React","Menu","children","onItemSelect","props","state","Ariakit","focusLoop","gutter","shift","handleItemSelect","value","Provider","MenuButton","polymorphicComponent","ref","exceptionallySetClassName","className","classNames","MenuList","visible","Portal","preserveTabOrder","FocusLock","returnFocus","MenuItem","onSelect","hideOnSelect","onClick","as","hide","handleClick","event","shouldClose","defaultPrevented","undefined","hideOnClick","SubMenu","parentMenuItemSelect","parentMenuHide","handleSubItemSelect","button","list","toArray","menuProps","useMenuItem","MenuGroup","label","role"],"mappings":"+mBA6BMA,EAAcC,gBAMhB,IA6BJ,SAASC,SAAKC,SAAEA,EAAFC,aAAYA,KAAiBC,iCACvC,MAAMC,EAAQC,gCAAuBC,WAAW,EAAMC,OAAQ,EAAGC,MAAO,GAAML,IAExEM,EAAmBV,eACrB,SAA0BW,GAClBR,GAAcA,EAAaQ,KAEnC,CAACR,IAGCQ,EAA0BX,UAC5B,MACIK,MAAAA,EACAK,iBAAAA,IAEJ,CAACL,EAAOK,IAGZ,OAAOV,gBAACD,EAAYa,UAASD,MAAOA,GAAQT,SAY1CW,EAAaC,wBAAgD,WAE/DC,OADAC,0BAAEA,KAA8BZ,iCAGhC,MAAMC,MAAEA,GAAUL,aAAiBD,GACnC,OACIC,gBAACM,gDACOF,OACJC,MAAOA,EACPU,IAAKA,EACLE,UAAWC,EAAW,sBAAuBF,SAcnDG,EAAWL,wBAA2C,WAExDC,OADAC,0BAAEA,KAA8BZ,iCAGhC,MAAMC,MAAEA,GAAUL,aAAiBD,GAEnC,OAAOM,EAAMe,QACTpB,gBAACqB,UAAOC,qBACJtB,gBAACuB,GAAUC,gBACPxB,gBAACM,0CACOF,OACJC,MAAOA,EACPU,IAAKA,EACLE,UAAWC,EAAW,oBAAqBF,QAIvD,QA8DFS,EAAWX,wBAA8C,WAW3DC,OAVAJ,MACIA,EADJT,SAEIA,EAFJwB,SAGIA,EAHJC,aAIIA,GAAe,EAJnBC,QAKIA,EALJZ,0BAMIA,EANJa,GAOIA,EAAK,YACFzB,iCAIP,MAAMM,iBAAEA,EAAFL,MAAoBA,GAAUL,aAAiBD,IAC/C+B,KAAEA,GAASzB,EAEX0B,EAAc/B,eAChB,SAAqBgC,SACjBJ,GAAAA,EAAUI,GACV,MAEMC,GAAiC,KADnCP,IAAaM,EAAME,iBAAmBR,SAAaS,IACPR,EAChDjB,EAAiBC,GACbsB,GAAaH,MAErB,CAACJ,EAAUE,EAASlB,EAAkBiB,EAAcG,EAAMnB,IAG9D,OACIX,gBAACM,8CACOF,OACJyB,GAAIA,EACJxB,MAAOA,EACPU,IAAKA,EACLa,QAASG,EACTd,UAAWD,EACXoB,aAAa,IAEZlC,MAgCPmC,EAAUrC,cAAkD,UAC9DE,SAAEA,EAAFC,aAAYA,GACZY,GAEA,MAAQL,iBAAkB4B,EAApBjC,MAA0CA,GAAUL,aAAiBD,IACnE+B,KAAMS,GAAmBlC,EAE3BmC,EAAsBxC,eACxB,SAA6BW,GACrBR,GAAcA,EAAaQ,GAC/B2B,EAAqB3B,GACrB4B,MAEJ,CAACA,EAAgBD,EAAsBnC,KAGpCsC,EAAQC,GAAQ1C,WAAe2C,QAAQzC,GAExC0C,EAAYC,cAAY,CAAExC,MAAAA,IAEhC,OACIL,gBAACC,GAAKE,aAAcqC,GACfxC,eAAmByC,qCACbG,OACH3B,UAAWC,EAAW0B,EAAU3B,UAAW,2BAC3CF,IAAAA,KAEH2B,MAsBPI,EAAYhC,wBAA4C,WAE1DC,OADAgC,MAAEA,EAAF7C,SAASA,EAATc,0BAAmBA,KAA8BZ,iCAGjD,MAAMC,MAAEA,GAAUL,aAAiBD,GACnC,OACIC,gBAACM,+CAAsBF,OAAOW,IAAKA,EAAKV,MAAOA,EAAOY,UAAWD,IAC5D+B,EACG/C,uBAAKgD,KAAK,eAAe/B,UAAU,6BAC9B8B,GAEL,KACH7C"}
+{"version":3,"file":"menu.js","sources":["../../../src/components/menu/menu.tsx"],"sourcesContent":["import * as React from 'react'\nimport classNames from 'classnames'\nimport FocusLock from 'react-focus-lock'\n\nimport { polymorphicComponent } from '../../utils/polymorphism'\n\n//\n// Reactist menu is a thin wrapper around Ariakit's menu components. This may or may not be\n// temporary. Our goal is to make it transparent for the users of Reactist of this implementation\n// detail. We may change in the future the external lib we use, or even implement it all internally,\n// as long as we keep the same outer interface as intact as possible.\n//\n// Around the heavy lifting of the external lib we just add some features to better integrate the\n// menu to Reactist's more opinionated approach (e.g. using our button with its custom variants and\n// other features, easily show keyboard shortcuts in menu items, etc.)\n//\nimport * as Ariakit from 'ariakit/menu'\nimport { Portal } from 'ariakit/portal'\n\nimport './menu.less'\nimport { useMenuItem } from 'ariakit/menu'\n\ntype NativeProps<E extends HTMLElement> = React.DetailedHTMLProps<React.HTMLAttributes<E>, E>\n\ntype MenuContextState = {\n    state: Ariakit.MenuState\n    handleItemSelect: (value: string | null | undefined) => void\n}\n\nconst MenuContext = React.createContext<MenuContextState>(\n    // Ariakit gives us no means to obtain a valid initial/default value of type MenuStateReturn\n    // (it is normally obtained by calling useMenuState but we can't call hooks outside components).\n    // This is however of little consequence since this value is only used if some of the components\n    // are used outside Menu, something that should not happen and we do not support.\n    // @ts-expect-error\n    {},\n)\n\n//\n// Menu\n//\n\ntype MenuProps = Omit<Ariakit.MenuStateProps, 'visible'> & {\n    /**\n     * The `Menu` must contain a `MenuList` that defines the menu options. It must also contain a\n     * `MenuButton` that triggers the menu to be opened or closed.\n     */\n    children: React.ReactNode\n\n    /**\n     * An optional callback that will be called back whenever a menu item is selected. It receives\n     * the `value` of the selected `MenuItem`.\n     *\n     * If you pass down this callback, it is recommended that you properly memoize it so it does not\n     * change on every render.\n     */\n    onItemSelect?: (value: string | null | undefined) => void\n}\n\n/**\n * Wrapper component to control a menu. It does not render anything, only providing the state\n * management for the menu components inside it. Note that if you are relying on the `[role='menu']`\n * attribute to style the menu list, it is applied a `menubar` role instead in Safari.\n */\nfunction Menu({ children, onItemSelect, ...props }: MenuProps) {\n    const state = Ariakit.useMenuState({ focusLoop: true, gutter: 8, shift: 4, ...props })\n\n    const handleItemSelect = React.useCallback(\n        function handleItemSelect(value: string | null | undefined) {\n            if (onItemSelect) onItemSelect(value)\n        },\n        [onItemSelect],\n    )\n\n    const value: MenuContextState = React.useMemo(\n        () => ({\n            state,\n            handleItemSelect,\n        }),\n        [state, handleItemSelect],\n    )\n\n    return <MenuContext.Provider value={value}>{children}</MenuContext.Provider>\n}\n\n//\n// MenuButton\n//\n\ntype MenuButtonProps = Omit<Ariakit.MenuButtonProps, 'state' | 'className' | 'as'>\n\n/**\n * A button to toggle a dropdown menu open or closed.\n */\nconst MenuButton = polymorphicComponent<'button', MenuButtonProps>(function MenuButton(\n    { exceptionallySetClassName, ...props },\n    ref,\n) {\n    const { state } = React.useContext(MenuContext)\n    return (\n        <Ariakit.MenuButton\n            {...props}\n            state={state}\n            ref={ref}\n            className={classNames('reactist_menubutton', exceptionallySetClassName)}\n        />\n    )\n})\n\n//\n// MenuList\n//\n\ntype MenuListProps = Omit<Ariakit.MenuProps, 'state' | 'className'>\n\n/**\n * The dropdown menu itself, containing a list of menu items.\n */\nconst MenuList = polymorphicComponent<'div', MenuListProps>(function MenuList(\n    { exceptionallySetClassName, ...props },\n    ref,\n) {\n    const { state } = React.useContext(MenuContext)\n\n    return state.visible ? (\n        <Portal preserveTabOrder>\n            <FocusLock returnFocus>\n                <Ariakit.Menu\n                    {...props}\n                    state={state}\n                    ref={ref}\n                    className={classNames('reactist_menulist', exceptionallySetClassName)}\n                />\n            </FocusLock>\n        </Portal>\n    ) : null\n})\n\n//\n// MenuItem\n//\n\ntype MenuItemProps = {\n    /**\n     * An optional value given to this menu item. It is passed on to the parent `Menu`'s\n     * `onItemSelect` when you provide that instead of (or alongside) providing individual\n     * `onSelect` callbacks to each menu item.\n     */\n    value?: string\n    /**\n     * The content inside the menu item.\n     */\n    children: React.ReactNode\n    /**\n     * When `true` the menu item is disabled and won't be selectable or be part of the keyboard\n     * navigation across the menu options.\n     *\n     * @default true\n     */\n    disabled?: boolean\n    /**\n     * When `true` the menu will close when the menu item is selected, in addition to performing the\n     * action that the menu item is set out to do.\n     *\n     * Set this to `false` to make sure that a given menu item does not auto-closes the menu when\n     * selected. This should be the exception and not the norm, as the default is to auto-close.\n     *\n     * @default true\n     */\n    hideOnSelect?: boolean\n    /**\n     * The action to perform when the menu item is selected.\n     *\n     * If you return `false` from this function, the menu will not auto-close when this menu item\n     * is selected. Though you should use `hideOnSelect` for this purpose, this allows you to\n     * achieve the same effect conditionally and dynamically deciding at run time.\n     */\n    onSelect?: () => unknown\n    /**\n     * The event handler called when the menu item is clicked.\n     *\n     * This is similar to `onSelect`, but a bit different. You can certainly use it to trigger the\n     * action that the menu item represents. But in general you should prefer `onSelect` for that.\n     *\n     * The main use for this handler is to get access to the click event. This can be used, for\n     * example, to call `event.preventDefault()`, which will effectively prevent the rest of the\n     * consequences of the click, including preventing `onSelect` from being called. In particular,\n     * this is useful in menu items that are links, and you want the click to not trigger navigation\n     * under some circumstances.\n     */\n    onClick?: (event: React.MouseEvent) => void\n}\n\n/**\n * A menu item inside a menu list. It can be selected by the user, triggering the `onSelect`\n * callback.\n */\nconst MenuItem = polymorphicComponent<'button', MenuItemProps>(function MenuItem(\n    {\n        value,\n        children,\n        onSelect,\n        hideOnSelect = true,\n        onClick,\n        exceptionallySetClassName,\n        as = 'button',\n        ...props\n    },\n    ref,\n) {\n    const { handleItemSelect, state } = React.useContext(MenuContext)\n    const { hide } = state\n\n    const handleClick = React.useCallback(\n        function handleClick(event: React.MouseEvent<HTMLButtonElement>) {\n            onClick?.(event)\n            const onSelectResult: unknown =\n                onSelect && !event.defaultPrevented ? onSelect() : undefined\n            const shouldClose = onSelectResult !== false && hideOnSelect\n            handleItemSelect(value)\n            if (shouldClose) hide()\n        },\n        [onSelect, onClick, handleItemSelect, hideOnSelect, hide, value],\n    )\n\n    return (\n        <Ariakit.MenuItem\n            {...props}\n            as={as}\n            state={state}\n            ref={ref}\n            onClick={handleClick}\n            className={exceptionallySetClassName}\n            hideOnClick={false}\n        >\n            {children}\n        </Ariakit.MenuItem>\n    )\n})\n\n//\n// SubMenu\n//\n\ntype SubMenuProps = Pick<MenuProps, 'children' | 'onItemSelect'>\n\n/**\n * This component can be rendered alongside other `MenuItem` inside a `MenuList` in order to have\n * a sub-menu.\n *\n * Its children are expected to have the structure of a first level menu (a `MenuButton` and a\n * `MenuList`).\n *\n * ```jsx\n * <MenuItem label=\"Edit profile\" />\n * <SubMenu>\n *   <MenuButton>More options</MenuButton>\n *   <MenuList>\n *     <MenuItem label=\"Preferences\" />\n *     <MenuItem label=\"Sign out\" />\n *   </MenuList>\n * </SubMenu>\n * ```\n *\n * The `MenuButton` will become a menu item in the current menu items list, and it will lead to\n * opening a sub-menu with the menu items list below it.\n */\nconst SubMenu = React.forwardRef<HTMLButtonElement, SubMenuProps>(function SubMenu(\n    { children, onItemSelect },\n    ref,\n) {\n    const { handleItemSelect: parentMenuItemSelect, state } = React.useContext(MenuContext)\n    const { hide: parentMenuHide } = state\n\n    const handleSubItemSelect = React.useCallback(\n        function handleSubItemSelect(value: string | null | undefined) {\n            if (onItemSelect) onItemSelect(value)\n            parentMenuItemSelect(value)\n            parentMenuHide()\n        },\n        [parentMenuHide, parentMenuItemSelect, onItemSelect],\n    )\n\n    const [button, list] = React.Children.toArray(children)\n\n    const menuProps = useMenuItem({ state })\n\n    return (\n        <Menu onItemSelect={handleSubItemSelect}>\n            {React.cloneElement(button as React.ReactElement, {\n                ...menuProps,\n                className: classNames(menuProps.className, 'reactist_submenu_button'),\n                ref,\n            })}\n            {list}\n        </Menu>\n    )\n})\n\n//\n// MenuGroup\n//\n\ntype MenuGroupProps = Omit<NativeProps<HTMLDivElement>, 'className'> & {\n    /**\n     * A label to be shown visually and also used to semantically label the group.\n     */\n    label: string\n}\n\n/**\n * A way to semantically group some menu items.\n *\n * This group does not add any visual separator. You can do that yourself adding `<hr />` elements\n * before and/or after the group if you so wish.\n */\nconst MenuGroup = polymorphicComponent<'div', MenuGroupProps>(function MenuGroup(\n    { label, children, exceptionallySetClassName, ...props },\n    ref,\n) {\n    const { state } = React.useContext(MenuContext)\n    return (\n        <Ariakit.MenuGroup {...props} ref={ref} state={state} className={exceptionallySetClassName}>\n            {label ? (\n                <div role=\"presentation\" className=\"reactist_menugroup__label\">\n                    {label}\n                </div>\n            ) : null}\n            {children}\n        </Ariakit.MenuGroup>\n    )\n})\n\nexport { Menu, MenuButton, MenuList, MenuItem, SubMenu, MenuGroup }\nexport type { MenuButtonProps, MenuListProps, MenuItemProps, SubMenuProps, MenuGroupProps }\n"],"names":["MenuContext","React","Menu","children","onItemSelect","props","state","Ariakit","focusLoop","gutter","shift","handleItemSelect","value","Provider","MenuButton","polymorphicComponent","ref","exceptionallySetClassName","className","classNames","MenuList","visible","Portal","preserveTabOrder","FocusLock","returnFocus","MenuItem","onSelect","hideOnSelect","onClick","as","hide","handleClick","event","shouldClose","defaultPrevented","undefined","hideOnClick","SubMenu","parentMenuItemSelect","parentMenuHide","handleSubItemSelect","button","list","toArray","menuProps","useMenuItem","MenuGroup","label","role"],"mappings":"wmBA6BMA,EAAcC,gBAMhB,IA6BJ,SAASC,SAAKC,SAAEA,EAAFC,aAAYA,KAAiBC,iCACvC,MAAMC,EAAQC,gCAAuBC,WAAW,EAAMC,OAAQ,EAAGC,MAAO,GAAML,IAExEM,EAAmBV,eACrB,SAA0BW,GAClBR,GAAcA,EAAaQ,KAEnC,CAACR,IAGCQ,EAA0BX,UAC5B,MACIK,MAAAA,EACAK,iBAAAA,IAEJ,CAACL,EAAOK,IAGZ,OAAOV,gBAACD,EAAYa,UAASD,MAAOA,GAAQT,SAY1CW,EAAaC,wBAAgD,WAE/DC,OADAC,0BAAEA,KAA8BZ,iCAGhC,MAAMC,MAAEA,GAAUL,aAAiBD,GACnC,OACIC,gBAACM,gDACOF,OACJC,MAAOA,EACPU,IAAKA,EACLE,UAAWC,EAAW,sBAAuBF,SAcnDG,EAAWL,wBAA2C,WAExDC,OADAC,0BAAEA,KAA8BZ,iCAGhC,MAAMC,MAAEA,GAAUL,aAAiBD,GAEnC,OAAOM,EAAMe,QACTpB,gBAACqB,UAAOC,qBACJtB,gBAACuB,GAAUC,gBACPxB,gBAACM,0CACOF,OACJC,MAAOA,EACPU,IAAKA,EACLE,UAAWC,EAAW,oBAAqBF,QAIvD,QA8DFS,EAAWX,wBAA8C,WAW3DC,OAVAJ,MACIA,EADJT,SAEIA,EAFJwB,SAGIA,EAHJC,aAIIA,GAAe,EAJnBC,QAKIA,EALJZ,0BAMIA,EANJa,GAOIA,EAAK,YACFzB,iCAIP,MAAMM,iBAAEA,EAAFL,MAAoBA,GAAUL,aAAiBD,IAC/C+B,KAAEA,GAASzB,EAEX0B,EAAc/B,eAChB,SAAqBgC,SACjBJ,GAAAA,EAAUI,GACV,MAEMC,GAAiC,KADnCP,IAAaM,EAAME,iBAAmBR,SAAaS,IACPR,EAChDjB,EAAiBC,GACbsB,GAAaH,MAErB,CAACJ,EAAUE,EAASlB,EAAkBiB,EAAcG,EAAMnB,IAG9D,OACIX,gBAACM,8CACOF,OACJyB,GAAIA,EACJxB,MAAOA,EACPU,IAAKA,EACLa,QAASG,EACTd,UAAWD,EACXoB,aAAa,IAEZlC,MAgCPmC,EAAUrC,cAAkD,UAC9DE,SAAEA,EAAFC,aAAYA,GACZY,GAEA,MAAQL,iBAAkB4B,EAApBjC,MAA0CA,GAAUL,aAAiBD,IACnE+B,KAAMS,GAAmBlC,EAE3BmC,EAAsBxC,eACxB,SAA6BW,GACrBR,GAAcA,EAAaQ,GAC/B2B,EAAqB3B,GACrB4B,MAEJ,CAACA,EAAgBD,EAAsBnC,KAGpCsC,EAAQC,GAAQ1C,WAAe2C,QAAQzC,GAExC0C,EAAYC,cAAY,CAAExC,MAAAA,IAEhC,OACIL,gBAACC,GAAKE,aAAcqC,GACfxC,eAAmByC,qCACbG,OACH3B,UAAWC,EAAW0B,EAAU3B,UAAW,2BAC3CF,IAAAA,KAEH2B,MAsBPI,EAAYhC,wBAA4C,WAE1DC,OADAgC,MAAEA,EAAF7C,SAASA,EAATc,0BAAmBA,KAA8BZ,iCAGjD,MAAMC,MAAEA,GAAUL,aAAiBD,GACnC,OACIC,gBAACM,+CAAsBF,OAAOW,IAAKA,EAAKV,MAAOA,EAAOY,UAAWD,IAC5D+B,EACG/C,uBAAKgD,KAAK,eAAe/B,UAAU,6BAC9B8B,GAEL,KACH7C"}

package/lib/components/notification/notification.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import './notification.less';
 declare type NotificationProps = {
     id: string;

package/lib/components/notification/notification.js

@@ -1,2 +1,2 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../_virtual/_rollupPluginBabelHelpers.js"),l=e(require("react")),i=e(require("classnames")),n=require("../icons/CloseIcon.svg.js");const a=["id","icon","title","subtitle","children","customCloseButton","onClick","onClose","closeAltText","className","aria-live"];exports.Notification=function(e){let{id:o,icon:c,title:r,subtitle:s,children:u,customCloseButton:b,onClick:d,onClose:m,closeAltText:f="Close",className:p,"aria-live":_="polite"}=e,j=t.objectWithoutProperties(e,a);const v=r?o+"-title":null,C=v?{id:v}:null,N=s?o+"-subtitle":null,E=N?{id:N}:null,h=u?o+"-content":null,S=h?{"aria-labelledby":h}:v?{"aria-labelledby":v}:null,y=N&&!u?{"aria-describedby":N}:null,B=l.createElement("div",t.objectSpread2({className:"reactist-notification__content"},u?{id:o+"-content"}:null),null!=u?u:l.createElement(l.Fragment,null,r?l.createElement("h3",t.objectSpread2({className:"reactist-notification__title"},C),r):null,s?l.createElement("p",t.objectSpread2({className:"reactist-notification__subtitle"},E),s):null)),g=l.createElement("div",{className:"reactist-notification__icon-content-group"},null!=c?c:null,B);return l.createElement("div",t.objectSpread2(t.objectSpread2(t.objectSpread2({id:o,role:"alert",className:i("reactist-notification",p,{"reactist-notification--with-button":Boolean(d),"reactist-notification--with-close-button":Boolean(m)}),"aria-live":_},S),y),j),d?l.createElement("button",{className:"reactist-notification__button",onClick:d},g):g,m?l.createElement("button",{className:"reactist-notification__close-button",onClick:m,"aria-label":f},null!=b?b:l.createElement(n.default,null)):null)};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("../../_virtual/_rollupPluginBabelHelpers.js"),l=require("react"),i=(e=require("classnames"))&&"object"==typeof e&&"default"in e?e.default:e,n=require("../icons/CloseIcon.svg.js");const a=["id","icon","title","subtitle","children","customCloseButton","onClick","onClose","closeAltText","className","aria-live"];exports.Notification=function(e){let{id:o,icon:c,title:r,subtitle:s,children:u,customCloseButton:b,onClick:d,onClose:m,closeAltText:f="Close",className:p,"aria-live":_="polite"}=e,j=t.objectWithoutProperties(e,a);const v=r?o+"-title":null,C=v?{id:v}:null,N=s?o+"-subtitle":null,E=N?{id:N}:null,h=u?o+"-content":null,S=h?{"aria-labelledby":h}:v?{"aria-labelledby":v}:null,y=N&&!u?{"aria-describedby":N}:null,B=l.createElement("div",t.objectSpread2({className:"reactist-notification__content"},u?{id:o+"-content"}:null),null!=u?u:l.createElement(l.Fragment,null,r?l.createElement("h3",t.objectSpread2({className:"reactist-notification__title"},C),r):null,s?l.createElement("p",t.objectSpread2({className:"reactist-notification__subtitle"},E),s):null)),g=l.createElement("div",{className:"reactist-notification__icon-content-group"},null!=c?c:null,B);return l.createElement("div",t.objectSpread2(t.objectSpread2(t.objectSpread2({id:o,role:"alert",className:i("reactist-notification",p,{"reactist-notification--with-button":Boolean(d),"reactist-notification--with-close-button":Boolean(m)}),"aria-live":_},S),y),j),d?l.createElement("button",{className:"reactist-notification__button",onClick:d},g):g,m?l.createElement("button",{className:"reactist-notification__close-button",onClick:m,"aria-label":f},null!=b?b:l.createElement(n.default,null)):null)};
 //# sourceMappingURL=notification.js.map

package/lib/components/notification/notification.js.map

@@ -1 +1 @@
-{"version":3,"file":"notification.js","sources":["../../../src/components/notification/notification.tsx"],"sourcesContent":["import React from 'react'\nimport classNames from 'classnames'\nimport CloseIcon from '../icons/CloseIcon.svg'\nimport './notification.less'\n\ntype NotificationProps = {\n    id: string\n    icon?: React.ReactNode\n    title?: React.ReactNode\n    subtitle?: React.ReactNode\n    children?: React.ReactNode\n    customCloseButton?: React.ReactNode\n    onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void\n    onClose?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void\n    closeAltText?: string\n    className?: string\n    /** Indicates that the notification will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region. */\n    'aria-live'?: 'off' | 'polite' | 'assertive'\n} & Omit<JSX.IntrinsicElements['div'], 'aria-live'>\n\nfunction Notification({\n    id,\n    icon,\n    title,\n    subtitle,\n    children,\n    customCloseButton,\n    onClick,\n    onClose,\n    closeAltText = 'Close',\n    className,\n    'aria-live': ariaLive = 'polite',\n    ...rest\n}: NotificationProps) {\n    const titleId = title ? `${id}-title` : null\n    const titleIdAttribute = titleId ? { id: titleId } : null\n    const subtitleId = subtitle ? `${id}-subtitle` : null\n    const subtitleIdAttribute = subtitleId ? { id: subtitleId } : null\n    const contentId = children ? `${id}-content` : null\n    const contentIdAttribute = children ? { id: `${id}-content` } : null\n    const ariaLabelledBy = contentId\n        ? { 'aria-labelledby': contentId }\n        : titleId\n        ? { 'aria-labelledby': titleId }\n        : null\n    const ariaDescribedBy = subtitleId && !children ? { 'aria-describedby': subtitleId } : null\n\n    const notificationContent = (\n        <div className=\"reactist-notification__content\" {...contentIdAttribute}>\n            {children ?? (\n                <>\n                    {title ? (\n                        <h3 className=\"reactist-notification__title\" {...titleIdAttribute}>\n                            {title}\n                        </h3>\n                    ) : null}\n                    {subtitle ? (\n                        <p className=\"reactist-notification__subtitle\" {...subtitleIdAttribute}>\n                            {subtitle}\n                        </p>\n                    ) : null}\n                </>\n            )}\n        </div>\n    )\n    const notificationBody = (\n        <div className=\"reactist-notification__icon-content-group\">\n            {icon ?? null}\n            {notificationContent}\n        </div>\n    )\n\n    return (\n        <div\n            id={id}\n            role=\"alert\"\n            className={classNames('reactist-notification', className, {\n                'reactist-notification--with-button': Boolean(onClick),\n                'reactist-notification--with-close-button': Boolean(onClose),\n            })}\n            aria-live={ariaLive}\n            {...ariaLabelledBy}\n            {...ariaDescribedBy}\n            {...rest}\n        >\n            {onClick ? (\n                <button className=\"reactist-notification__button\" onClick={onClick}>\n                    {notificationBody}\n                </button>\n            ) : (\n                notificationBody\n            )}\n\n            {onClose ? (\n                <button\n                    className=\"reactist-notification__close-button\"\n                    onClick={onClose}\n                    aria-label={closeAltText}\n                >\n                    {customCloseButton ?? <CloseIcon />}\n                </button>\n            ) : null}\n        </div>\n    )\n}\n\nexport { Notification }\n"],"names":["id","icon","title","subtitle","children","customCloseButton","onClick","onClose","closeAltText","className","aria-live","ariaLive","rest","titleId","titleIdAttribute","subtitleId","subtitleIdAttribute","contentId","ariaLabelledBy","aria-labelledby","ariaDescribedBy","aria-describedby","notificationContent","React","notificationBody","role","classNames","reactist-notification--with-button","Boolean","reactist-notification--with-close-button","CloseIcon"],"mappings":"ubAoBA,gBAAsBA,GAClBA,EADkBC,KAElBA,EAFkBC,MAGlBA,EAHkBC,SAIlBA,EAJkBC,SAKlBA,EALkBC,kBAMlBA,EANkBC,QAOlBA,EAPkBC,QAQlBA,EARkBC,aASlBA,EAAe,QATGC,UAUlBA,EACAC,YAAaC,EAAW,YACrBC,iCAEH,MAAMC,EAAUX,EAAWF,WAAa,KAClCc,EAAmBD,EAAU,CAAEb,GAAIa,GAAY,KAC/CE,EAAaZ,EAAcH,cAAgB,KAC3CgB,EAAsBD,EAAa,CAAEf,GAAIe,GAAe,KACxDE,EAAYb,EAAcJ,aAAe,KAEzCkB,EAAiBD,EACjB,CAAEE,kBAAmBF,GACrBJ,EACA,CAAEM,kBAAmBN,GACrB,KACAO,EAAkBL,IAAeX,EAAW,CAAEiB,mBAAoBN,GAAe,KAEjFO,EACFC,uCAAKd,UAAU,kCATQL,EAAW,CAAEJ,GAAOA,cAAiB,YAUvDI,EAAAA,EACGmB,gCACKrB,EACGqB,sCAAId,UAAU,gCAAmCK,GAC5CZ,GAEL,KACHC,EACGoB,qCAAGd,UAAU,mCAAsCO,GAC9Cb,GAEL,OAKdqB,EACFD,uBAAKd,UAAU,mDACVR,EAAAA,EAAQ,KACRqB,GAIT,OACIC,uEACIvB,GAAIA,EACJyB,KAAK,QACLhB,UAAWiB,EAAW,wBAAyBjB,EAAW,CACtDkB,qCAAsCC,QAAQtB,GAC9CuB,2CAA4CD,QAAQrB,iBAE7CI,GACPO,GACAE,GACAR,GAEHN,EACGiB,0BAAQd,UAAU,gCAAgCH,QAASA,GACtDkB,GAGLA,EAGHjB,EACGgB,0BACId,UAAU,sCACVH,QAASC,eACGC,SAEXH,EAAAA,EAAqBkB,gBAACO,iBAE3B"}
+{"version":3,"file":"notification.js","sources":["../../../src/components/notification/notification.tsx"],"sourcesContent":["import * as React from 'react'\nimport classNames from 'classnames'\nimport CloseIcon from '../icons/CloseIcon.svg'\nimport './notification.less'\n\ntype NotificationProps = {\n    id: string\n    icon?: React.ReactNode\n    title?: React.ReactNode\n    subtitle?: React.ReactNode\n    children?: React.ReactNode\n    customCloseButton?: React.ReactNode\n    onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void\n    onClose?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void\n    closeAltText?: string\n    className?: string\n    /** Indicates that the notification will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region. */\n    'aria-live'?: 'off' | 'polite' | 'assertive'\n} & Omit<JSX.IntrinsicElements['div'], 'aria-live'>\n\nfunction Notification({\n    id,\n    icon,\n    title,\n    subtitle,\n    children,\n    customCloseButton,\n    onClick,\n    onClose,\n    closeAltText = 'Close',\n    className,\n    'aria-live': ariaLive = 'polite',\n    ...rest\n}: NotificationProps) {\n    const titleId = title ? `${id}-title` : null\n    const titleIdAttribute = titleId ? { id: titleId } : null\n    const subtitleId = subtitle ? `${id}-subtitle` : null\n    const subtitleIdAttribute = subtitleId ? { id: subtitleId } : null\n    const contentId = children ? `${id}-content` : null\n    const contentIdAttribute = children ? { id: `${id}-content` } : null\n    const ariaLabelledBy = contentId\n        ? { 'aria-labelledby': contentId }\n        : titleId\n        ? { 'aria-labelledby': titleId }\n        : null\n    const ariaDescribedBy = subtitleId && !children ? { 'aria-describedby': subtitleId } : null\n\n    const notificationContent = (\n        <div className=\"reactist-notification__content\" {...contentIdAttribute}>\n            {children ?? (\n                <>\n                    {title ? (\n                        <h3 className=\"reactist-notification__title\" {...titleIdAttribute}>\n                            {title}\n                        </h3>\n                    ) : null}\n                    {subtitle ? (\n                        <p className=\"reactist-notification__subtitle\" {...subtitleIdAttribute}>\n                            {subtitle}\n                        </p>\n                    ) : null}\n                </>\n            )}\n        </div>\n    )\n    const notificationBody = (\n        <div className=\"reactist-notification__icon-content-group\">\n            {icon ?? null}\n            {notificationContent}\n        </div>\n    )\n\n    return (\n        <div\n            id={id}\n            role=\"alert\"\n            className={classNames('reactist-notification', className, {\n                'reactist-notification--with-button': Boolean(onClick),\n                'reactist-notification--with-close-button': Boolean(onClose),\n            })}\n            aria-live={ariaLive}\n            {...ariaLabelledBy}\n            {...ariaDescribedBy}\n            {...rest}\n        >\n            {onClick ? (\n                <button className=\"reactist-notification__button\" onClick={onClick}>\n                    {notificationBody}\n                </button>\n            ) : (\n                notificationBody\n            )}\n\n            {onClose ? (\n                <button\n                    className=\"reactist-notification__close-button\"\n                    onClick={onClose}\n                    aria-label={closeAltText}\n                >\n                    {customCloseButton ?? <CloseIcon />}\n                </button>\n            ) : null}\n        </div>\n    )\n}\n\nexport { Notification }\n"],"names":["id","icon","title","subtitle","children","customCloseButton","onClick","onClose","closeAltText","className","aria-live","ariaLive","rest","titleId","titleIdAttribute","subtitleId","subtitleIdAttribute","contentId","ariaLabelledBy","aria-labelledby","ariaDescribedBy","aria-describedby","notificationContent","React","notificationBody","role","classNames","reactist-notification--with-button","Boolean","reactist-notification--with-close-button","CloseIcon"],"mappings":"gaAoBA,gBAAsBA,GAClBA,EADkBC,KAElBA,EAFkBC,MAGlBA,EAHkBC,SAIlBA,EAJkBC,SAKlBA,EALkBC,kBAMlBA,EANkBC,QAOlBA,EAPkBC,QAQlBA,EARkBC,aASlBA,EAAe,QATGC,UAUlBA,EACAC,YAAaC,EAAW,YACrBC,iCAEH,MAAMC,EAAUX,EAAWF,WAAa,KAClCc,EAAmBD,EAAU,CAAEb,GAAIa,GAAY,KAC/CE,EAAaZ,EAAcH,cAAgB,KAC3CgB,EAAsBD,EAAa,CAAEf,GAAIe,GAAe,KACxDE,EAAYb,EAAcJ,aAAe,KAEzCkB,EAAiBD,EACjB,CAAEE,kBAAmBF,GACrBJ,EACA,CAAEM,kBAAmBN,GACrB,KACAO,EAAkBL,IAAeX,EAAW,CAAEiB,mBAAoBN,GAAe,KAEjFO,EACFC,uCAAKd,UAAU,kCATQL,EAAW,CAAEJ,GAAOA,cAAiB,YAUvDI,EAAAA,EACGmB,gCACKrB,EACGqB,sCAAId,UAAU,gCAAmCK,GAC5CZ,GAEL,KACHC,EACGoB,qCAAGd,UAAU,mCAAsCO,GAC9Cb,GAEL,OAKdqB,EACFD,uBAAKd,UAAU,mDACVR,EAAAA,EAAQ,KACRqB,GAIT,OACIC,uEACIvB,GAAIA,EACJyB,KAAK,QACLhB,UAAWiB,EAAW,wBAAyBjB,EAAW,CACtDkB,qCAAsCC,QAAQtB,GAC9CuB,2CAA4CD,QAAQrB,iBAE7CI,GACPO,GACAE,GACAR,GAEHN,EACGiB,0BAAQd,UAAU,gCAAgCH,QAASA,GACtDkB,GAGLA,EAGHjB,EACGgB,0BACId,UAAU,sCACVH,QAASC,eACGC,SAEXH,EAAAA,EAAqBkB,gBAACO,iBAE3B"}

package/lib/components/progress-bar/progress-bar.js

@@ -1,2 +1,2 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var r=e(require("react")),a=e(require("classnames")),t=require("../../new-components/hidden-visually/hidden-visually.js");function s({fillPercentage:e=0,className:s,"aria-valuetext":l}){const n=a("reactist_progress_bar",s),i=e<0?0:e>100?100:e;return r.createElement("div",{className:n},r.createElement("div",{className:"inner",style:{width:i+"%"}}),r.createElement(t.HiddenVisually,null,r.createElement("progress",{value:i,max:100,"aria-valuetext":null!=l?l:void 0})))}s.displayName="ProgressBar",exports.ProgressBar=s;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,a=require("react"),r=(e=require("classnames"))&&"object"==typeof e&&"default"in e?e.default:e,t=require("../../new-components/hidden-visually/hidden-visually.js");function s({fillPercentage:e=0,className:s,"aria-valuetext":l}){const i=r("reactist_progress_bar",s),n=e<0?0:e>100?100:e;return a.createElement("div",{className:i},a.createElement("div",{className:"inner",style:{width:n+"%"}}),a.createElement(t.HiddenVisually,null,a.createElement("progress",{value:n,max:100,"aria-valuetext":null!=l?l:void 0})))}s.displayName="ProgressBar",exports.ProgressBar=s;
 //# sourceMappingURL=progress-bar.js.map

package/lib/components/progress-bar/progress-bar.js.map

@@ -1 +1 @@
-{"version":3,"file":"progress-bar.js","sources":["../../../src/components/progress-bar/progress-bar.tsx"],"sourcesContent":["import React from 'react'\nimport { HiddenVisually } from '../../new-components/hidden-visually'\nimport classNames from 'classnames'\n\nimport './progress-bar.less'\n\ntype Props = {\n    /** Additional css class applied to the progress bar. */\n    className?: string\n    /** How much of the progress bar should be filled. Number between 0 and 100 inclusive. */\n    fillPercentage?: number\n    /** Defines the human readable text alternative for assitive technologies. */\n    'aria-valuetext'?: string\n}\nfunction ProgressBar({ fillPercentage = 0, className, 'aria-valuetext': ariaValuetext }: Props) {\n    const finalClassName = classNames('reactist_progress_bar', className)\n    const width = fillPercentage < 0 ? 0 : fillPercentage > 100 ? 100 : fillPercentage\n    return (\n        <div className={finalClassName}>\n            <div className=\"inner\" style={{ width: `${width}%` }} />\n            <HiddenVisually>\n                <progress value={width} max={100} aria-valuetext={ariaValuetext ?? undefined} />\n            </HiddenVisually>\n        </div>\n    )\n}\nProgressBar.displayName = 'ProgressBar'\n\nexport { ProgressBar }\n"],"names":["ProgressBar","fillPercentage","className","aria-valuetext","ariaValuetext","finalClassName","classNames","width","React","style","HiddenVisually","value","max","undefined","displayName"],"mappings":"oQAcA,SAASA,GAAYC,eAAEA,EAAiB,EAAnBC,UAAsBA,EAAWC,iBAAkBC,IACpE,MAAMC,EAAiBC,EAAW,wBAAyBJ,GACrDK,EAAQN,EAAiB,EAAI,EAAIA,EAAiB,IAAM,IAAMA,EACpE,OACIO,uBAAKN,UAAWG,GACZG,uBAAKN,UAAU,QAAQO,MAAO,CAAEF,MAAUA,SAC1CC,gBAACE,sBACGF,4BAAUG,MAAOJ,EAAOK,IAAK,2BAAqBR,EAAAA,OAAiBS,MAKnFb,EAAYc,YAAc"}
+{"version":3,"file":"progress-bar.js","sources":["../../../src/components/progress-bar/progress-bar.tsx"],"sourcesContent":["import * as React from 'react'\nimport { HiddenVisually } from '../../new-components/hidden-visually'\nimport classNames from 'classnames'\n\nimport './progress-bar.less'\n\ntype Props = {\n    /** Additional css class applied to the progress bar. */\n    className?: string\n    /** How much of the progress bar should be filled. Number between 0 and 100 inclusive. */\n    fillPercentage?: number\n    /** Defines the human readable text alternative for assitive technologies. */\n    'aria-valuetext'?: string\n}\nfunction ProgressBar({ fillPercentage = 0, className, 'aria-valuetext': ariaValuetext }: Props) {\n    const finalClassName = classNames('reactist_progress_bar', className)\n    const width = fillPercentage < 0 ? 0 : fillPercentage > 100 ? 100 : fillPercentage\n    return (\n        <div className={finalClassName}>\n            <div className=\"inner\" style={{ width: `${width}%` }} />\n            <HiddenVisually>\n                <progress value={width} max={100} aria-valuetext={ariaValuetext ?? undefined} />\n            </HiddenVisually>\n        </div>\n    )\n}\nProgressBar.displayName = 'ProgressBar'\n\nexport { ProgressBar }\n"],"names":["ProgressBar","fillPercentage","className","aria-valuetext","ariaValuetext","finalClassName","classNames","width","React","style","HiddenVisually","value","max","undefined","displayName"],"mappings":"6OAcA,SAASA,GAAYC,eAAEA,EAAiB,EAAnBC,UAAsBA,EAAWC,iBAAkBC,IACpE,MAAMC,EAAiBC,EAAW,wBAAyBJ,GACrDK,EAAQN,EAAiB,EAAI,EAAIA,EAAiB,IAAM,IAAMA,EACpE,OACIO,uBAAKN,UAAWG,GACZG,uBAAKN,UAAU,QAAQO,MAAO,CAAEF,MAAUA,SAC1CC,gBAACE,sBACGF,4BAAUG,MAAOJ,EAAOK,IAAK,2BAAqBR,EAAAA,OAAiBS,MAKnFb,EAAYc,YAAc"}

package/lib/components/time/time.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { TimeConfig } from './time-utils';
 import './time.less';
 declare type Props = {

package/lib/components/time/time.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=(e=require("react"))&&"object"==typeof e&&"default"in e?e.default:e,s=require("../tooltip/tooltip.js"),r=require("./time-utils.js");class o extends t.Component{constructor(e){super(e),this.refreshInterval=void 0,this.refreshInterval=void 0,this.state={hovered:!1,mouseX:void 0,mouseY:void 0}}componentDidMount(){this.props.refresh&&this._refresh()}componentDidUpdate(e){!e.refresh&&this.props.refresh&&this._refresh(),e.refresh&&!this.props.refresh&&this.refreshInterval&&clearTimeout(this.refreshInterval)}componentWillUnmount(){this.refreshInterval&&clearTimeout(this.refreshInterval)}_setHovered(e,t){const{mouseX:s,mouseY:r}=this.state,{clientX:o,clientY:i}=t;o===s&&i===r||this.setState(()=>({hovered:e,mouseX:o,mouseY:i}))}_renderTime(e){if(this.props.time){if(this.state.hovered){if(this.props.expandFullyOnHover&&!this.props.tooltipOnHover)return r.TimeUtils.formatTimeLong(this.props.time,e);if(this.props.expandOnHover&&!this.props.tooltipOnHover)return r.TimeUtils.formatTime(this.props.time,e)}return r.TimeUtils.timeAgo(this.props.time,e)}}_refresh(){this.refreshInterval=setInterval(()=>{this.forceUpdate()},6e4)}render(){let e="reactist_time";this.props.className&&(e=this.props.className);const o=this._renderTime(this.props.config);return t.createElement("time",{className:e,onMouseEnter:e=>this._setHovered(!0,e),onMouseLeave:e=>this._setHovered(!1,e)},this.props.tooltipOnHover?t.createElement(s.Tooltip,{content:this.props.tooltip||this.props.time&&r.TimeUtils.formatTimeLong(this.props.time,this.props.config)},t.createElement("span",null,o)):o)}}o.displayName=void 0,o.defaultProps=void 0,o.displayName="Time",o.defaultProps={expandOnHover:!1,expandFullyOnHover:!1,tooltipOnHover:!1,refresh:!0,config:{locale:"en",daysSuffix:"d",hoursSuffix:"h",minutesSuffix:"m",momentsAgo:"moments ago"}},exports.Time=o;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("../tooltip/tooltip.js"),s=require("./time-utils.js");class r extends e.Component{constructor(e){super(e),this.refreshInterval=void 0,this.refreshInterval=void 0,this.state={hovered:!1,mouseX:void 0,mouseY:void 0}}componentDidMount(){this.props.refresh&&this._refresh()}componentDidUpdate(e){!e.refresh&&this.props.refresh&&this._refresh(),e.refresh&&!this.props.refresh&&this.refreshInterval&&clearTimeout(this.refreshInterval)}componentWillUnmount(){this.refreshInterval&&clearTimeout(this.refreshInterval)}_setHovered(e,t){const{mouseX:s,mouseY:r}=this.state,{clientX:o,clientY:i}=t;o===s&&i===r||this.setState(()=>({hovered:e,mouseX:o,mouseY:i}))}_renderTime(e){if(this.props.time){if(this.state.hovered){if(this.props.expandFullyOnHover&&!this.props.tooltipOnHover)return s.TimeUtils.formatTimeLong(this.props.time,e);if(this.props.expandOnHover&&!this.props.tooltipOnHover)return s.TimeUtils.formatTime(this.props.time,e)}return s.TimeUtils.timeAgo(this.props.time,e)}}_refresh(){this.refreshInterval=setInterval(()=>{this.forceUpdate()},6e4)}render(){let r="reactist_time";this.props.className&&(r=this.props.className);const o=this._renderTime(this.props.config);return e.createElement("time",{className:r,onMouseEnter:e=>this._setHovered(!0,e),onMouseLeave:e=>this._setHovered(!1,e)},this.props.tooltipOnHover?e.createElement(t.Tooltip,{content:this.props.tooltip||this.props.time&&s.TimeUtils.formatTimeLong(this.props.time,this.props.config)},e.createElement("span",null,o)):o)}}r.displayName=void 0,r.defaultProps=void 0,r.displayName="Time",r.defaultProps={expandOnHover:!1,expandFullyOnHover:!1,tooltipOnHover:!1,refresh:!0,config:{locale:"en",daysSuffix:"d",hoursSuffix:"h",minutesSuffix:"m",momentsAgo:"moments ago"}},exports.Time=r;
 //# sourceMappingURL=time.js.map

package/lib/components/time/time.js.map

@@ -1 +1 @@
-{"version":3,"file":"time.js","sources":["../../../src/components/time/time.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Tooltip } from '../tooltip'\nimport { TimeUtils, TimeConfig } from './time-utils'\n\nimport './time.less'\n\nconst DELAY = 60000\n\ntype Props = {\n    /** UNIX timestamp of the time to display. */\n    time?: number\n    /** Configuration for localization. */\n    config?: TimeConfig\n    /** Additional css class applied to the time element. */\n    className?: string\n    tooltipOnHover?: boolean\n    /** Refresh the component every DELAY seconds. */\n    refresh?: boolean\n    /** If you don't want to use the default time format on the tooltip use this prop to supply a custom text */\n    tooltip?: React.ReactNode\n    /** When hovering over time it expands to short absolute version. */\n    expandOnHover?: boolean\n    /** When hovering over time it expands to the full absolute version. */\n    expandFullyOnHover?: boolean\n}\n\ntype State = {\n    hovered: boolean\n    mouseX?: number\n    mouseY?: number\n}\n\nclass Time extends React.Component<Props, State> {\n    public static displayName: string\n    public static defaultProps: Props\n\n    constructor(props: Props) {\n        super(props)\n        this.refreshInterval = undefined\n\n        this.state = {\n            hovered: false,\n            mouseX: undefined,\n            mouseY: undefined,\n        }\n    }\n\n    componentDidMount() {\n        if (this.props.refresh) {\n            this._refresh()\n        }\n    }\n\n    componentDidUpdate(prevProps: Props) {\n        if (!prevProps.refresh && this.props.refresh) {\n            this._refresh()\n        }\n\n        if (prevProps.refresh && !this.props.refresh) {\n            if (this.refreshInterval) {\n                clearTimeout(this.refreshInterval)\n            }\n        }\n    }\n\n    componentWillUnmount() {\n        if (this.refreshInterval) {\n            clearTimeout(this.refreshInterval)\n        }\n    }\n\n    refreshInterval?: ReturnType<typeof setTimeout>\n\n    _setHovered(hovered: boolean, event: React.MouseEvent) {\n        const { mouseX, mouseY } = this.state\n        const { clientX, clientY } = event\n        if (clientX !== mouseX || clientY !== mouseY) {\n            // mouse has moved\n            this.setState(() => ({\n                hovered,\n                mouseX: clientX,\n                mouseY: clientY,\n            }))\n        }\n    }\n\n    _renderTime(config: Props['config']) {\n        if (!this.props.time) {\n            return\n        }\n        if (this.state.hovered) {\n            if (this.props.expandFullyOnHover && !this.props.tooltipOnHover) {\n                return TimeUtils.formatTimeLong(this.props.time, config)\n            }\n            if (this.props.expandOnHover && !this.props.tooltipOnHover) {\n                return TimeUtils.formatTime(this.props.time, config)\n            }\n        }\n        return TimeUtils.timeAgo(this.props.time, config)\n    }\n\n    _refresh() {\n        this.refreshInterval = setInterval(() => {\n            this.forceUpdate()\n        }, DELAY)\n    }\n\n    render() {\n        let className = 'reactist_time'\n        if (this.props.className) {\n            className = this.props.className\n        }\n\n        const timeComponent = this._renderTime(this.props.config)\n\n        return (\n            <time\n                className={className}\n                onMouseEnter={(event) => this._setHovered(true, event)}\n                onMouseLeave={(event) => this._setHovered(false, event)}\n            >\n                {this.props.tooltipOnHover ? (\n                    <Tooltip\n                        content={\n                            this.props.tooltip ||\n                            (this.props.time &&\n                                TimeUtils.formatTimeLong(this.props.time, this.props.config))\n                        }\n                    >\n                        <span>{timeComponent}</span>\n                    </Tooltip>\n                ) : (\n                    timeComponent\n                )}\n            </time>\n        )\n    }\n}\nTime.displayName = 'Time'\n\nTime.defaultProps = {\n    expandOnHover: false,\n    expandFullyOnHover: false,\n    tooltipOnHover: false,\n    refresh: true,\n    config: {\n        locale: 'en',\n        daysSuffix: 'd',\n        hoursSuffix: 'h',\n        minutesSuffix: 'm',\n        momentsAgo: 'moments ago',\n    },\n}\n\nexport { Time }\n"],"names":["Time","React","Component","constructor","props","super","refreshInterval","this","undefined","state","hovered","mouseX","mouseY","componentDidMount","refresh","_refresh","componentDidUpdate","prevProps","clearTimeout","componentWillUnmount","_setHovered","event","clientX","clientY","setState","_renderTime","config","time","expandFullyOnHover","tooltipOnHover","TimeUtils","formatTimeLong","expandOnHover","formatTime","timeAgo","setInterval","forceUpdate","render","className","timeComponent","onMouseEnter","onMouseLeave","Tooltip","content","tooltip","displayName","defaultProps","locale","daysSuffix","hoursSuffix","minutesSuffix","momentsAgo"],"mappings":"gNAiCA,MAAMA,UAAaC,EAAMC,UAIrBC,YAAYC,GACRC,MAAMD,QAkCVE,uBAjCIC,KAAKD,qBAAkBE,EAEvBD,KAAKE,MAAQ,CACTC,SAAS,EACTC,YAAQH,EACRI,YAAQJ,GAIhBK,oBACQN,KAAKH,MAAMU,SACXP,KAAKQ,WAIbC,mBAAmBC,IACVA,EAAUH,SAAWP,KAAKH,MAAMU,SACjCP,KAAKQ,WAGLE,EAAUH,UAAYP,KAAKH,MAAMU,SAC7BP,KAAKD,iBACLY,aAAaX,KAAKD,iBAK9Ba,uBACQZ,KAAKD,iBACLY,aAAaX,KAAKD,iBAM1Bc,YAAYV,EAAkBW,GAC1B,MAAMV,OAAEA,EAAFC,OAAUA,GAAWL,KAAKE,OAC1Ba,QAAEA,EAAFC,QAAWA,GAAYF,EACzBC,IAAYX,GAAUY,IAAYX,GAElCL,KAAKiB,SAAS,MACVd,QAAAA,EACAC,OAAQW,EACRV,OAAQW,KAKpBE,YAAYC,GACR,GAAKnB,KAAKH,MAAMuB,KAAhB,CAGA,GAAIpB,KAAKE,MAAMC,QAAS,CACpB,GAAIH,KAAKH,MAAMwB,qBAAuBrB,KAAKH,MAAMyB,eAC7C,OAAOC,YAAUC,eAAexB,KAAKH,MAAMuB,KAAMD,GAErD,GAAInB,KAAKH,MAAM4B,gBAAkBzB,KAAKH,MAAMyB,eACxC,OAAOC,YAAUG,WAAW1B,KAAKH,MAAMuB,KAAMD,GAGrD,OAAOI,YAAUI,QAAQ3B,KAAKH,MAAMuB,KAAMD,IAG9CX,WACIR,KAAKD,gBAAkB6B,YAAY,KAC/B5B,KAAK6B,eAjGH,KAqGVC,SACI,IAAIC,EAAY,gBACZ/B,KAAKH,MAAMkC,YACXA,EAAY/B,KAAKH,MAAMkC,WAG3B,MAAMC,EAAgBhC,KAAKkB,YAAYlB,KAAKH,MAAMsB,QAElD,OACIzB,wBACIqC,UAAWA,EACXE,aAAenB,GAAUd,KAAKa,aAAY,EAAMC,GAChDoB,aAAepB,GAAUd,KAAKa,aAAY,EAAOC,IAEhDd,KAAKH,MAAMyB,eACR5B,gBAACyC,WACGC,QACIpC,KAAKH,MAAMwC,SACVrC,KAAKH,MAAMuB,MACRG,YAAUC,eAAexB,KAAKH,MAAMuB,KAAMpB,KAAKH,MAAMsB,SAG7DzB,4BAAOsC,IAGXA,IApGdvC,EACY6C,mBADZ7C,EAEY8C,oBAwGlB9C,EAAK6C,YAAc,OAEnB7C,EAAK8C,aAAe,CAChBd,eAAe,EACfJ,oBAAoB,EACpBC,gBAAgB,EAChBf,SAAS,EACTY,OAAQ,CACJqB,OAAQ,KACRC,WAAY,IACZC,YAAa,IACbC,cAAe,IACfC,WAAY"}
+{"version":3,"file":"time.js","sources":["../../../src/components/time/time.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Tooltip } from '../tooltip'\nimport { TimeUtils, TimeConfig } from './time-utils'\n\nimport './time.less'\n\nconst DELAY = 60000\n\ntype Props = {\n    /** UNIX timestamp of the time to display. */\n    time?: number\n    /** Configuration for localization. */\n    config?: TimeConfig\n    /** Additional css class applied to the time element. */\n    className?: string\n    tooltipOnHover?: boolean\n    /** Refresh the component every DELAY seconds. */\n    refresh?: boolean\n    /** If you don't want to use the default time format on the tooltip use this prop to supply a custom text */\n    tooltip?: React.ReactNode\n    /** When hovering over time it expands to short absolute version. */\n    expandOnHover?: boolean\n    /** When hovering over time it expands to the full absolute version. */\n    expandFullyOnHover?: boolean\n}\n\ntype State = {\n    hovered: boolean\n    mouseX?: number\n    mouseY?: number\n}\n\nclass Time extends React.Component<Props, State> {\n    public static displayName: string\n    public static defaultProps: Props\n\n    constructor(props: Props) {\n        super(props)\n        this.refreshInterval = undefined\n\n        this.state = {\n            hovered: false,\n            mouseX: undefined,\n            mouseY: undefined,\n        }\n    }\n\n    componentDidMount() {\n        if (this.props.refresh) {\n            this._refresh()\n        }\n    }\n\n    componentDidUpdate(prevProps: Props) {\n        if (!prevProps.refresh && this.props.refresh) {\n            this._refresh()\n        }\n\n        if (prevProps.refresh && !this.props.refresh) {\n            if (this.refreshInterval) {\n                clearTimeout(this.refreshInterval)\n            }\n        }\n    }\n\n    componentWillUnmount() {\n        if (this.refreshInterval) {\n            clearTimeout(this.refreshInterval)\n        }\n    }\n\n    refreshInterval?: ReturnType<typeof setTimeout>\n\n    _setHovered(hovered: boolean, event: React.MouseEvent) {\n        const { mouseX, mouseY } = this.state\n        const { clientX, clientY } = event\n        if (clientX !== mouseX || clientY !== mouseY) {\n            // mouse has moved\n            this.setState(() => ({\n                hovered,\n                mouseX: clientX,\n                mouseY: clientY,\n            }))\n        }\n    }\n\n    _renderTime(config: Props['config']) {\n        if (!this.props.time) {\n            return\n        }\n        if (this.state.hovered) {\n            if (this.props.expandFullyOnHover && !this.props.tooltipOnHover) {\n                return TimeUtils.formatTimeLong(this.props.time, config)\n            }\n            if (this.props.expandOnHover && !this.props.tooltipOnHover) {\n                return TimeUtils.formatTime(this.props.time, config)\n            }\n        }\n        return TimeUtils.timeAgo(this.props.time, config)\n    }\n\n    _refresh() {\n        this.refreshInterval = setInterval(() => {\n            this.forceUpdate()\n        }, DELAY)\n    }\n\n    render() {\n        let className = 'reactist_time'\n        if (this.props.className) {\n            className = this.props.className\n        }\n\n        const timeComponent = this._renderTime(this.props.config)\n\n        return (\n            <time\n                className={className}\n                onMouseEnter={(event) => this._setHovered(true, event)}\n                onMouseLeave={(event) => this._setHovered(false, event)}\n            >\n                {this.props.tooltipOnHover ? (\n                    <Tooltip\n                        content={\n                            this.props.tooltip ||\n                            (this.props.time &&\n                                TimeUtils.formatTimeLong(this.props.time, this.props.config))\n                        }\n                    >\n                        <span>{timeComponent}</span>\n                    </Tooltip>\n                ) : (\n                    timeComponent\n                )}\n            </time>\n        )\n    }\n}\nTime.displayName = 'Time'\n\nTime.defaultProps = {\n    expandOnHover: false,\n    expandFullyOnHover: false,\n    tooltipOnHover: false,\n    refresh: true,\n    config: {\n        locale: 'en',\n        daysSuffix: 'd',\n        hoursSuffix: 'h',\n        minutesSuffix: 'm',\n        momentsAgo: 'moments ago',\n    },\n}\n\nexport { Time }\n"],"names":["Time","React","constructor","props","super","refreshInterval","this","undefined","state","hovered","mouseX","mouseY","componentDidMount","refresh","_refresh","componentDidUpdate","prevProps","clearTimeout","componentWillUnmount","_setHovered","event","clientX","clientY","setState","_renderTime","config","time","expandFullyOnHover","tooltipOnHover","TimeUtils","formatTimeLong","expandOnHover","formatTime","timeAgo","setInterval","forceUpdate","render","className","timeComponent","onMouseEnter","onMouseLeave","Tooltip","content","tooltip","displayName","defaultProps","locale","daysSuffix","hoursSuffix","minutesSuffix","momentsAgo"],"mappings":"2JAiCA,MAAMA,UAAaC,YAIfC,YAAYC,GACRC,MAAMD,QAkCVE,uBAjCIC,KAAKD,qBAAkBE,EAEvBD,KAAKE,MAAQ,CACTC,SAAS,EACTC,YAAQH,EACRI,YAAQJ,GAIhBK,oBACQN,KAAKH,MAAMU,SACXP,KAAKQ,WAIbC,mBAAmBC,IACVA,EAAUH,SAAWP,KAAKH,MAAMU,SACjCP,KAAKQ,WAGLE,EAAUH,UAAYP,KAAKH,MAAMU,SAC7BP,KAAKD,iBACLY,aAAaX,KAAKD,iBAK9Ba,uBACQZ,KAAKD,iBACLY,aAAaX,KAAKD,iBAM1Bc,YAAYV,EAAkBW,GAC1B,MAAMV,OAAEA,EAAFC,OAAUA,GAAWL,KAAKE,OAC1Ba,QAAEA,EAAFC,QAAWA,GAAYF,EACzBC,IAAYX,GAAUY,IAAYX,GAElCL,KAAKiB,SAAS,MACVd,QAAAA,EACAC,OAAQW,EACRV,OAAQW,KAKpBE,YAAYC,GACR,GAAKnB,KAAKH,MAAMuB,KAAhB,CAGA,GAAIpB,KAAKE,MAAMC,QAAS,CACpB,GAAIH,KAAKH,MAAMwB,qBAAuBrB,KAAKH,MAAMyB,eAC7C,OAAOC,YAAUC,eAAexB,KAAKH,MAAMuB,KAAMD,GAErD,GAAInB,KAAKH,MAAM4B,gBAAkBzB,KAAKH,MAAMyB,eACxC,OAAOC,YAAUG,WAAW1B,KAAKH,MAAMuB,KAAMD,GAGrD,OAAOI,YAAUI,QAAQ3B,KAAKH,MAAMuB,KAAMD,IAG9CX,WACIR,KAAKD,gBAAkB6B,YAAY,KAC/B5B,KAAK6B,eAjGH,KAqGVC,SACI,IAAIC,EAAY,gBACZ/B,KAAKH,MAAMkC,YACXA,EAAY/B,KAAKH,MAAMkC,WAG3B,MAAMC,EAAgBhC,KAAKkB,YAAYlB,KAAKH,MAAMsB,QAElD,OACIxB,wBACIoC,UAAWA,EACXE,aAAenB,GAAUd,KAAKa,aAAY,EAAMC,GAChDoB,aAAepB,GAAUd,KAAKa,aAAY,EAAOC,IAEhDd,KAAKH,MAAMyB,eACR3B,gBAACwC,WACGC,QACIpC,KAAKH,MAAMwC,SACVrC,KAAKH,MAAMuB,MACRG,YAAUC,eAAexB,KAAKH,MAAMuB,KAAMpB,KAAKH,MAAMsB,SAG7DxB,4BAAOqC,IAGXA,IApGdtC,EACY4C,mBADZ5C,EAEY6C,oBAwGlB7C,EAAK4C,YAAc,OAEnB5C,EAAK6C,aAAe,CAChBd,eAAe,EACfJ,oBAAoB,EACpBC,gBAAgB,EAChBf,SAAS,EACTY,OAAQ,CACJqB,OAAQ,KACRC,WAAY,IACZC,YAAa,IACbC,cAAe,IACfC,WAAY"}

package/lib/components/tooltip/tooltip.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { TooltipProps as AriakitTooltipProps } from 'ariakit/tooltip';
 import type { PopoverState } from 'ariakit/popover';
 import './tooltip.less';

package/lib/components/tooltip/tooltip.js

@@ -1,2 +1,2 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../_virtual/_rollupPluginBabelHelpers.js"),r=e(require("react")),o=e(require("classnames")),n=require("ariakit/tooltip");const c=["children","content","position","gapSize","className"];exports.HIDE_DELAY=100,exports.SHOW_DELAY=500,exports.Tooltip=function(e){let{children:u,content:l,position:s="top",gapSize:i=3,className:a}=e,p=t.objectWithoutProperties(e,c);const f=function(e){const o=n.useTooltipState(e),c=function(){const e=r.useRef(),t=r.useCallback((function(){null!=e.current&&clearTimeout(e.current)}),[]);return r.useEffect(()=>t,[t]),r.useCallback((function(r,o){return()=>{t(),e.current=setTimeout(r,o)}}),[t])}();return r.useMemo(()=>t.objectSpread2(t.objectSpread2({},o),{},{show:c(()=>o.show(),500),hide:c(()=>o.hide(),100)}),[c,o])}({placement:s,gutter:i}),d=r.Children.only(u);if(!l||!d)return d;if("string"==typeof d.ref)throw new Error("Tooltip: String refs cannot be used as they cannot be forwarded");return r.createElement(r.Fragment,null,r.createElement(n.TooltipAnchor,{state:f,ref:d.ref,onFocus:function(e){var t;e.currentTarget.addEventListener("keyup",(function(e){const t=e.key;"Escape"!==t&&"Enter"!==t&&"Space"!==t&&f.show()}),{once:!0}),e.preventDefault(),null==d||null==(t=d.props)||null==t.onFocus||t.onFocus(e)}},e=>r.cloneElement(d,t.objectSpread2(t.objectSpread2({},e),d.props))),f.visible?r.createElement(n.Tooltip,t.objectSpread2(t.objectSpread2({},p),{},{state:f,className:o("reactist_tooltip",a)}),"function"==typeof l?l():l):null)};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("../../_virtual/_rollupPluginBabelHelpers.js"),o=require("react"),r=(e=require("classnames"))&&"object"==typeof e&&"default"in e?e.default:e,n=require("ariakit/tooltip");const c=["children","content","position","gapSize","className"];exports.HIDE_DELAY=100,exports.SHOW_DELAY=500,exports.Tooltip=function(e){let{children:l,content:s,position:u="top",gapSize:a=3,className:i}=e,p=t.objectWithoutProperties(e,c);const f=function(e){const r=n.useTooltipState(e),c=function(){const e=o.useRef(),t=o.useCallback((function(){null!=e.current&&clearTimeout(e.current)}),[]);return o.useEffect(()=>t,[t]),o.useCallback((function(o,r){return()=>{t(),e.current=setTimeout(o,r)}}),[t])}();return o.useMemo(()=>t.objectSpread2(t.objectSpread2({},r),{},{show:c(()=>r.show(),500),hide:c(()=>r.hide(),100)}),[c,r])}({placement:u,gutter:a}),d=o.Children.only(l);if(!s||!d)return d;if("string"==typeof d.ref)throw new Error("Tooltip: String refs cannot be used as they cannot be forwarded");return o.createElement(o.Fragment,null,o.createElement(n.TooltipAnchor,{state:f,ref:d.ref,onFocus:function(e){var t;e.currentTarget.addEventListener("keyup",(function(e){const t=e.key;"Escape"!==t&&"Enter"!==t&&"Space"!==t&&f.show()}),{once:!0}),e.preventDefault(),null==d||null==(t=d.props)||null==t.onFocus||t.onFocus(e)}},e=>o.cloneElement(d,t.objectSpread2(t.objectSpread2({},e),d.props))),f.visible?o.createElement(n.Tooltip,t.objectSpread2(t.objectSpread2({},p),{},{state:f,className:r("reactist_tooltip",i)}),"function"==typeof s?s():s):null)};
 //# sourceMappingURL=tooltip.js.map

package/lib/components/tooltip/tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.js","sources":["../../../src/components/tooltip/tooltip.tsx"],"sourcesContent":["import React from 'react'\nimport classNames from 'classnames'\n\nimport {\n    useTooltipState as useAriakitTooltipState,\n    TooltipStateProps as AriakitTooltipStateProps,\n    Tooltip as AriakitTooltip,\n    TooltipProps as AriakitTooltipProps,\n    TooltipAnchor,\n    TooltipAnchorProps,\n} from 'ariakit/tooltip'\nimport type { PopoverState } from 'ariakit/popover'\n\nimport './tooltip.less'\n\ntype TooltipProps = Omit<AriakitTooltipProps, 'children' | 'state'> & {\n    children: React.ReactNode\n    content: React.ReactNode | (() => React.ReactNode)\n    position?: PopoverState['placement']\n    gapSize?: number\n}\n\n// These are exported to be used in the tests, they are not meant to be exported publicly\nexport const SHOW_DELAY = 500\nexport const HIDE_DELAY = 100\n\nfunction useDelayedTooltipState(initialState: AriakitTooltipStateProps) {\n    const tooltipState = useAriakitTooltipState(initialState)\n    const delay = useDelay()\n    return React.useMemo(\n        () => ({\n            ...tooltipState,\n            show: delay(() => tooltipState.show(), SHOW_DELAY),\n            hide: delay(() => tooltipState.hide(), HIDE_DELAY),\n        }),\n        [delay, tooltipState],\n    )\n}\n\nfunction Tooltip({\n    children,\n    content,\n    position = 'top',\n    gapSize = 3,\n    className,\n    ...props\n}: TooltipProps) {\n    const state = useDelayedTooltipState({ placement: position, gutter: gapSize })\n\n    const child = React.Children.only(\n        children as React.FunctionComponentElement<JSX.IntrinsicElements['div']> | null,\n    )\n\n    if (!content || !child) {\n        return child\n    }\n\n    if (typeof child.ref === 'string') {\n        throw new Error('Tooltip: String refs cannot be used as they cannot be forwarded')\n    }\n\n    /**\n     * Prevents the tooltip from automatically firing on focus all the time. This is to prevent\n     * tooltips from showing when the trigger element is focused back after a popover or dialog that\n     * it opened was closed. See link below for more details.\n     * @see https://github.com/reakit/reakit/discussions/749\n     */\n    function handleFocus(event: React.FocusEvent<HTMLDivElement>) {\n        // If focus is not followed by a key up event, does it mean that it's not\n        // an intentional keyboard focus? Not sure but it seems to work.\n        // This may be resolved soon in an upcoming version of reakit:\n        // https://github.com/reakit/reakit/issues/750\n        function handleKeyUp(e: Event) {\n            const eventKey = (e as KeyboardEvent).key\n            if (eventKey !== 'Escape' && eventKey !== 'Enter' && eventKey !== 'Space') {\n                state.show()\n            }\n        }\n        event.currentTarget.addEventListener('keyup', handleKeyUp, { once: true })\n        // Prevent tooltip.show from being called by TooltipReference\n        event.preventDefault()\n        child?.props?.onFocus?.(event)\n    }\n\n    return (\n        <>\n            <TooltipAnchor state={state} ref={child.ref} onFocus={handleFocus}>\n                {(anchorProps: TooltipAnchorProps) => {\n                    // Let child props override anchor props so user can specify attributes like tabIndex\n                    // Also, do not apply the child's props to TooltipAnchor as props like `as` can create problems\n                    // by applying the replacement component/element twice\n                    return React.cloneElement(child, { ...anchorProps, ...child.props })\n                }}\n            </TooltipAnchor>\n            {state.visible ? (\n                <AriakitTooltip\n                    {...props}\n                    state={state}\n                    className={classNames('reactist_tooltip', className)}\n                >\n                    {typeof content === 'function' ? content() : content}\n                </AriakitTooltip>\n            ) : null}\n        </>\n    )\n}\n\nexport type { TooltipProps }\nexport { Tooltip }\n\n//\n// Internal helpers\n//\n\n/**\n * Returns a function offering the same interface as setTimeout, but cleans up on unmount.\n *\n * The timeout state is shared, and only one delayed function can be active at any given time. If\n * a new delayed function is called while another one was waiting for its time to run, that older\n * invocation is cleared and it never runs.\n *\n * This is suitable for our use case here, but probably not the most intuitive thing in general.\n * That's why this is not made a shared util or something like it.\n */\nfunction useDelay() {\n    const timeoutRef = React.useRef<ReturnType<typeof setTimeout>>()\n\n    const clearTimeouts = React.useCallback(function clearTimeouts() {\n        if (timeoutRef.current != null) {\n            clearTimeout(timeoutRef.current)\n        }\n    }, [])\n\n    // Runs clearTimeouts when the component is unmounted\n    React.useEffect(() => clearTimeouts, [clearTimeouts])\n\n    return React.useCallback(\n        function delay(fn: () => void, delay: number) {\n            return () => {\n                clearTimeouts()\n                timeoutRef.current = setTimeout(fn, delay)\n            }\n        },\n        [clearTimeouts],\n    )\n}\n"],"names":["children","content","position","gapSize","className","props","state","initialState","tooltipState","useAriakitTooltipState","delay","timeoutRef","React","useRef","clearTimeouts","useCallback","current","clearTimeout","useEffect","fn","setTimeout","useDelay","useMemo","show","hide","useDelayedTooltipState","placement","gutter","child","Children","only","ref","Error","TooltipAnchor","onFocus","event","currentTarget","addEventListener","e","eventKey","key","once","preventDefault","anchorProps","cloneElement","visible","AriakitTooltip","classNames"],"mappings":"wWAwB0B,uBADA,oBAgB1B,gBAAiBA,SACbA,EADaC,QAEbA,EAFaC,SAGbA,EAAW,MAHEC,QAIbA,EAAU,EAJGC,UAKbA,KACGC,iCAEH,MAAMC,EArBV,SAAgCC,GAC5B,MAAMC,EAAeC,kBAAuBF,GACtCG,EAgGV,WACI,MAAMC,EAAaC,EAAMC,SAEnBC,EAAgBF,EAAMG,aAAY,WACV,MAAtBJ,EAAWK,SACXC,aAAaN,EAAWK,WAE7B,IAKH,OAFAJ,EAAMM,UAAU,IAAMJ,EAAe,CAACA,IAE/BF,EAAMG,aACT,SAAeI,EAAgBT,GAC3B,MAAO,KACHI,IACAH,EAAWK,QAAUI,WAAWD,EAAIT,MAG5C,CAACI,IAnHSO,GACd,OAAOT,EAAMU,QACT,uCACOd,OACHe,KAAMb,EAAM,IAAMF,EAAae,OATjB,KAUdC,KAAMd,EAAM,IAAMF,EAAagB,OATjB,OAWlB,CAACd,EAAOF,IAYEiB,CAAuB,CAAEC,UAAWxB,EAAUyB,OAAQxB,IAE9DyB,EAAQhB,EAAMiB,SAASC,KACzB9B,GAGJ,IAAKC,IAAY2B,EACb,OAAOA,EAGX,GAAyB,iBAAdA,EAAMG,IACb,MAAM,IAAIC,MAAM,mEA0BpB,OACIpB,gCACIA,gBAACqB,iBAAc3B,MAAOA,EAAOyB,IAAKH,EAAMG,IAAKG,QAnBrD,SAAqBC,SAWjBA,EAAMC,cAAcC,iBAAiB,SANrC,SAAqBC,GACjB,MAAMC,EAAYD,EAAoBE,IACrB,WAAbD,GAAsC,UAAbA,GAAqC,UAAbA,GACjDjC,EAAMiB,SAG6C,CAAEkB,MAAM,IAEnEN,EAAMO,uBACNd,YAAAA,EAAOvB,gBAAO6B,WAAAA,QAAUC,KAMdQ,GAIS/B,EAAMgC,aAAahB,qCAAYe,GAAgBf,EAAMvB,SAGnEC,EAAMuC,QACHjC,gBAACkC,6CACOzC,OACJC,MAAOA,EACPF,UAAW2C,EAAW,mBAAoB3C,KAEtB,mBAAZH,EAAyBA,IAAYA,GAEjD"}
+{"version":3,"file":"tooltip.js","sources":["../../../src/components/tooltip/tooltip.tsx"],"sourcesContent":["import * as React from 'react'\nimport classNames from 'classnames'\n\nimport {\n    useTooltipState as useAriakitTooltipState,\n    TooltipStateProps as AriakitTooltipStateProps,\n    Tooltip as AriakitTooltip,\n    TooltipProps as AriakitTooltipProps,\n    TooltipAnchor,\n    TooltipAnchorProps,\n} from 'ariakit/tooltip'\nimport type { PopoverState } from 'ariakit/popover'\n\nimport './tooltip.less'\n\ntype TooltipProps = Omit<AriakitTooltipProps, 'children' | 'state'> & {\n    children: React.ReactNode\n    content: React.ReactNode | (() => React.ReactNode)\n    position?: PopoverState['placement']\n    gapSize?: number\n}\n\n// These are exported to be used in the tests, they are not meant to be exported publicly\nexport const SHOW_DELAY = 500\nexport const HIDE_DELAY = 100\n\nfunction useDelayedTooltipState(initialState: AriakitTooltipStateProps) {\n    const tooltipState = useAriakitTooltipState(initialState)\n    const delay = useDelay()\n    return React.useMemo(\n        () => ({\n            ...tooltipState,\n            show: delay(() => tooltipState.show(), SHOW_DELAY),\n            hide: delay(() => tooltipState.hide(), HIDE_DELAY),\n        }),\n        [delay, tooltipState],\n    )\n}\n\nfunction Tooltip({\n    children,\n    content,\n    position = 'top',\n    gapSize = 3,\n    className,\n    ...props\n}: TooltipProps) {\n    const state = useDelayedTooltipState({ placement: position, gutter: gapSize })\n\n    const child = React.Children.only(\n        children as React.FunctionComponentElement<JSX.IntrinsicElements['div']> | null,\n    )\n\n    if (!content || !child) {\n        return child\n    }\n\n    if (typeof child.ref === 'string') {\n        throw new Error('Tooltip: String refs cannot be used as they cannot be forwarded')\n    }\n\n    /**\n     * Prevents the tooltip from automatically firing on focus all the time. This is to prevent\n     * tooltips from showing when the trigger element is focused back after a popover or dialog that\n     * it opened was closed. See link below for more details.\n     * @see https://github.com/reakit/reakit/discussions/749\n     */\n    function handleFocus(event: React.FocusEvent<HTMLDivElement>) {\n        // If focus is not followed by a key up event, does it mean that it's not\n        // an intentional keyboard focus? Not sure but it seems to work.\n        // This may be resolved soon in an upcoming version of reakit:\n        // https://github.com/reakit/reakit/issues/750\n        function handleKeyUp(e: Event) {\n            const eventKey = (e as KeyboardEvent).key\n            if (eventKey !== 'Escape' && eventKey !== 'Enter' && eventKey !== 'Space') {\n                state.show()\n            }\n        }\n        event.currentTarget.addEventListener('keyup', handleKeyUp, { once: true })\n        // Prevent tooltip.show from being called by TooltipReference\n        event.preventDefault()\n        child?.props?.onFocus?.(event)\n    }\n\n    return (\n        <>\n            <TooltipAnchor state={state} ref={child.ref} onFocus={handleFocus}>\n                {(anchorProps: TooltipAnchorProps) => {\n                    // Let child props override anchor props so user can specify attributes like tabIndex\n                    // Also, do not apply the child's props to TooltipAnchor as props like `as` can create problems\n                    // by applying the replacement component/element twice\n                    return React.cloneElement(child, { ...anchorProps, ...child.props })\n                }}\n            </TooltipAnchor>\n            {state.visible ? (\n                <AriakitTooltip\n                    {...props}\n                    state={state}\n                    className={classNames('reactist_tooltip', className)}\n                >\n                    {typeof content === 'function' ? content() : content}\n                </AriakitTooltip>\n            ) : null}\n        </>\n    )\n}\n\nexport type { TooltipProps }\nexport { Tooltip }\n\n//\n// Internal helpers\n//\n\n/**\n * Returns a function offering the same interface as setTimeout, but cleans up on unmount.\n *\n * The timeout state is shared, and only one delayed function can be active at any given time. If\n * a new delayed function is called while another one was waiting for its time to run, that older\n * invocation is cleared and it never runs.\n *\n * This is suitable for our use case here, but probably not the most intuitive thing in general.\n * That's why this is not made a shared util or something like it.\n */\nfunction useDelay() {\n    const timeoutRef = React.useRef<ReturnType<typeof setTimeout>>()\n\n    const clearTimeouts = React.useCallback(function clearTimeouts() {\n        if (timeoutRef.current != null) {\n            clearTimeout(timeoutRef.current)\n        }\n    }, [])\n\n    // Runs clearTimeouts when the component is unmounted\n    React.useEffect(() => clearTimeouts, [clearTimeouts])\n\n    return React.useCallback(\n        function delay(fn: () => void, delay: number) {\n            return () => {\n                clearTimeouts()\n                timeoutRef.current = setTimeout(fn, delay)\n            }\n        },\n        [clearTimeouts],\n    )\n}\n"],"names":["children","content","position","gapSize","className","props","state","initialState","tooltipState","useAriakitTooltipState","delay","timeoutRef","React","clearTimeouts","current","clearTimeout","fn","setTimeout","useDelay","show","hide","useDelayedTooltipState","placement","gutter","child","only","ref","Error","TooltipAnchor","onFocus","event","currentTarget","addEventListener","e","eventKey","key","once","preventDefault","anchorProps","visible","AriakitTooltip","classNames"],"mappings":"iVAwB0B,uBADA,oBAgB1B,gBAAiBA,SACbA,EADaC,QAEbA,EAFaC,SAGbA,EAAW,MAHEC,QAIbA,EAAU,EAJGC,UAKbA,KACGC,iCAEH,MAAMC,EArBV,SAAgCC,GAC5B,MAAMC,EAAeC,kBAAuBF,GACtCG,EAgGV,WACI,MAAMC,EAAaC,WAEbC,EAAgBD,eAAkB,WACV,MAAtBD,EAAWG,SACXC,aAAaJ,EAAWG,WAE7B,IAKH,OAFAF,YAAgB,IAAMC,EAAe,CAACA,IAE/BD,eACH,SAAeI,EAAgBN,GAC3B,MAAO,KACHG,IACAF,EAAWG,QAAUG,WAAWD,EAAIN,MAG5C,CAACG,IAnHSK,GACd,OAAON,UACH,uCACOJ,OACHW,KAAMT,EAAM,IAAMF,EAAaW,OATjB,KAUdC,KAAMV,EAAM,IAAMF,EAAaY,OATjB,OAWlB,CAACV,EAAOF,IAYEa,CAAuB,CAAEC,UAAWpB,EAAUqB,OAAQpB,IAE9DqB,EAAQZ,WAAea,KACzBzB,GAGJ,IAAKC,IAAYuB,EACb,OAAOA,EAGX,GAAyB,iBAAdA,EAAME,IACb,MAAM,IAAIC,MAAM,mEA0BpB,OACIf,gCACIA,gBAACgB,iBAActB,MAAOA,EAAOoB,IAAKF,EAAME,IAAKG,QAnBrD,SAAqBC,SAWjBA,EAAMC,cAAcC,iBAAiB,SANrC,SAAqBC,GACjB,MAAMC,EAAYD,EAAoBE,IACrB,WAAbD,GAAsC,UAAbA,GAAqC,UAAbA,GACjD5B,EAAMa,SAG6C,CAAEiB,MAAM,IAEnEN,EAAMO,uBACNb,YAAAA,EAAOnB,gBAAOwB,WAAAA,QAAUC,KAMdQ,GAIS1B,eAAmBY,qCAAYc,GAAgBd,EAAMnB,SAGnEC,EAAMiC,QACH3B,gBAAC4B,6CACOnC,OACJC,MAAOA,EACPF,UAAWqC,EAAW,mBAAoBrC,KAEtB,mBAAZH,EAAyBA,IAAYA,GAEjD"}

package/lib/index.d.ts

@@ -21,6 +21,7 @@ export * from './new-components/switch-field';
 export * from './new-components/text-area';
 export * from './new-components/text-field';
 export * from './new-components/avatar';
+export * from './new-components/badge';
 export * from './new-components/modal';
 export * from './new-components/tabs';
 export * from './hooks/use-previous';

package/lib/index.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./new-components/box/box.js"),o=require("./new-components/columns/columns.js"),t=require("./new-components/divider/divider.js"),r=require("./new-components/inline/inline.js"),n=require("./new-components/stack/stack.js"),s=require("./new-components/hidden/hidden.js"),i=require("./new-components/hidden-visually/hidden-visually.js"),p=require("./components/tooltip/tooltip.js"),d=require("./new-components/button/button.js"),a=require("./new-components/alert/alert.js"),u=require("./new-components/loading/loading.js"),l=require("./new-components/notice/notice.js"),c=require("./new-components/heading/heading.js"),x=require("./new-components/text/text.js"),m=require("./new-components/button-link/button-link.js"),j=require("./new-components/text-link/text-link.js"),q=require("./new-components/checkbox-field/checkbox-field.js"),w=require("./new-components/password-field/password-field.js"),M=require("./new-components/select-field/select-field.js"),b=require("./new-components/switch-field/switch-field.js"),k=require("./new-components/text-area/text-area.js"),f=require("./new-components/text-field/text-field.js"),T=require("./new-components/avatar/avatar.js"),D=require("./new-components/modal/modal.js"),B=require("./hooks/use-previous/use-previous.js"),S=require("./new-components/tabs/tabs.js"),h=require("./components/deprecated-button/index.js"),v=require("./components/deprecated-dropdown/index.js"),y=require("./components/color-picker/color-picker.js"),C=require("./components/color-picker/index.js"),F=require("./components/keyboard-shortcut/index.js"),P=require("./components/key-capturer/key-capturer.js"),A=require("./components/key-capturer/index.js"),L=require("./components/progress-bar/index.js"),g=require("./components/time/index.js"),H=require("./components/notification/notification.js"),O=require("./components/menu/menu.js"),I=require("./components/deprecated-input/index.js"),E=require("./components/deprecated-select/index.js"),K=require("./new-components/deprecated-modal/modal.js");exports.Box=e.Box,exports.Column=o.Column,exports.Columns=o.Columns,exports.Divider=t.Divider,exports.Inline=r.Inline,exports.Stack=n.Stack,exports.Hidden=s.Hidden,exports.HiddenVisually=i.HiddenVisually,exports.Tooltip=p.Tooltip,exports.Button=d.Button,exports.Alert=a.Alert,exports.Loading=u.Loading,exports.Notice=l.Notice,exports.Heading=c.Heading,exports.Text=x.Text,exports.ButtonLink=m.ButtonLink,exports.TextLink=j.TextLink,exports.CheckboxField=q.CheckboxField,exports.PasswordField=w.PasswordField,exports.SelectField=M.SelectField,exports.SwitchField=b.SwitchField,exports.TextArea=k.TextArea,exports.TextField=f.TextField,exports.Avatar=T.Avatar,exports.Modal=D.Modal,exports.ModalActions=D.ModalActions,exports.ModalBody=D.ModalBody,exports.ModalCloseButton=D.ModalCloseButton,exports.ModalFooter=D.ModalFooter,exports.ModalHeader=D.ModalHeader,exports.usePrevious=B.usePrevious,exports.Tab=S.Tab,exports.TabAwareSlot=S.TabAwareSlot,exports.TabList=S.TabList,exports.TabPanel=S.TabPanel,exports.Tabs=S.Tabs,exports.DeprecatedButton=h.default,exports.DeprecatedDropdown=v.default,exports.COLORS=y.COLORS,exports.ColorPicker=C.default,exports.KeyboardShortcut=F.default,exports.SUPPORTED_KEYS=P.SUPPORTED_KEYS,exports.KeyCapturer=A.default,exports.ProgressBar=L.default,exports.Time=g.default,exports.Notification=H.Notification,exports.Menu=O.Menu,exports.MenuButton=O.MenuButton,exports.MenuGroup=O.MenuGroup,exports.MenuItem=O.MenuItem,exports.MenuList=O.MenuList,exports.SubMenu=O.SubMenu,exports.DeprecatedInput=I.default,exports.DeprecatedSelect=E.default,exports.DeprecatedModal=K.DeprecatedModal,exports.DeprecatedModalActions=K.DeprecatedModalActions,exports.DeprecatedModalBody=K.DeprecatedModalBody,exports.DeprecatedModalCloseButton=K.DeprecatedModalCloseButton,exports.DeprecatedModalFooter=K.DeprecatedModalFooter,exports.DeprecatedModalHeader=K.DeprecatedModalHeader;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./new-components/box/box.js"),o=require("./new-components/columns/columns.js"),t=require("./new-components/divider/divider.js"),r=require("./new-components/inline/inline.js"),n=require("./new-components/stack/stack.js"),s=require("./new-components/hidden/hidden.js"),i=require("./new-components/hidden-visually/hidden-visually.js"),p=require("./components/tooltip/tooltip.js"),d=require("./new-components/button/button.js"),a=require("./new-components/alert/alert.js"),u=require("./new-components/loading/loading.js"),c=require("./new-components/notice/notice.js"),l=require("./new-components/heading/heading.js"),x=require("./new-components/text/text.js"),m=require("./new-components/button-link/button-link.js"),j=require("./new-components/text-link/text-link.js"),q=require("./new-components/checkbox-field/checkbox-field.js"),w=require("./new-components/password-field/password-field.js"),M=require("./new-components/select-field/select-field.js"),b=require("./new-components/switch-field/switch-field.js"),k=require("./new-components/text-area/text-area.js"),f=require("./new-components/text-field/text-field.js"),T=require("./new-components/avatar/avatar.js"),D=require("./new-components/badge/badge.js"),B=require("./new-components/modal/modal.js"),S=require("./hooks/use-previous/use-previous.js"),h=require("./new-components/tabs/tabs.js"),v=require("./components/deprecated-button/index.js"),y=require("./components/deprecated-dropdown/index.js"),g=require("./components/color-picker/color-picker.js"),C=require("./components/color-picker/index.js"),F=require("./components/keyboard-shortcut/index.js"),P=require("./components/key-capturer/key-capturer.js"),A=require("./components/key-capturer/index.js"),L=require("./components/progress-bar/index.js"),H=require("./components/time/index.js"),O=require("./components/notification/notification.js"),I=require("./components/menu/menu.js"),E=require("./components/deprecated-input/index.js"),K=require("./components/deprecated-select/index.js"),N=require("./new-components/deprecated-modal/modal.js");exports.Box=e.Box,exports.Column=o.Column,exports.Columns=o.Columns,exports.Divider=t.Divider,exports.Inline=r.Inline,exports.Stack=n.Stack,exports.Hidden=s.Hidden,exports.HiddenVisually=i.HiddenVisually,exports.Tooltip=p.Tooltip,exports.Button=d.Button,exports.Alert=a.Alert,exports.Loading=u.Loading,exports.Notice=c.Notice,exports.Heading=l.Heading,exports.Text=x.Text,exports.ButtonLink=m.ButtonLink,exports.TextLink=j.TextLink,exports.CheckboxField=q.CheckboxField,exports.PasswordField=w.PasswordField,exports.SelectField=M.SelectField,exports.SwitchField=b.SwitchField,exports.TextArea=k.TextArea,exports.TextField=f.TextField,exports.Avatar=T.Avatar,exports.Badge=D.Badge,exports.Modal=B.Modal,exports.ModalActions=B.ModalActions,exports.ModalBody=B.ModalBody,exports.ModalCloseButton=B.ModalCloseButton,exports.ModalFooter=B.ModalFooter,exports.ModalHeader=B.ModalHeader,exports.usePrevious=S.usePrevious,exports.Tab=h.Tab,exports.TabAwareSlot=h.TabAwareSlot,exports.TabList=h.TabList,exports.TabPanel=h.TabPanel,exports.Tabs=h.Tabs,exports.DeprecatedButton=v.default,exports.DeprecatedDropdown=y.default,exports.COLORS=g.COLORS,exports.ColorPicker=C.default,exports.KeyboardShortcut=F.default,exports.SUPPORTED_KEYS=P.SUPPORTED_KEYS,exports.KeyCapturer=A.default,exports.ProgressBar=L.default,exports.Time=H.default,exports.Notification=O.Notification,exports.Menu=I.Menu,exports.MenuButton=I.MenuButton,exports.MenuGroup=I.MenuGroup,exports.MenuItem=I.MenuItem,exports.MenuList=I.MenuList,exports.SubMenu=I.SubMenu,exports.DeprecatedInput=E.default,exports.DeprecatedSelect=K.default,exports.DeprecatedModal=N.DeprecatedModal,exports.DeprecatedModalActions=N.DeprecatedModalActions,exports.DeprecatedModalBody=N.DeprecatedModalBody,exports.DeprecatedModalCloseButton=N.DeprecatedModalCloseButton,exports.DeprecatedModalFooter=N.DeprecatedModalFooter,exports.DeprecatedModalHeader=N.DeprecatedModalHeader;
 //# sourceMappingURL=index.js.map

package/lib/new-components/avatar/avatar.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,a=require("../../_virtual/_rollupPluginBabelHelpers.js"),t=(e=require("react"))&&"object"==typeof e&&"default"in e?e.default:e,r=require("../responsive-props.js"),s=require("../box/box.js"),l=require("./utils.js"),i=require("./avatar.module.css.js");const o=["user","avatarUrl","size","className","colorList","exceptionallySetClassName"],c=["#fcc652","#e9952c","#e16b2d","#d84b40","#e8435a","#e5198a","#ad3889","#86389c","#a8a8a8","#98be2f","#5d9d50","#5f9f85","#5bbcb6","#32a3bf","#2bafeb","#2d88c3","#3863cc","#5e5e5e"];function u(e){let{user:u,avatarUrl:n,size:d="l",className:b,colorList:p=c,exceptionallySetClassName:m}=e,f=a.objectWithoutProperties(e,o);const v=l.getInitials(u.name)||l.getInitials(u.email),x=d||"l",j=n?{backgroundImage:"url("+n+")",textIndent:"-9999px"}:{backgroundColor:p[l.emailToIndex(u.email,p.length)]},g=r.getClassNames(i.default,"size",x);return t.createElement(s.Box,a.objectSpread2({className:[b,i.default.avatar,g,m],style:j},f),v)}u.displayName="Avatar",exports.Avatar=u;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_rollupPluginBabelHelpers.js"),a=require("react"),r=require("../responsive-props.js"),t=require("../box/box.js"),s=require("./utils.js"),l=require("./avatar.module.css.js");const i=["user","avatarUrl","size","className","colorList","exceptionallySetClassName"],o=["#fcc652","#e9952c","#e16b2d","#d84b40","#e8435a","#e5198a","#ad3889","#86389c","#a8a8a8","#98be2f","#5d9d50","#5f9f85","#5bbcb6","#32a3bf","#2bafeb","#2d88c3","#3863cc","#5e5e5e"];function c(c){let{user:u,avatarUrl:n,size:b="l",className:d,colorList:m=o,exceptionallySetClassName:p}=c,f=e.objectWithoutProperties(c,i);const v=s.getInitials(u.name)||s.getInitials(u.email),x=b||"l",g=n?{backgroundImage:"url("+n+")",textIndent:"-9999px"}:{backgroundColor:m[s.emailToIndex(u.email,m.length)]},j=r.getClassNames(l.default,"size",x);return a.createElement(t.Box,e.objectSpread2({className:[d,l.default.avatar,j,p],style:g},f),v)}c.displayName="Avatar",exports.Avatar=c;
 //# sourceMappingURL=avatar.js.map

package/lib/new-components/avatar/avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"avatar.js","sources":["../../../src/new-components/avatar/avatar.tsx"],"sourcesContent":["import React from 'react'\n\nimport { getInitials, emailToIndex } from './utils'\n\nimport { getClassNames, ResponsiveProp } from '../responsive-props'\nimport styles from './avatar.module.css'\nimport { Box } from '../box'\n\nconst AVATAR_COLORS = [\n    '#fcc652',\n    '#e9952c',\n    '#e16b2d',\n    '#d84b40',\n    '#e8435a',\n    '#e5198a',\n    '#ad3889',\n    '#86389c',\n    '#a8a8a8',\n    '#98be2f',\n    '#5d9d50',\n    '#5f9f85',\n    '#5bbcb6',\n    '#32a3bf',\n    '#2bafeb',\n    '#2d88c3',\n    '#3863cc',\n    '#5e5e5e',\n]\n\ntype AvatarSize = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl' | 'xxxl'\n\ntype Props = {\n    /** @deprecated Please use `exceptionallySetClassName` */\n    className?: string\n    exceptionallySetClassName?: string\n    /** @deprecated */\n    colorList?: string[]\n    size?: ResponsiveProp<AvatarSize>\n    avatarUrl?: string\n    user: { name?: string; email: string }\n}\n\nfunction Avatar({\n    user,\n    avatarUrl,\n    size = 'l',\n    className,\n    colorList = AVATAR_COLORS,\n    exceptionallySetClassName,\n    ...props\n}: Props) {\n    const userInitials = getInitials(user.name) || getInitials(user.email)\n    const avatarSize = size ? size : 'l'\n\n    const style = avatarUrl\n        ? {\n              backgroundImage: `url(${avatarUrl})`,\n              textIndent: '-9999px', // hide the initials\n          }\n        : {\n              backgroundColor: colorList[emailToIndex(user.email, colorList.length)],\n          }\n\n    const sizeClassName = getClassNames(styles, 'size', avatarSize)\n\n    return (\n        <Box\n            className={[className, styles.avatar, sizeClassName, exceptionallySetClassName]}\n            style={style}\n            {...props}\n        >\n            {userInitials}\n        </Box>\n    )\n}\nAvatar.displayName = 'Avatar'\n\nexport { Avatar }\n"],"names":["AVATAR_COLORS","Avatar","user","avatarUrl","size","className","colorList","exceptionallySetClassName","props","userInitials","getInitials","name","email","avatarSize","style","backgroundImage","textIndent","backgroundColor","emailToIndex","length","sizeClassName","getClassNames","styles","React","Box","avatar","displayName"],"mappings":"4ZAQMA,EAAgB,CAClB,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,WAgBJ,SAASC,SAAOC,KACZA,EADYC,UAEZA,EAFYC,KAGZA,EAAO,IAHKC,UAIZA,EAJYC,UAKZA,EAAYN,EALAO,0BAMZA,KACGC,iCAEH,MAAMC,EAAeC,cAAYR,EAAKS,OAASD,cAAYR,EAAKU,OAC1DC,EAAaT,GAAc,IAE3BU,EAAQX,EACR,CACIY,uBAAwBZ,MACxBa,WAAY,WAEhB,CACIC,gBAAiBX,EAAUY,eAAahB,EAAKU,MAAON,EAAUa,UAGlEC,EAAgBC,gBAAcC,UAAQ,OAAQT,GAEpD,OACIU,gBAACC,uBACGnB,UAAW,CAACA,EAAWiB,UAAOG,OAAQL,EAAeb,GACrDO,MAAOA,GACHN,GAEHC,GAIbR,EAAOyB,YAAc"}
+{"version":3,"file":"avatar.js","sources":["../../../src/new-components/avatar/avatar.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { getInitials, emailToIndex } from './utils'\n\nimport { getClassNames, ResponsiveProp } from '../responsive-props'\nimport styles from './avatar.module.css'\nimport { Box } from '../box'\n\nconst AVATAR_COLORS = [\n    '#fcc652',\n    '#e9952c',\n    '#e16b2d',\n    '#d84b40',\n    '#e8435a',\n    '#e5198a',\n    '#ad3889',\n    '#86389c',\n    '#a8a8a8',\n    '#98be2f',\n    '#5d9d50',\n    '#5f9f85',\n    '#5bbcb6',\n    '#32a3bf',\n    '#2bafeb',\n    '#2d88c3',\n    '#3863cc',\n    '#5e5e5e',\n]\n\ntype AvatarSize = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl' | 'xxxl'\n\ntype Props = {\n    /** @deprecated Please use `exceptionallySetClassName` */\n    className?: string\n    exceptionallySetClassName?: string\n    /** @deprecated */\n    colorList?: string[]\n    size?: ResponsiveProp<AvatarSize>\n    avatarUrl?: string\n    user: { name?: string; email: string }\n}\n\nfunction Avatar({\n    user,\n    avatarUrl,\n    size = 'l',\n    className,\n    colorList = AVATAR_COLORS,\n    exceptionallySetClassName,\n    ...props\n}: Props) {\n    const userInitials = getInitials(user.name) || getInitials(user.email)\n    const avatarSize = size ? size : 'l'\n\n    const style = avatarUrl\n        ? {\n              backgroundImage: `url(${avatarUrl})`,\n              textIndent: '-9999px', // hide the initials\n          }\n        : {\n              backgroundColor: colorList[emailToIndex(user.email, colorList.length)],\n          }\n\n    const sizeClassName = getClassNames(styles, 'size', avatarSize)\n\n    return (\n        <Box\n            className={[className, styles.avatar, sizeClassName, exceptionallySetClassName]}\n            style={style}\n            {...props}\n        >\n            {userInitials}\n        </Box>\n    )\n}\nAvatar.displayName = 'Avatar'\n\nexport { Avatar }\n"],"names":["AVATAR_COLORS","Avatar","user","avatarUrl","size","className","colorList","exceptionallySetClassName","props","userInitials","getInitials","name","email","avatarSize","style","backgroundImage","textIndent","backgroundColor","emailToIndex","length","sizeClassName","getClassNames","styles","React","Box","avatar","displayName"],"mappings":"uWAQMA,EAAgB,CAClB,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,WAgBJ,SAASC,SAAOC,KACZA,EADYC,UAEZA,EAFYC,KAGZA,EAAO,IAHKC,UAIZA,EAJYC,UAKZA,EAAYN,EALAO,0BAMZA,KACGC,iCAEH,MAAMC,EAAeC,cAAYR,EAAKS,OAASD,cAAYR,EAAKU,OAC1DC,EAAaT,GAAc,IAE3BU,EAAQX,EACR,CACIY,uBAAwBZ,MACxBa,WAAY,WAEhB,CACIC,gBAAiBX,EAAUY,eAAahB,EAAKU,MAAON,EAAUa,UAGlEC,EAAgBC,gBAAcC,UAAQ,OAAQT,GAEpD,OACIU,gBAACC,uBACGnB,UAAW,CAACA,EAAWiB,UAAOG,OAAQL,EAAeb,GACrDO,MAAOA,GACHN,GAEHC,GAIbR,EAAOyB,YAAc"}

package/lib/new-components/badge/badge.d.ts

@@ -0,0 +1,7 @@
+import type { PropsWithChildren } from 'react';
+declare type Props = {
+    variant: 'neutral' | 'positive' | 'color';
+    'aria-label'?: string;
+};
+declare function Badge({ variant, children, ...rest }: PropsWithChildren<Props>): JSX.Element;
+export { Badge };

package/lib/new-components/badge/badge.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_rollupPluginBabelHelpers.js"),r=require("react"),t=require("../box/box.js"),a=require("./badge.module.css.js");const l=["variant","children"];exports.Badge=function(o){let{variant:u="neutral",children:s}=o,i=e.objectWithoutProperties(o,l);const c=a.default["badge-"+u];return r.createElement(t.Box,e.objectSpread2(e.objectSpread2({},i),{},{className:[a.default.badge,c]}),s)};
+//# sourceMappingURL=badge.js.map

package/lib/new-components/badge/badge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"badge.js","sources":["../../../src/new-components/badge/badge.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Box } from '../box'\n\nimport type { PropsWithChildren } from 'react'\n\nimport styles from './badge.module.css'\n\ntype Props = {\n    variant: 'neutral' | 'positive' | 'color'\n    'aria-label'?: string\n}\n\nfunction Badge({ variant = 'neutral', children, ...rest }: PropsWithChildren<Props>) {\n    const variantClassName = styles[`badge-${variant}`]\n\n    return (\n        <Box {...rest} className={[styles.badge, variantClassName]}>\n            {children}\n        </Box>\n    )\n}\n\nexport { Badge }\n"],"names":["variant","children","rest","variantClassName","styles","React","Box","className","badge"],"mappings":"+PAaA,gBAAeA,QAAEA,EAAU,UAAZC,SAAuBA,KAAaC,iCAC/C,MAAMC,EAAmBC,mBAAgBJ,GAEzC,OACIK,gBAACC,yCAAQJ,OAAMK,UAAW,CAACH,UAAOI,MAAOL,KACpCF"}

package/lib/new-components/badge/badge.module.css.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={badge:"_0b1e00ed","badge-neutral":"dda494a5","badge-positive":"_9260b8b0","badge-color":"_73a14c03"};
+//# sourceMappingURL=badge.module.css.js.map

package/lib/new-components/badge/badge.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"badge.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/lib/new-components/badge/index.d.ts

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

package/lib/new-components/box/box.js

@@ -1,2 +1,2 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var l=require("../../_virtual/_rollupPluginBabelHelpers.js"),a=require("react"),t=(e(a),e(require("classnames"))),s=require("../../utils/polymorphism.js"),n=require("../responsive-props.js"),i=require("./box.module.css.js"),d=require("./padding.module.css.js"),r=require("./margin.module.css.js"),u=require("./width.module.css.js");const g=["as","position","display","flexDirection","flexWrap","flexGrow","flexShrink","alignItems","justifyContent","alignSelf","overflow","width","height","background","border","borderRadius","minWidth","maxWidth","textAlign","padding","paddingY","paddingX","paddingTop","paddingRight","paddingBottom","paddingLeft","margin","marginY","marginX","marginTop","marginRight","marginBottom","marginLeft","className","children"];exports.Box=s.polymorphicComponent((function(e,s){var o,m,f,p,c,h,C,N;let{as:x="div",position:b="static",display:j,flexDirection:S="row",flexWrap:w,flexGrow:y,flexShrink:v,alignItems:W,justifyContent:q,alignSelf:R,overflow:B,width:L,height:T,background:k,border:X,borderRadius:Y,minWidth:_,maxWidth:A,textAlign:D,padding:G,paddingY:I,paddingX:P,paddingTop:E,paddingRight:F,paddingBottom:H,paddingLeft:M,margin:O,marginY:z,marginX:J,marginTop:K,marginRight:Q,marginBottom:U,marginLeft:V,className:Z,children:$}=e,ee=l.objectWithoutProperties(e,g);const le=null!=(o=null!=E?E:I)?o:G,ae=null!=(m=null!=F?F:P)?m:G,te=null!=(f=null!=H?H:I)?f:G,se=null!=(p=null!=M?M:P)?p:G,ne=null!=(c=null!=K?K:z)?c:O,ie=null!=(h=null!=Q?Q:J)?h:O,de=null!=(C=null!=U?U:z)?C:O,re=null!=(N=null!=V?V:J)?N:O,ue=!j||"string"==typeof j&&"flex"!==j&&"inlineFlex"!==j;return a.createElement(x,l.objectSpread2(l.objectSpread2({},ee),{},{className:t(Z,i.default.box,j?n.getClassNames(i.default,"display",j):null,"static"!==b?n.getClassNames(i.default,"position",b):null,null!=_?n.getClassNames(u.default,"minWidth",String(_)):null,n.getClassNames(u.default,"maxWidth",A),n.getClassNames(i.default,"textAlign",D),n.getClassNames(d.default,"paddingTop",le),n.getClassNames(d.default,"paddingRight",ae),n.getClassNames(d.default,"paddingBottom",te),n.getClassNames(d.default,"paddingLeft",se),n.getClassNames(r.default,"marginTop",ne),n.getClassNames(r.default,"marginRight",ie),n.getClassNames(r.default,"marginBottom",de),n.getClassNames(r.default,"marginLeft",re),ue?null:n.getClassNames(i.default,"flexDirection",S),ue?null:n.getClassNames(i.default,"flexWrap",w),ue?null:n.getClassNames(i.default,"alignItems",W),ue?null:n.getClassNames(i.default,"justifyContent",q),null!=R?n.getClassNames(i.default,"alignSelf",R):null,null!=v?n.getClassNames(i.default,"flexShrink",String(v)):null,null!=y?n.getClassNames(i.default,"flexGrow",String(y)):null,n.getClassNames(i.default,"overflow",B),null!=L?n.getClassNames(u.default,"width",String(L)):null,n.getClassNames(i.default,"height",T),n.getClassNames(i.default,"bg",k),"none"!==Y?n.getClassNames(i.default,"borderRadius",Y):null,"none"!==X?n.getClassNames(i.default,"border",X):null)||void 0,ref:s}),$)}));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,l=require("../../_virtual/_rollupPluginBabelHelpers.js"),a=require("react"),t=(e=require("classnames"))&&"object"==typeof e&&"default"in e?e.default:e,s=require("../../utils/polymorphism.js"),i=require("../responsive-props.js"),n=require("./box.module.css.js"),d=require("./padding.module.css.js"),r=require("./margin.module.css.js"),u=require("./width.module.css.js");const g=["as","position","display","flexDirection","flexWrap","flexGrow","flexShrink","alignItems","justifyContent","alignSelf","overflow","width","height","background","border","borderRadius","minWidth","maxWidth","textAlign","padding","paddingY","paddingX","paddingTop","paddingRight","paddingBottom","paddingLeft","margin","marginY","marginX","marginTop","marginRight","marginBottom","marginLeft","className","children"];exports.Box=s.polymorphicComponent((function(e,s){var o,m,f,p,h,C,c,N;let{as:x="div",position:b="static",display:j,flexDirection:S="row",flexWrap:w,flexGrow:y,flexShrink:v,alignItems:W,justifyContent:q,alignSelf:R,overflow:B,width:L,height:T,background:k,border:X,borderRadius:Y,minWidth:_,maxWidth:A,textAlign:D,padding:G,paddingY:I,paddingX:P,paddingTop:E,paddingRight:F,paddingBottom:H,paddingLeft:M,margin:O,marginY:z,marginX:J,marginTop:K,marginRight:Q,marginBottom:U,marginLeft:V,className:Z,children:$}=e,ee=l.objectWithoutProperties(e,g);const le=null!=(o=null!=E?E:I)?o:G,ae=null!=(m=null!=F?F:P)?m:G,te=null!=(f=null!=H?H:I)?f:G,se=null!=(p=null!=M?M:P)?p:G,ie=null!=(h=null!=K?K:z)?h:O,ne=null!=(C=null!=Q?Q:J)?C:O,de=null!=(c=null!=U?U:z)?c:O,re=null!=(N=null!=V?V:J)?N:O,ue=!j||"string"==typeof j&&"flex"!==j&&"inlineFlex"!==j;return a.createElement(x,l.objectSpread2(l.objectSpread2({},ee),{},{className:t(Z,n.default.box,j?i.getClassNames(n.default,"display",j):null,"static"!==b?i.getClassNames(n.default,"position",b):null,null!=_?i.getClassNames(u.default,"minWidth",String(_)):null,i.getClassNames(u.default,"maxWidth",A),i.getClassNames(n.default,"textAlign",D),i.getClassNames(d.default,"paddingTop",le),i.getClassNames(d.default,"paddingRight",ae),i.getClassNames(d.default,"paddingBottom",te),i.getClassNames(d.default,"paddingLeft",se),i.getClassNames(r.default,"marginTop",ie),i.getClassNames(r.default,"marginRight",ne),i.getClassNames(r.default,"marginBottom",de),i.getClassNames(r.default,"marginLeft",re),ue?null:i.getClassNames(n.default,"flexDirection",S),ue?null:i.getClassNames(n.default,"flexWrap",w),ue?null:i.getClassNames(n.default,"alignItems",W),ue?null:i.getClassNames(n.default,"justifyContent",q),null!=R?i.getClassNames(n.default,"alignSelf",R):null,null!=v?i.getClassNames(n.default,"flexShrink",String(v)):null,null!=y?i.getClassNames(n.default,"flexGrow",String(y)):null,i.getClassNames(n.default,"overflow",B),null!=L?i.getClassNames(u.default,"width",String(L)):null,i.getClassNames(n.default,"height",T),i.getClassNames(n.default,"bg",k),"none"!==Y?i.getClassNames(n.default,"borderRadius",Y):null,"none"!==X?i.getClassNames(n.default,"border",X):null)||void 0,ref:s}),$)}));
 //# sourceMappingURL=box.js.map