@oliasoft-open-source/react-ui-library 4.11.0-beta-3 → 4.12.0-beta-1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/assets/{index-BpSdrNXy.css → index-BU9wzZv9.css} +336 -336
- package/dist/assets/{index-DoFa61ar.js → index-BVCFmQTa.js} +144 -164
- package/dist/index.d.ts +2 -6
- package/dist/index.html +1 -1
- package/dist/index.js +190 -181
- package/dist/index.js.map +1 -1
- package/dist/storybook/assets/{Color-KGDBMAHA-DeGjmgTY.js → Color-KGDBMAHA-CK3d59Om.js} +1 -1
- package/dist/storybook/assets/{DocsRenderer-PKQXORMH-DJIj_qEG.js → DocsRenderer-PKQXORMH-C_QE44cn.js} +1 -1
- package/dist/storybook/assets/{accordion.stories-BTxV-ybU.js → accordion.stories-C3VY77Jy.js} +2 -2
- package/dist/storybook/assets/{actions-D-uVCDzk.js → actions-Bax0KeqM.js} +2 -2
- package/dist/storybook/assets/{actions.stories-gKfuiKQy.js → actions.stories-BnPZKqOJ.js} +1 -1
- package/dist/storybook/assets/{afe.stories-DFQsvqIV.js → afe.stories-C9XjJj62.js} +2 -2
- package/dist/storybook/assets/{badge.stories-Dkq_XgEW.js → badge.stories-DA_eeQyi.js} +1 -1
- package/dist/storybook/assets/{blowout.stories-DHdofVc-.js → blowout.stories-DH-sYHgB.js} +1 -1
- package/dist/storybook/assets/button-Cbv7WK6k.js +1 -0
- package/dist/storybook/assets/button-DtgxLQCF.css +1 -0
- package/dist/storybook/assets/{button-group-1DEZPmxq.js → button-group-D2fGP_bX.js} +1 -1
- package/dist/storybook/assets/{button-group.stories-C4V1k0z_.js → button-group.stories-BETADGti.js} +1 -1
- package/dist/storybook/assets/{button.stories-DA9DGYD2.js → button.stories-C03VvX8K.js} +1 -1
- package/dist/storybook/assets/{buttons-and-links-BHGzZGPV.js → buttons-and-links-FQEbqz9H.js} +1 -1
- package/dist/storybook/assets/{casing-loads.stories-CJpnsmsZ.js → casing-loads.stories-B7JIoJVk.js} +2 -2
- package/dist/storybook/assets/{cell.stories-Bpl0Squh.js → cell.stories-xZiHEc0P.js} +2 -2
- package/dist/storybook/assets/check-box.stories-BJ0ShmeC.js +97 -0
- package/dist/storybook/assets/check-box.test-case.stories-CzuYZkUh.js +30 -0
- package/dist/storybook/assets/{chunk-HLWAVYOI-D2p4xoma.js → chunk-HLWAVYOI-EhWEisNT.js} +1 -1
- package/dist/storybook/assets/{color-D9KYOiNh.js → color-B3dajHjs.js} +1 -1
- package/dist/storybook/assets/{dialog-BelCA1mt.js → dialog-DkpQscuI.js} +1 -1
- package/dist/storybook/assets/drawer-BVc1xI9q.css +1 -0
- package/dist/storybook/assets/drawer-DaQ1xGjV.js +3 -0
- package/dist/storybook/assets/{drawer.stories-DcjyDHEs.js → drawer.stories-C08XBVTq.js} +1 -1
- package/dist/storybook/assets/{empty.stories-DcwF0pkK.js → empty.stories-L7LSMcLe.js} +1 -1
- package/dist/storybook/assets/enum-Bnn40S8Q.js +1 -0
- package/dist/storybook/assets/{field.stories-DUGMwi1O.js → field.stories-CYpQ669-.js} +1 -1
- package/dist/storybook/assets/{file-button.stories-CU2pZcEO.js → file-button.stories-CRaTdLfv.js} +1 -1
- package/dist/storybook/assets/{file-input-B0-ERX66.js → file-input-yalPf7-m.js} +1 -1
- package/dist/storybook/assets/{file-input.stories-Cpd1NHbq.js → file-input.stories-DMTQqAF8.js} +1 -1
- package/dist/storybook/assets/{flex.stories-BhvJpHpN.js → flex.stories-CLwPyEMp.js} +1 -1
- package/dist/storybook/assets/footer.stories-BxzKeFAK.js +3 -0
- package/dist/storybook/assets/form.stories-BNORsn6Z.js +49 -0
- package/dist/storybook/assets/formation.stories-C5Hkb3iK.js +74 -0
- package/dist/storybook/assets/helpers-JJxzGegQ.js +1 -0
- package/dist/storybook/assets/iframe-DOUoMheZ.js +2 -0
- package/dist/storybook/assets/{index-C0Iaso0O.js → index-AKsHS-dO.js} +4 -4
- package/dist/storybook/assets/{index-CNkaN_wz.js → index-KVAIZqzA.js} +1 -1
- package/dist/storybook/assets/initialize-context-rEvM6bdZ.js +1 -0
- package/dist/storybook/assets/input-Db9WkmPP.js +1 -0
- package/dist/storybook/assets/input-Dz1ZZYN5.css +1 -0
- package/dist/storybook/assets/{input-group.stories-CElwRt3p.js → input-group.stories-BCajsqAk.js} +3 -3
- package/dist/storybook/assets/{input-validation-Ccgprl1C.js → input-validation-BNoUk3q6.js} +2 -2
- package/dist/storybook/assets/{input.stories-FKl0qVhm.js → input.stories-SJy3TKkD.js} +1 -1
- package/dist/storybook/assets/{inputs-DtQ245kS.js → inputs-Dql6Fq32.js} +2 -2
- package/dist/storybook/assets/{layout-forms-Bm7FYA3V.js → layout-forms-DuFo_rwV.js} +5 -5
- package/dist/storybook/assets/{layout-general-V7ekuEG7.js → layout-general-C-UddRr1.js} +1 -1
- package/dist/storybook/assets/{list-bKpz6I9Q.js → list-By3wp5Wa.js} +1 -1
- package/dist/storybook/assets/{list.stories-Cgmt29Wv.js → list.stories-BcDHHHYJ.js} +1 -1
- package/dist/storybook/assets/{list.stories-data-D_Aj3AN4.js → list.stories-data-Doo2Rqun.js} +1 -1
- package/dist/storybook/assets/{loader.stories-pS8zRM4u.js → loader.stories-Q0U2BqZX.js} +1 -1
- package/dist/storybook/assets/menu.stories-1I5AGGQx.js +82 -0
- package/dist/storybook/assets/menu.test-case.stories-BFYhvtSH.js +3 -0
- package/dist/storybook/assets/message-BRyKdRaX.js +1 -0
- package/dist/storybook/assets/message-C2ZCkHX6.css +1 -0
- package/dist/storybook/assets/{message.stories-r_UlbshI.js → message.stories-bCqCYIuN.js} +1 -1
- package/dist/storybook/assets/meta-content-ByVTG0hd.css +1 -0
- package/dist/storybook/assets/meta-content-DNgQbAW0.js +9 -0
- package/dist/storybook/assets/modal.stories-C2d-Em5V.js +200 -0
- package/dist/storybook/assets/modal.test-case.stories-H8AYyvAl.js +21 -0
- package/dist/storybook/assets/{number-input-Bpg4Yqmo.js → number-input-CNnU6gOF.js} +2 -2
- package/dist/storybook/assets/number-input.stories-Bo26PJmJ.js +89 -0
- package/dist/storybook/assets/number-input.test-case.stories-BBKpBWfA.js +92 -0
- package/dist/storybook/assets/{option-dropdown.stories-CIvqMhQ3.js → option-dropdown.stories-CznUbXVi.js} +1 -1
- package/dist/storybook/assets/{padding-and-spacing-IKi7rvQ-.js → padding-and-spacing-B9ObVTUS.js} +1 -1
- package/dist/storybook/assets/{page.stories-DnCh8h8y.js → page.stories-DthnK8qb.js} +1 -1
- package/dist/storybook/assets/{pagination-CLt-kUlx.js → pagination-CR1nxnnq.js} +1 -1
- package/dist/storybook/assets/{pagination.stories-CTRM0Xou.js → pagination.stories-qXmBYwYc.js} +2 -2
- package/dist/storybook/assets/{pop-confirm.stories-DCpooB2O.js → pop-confirm.stories-CHa0qUBe.js} +1 -1
- package/dist/storybook/assets/{popover-rq33c1W2.js → popover-C_2P8LFJ.js} +1 -1
- package/dist/storybook/assets/popover.stories-DZTfimDf.js +10 -0
- package/dist/storybook/assets/{preview-ZgLLfBPl.js → preview-_21fnvwa.js} +2 -2
- package/dist/storybook/assets/{preview-CtQzjqBP.js → preview-dBqj-M8_.js} +1 -1
- package/dist/storybook/assets/projects.stories-BPm6ucAe.js +47 -0
- package/dist/storybook/assets/{radio-button-DmDuw4DA.js → radio-button-C4ljBRED.js} +1 -1
- package/dist/storybook/assets/radio-button.stories-D1rWr6ms.js +61 -0
- package/dist/storybook/assets/radio-button.test-case.stories-DglmHlWs.js +11 -0
- package/dist/storybook/assets/{reservoirs.stories-B12tIrmZ.js → reservoirs.stories-r1Ip90kJ.js} +2 -2
- package/dist/storybook/assets/{rich-text-input-dDjxXFl-.css → rich-text-input-BJfL0Me_.css} +1 -1
- package/dist/storybook/assets/{rich-text-input.stories-DkaOBgbE.js → rich-text-input.stories-DwaseXZv.js} +3 -3
- package/dist/storybook/assets/{row.stories-msEoNdGI.js → row.stories-BrPMTnKK.js} +2 -2
- package/dist/storybook/assets/select-BmYXTl_0.css +1 -0
- package/dist/storybook/assets/select-Cwks-WA0.js +61 -0
- package/dist/storybook/assets/select.input-CJed_LLR.js +1 -0
- package/dist/storybook/assets/select.stories-DjGSNDXK.js +498 -0
- package/dist/storybook/assets/select.stories-data-DxgWKlU6.js +1 -0
- package/dist/storybook/assets/select.test-case.stories-B6On-PjA.js +82 -0
- package/dist/storybook/assets/side-bar-fBbBqyAT.css +1 -0
- package/dist/storybook/assets/side-bar-wpFQ5NEE.js +24 -0
- package/dist/storybook/assets/{side-bar.stories-M6FsuCrQ.js → side-bar.stories-LjClxJcG.js} +1 -1
- package/dist/storybook/assets/{site.stories-umpPYjkq.js → site.stories-BnWmALGd.js} +2 -2
- package/dist/storybook/assets/{slider-C7vnj_3M.js → slider-CcpE4BLD.js} +1 -1
- package/dist/storybook/assets/{slider.stories-BzBb3PkP.js → slider.stories-BqlRLY_C.js} +1 -1
- package/dist/storybook/assets/{smart-upload-modal.stories-xqiXR6jV.js → smart-upload-modal.stories-BlTSF64K.js} +1 -1
- package/dist/storybook/assets/{spacer.stories-BBTt2LdE.js → spacer.stories-BT2S6B0R.js} +1 -1
- package/dist/storybook/assets/table-BtBtDwPu.css +1 -0
- package/dist/storybook/assets/table-iVsvoMpy.js +86 -0
- package/dist/storybook/assets/{table.stories-Clltxls0.js → table.stories-DmGMjcFw.js} +2 -2
- package/dist/storybook/assets/{table.stories-data-C3vJedB1.js → table.stories-data-C7mC5R8Q.js} +1 -1
- package/dist/storybook/assets/{tabs-C3NG6m9W.js → tabs-BoToLVEP.js} +1 -1
- package/dist/storybook/assets/tabs.stories-B52iEaHf.js +30 -0
- package/dist/storybook/assets/{textarea-D6ltcKhz.js → textarea-DflOOrxV.js} +2 -2
- package/dist/storybook/assets/textarea-TqxidmV4.css +1 -0
- package/dist/storybook/assets/{textarea.stories-CJ-Oqytp.js → textarea.stories-CzsqRVpC.js} +1 -1
- package/dist/storybook/assets/{title.stories-CsrYTGde.js → title.stories-D2LDNgbT.js} +3 -3
- package/dist/storybook/assets/{toaster-BoBcvmf9.js → toaster-O8ftrUAJ.js} +1 -1
- package/dist/storybook/assets/toaster.stories-CdpwLBSo.js +84 -0
- package/dist/storybook/assets/toaster.test-case.stories-BhWnh4Cd.js +6 -0
- package/dist/storybook/assets/toggle.stories-BAislK3I.js +106 -0
- package/dist/storybook/assets/toggle.test-case.stories-CeUwdhGD.js +36 -0
- package/dist/storybook/assets/{tooltip.test-case.stories-CHibN8rC.js → tooltip.test-case.stories-De9h8ThH.js} +1 -1
- package/dist/storybook/assets/{top-bar-DkXSzzqt.js → top-bar-Bjf6PQE1.js} +1 -1
- package/dist/storybook/assets/{top-bar.stories-HDmWT243.js → top-bar.stories-1hZmlzDT.js} +1 -1
- package/dist/storybook/assets/{top-bar.testcase.stories-DfmrkEpT.js → top-bar.testcase.stories-BsFYqaw6.js} +1 -1
- package/dist/storybook/assets/{tree.stories-feLUcTtm.js → tree.stories-NGZfmH_B.js} +1 -1
- package/dist/storybook/assets/unit-input-Byipu-z0.js +10 -0
- package/dist/storybook/assets/unit-input.stories-CChVbxmI.js +198 -0
- package/dist/storybook/assets/unit-input.test-case.stories-BwKiucyc.js +220 -0
- package/dist/storybook/assets/unit-table.stories-B7rN0MF0.js +152 -0
- package/dist/storybook/assets/unit-table.test-case.stories-BIMbgiTz.js +1 -0
- package/dist/storybook/iframe.html +1 -1
- package/dist/storybook/index.json +1 -1
- package/dist/storybook/project.json +1 -1
- package/package.json +1 -1
- package/dist/storybook/assets/button-DHevvVBE.js +0 -1
- package/dist/storybook/assets/button-fAxt_G4d.css +0 -1
- package/dist/storybook/assets/check-box.stories-DfbWw6mD.js +0 -126
- package/dist/storybook/assets/drawer-DOWJp9T4.js +0 -3
- package/dist/storybook/assets/drawer-DhrjYsQu.css +0 -1
- package/dist/storybook/assets/footer.stories-DgjDE_JR.js +0 -3
- package/dist/storybook/assets/form.stories-BrUnmw7R.js +0 -49
- package/dist/storybook/assets/formation.stories-BT8VrcqV.js +0 -74
- package/dist/storybook/assets/iframe-B8VgeFPT.js +0 -2
- package/dist/storybook/assets/initialize-context-DOqEe1Xq.js +0 -1
- package/dist/storybook/assets/input-DD7t4kHm.css +0 -1
- package/dist/storybook/assets/input-DTXbDJaL.js +0 -1
- package/dist/storybook/assets/menu.stories-xWX80Eh2.js +0 -84
- package/dist/storybook/assets/message-Cl3kn7ZD.css +0 -1
- package/dist/storybook/assets/message-Y48EomV-.js +0 -1
- package/dist/storybook/assets/meta-content-DWZbURV2.js +0 -9
- package/dist/storybook/assets/meta-content-DnZPPeTF.css +0 -1
- package/dist/storybook/assets/modal.stories-LhoWfDE6.js +0 -220
- package/dist/storybook/assets/number-input.stories-DhCjZ37u.js +0 -180
- package/dist/storybook/assets/popover.stories-CGm0M5fv.js +0 -10
- package/dist/storybook/assets/projects.stories-BQswWVCx.js +0 -47
- package/dist/storybook/assets/radio-button.stories-5gvV0LD0.js +0 -71
- package/dist/storybook/assets/select-DnRuRG_N.js +0 -61
- package/dist/storybook/assets/select-H-9tdhwc.css +0 -1
- package/dist/storybook/assets/select.input-D0UkAPd9.js +0 -1
- package/dist/storybook/assets/select.stories-B9w9ONzj.js +0 -579
- package/dist/storybook/assets/side-bar-CSx5wI-k.js +0 -24
- package/dist/storybook/assets/side-bar-auov230-.css +0 -1
- package/dist/storybook/assets/table-5Y5KPNSk.js +0 -86
- package/dist/storybook/assets/table-B8ojy8Nj.css +0 -1
- package/dist/storybook/assets/tabs.stories-dsXjRHJy.js +0 -30
- package/dist/storybook/assets/textarea-H-YTEwr8.css +0 -1
- package/dist/storybook/assets/toaster.stories-HO4VBTy-.js +0 -89
- package/dist/storybook/assets/toggle.stories-qTHFTXxI.js +0 -141
- package/dist/storybook/assets/unit-input.stories-QnEpR0rY.js +0 -426
- package/dist/storybook/assets/unit-table.stories-BZCc0yfc.js +0 -152
|
@@ -1,84 +0,0 @@
|
|
|
1
|
-
import{j as r}from"./jsx-runtime-eps93zm2.js";import{r as Ir}from"./index-DhsZuJvc.js";import{H as Cr,L as J,S as Dr,R as U}from"./react-router-dom-Ck2Y_Fzc.js";import{T as A,I as fr}from"./common-types-Sih75Sav.js";import{w as kr,e as P,u as v}from"./index-DMAnyMX5.js";import{M as W}from"./actions-D-uVCDzk.js";import{B as X}from"./button-DHevvVBE.js";import{F as Rr}from"./flex-EllkLxgO.js";import{m as s,a as wr,b as Br,c as Er,d as Nr,e as Fr,f as Lr,g as Pr,h as _r,i as Ar}from"./menu.stories-data-CQ59XhzU.js";import{M as H}from"./types-BmbYqTX_.js";import"./inheritsLoose-DP0QEDDI.js";import"./index-CEuq6vkz.js";import"./tiny-invariant-DqLgxztJ.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./index-CF7H4eMJ.js";import"./index-Bk2sglWO.js";import"./lodash-c4VUpsOs.js";import"./disabled-context-rmpd7YJS.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";import"./icon-BSFY3vDO.js";import"./types-Dx2TtIG9.js";import"./badge-CLQ59MDF.js";import"./spinner-AWUe4xwQ.js";const ps={title:"Basic/Menu",component:W,args:{menu:s}},e=a=>r.jsx(W,{...a}),_=e.bind({}),c=e.bind({});c.args={menu:{...s,colored:!0}};const p=e.bind({});p.args={menu:{...s,label:"Delete",colored:"danger"}};const d=e.bind({});d.args={menu:{...s,trigger:A.TEXT}};const l=e.bind({});l.args={menu:{...s,trigger:A.COMPONENT,component:r.jsx(X,{small:!0,colored:!0,round:!0,icon:fr.SETTINGS})}};const m=e.bind({});m.args={menu:wr};const u=e.bind({});u.args={menu:Br};const g=e.bind({});g.args={menu:Er};const b=e.bind({});b.args={menu:Nr};const x=e.bind({});x.args={disabled:!0};const S=e.bind({});S.args={tooltip:"Tooltip goes here"};const h=e.bind({});h.args={error:"Error goes here"};const T=e.bind({});T.args={warning:"Warning goes here"};const j=e.bind({});j.args={loading:!0,disabled:!0};const M=e.bind({});M.args={badgeTitle:"3"};const y=e.bind({});y.args={badgeDot:!0};const O=e.bind({});O.args={menu:Fr};const I=e.bind({});I.args={menu:Lr};const C=e.bind({});C.args={closeOnOptionClick:!1};const D=e.bind({});D.args={contextMenu:!0,menu:{...s,trigger:A.TEXT,label:"Right-click me"}};const f=e.bind({});f.args={width:"100%"};const k=e.bind({});k.args={menu:{...s,small:!0}};const R=e.bind({});R.args={menu:Pr};const w=e.bind({});w.args={menu:{...s,sections:r.jsx("div",{children:"Testing"})}};const B=e.bind({});B.args={menu:_r};const E=e.bind({});E.args={menu:Ar};const N=()=>{const[a,t]=Ir.useState(!1);return r.jsxs(Rr,{gap:!0,children:[r.jsx(W,{menu:s,open:a,setOpen:t}),r.jsx(X,{label:"Open",onClick:()=>t(!0),disabled:a}),r.jsx(X,{label:"Close",onClick:()=>t(!1),disabled:!a})]})},F=()=>r.jsxs(Cr,{children:[r.jsx(W,{menu:{label:"Go to",trigger:A.DROP_DOWN_BUTTON,sections:[{type:H.OPTION,label:"Dashboard",url:"/dashboard",component:J},{type:H.OPTION,label:"Settings",url:"/settings",component:J}]}}),r.jsxs(Dr,{children:[r.jsx(U,{path:"/dashboard",children:"Dashboard"}),r.jsx(U,{path:"/settings",children:"Settings"})]})]}),o=e.bind({});o.args={testId:"testId"};o.play=async({canvasElement:a,step:t})=>{const n=a.parentElement?kr(a.parentElement):null;await P(n).toBeTruthy(),n&&(await t("Clicking trigger should open menu",async()=>{const L=n.getByTestId("testId");await v.click(L);const i=n.getByTestId("testId-layer");await P(i).toBeInTheDocument()}),await t("Clicking disabled item should do nothing",async()=>{await n.getByText("Knight").click();const i=n.getByTestId("testId-layer");await P(i).toBeInTheDocument()}),await t("Clicking item should close menu",async()=>{const L=n.getByText("King");await v.click(L);const i=n.queryByTestId("testId-layer");await P(i).not.toBeInTheDocument()}))};N.__docgenInfo={description:"",methods:[],displayName:"ControlOpenStateFromParent"};F.__docgenInfo={description:"",methods:[],displayName:"AsRouterLink"};var G,K,q;_.parameters={..._.parameters,docs:{...(G=_.parameters)==null?void 0:G.docs,source:{originalSource:`args => <Menu
|
|
2
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
3
|
-
{...args} />`,...(q=(K=_.parameters)==null?void 0:K.docs)==null?void 0:q.source}}};var z,Q,V;c.parameters={...c.parameters,docs:{...(z=c.parameters)==null?void 0:z.docs,source:{originalSource:`args => <Menu
|
|
4
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
5
|
-
{...args} />`,...(V=(Q=c.parameters)==null?void 0:Q.docs)==null?void 0:V.source}}};var Y,Z,$;p.parameters={...p.parameters,docs:{...(Y=p.parameters)==null?void 0:Y.docs,source:{originalSource:`args => <Menu
|
|
6
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
7
|
-
{...args} />`,...($=(Z=p.parameters)==null?void 0:Z.docs)==null?void 0:$.source}}};var ee,re,se;d.parameters={...d.parameters,docs:{...(ee=d.parameters)==null?void 0:ee.docs,source:{originalSource:`args => <Menu
|
|
8
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
9
|
-
{...args} />`,...(se=(re=d.parameters)==null?void 0:re.docs)==null?void 0:se.source}}};var ae,ne,te;l.parameters={...l.parameters,docs:{...(ae=l.parameters)==null?void 0:ae.docs,source:{originalSource:`args => <Menu
|
|
10
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
11
|
-
{...args} />`,...(te=(ne=l.parameters)==null?void 0:ne.docs)==null?void 0:te.source}}};var oe,ie,ce;m.parameters={...m.parameters,docs:{...(oe=m.parameters)==null?void 0:oe.docs,source:{originalSource:`args => <Menu
|
|
12
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
13
|
-
{...args} />`,...(ce=(ie=m.parameters)==null?void 0:ie.docs)==null?void 0:ce.source}}};var pe,de,le;u.parameters={...u.parameters,docs:{...(pe=u.parameters)==null?void 0:pe.docs,source:{originalSource:`args => <Menu
|
|
14
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
15
|
-
{...args} />`,...(le=(de=u.parameters)==null?void 0:de.docs)==null?void 0:le.source}}};var me,ue,ge;g.parameters={...g.parameters,docs:{...(me=g.parameters)==null?void 0:me.docs,source:{originalSource:`args => <Menu
|
|
16
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
17
|
-
{...args} />`,...(ge=(ue=g.parameters)==null?void 0:ue.docs)==null?void 0:ge.source}}};var be,xe,Se;b.parameters={...b.parameters,docs:{...(be=b.parameters)==null?void 0:be.docs,source:{originalSource:`args => <Menu
|
|
18
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
19
|
-
{...args} />`,...(Se=(xe=b.parameters)==null?void 0:xe.docs)==null?void 0:Se.source}}};var he,Te,je;x.parameters={...x.parameters,docs:{...(he=x.parameters)==null?void 0:he.docs,source:{originalSource:`args => <Menu
|
|
20
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
21
|
-
{...args} />`,...(je=(Te=x.parameters)==null?void 0:Te.docs)==null?void 0:je.source}}};var Me,ye,Oe;S.parameters={...S.parameters,docs:{...(Me=S.parameters)==null?void 0:Me.docs,source:{originalSource:`args => <Menu
|
|
22
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
23
|
-
{...args} />`,...(Oe=(ye=S.parameters)==null?void 0:ye.docs)==null?void 0:Oe.source}}};var Ie,Ce,De;h.parameters={...h.parameters,docs:{...(Ie=h.parameters)==null?void 0:Ie.docs,source:{originalSource:`args => <Menu
|
|
24
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
25
|
-
{...args} />`,...(De=(Ce=h.parameters)==null?void 0:Ce.docs)==null?void 0:De.source}}};var fe,ke,Re;T.parameters={...T.parameters,docs:{...(fe=T.parameters)==null?void 0:fe.docs,source:{originalSource:`args => <Menu
|
|
26
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
27
|
-
{...args} />`,...(Re=(ke=T.parameters)==null?void 0:ke.docs)==null?void 0:Re.source}}};var we,Be,Ee;j.parameters={...j.parameters,docs:{...(we=j.parameters)==null?void 0:we.docs,source:{originalSource:`args => <Menu
|
|
28
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
29
|
-
{...args} />`,...(Ee=(Be=j.parameters)==null?void 0:Be.docs)==null?void 0:Ee.source}}};var Ne,Fe,Le;M.parameters={...M.parameters,docs:{...(Ne=M.parameters)==null?void 0:Ne.docs,source:{originalSource:`args => <Menu
|
|
30
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
31
|
-
{...args} />`,...(Le=(Fe=M.parameters)==null?void 0:Fe.docs)==null?void 0:Le.source}}};var Pe,_e,Ae;y.parameters={...y.parameters,docs:{...(Pe=y.parameters)==null?void 0:Pe.docs,source:{originalSource:`args => <Menu
|
|
32
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
33
|
-
{...args} />`,...(Ae=(_e=y.parameters)==null?void 0:_e.docs)==null?void 0:Ae.source}}};var We,Xe,Je;O.parameters={...O.parameters,docs:{...(We=O.parameters)==null?void 0:We.docs,source:{originalSource:`args => <Menu
|
|
34
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
35
|
-
{...args} />`,...(Je=(Xe=O.parameters)==null?void 0:Xe.docs)==null?void 0:Je.source}}};var Ue,ve,He;I.parameters={...I.parameters,docs:{...(Ue=I.parameters)==null?void 0:Ue.docs,source:{originalSource:`args => <Menu
|
|
36
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
37
|
-
{...args} />`,...(He=(ve=I.parameters)==null?void 0:ve.docs)==null?void 0:He.source}}};var Ge,Ke,qe;C.parameters={...C.parameters,docs:{...(Ge=C.parameters)==null?void 0:Ge.docs,source:{originalSource:`args => <Menu
|
|
38
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
39
|
-
{...args} />`,...(qe=(Ke=C.parameters)==null?void 0:Ke.docs)==null?void 0:qe.source}}};var ze,Qe,Ve;D.parameters={...D.parameters,docs:{...(ze=D.parameters)==null?void 0:ze.docs,source:{originalSource:`args => <Menu
|
|
40
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
41
|
-
{...args} />`,...(Ve=(Qe=D.parameters)==null?void 0:Qe.docs)==null?void 0:Ve.source}}};var Ye,Ze,$e;f.parameters={...f.parameters,docs:{...(Ye=f.parameters)==null?void 0:Ye.docs,source:{originalSource:`args => <Menu
|
|
42
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
43
|
-
{...args} />`,...($e=(Ze=f.parameters)==null?void 0:Ze.docs)==null?void 0:$e.source}}};var er,rr,sr;k.parameters={...k.parameters,docs:{...(er=k.parameters)==null?void 0:er.docs,source:{originalSource:`args => <Menu
|
|
44
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
45
|
-
{...args} />`,...(sr=(rr=k.parameters)==null?void 0:rr.docs)==null?void 0:sr.source}}};var ar,nr,tr;R.parameters={...R.parameters,docs:{...(ar=R.parameters)==null?void 0:ar.docs,source:{originalSource:`args => <Menu
|
|
46
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
47
|
-
{...args} />`,...(tr=(nr=R.parameters)==null?void 0:nr.docs)==null?void 0:tr.source}}};var or,ir,cr;w.parameters={...w.parameters,docs:{...(or=w.parameters)==null?void 0:or.docs,source:{originalSource:`args => <Menu
|
|
48
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
49
|
-
{...args} />`,...(cr=(ir=w.parameters)==null?void 0:ir.docs)==null?void 0:cr.source}}};var pr,dr,lr;B.parameters={...B.parameters,docs:{...(pr=B.parameters)==null?void 0:pr.docs,source:{originalSource:`args => <Menu
|
|
50
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
51
|
-
{...args} />`,...(lr=(dr=B.parameters)==null?void 0:dr.docs)==null?void 0:lr.source}}};var mr,ur,gr;E.parameters={...E.parameters,docs:{...(mr=E.parameters)==null?void 0:mr.docs,source:{originalSource:`args => <Menu
|
|
52
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
53
|
-
{...args} />`,...(gr=(ur=E.parameters)==null?void 0:ur.docs)==null?void 0:gr.source}}};var br,xr,Sr;N.parameters={...N.parameters,docs:{...(br=N.parameters)==null?void 0:br.docs,source:{originalSource:`() => {
|
|
54
|
-
const [open, setOpen] = useState(false);
|
|
55
|
-
return <Flex gap>
|
|
56
|
-
<Menu menu={storyData.menu} open={open} setOpen={setOpen} />
|
|
57
|
-
<Button label="Open" onClick={() => setOpen(true)} disabled={open} />
|
|
58
|
-
<Button label="Close" onClick={() => setOpen(false)} disabled={!open} />
|
|
59
|
-
</Flex>;
|
|
60
|
-
}`,...(Sr=(xr=N.parameters)==null?void 0:xr.docs)==null?void 0:Sr.source}}};var hr,Tr,jr;F.parameters={...F.parameters,docs:{...(hr=F.parameters)==null?void 0:hr.docs,source:{originalSource:`() => {
|
|
61
|
-
return <HashRouter>
|
|
62
|
-
<Menu menu={{
|
|
63
|
-
label: 'Go to',
|
|
64
|
-
trigger: TriggerType.DROP_DOWN_BUTTON,
|
|
65
|
-
sections: [{
|
|
66
|
-
type: MenuType.OPTION,
|
|
67
|
-
label: 'Dashboard',
|
|
68
|
-
url: '/dashboard',
|
|
69
|
-
component: Link
|
|
70
|
-
}, {
|
|
71
|
-
type: MenuType.OPTION,
|
|
72
|
-
label: 'Settings',
|
|
73
|
-
url: '/settings',
|
|
74
|
-
component: Link
|
|
75
|
-
}]
|
|
76
|
-
}} />
|
|
77
|
-
<Switch>
|
|
78
|
-
<Route path="/dashboard">Dashboard</Route>
|
|
79
|
-
<Route path="/settings">Settings</Route>
|
|
80
|
-
</Switch>
|
|
81
|
-
</HashRouter>;
|
|
82
|
-
}`,...(jr=(Tr=F.parameters)==null?void 0:Tr.docs)==null?void 0:jr.source}}};var Mr,yr,Or;o.parameters={...o.parameters,docs:{...(Mr=o.parameters)==null?void 0:Mr.docs,source:{originalSource:`args => <Menu
|
|
83
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
84
|
-
{...args} />`,...(Or=(yr=o.parameters)==null?void 0:yr.docs)==null?void 0:Or.source}}};const ds=["Default","PrimaryTrigger","DestructiveTrigger","TextTrigger","CustomTrigger","FileUpload","DescriptionOnRight","Actions","Icons","Disabled","Tooltip","Error","Warning","Loading","Badge","Dot","Empty","Submenus","WithoutCloseOnOptionClick","RightClickContextMenu","FullWidth","Small","JSXItems","JSXContent","ShowAll","Long","ControlOpenStateFromParent","AsRouterLink","Test"];export{g as Actions,F as AsRouterLink,M as Badge,N as ControlOpenStateFromParent,l as CustomTrigger,_ as Default,u as DescriptionOnRight,p as DestructiveTrigger,x as Disabled,y as Dot,O as Empty,h as Error,m as FileUpload,f as FullWidth,b as Icons,w as JSXContent,R as JSXItems,j as Loading,E as Long,c as PrimaryTrigger,D as RightClickContextMenu,B as ShowAll,k as Small,I as Submenus,o as Test,d as TextTrigger,S as Tooltip,T as Warning,C as WithoutCloseOnOptionClick,ds as __namedExportsOrder,ps as default};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
._inputInTable_1q2d1_1{background-color:transparent;border-radius:inherit!important;height:var(--size);min-height:100%}._inputInTable_1q2d1_1:not(:hover):not(._error_1q2d1_7):not(._warning_1q2d1_7){border-color:transparent}._inputInTable_1q2d1_1:not(:focus){box-shadow:none}._inputHover_1q2d1_13{position:relative;border-color:var(--color-border-hover);z-index:2}._inputFocus_1q2d1_18{position:relative;outline:none!important;border-color:var(--color-border-focus)!important;box-shadow:var(--shadow-focus);z-index:3}._inputError_1q2d1_25,._inputWarning_1q2d1_26{position:relative}._inputError_1q2d1_25{z-index:2;border-color:var(--color-border-error);color:var(--color-text-error)!important;background-color:var(--color-background-error-muted)}._inputError_1q2d1_25:hover{border-color:var(--color-border-error-hover)!important}._inputError_1q2d1_25:focus{position:relative;outline:none!important;border-color:var(--color-border-focus)!important;box-shadow:var(--shadow-focus);z-index:3}._inputWarning_1q2d1_26{z-index:1;border-color:var(--color-border-warning);color:var(--color-text-warning)!important;background-color:var(--color-background-warning-muted)}._inputWarning_1q2d1_26:hover{border-color:var(--color-border-warning-hover)!important}._inputWarning_1q2d1_26:focus{position:relative;outline:none!important;border-color:var(--color-border-focus)!important;box-shadow:var(--shadow-focus);z-index:3}._inputDisabled_1q2d1_61{pointer-events:none;background-color:var(--color-background-disabled);color:var(--color-text-muted);box-shadow:none}._hideScrollbars_1q2d1_67{scrollbar-width:none;-ms-overflow-style:none}._hideScrollbars_1q2d1_67::-webkit-scrollbar{display:none}:root{--color-border-message: rgba(0, 0, 0, .1)}html[data-theme=dark]{--color-border-message: rgba(255, 255, 255, .1)}._container_1q2d1_83{padding:var(--padding-sm);border-radius:var(--border-radius);display:inline-flex;align-items:flex-start;line-height:var(--line-height);flex-wrap:wrap;overflow-y:auto;border:1px solid var(--color-border-message);scrollbar-width:none;-ms-overflow-style:none}._container_1q2d1_83::-webkit-scrollbar{display:none}._container_1q2d1_83._block_1q2d1_101{display:flex}._container_1q2d1_83._info_1q2d1_104{color:var(--color-text-info);background-color:var(--color-background-info-muted)}._container_1q2d1_83._success_1q2d1_108{color:var(--color-text-success);background-color:var(--color-background-success-muted)}._container_1q2d1_83._warning_1q2d1_7{color:var(--color-text-warning);background-color:var(--color-background-warning-muted)}._container_1q2d1_83._error_1q2d1_7{color:var(--color-text-error);background-color:var(--color-background-error-muted)}._content_1q2d1_120{flex:1;min-width:0}._heading_1q2d1_124{font-weight:700;letter-spacing:var(--letter-spacing-wide);text-transform:uppercase;font-size:var(--font-size-sm);line-height:var(--line-height)}._icon_1q2d1_131{display:flex;justify-content:center;align-items:center;height:var(--line-height);margin-right:var(--padding-xs);font-size:var(--size-xs)}._dismiss_1q2d1_139{margin-left:var(--padding);color:var(--color-text)}._dismiss_1q2d1_139._absolute_1q2d1_143{position:absolute;top:var(--padding-sm);right:var(--padding-sm)}._dismiss_1q2d1_139{--offset-message-dismiss: calc((var(--line-height) - var(--size-sm)) / 2);display:flex;margin-top:var(--offset-message-dismiss);margin-bottom:var(--offset-message-dismiss);margin-right:var(--offset-message-dismiss)}._legendToggle_1q2d1_155{opacity:.6}._legendToggle_1q2d1_155:hover{opacity:.8;cursor:pointer}._legendToggle_1q2d1_155:active{opacity:1}._detailsText_1q2d1_165{margin-top:var(--padding-xxs);word-break:break-word}._footer_1q2d1_169{display:flex;flex-wrap:wrap;gap:var(--padding-sm);margin-top:var(--padding-xxs)}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{j as s}from"./jsx-runtime-eps93zm2.js";import{r as N}from"./index-DhsZuJvc.js";import{c as l}from"./index-Bk2sglWO.js";import{I as o}from"./common-types-Sih75Sav.js";import{I as a}from"./icon-BSFY3vDO.js";const b="_inputInTable_1q2d1_1",j="_error_1q2d1_7",R="_warning_1q2d1_7",v="_inputHover_1q2d1_13",y="_inputFocus_1q2d1_18",C="_inputError_1q2d1_25",w="_inputWarning_1q2d1_26",O="_inputDisabled_1q2d1_61",D="_hideScrollbars_1q2d1_67",G="_container_1q2d1_83",W="_block_1q2d1_101",A="_info_1q2d1_104",L="_success_1q2d1_108",F="_content_1q2d1_120",k="_heading_1q2d1_124",z="_icon_1q2d1_131",H="_dismiss_1q2d1_139",U="_absolute_1q2d1_143",V="_legendToggle_1q2d1_155",M="_detailsText_1q2d1_165",B="_footer_1q2d1_169",n={inputInTable:b,error:j,warning:R,inputHover:v,inputFocus:y,inputError:C,inputWarning:w,inputDisabled:O,hideScrollbars:D,container:G,block:W,info:A,success:L,content:F,heading:k,icon:z,dismiss:H,absolute:U,legendToggle:V,detailsText:M,footer:B};var i=(e=>(e.INFO="Info",e.SUCCESS="Success",e.WARNING="Warning",e.ERROR="Error",e))(i||{}),d=(e=>(e.TOGGLE_DETAILS="TOGGLE_DETAILS",e))(d||{});const g=({type:e,onClose:t,isInToast:r,testId:c})=>s.jsx("div",{className:l(n.dismiss,r?n.absolute:"",e===i.INFO?n.info:e===i.SUCCESS?n.success:e===i.WARNING?n.warning:e===i.ERROR?n.error:null),children:s.jsx(a,{icon:o.CLOSE,onClick:t,testId:c})});g.__docgenInfo={description:"",methods:[],displayName:"Dismiss",props:{type:{required:!0,tsType:{name:"union",raw:"TMessageType | string",elements:[{name:"union",raw:"'Info' | 'Success' | 'Warning' | 'Error'",elements:[{name:"literal",value:"'Info'"},{name:"literal",value:"'Success'"},{name:"literal",value:"'Warning'"},{name:"literal",value:"'Error'"}]},{name:"string"}]},description:""},onClose:{required:!1,tsType:{name:"signature",type:"function",raw:"(...args: any[]) => any",signature:{arguments:[{type:{name:"Array",elements:[{name:"any"}],raw:"any[]"},name:"args",rest:!0}],return:{name:"any"}}},description:""},isInToast:{required:!1,tsType:{name:"boolean"},description:""},testId:{required:!1,tsType:{name:"string"},description:""}}};const J=(e,t)=>{switch(t.type){case d.TOGGLE_DETAILS:return{...e,detailsVisible:!e.detailsVisible};default:return e}},K=({details:e,visible:t,dispatch:r})=>s.jsxs("div",{children:[s.jsx("div",{className:l(n.legendToggle),onClick:r,children:t?"Hide details":"Show details"}),t?s.jsx("div",{className:n.detailsText,children:e}):null]}),P=({type:e})=>{switch(e){case i.SUCCESS:return s.jsx(a,{icon:o.SUCCESS,size:16});case i.WARNING:return s.jsx(a,{icon:o.WARNING,size:16});case i.ERROR:return s.jsx(a,{icon:o.ERROR,size:16});default:return s.jsx(a,{icon:o.INFO,size:16})}},Q=({message:e})=>{const{visible:t,type:r=i.INFO,icon:c,heading:u,content:h,details:_,detailsVisible:x=!1,footer:m,withDismiss:I,onClose:S,width:p,maxHeight:f}=e,E={detailsVisible:x},[q,T]=N.useReducer(J,E);return s.jsx(s.Fragment,{children:t?s.jsxs("div",{className:l(n.container,p?n.block:null,r===i.SUCCESS?n.success:r===i.WARNING?n.warning:r===i.ERROR?n.error:n.info),style:{width:p,maxHeight:f},children:[s.jsx("div",{children:c?s.jsx("div",{className:n.icon,children:s.jsx(P,{type:r})}):null}),s.jsxs("div",{className:n.content,children:[u?s.jsx("div",{className:n.heading,children:u}):null,s.jsx("div",{children:h}),_?s.jsx(K,{details:_,visible:q.detailsVisible,dispatch:()=>T({type:d.TOGGLE_DETAILS})}):null,!!m&&s.jsx("div",{className:n.footer,children:m})]}),I?s.jsx(g,{type:r,onClose:S}):null]}):null})};Q.__docgenInfo={description:"",methods:[],displayName:"Message",props:{message:{required:!0,tsType:{name:"IMessage"},description:""}}};export{g as D,Q as M,i as a};
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-eps93zm2.js";import{r as x}from"./index-DhsZuJvc.js";import{c}from"./index-Bk2sglWO.js";import{I as u}from"./common-types-Sih75Sav.js";import{I as _}from"./icon-BSFY3vDO.js";import{H as g}from"./heading-CRNoBc7q.js";import{A as q}from"./actions-D-uVCDzk.js";import{B as h}from"./badge-CLQ59MDF.js";import{T as f}from"./tooltip-1V7clEnw.js";const N="_inputInTable_dlqxe_1",b="_error_dlqxe_7",T="_warning_dlqxe_7",j="_inputHover_dlqxe_13",v="_inputFocus_dlqxe_18",y="_inputError_dlqxe_25",I="_inputWarning_dlqxe_26",w="_inputDisabled_dlqxe_61",H="_hideScrollbars_dlqxe_67",C="_header_dlqxe_77",k="_headerTitle_dlqxe_77",E="_heading_dlqxe_78",S="_itemHeader_dlqxe_78",M="_narrow_dlqxe_81",R="_stickyHeader_dlqxe_85",L="_title_dlqxe_96",F="_name_dlqxe_102",V="_iconTooltipMargin_dlqxe_105",W="_bold_dlqxe_108",B="_toggleNarrow_dlqxe_117",D="_drag_dlqxe_135",P="_list_dlqxe_155",$="_bordered_dlqxe_159",A="_item_dlqxe_78",O="_action_dlqxe_192",z="_active_dlqxe_195",G="_indented_dlqxe_202",J="_disabled_dlqxe_215",K="_label_dlqxe_226",Q="_details_dlqxe_237",U="_metadata_dlqxe_238",X="_itemContent_dlqxe_246",Y="_indentIcon_dlqxe_253",Z="_expandIcon_dlqxe_258",ee="_expanded_dlqxe_265",te="_right_dlqxe_268",ne="_actions_dlqxe_276",ae="_scrollableList_dlqxe_281",oe="_infiniteScrollContainer_dlqxe_286",re="_hideScrollbar_dlqxe_67",ie="_noPointerEvents_dlqxe_303",n={inputInTable:N,error:b,warning:T,inputHover:j,inputFocus:v,inputError:y,inputWarning:I,inputDisabled:w,hideScrollbars:H,header:C,headerTitle:k,heading:E,itemHeader:S,narrow:M,stickyHeader:R,title:L,name:F,iconTooltipMargin:V,bold:W,toggleNarrow:B,drag:D,list:P,bordered:$,item:A,action:O,active:z,indented:G,disabled:J,label:K,details:Q,metadata:U,itemContent:X,indentIcon:Y,expandIcon:Z,expanded:ee,right:te,actions:ne,scrollableList:ae,infiniteScrollContainer:oe,hideScrollbar:re,noPointerEvents:ie},p=({toggleNarrow:a,onClickToggleNarrow:t})=>a?e.jsx("a",{className:n.toggleNarrow,onClick:t,children:e.jsx(_,{icon:u.CHEVRON_LEFT})}):null;p.__docgenInfo={description:"",methods:[],displayName:"ToggleNarrow",props:{toggleNarrow:{required:!1,tsType:{name:"boolean"},description:""},onClickToggleNarrow:{required:!1,tsType:{name:"signature",type:"function",raw:"() => void",signature:{arguments:[],return:{name:"void"}}},description:""}}};const se=x.forwardRef(({name:a,actions:t=[],toggleNarrow:i=!1,onToggleNarrow:o=()=>{},stickyHeader:s},d)=>e.jsxs("div",{ref:d,className:c(n.header,s?n.stickyHeader:""),children:[e.jsx(p,{toggleNarrow:i,onClickToggleNarrow:o}),a&&e.jsx("div",{className:n.headerTitle,children:e.jsx(g,{top:!0,marginBottom:0,children:a})}),e.jsx("div",{className:n.right,children:e.jsx("div",{className:n.actions,children:e.jsx(q,{actions:t})})})]}));se.__docgenInfo={description:"",methods:[],displayName:"ListHeading",props:{actions:{defaultValue:{value:"[]",computed:!1},required:!1},toggleNarrow:{defaultValue:{value:"false",computed:!1},required:!1},onToggleNarrow:{defaultValue:{value:"() => {}",computed:!1},required:!1}}};const m=({name:a,icon:t,testId:i})=>{const o=t&&e.jsx(_,{icon:t.icon,color:t.color||"#db2828"});return e.jsxs("span",{className:c(n.name,n.bold),"data-testid":i,children:[a,t&&t.tooltip&&t.tooltip.text?e.jsx("span",{className:n.iconTooltipMargin,children:e.jsx(f,{text:t.tooltip.text,maxWidth:"350px",children:o})}):t&&t.icon&&e.jsx("span",{className:n.iconTooltipMargin,children:o})]})};m.__docgenInfo={description:"",methods:[],displayName:"Name",props:{name:{required:!0,tsType:{name:"ReactNode"},description:""},icon:{required:!1,tsType:{name:"signature",type:"object",raw:`{
|
|
2
|
-
icon: ReactNode;
|
|
3
|
-
color?: string;
|
|
4
|
-
tooltip?: {
|
|
5
|
-
text: ReactNode;
|
|
6
|
-
};
|
|
7
|
-
}`,signature:{properties:[{key:"icon",value:{name:"ReactNode",required:!0}},{key:"color",value:{name:"string",required:!1}},{key:"tooltip",value:{name:"signature",type:"object",raw:`{
|
|
8
|
-
text: ReactNode;
|
|
9
|
-
}`,signature:{properties:[{key:"text",value:{name:"ReactNode",required:!0}}]},required:!1}}]}},description:""},testId:{required:!1,tsType:{name:"string"},description:""}}};const de=({item:a})=>{const{name:t,icon:i,details:o,metadata:s,invalid:d,testId:r}=a;let l=e.jsx(m,{name:t,icon:i,testId:r&&`${r}-name`});return d&&(l=e.jsx(h,{small:!0,margin:"-2px",title:"!",children:l})),e.jsxs("span",{className:n.title,children:[l,o&&e.jsx("span",{className:n.details,"data-testid":r&&`${r}-details`,children:o}),s&&e.jsx("span",{className:n.metadata,"data-testid":r&&`${r}-metadata`,children:s})]})};de.__docgenInfo={description:"",methods:[],displayName:"MetaContent",props:{item:{required:!0,tsType:{name:"IMetaContentItem"},description:""}}};export{se as L,de as M,m as N,n as l};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
._inputInTable_dlqxe_1{background-color:transparent;border-radius:inherit!important;height:var(--size);min-height:100%}._inputInTable_dlqxe_1:not(:hover):not(._error_dlqxe_7):not(._warning_dlqxe_7){border-color:transparent}._inputInTable_dlqxe_1:not(:focus){box-shadow:none}._inputHover_dlqxe_13{position:relative;border-color:var(--color-border-hover);z-index:2}._inputFocus_dlqxe_18{position:relative;outline:none!important;border-color:var(--color-border-focus)!important;box-shadow:var(--shadow-focus);z-index:3}._inputError_dlqxe_25,._inputWarning_dlqxe_26{position:relative}._inputError_dlqxe_25{z-index:2;border-color:var(--color-border-error);color:var(--color-text-error)!important;background-color:var(--color-background-error-muted)}._inputError_dlqxe_25:hover{border-color:var(--color-border-error-hover)!important}._inputError_dlqxe_25:focus{position:relative;outline:none!important;border-color:var(--color-border-focus)!important;box-shadow:var(--shadow-focus);z-index:3}._inputWarning_dlqxe_26{z-index:1;border-color:var(--color-border-warning);color:var(--color-text-warning)!important;background-color:var(--color-background-warning-muted)}._inputWarning_dlqxe_26:hover{border-color:var(--color-border-warning-hover)!important}._inputWarning_dlqxe_26:focus{position:relative;outline:none!important;border-color:var(--color-border-focus)!important;box-shadow:var(--shadow-focus);z-index:3}._inputDisabled_dlqxe_61{pointer-events:none;background-color:var(--color-background-disabled);color:var(--color-text-muted);box-shadow:none}._hideScrollbars_dlqxe_67{scrollbar-width:none;-ms-overflow-style:none}._hideScrollbars_dlqxe_67::-webkit-scrollbar{display:none}._header_dlqxe_77 ._headerTitle_dlqxe_77,._heading_dlqxe_78 ._itemHeader_dlqxe_78{transition:opacity .3s}._narrow_dlqxe_81 ._header_dlqxe_77 ._headerTitle_dlqxe_77,._narrow_dlqxe_81 ._heading_dlqxe_78 ._itemHeader_dlqxe_78{opacity:0}._stickyHeader_dlqxe_85{position:sticky;top:0;background-color:var(--color-background);z-index:10}._itemHeader_dlqxe_78{padding:var(--padding-xs) var(--padding);display:flex;align-items:flex-start}._itemHeader_dlqxe_78 ._title_dlqxe_96{margin:0;padding:0;flex-grow:1;min-width:0}._itemHeader_dlqxe_78 ._name_dlqxe_102{font-weight:400}._itemHeader_dlqxe_78 ._iconTooltipMargin_dlqxe_105{margin-left:var(--padding-xs)}._itemHeader_dlqxe_78 ._bold_dlqxe_108{font-weight:700}._header_dlqxe_77{padding:var(--padding);display:flex;align-items:center;border-bottom:1px solid var(--color-border)}._toggleNarrow_dlqxe_117{margin-right:16px;margin-left:-5px;color:#c8c8c8;transition:all .4s;display:flex;width:22px;justify-content:center}._toggleNarrow_dlqxe_117:hover{color:var(--color-text-primary-hover)}._toggleNarrow_dlqxe_117:active{color:var(--color-text-primary-active)}._narrow_dlqxe_81 ._toggleNarrow_dlqxe_117{transform:scaleX(-1)}._drag_dlqxe_135{color:var(--color-text-faint);display:flex;align-items:center;justify-content:center;margin-right:var(--padding-xs);margin-left:calc(var(--padding-xs) * -1);margin-top:calc((var(--line-height) - var(--size-sm)) / 2);margin-bottom:calc((var(--line-height) - var(--size-sm)) / 2);cursor:move;height:var(--size-sm);width:var(--size-sm);flex-shrink:0}._drag_dlqxe_135:hover{color:var(--color-text-primary-hover)}._drag_dlqxe_135:active{color:var(--color-text-primary-active)}._list_dlqxe_155{flex-shrink:0;background:var(--color-background)}._list_dlqxe_155._bordered_dlqxe_159:first-child,._list_dlqxe_155._bordered_dlqxe_159:first-child>:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}._list_dlqxe_155._bordered_dlqxe_159:last-child,._list_dlqxe_155._bordered_dlqxe_159:last-child>:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit;border-bottom:0}._item_dlqxe_78{color:inherit;display:block;transition:background-color .2s;position:relative;border-bottom:1px solid var(--color-border);background-color:var(--color-background-raised);transition:background .3s;overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}._item_dlqxe_78:not(._heading_dlqxe_78):after{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;border-top-left-radius:inherit;border-bottom-left-radius:inherit;transition:background .3s,width .3s}._item_dlqxe_78._action_dlqxe_192{cursor:pointer}._item_dlqxe_78._action_dlqxe_192:not(._active_dlqxe_195):hover{background:var(--color-background-listitem-hover)}._item_dlqxe_78._action_dlqxe_192:not(._active_dlqxe_195):hover:after{width:5px;background:#0000001a}._item_dlqxe_78._indented_dlqxe_202:after{width:3px;background:#0000001a}._item_dlqxe_78._active_dlqxe_195{cursor:default;position:relative;z-index:1;background:var(--color-background-listitem-active)}._item_dlqxe_78._active_dlqxe_195:after{background:var(--color-background-primary)!important}._item_dlqxe_78._disabled_dlqxe_215{color:var(--color-text-faint);pointer-events:none}._item_dlqxe_78._heading_dlqxe_78{color:var(--color-text-muted);background-color:var(--color-background-cardheader)}._item_dlqxe_78._heading_dlqxe_78._action_dlqxe_192:hover{color:var(--color-text-primary-hover)}._item_dlqxe_78 ._label_dlqxe_226{margin-right:var(--padding-xs);flex-shrink:0;width:var(--size-sm);height:var(--size-sm);margin-top:calc(var(--line-height) / 2 - var(--size-sm) / 2);margin-bottom:calc(var(--line-height) / 2 - var(--size-sm) / 2);display:flex;align-items:center;justify-content:center}._item_dlqxe_78 ._details_dlqxe_237,._item_dlqxe_78 ._metadata_dlqxe_238{display:block;width:100%;font-weight:400}._item_dlqxe_78 ._metadata_dlqxe_238{color:var(--color-text-muted)}._item_dlqxe_78 ._itemContent_dlqxe_246{padding:0 var(--padding) var(--padding-sm);cursor:auto}._item_dlqxe_78 ._itemContent_dlqxe_246:empty{padding:inherit}._indentIcon_dlqxe_253{color:var(--color-text-faint);flex-shrink:0;margin-right:var(--padding-xxs)}._expandIcon_dlqxe_258{flex-shrink:0;position:relative;display:flex;height:var(--line-height);margin-right:var(--padding-xs)}._expandIcon_dlqxe_258._expanded_dlqxe_265 svg{transform:rotate(90deg)}._right_dlqxe_268{margin-left:auto;display:flex;align-items:center;margin-top:calc((var(--line-height) - var(--size-sm)) / 2);margin-bottom:calc((var(--line-height) - var(--size-sm)) / 2);min-height:var(--size-sm)}._actions_dlqxe_276{margin-left:var(--padding-xs);display:flex;align-items:center}._scrollableList_dlqxe_281{height:100%;overflow-y:auto;scroll-behavior:smooth}._infiniteScrollContainer_dlqxe_286{overflow:hidden!important}._hideScrollbar_dlqxe_67{scrollbar-width:none;-ms-overflow-style:none}._hideScrollbar_dlqxe_67::-webkit-scrollbar{display:none}._bordered_dlqxe_159{box-shadow:inset 0 0 0 2px var(--color-background-primary);background:var(--color-background-listitem-active)}._noPointerEvents_dlqxe_303{pointer-events:none}
|
|
@@ -1,220 +0,0 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-eps93zm2.js";import{r as k}from"./index-DhsZuJvc.js";import{w as le,e as j,u as f}from"./index-DMAnyMX5.js";import{T as se}from"./common-types-Sih75Sav.js";import{M as v,D as h}from"./dialog-BelCA1mt.js";import{B as l}from"./button-DHevvVBE.js";import{P as te}from"./popover-rq33c1W2.js";import{I as ne}from"./input-DTXbDJaL.js";import{I as ae}from"./input-group-BaRSJAEN.js";import{F as S}from"./field-HrLaMLbx.js";import{M as re}from"./actions-D-uVCDzk.js";import{S as ie}from"./select-DnRuRG_N.js";import{S as de}from"./spacer-BWoNR27H.js";import{T as ce}from"./tooltip-1V7clEnw.js";import{M as P}from"./types-BmbYqTX_.js";import"./index-CF7H4eMJ.js";import"./index-Bk2sglWO.js";import"./portal-GQ0_cLB6.js";import"./index-CUZDtIZe.js";import"./lodash-c4VUpsOs.js";import"./heading-CRNoBc7q.js";import"./help-icon-Buhx5nl6.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./inheritsLoose-DP0QEDDI.js";import"./index-CEuq6vkz.js";import"./disabled-context-rmpd7YJS.js";import"./spinner-AWUe4xwQ.js";import"./types-Dx2TtIG9.js";import"./label-CqmyC9he.js";import"./badge-CLQ59MDF.js";import"./assertThisInitialized-B9jnkVVz.js";import"./memoize-one.esm-CcMeOnPo.js";import"./text-B3-TSWok.js";import"./select.input-D0UkAPd9.js";const{useArgs:ge}=__STORYBOOK_MODULE_PREVIEW_API__,qe={title:"Modals/Modal",component:v,args:{visible:!0,centered:!0,width:"300px",heading:"Are you sure?",content:e.jsx(e.Fragment,{children:"This will complete the transaction"}),footer:e.jsxs(e.Fragment,{children:[e.jsx(l,{label:"Okay",colored:!0,onClick:()=>{}}),e.jsx(l,{label:"Cancel",onClick:()=>{}})]}),onClose:()=>{}},parameters:{docs:{story:{inline:!1,iframeHeight:400}}}},r=()=>{const[{visible:t,centered:a,...o},n]=ge(),s=()=>{n({visible:!t})};return e.jsxs(e.Fragment,{children:[e.jsx(v,{visible:t,centered:a,children:e.jsx(h,{dialog:{...o,onClose:s}})}),e.jsx(l,{label:"Open Modal",onClick:s})]})},C=r.bind({}),d=r.bind({});d.args={centered:!0};const c=r.bind({});c.args={content:["This is a","new line!"]};const g=r.bind({});g.args={scroll:!0,content:e.jsx("div",{children:"Example modal content goes here lorem ipsum. ".repeat(100)})};const p=r.bind({});p.args={width:"100%",content:e.jsx("div",{children:"Example modal content goes here lorem ipsum. ".repeat(100)})};const m=r.bind({});m.args={contentPadding:0};const u=r.bind({});u.args={content:e.jsxs(e.Fragment,{children:[e.jsx(ce,{text:"Tooltip text",children:"Hover for tooltip"}),e.jsx(de,{}),e.jsx(S,{label:"Custom Select",helpText:"Select an animal",children:e.jsx(ie,{name:"example",options:["Aardvarks","Kangaroos","Monkeys","Possums","Gorilla","Puma","Patagonian Mara","Tarsier","Koala","Panda","Red Panda","Impala","Tiger","Crocodile","Bat"],onChange:()=>{},value:"Monkeys",error:"Bad value"})}),e.jsx(S,{label:"Nested Menu",children:e.jsx(re,{maxHeight:"240px",menu:{label:"Menu",trigger:se.DROP_DOWN_BUTTON,sections:[{type:P.MENU,menu:{trigger:"Text",label:"Children",sections:[...Array(100).keys()].map(()=>({type:"Option",label:Math.random().toString(36).substring(7),onClick:()=>{}}))}},...[...Array(100).keys()].map(()=>({type:P.OPTION,label:Math.random().toString(36).substring(7),onClick:()=>{}}))]}})}),e.jsx(te,{content:e.jsxs(ae,{small:!0,children:[e.jsx(ne,{value:"Value",width:"150px",error:"Bad value"}),e.jsx(l,{colored:!0,label:"Save",onClick:()=>{}}),e.jsx(l,{label:"Cancel",onClick:()=>{}})]}),children:e.jsx(l,{colored:!0,label:"Toggle me",onClick:()=>{}})})]})};const b=()=>{const[t,a]=k.useState(!1),o=()=>{a(!0)},n=()=>{a(!1)},s=()=>{console.log("Submit action"),n()};return e.jsxs(e.Fragment,{children:[e.jsx(v,{visible:t,onEnter:()=>{console.log("Enter"),s()},onEscape:()=>{console.log("Escape"),n()},children:e.jsx(h,{dialog:{heading:"Test key handling",content:e.jsx(ne,{}),footer:e.jsxs(e.Fragment,{children:[e.jsx(l,{label:"Done",colored:"red",onClick:s}),e.jsx(l,{label:"Cancel",onClick:n})]}),onClose:n}})}),e.jsx(l,{label:"Open Modal",onClick:o})]})},M=()=>{const[t,a]=k.useState(!1),o=()=>a(!t),[n,s]=k.useState(!1),x=()=>s(!n);return e.jsxs(e.Fragment,{children:[e.jsx(v,{visible:t,children:e.jsx(h,{dialog:{heading:"Modal 1",content:"Lorem ipsum dolor sit amet",footer:e.jsxs(e.Fragment,{children:[e.jsx(l,{label:"Open modal 2",colored:!0,onClick:x}),e.jsx(v,{visible:n,children:e.jsx(h,{dialog:{heading:"Modal 2",content:"Lorem ipsum dolor sit amet",footer:e.jsx(l,{label:"Close",onClick:x}),onClose:x}})}),e.jsx(l,{label:"Close",onClick:o})]}),onClose:o}})}),e.jsx(l,{label:"Open modal 1",onClick:o})]})},i=r.bind({});i.args={testId:"testId"};i.play=async({canvasElement:t,step:a})=>{const o=t.parentElement?le(t.parentElement):null;await j(o).toBeTruthy(),o&&(await a("Modal should appear when triggered",async()=>{const n=o.getByText("Open Modal");await f.click(n);const s=o.getByTestId("testId");await j(s).toBeInTheDocument()}),await a("Modal should disappear when close button pressed",async()=>{const n=o.getByTestId("testId"),s=o.getByTestId("testId-dismiss");await f.click(s),await j(n).not.toBeInTheDocument()}))};b.__docgenInfo={description:"",methods:[],displayName:"KeyHandle"};M.__docgenInfo={description:"",methods:[],displayName:"MultipleModals"};var y,A,B;C.parameters={...C.parameters,docs:{...(y=C.parameters)==null?void 0:y.docs,source:{originalSource:`() => {
|
|
2
|
-
const [{
|
|
3
|
-
visible,
|
|
4
|
-
centered,
|
|
5
|
-
...dialogProps
|
|
6
|
-
}, updateArgs] = useArgs();
|
|
7
|
-
const toggleModal = () => {
|
|
8
|
-
updateArgs({
|
|
9
|
-
visible: !visible
|
|
10
|
-
});
|
|
11
|
-
};
|
|
12
|
-
return <>
|
|
13
|
-
<Modal visible={visible} centered={centered}>
|
|
14
|
-
<Dialog dialog={{
|
|
15
|
-
...dialogProps,
|
|
16
|
-
onClose: toggleModal
|
|
17
|
-
}} />
|
|
18
|
-
</Modal>
|
|
19
|
-
<Button label="Open Modal" onClick={toggleModal} />
|
|
20
|
-
</>;
|
|
21
|
-
}`,...(B=(A=C.parameters)==null?void 0:A.docs)==null?void 0:B.source}}};var T,O,D;d.parameters={...d.parameters,docs:{...(T=d.parameters)==null?void 0:T.docs,source:{originalSource:`() => {
|
|
22
|
-
const [{
|
|
23
|
-
visible,
|
|
24
|
-
centered,
|
|
25
|
-
...dialogProps
|
|
26
|
-
}, updateArgs] = useArgs();
|
|
27
|
-
const toggleModal = () => {
|
|
28
|
-
updateArgs({
|
|
29
|
-
visible: !visible
|
|
30
|
-
});
|
|
31
|
-
};
|
|
32
|
-
return <>
|
|
33
|
-
<Modal visible={visible} centered={centered}>
|
|
34
|
-
<Dialog dialog={{
|
|
35
|
-
...dialogProps,
|
|
36
|
-
onClose: toggleModal
|
|
37
|
-
}} />
|
|
38
|
-
</Modal>
|
|
39
|
-
<Button label="Open Modal" onClick={toggleModal} />
|
|
40
|
-
</>;
|
|
41
|
-
}`,...(D=(O=d.parameters)==null?void 0:O.docs)==null?void 0:D.source}}};var V,I,E;c.parameters={...c.parameters,docs:{...(V=c.parameters)==null?void 0:V.docs,source:{originalSource:`() => {
|
|
42
|
-
const [{
|
|
43
|
-
visible,
|
|
44
|
-
centered,
|
|
45
|
-
...dialogProps
|
|
46
|
-
}, updateArgs] = useArgs();
|
|
47
|
-
const toggleModal = () => {
|
|
48
|
-
updateArgs({
|
|
49
|
-
visible: !visible
|
|
50
|
-
});
|
|
51
|
-
};
|
|
52
|
-
return <>
|
|
53
|
-
<Modal visible={visible} centered={centered}>
|
|
54
|
-
<Dialog dialog={{
|
|
55
|
-
...dialogProps,
|
|
56
|
-
onClose: toggleModal
|
|
57
|
-
}} />
|
|
58
|
-
</Modal>
|
|
59
|
-
<Button label="Open Modal" onClick={toggleModal} />
|
|
60
|
-
</>;
|
|
61
|
-
}`,...(E=(I=c.parameters)==null?void 0:I.docs)==null?void 0:E.source}}};var w,_,F;g.parameters={...g.parameters,docs:{...(w=g.parameters)==null?void 0:w.docs,source:{originalSource:`() => {
|
|
62
|
-
const [{
|
|
63
|
-
visible,
|
|
64
|
-
centered,
|
|
65
|
-
...dialogProps
|
|
66
|
-
}, updateArgs] = useArgs();
|
|
67
|
-
const toggleModal = () => {
|
|
68
|
-
updateArgs({
|
|
69
|
-
visible: !visible
|
|
70
|
-
});
|
|
71
|
-
};
|
|
72
|
-
return <>
|
|
73
|
-
<Modal visible={visible} centered={centered}>
|
|
74
|
-
<Dialog dialog={{
|
|
75
|
-
...dialogProps,
|
|
76
|
-
onClose: toggleModal
|
|
77
|
-
}} />
|
|
78
|
-
</Modal>
|
|
79
|
-
<Button label="Open Modal" onClick={toggleModal} />
|
|
80
|
-
</>;
|
|
81
|
-
}`,...(F=(_=g.parameters)==null?void 0:_.docs)==null?void 0:F.source}}};var L,N,H;p.parameters={...p.parameters,docs:{...(L=p.parameters)==null?void 0:L.docs,source:{originalSource:`() => {
|
|
82
|
-
const [{
|
|
83
|
-
visible,
|
|
84
|
-
centered,
|
|
85
|
-
...dialogProps
|
|
86
|
-
}, updateArgs] = useArgs();
|
|
87
|
-
const toggleModal = () => {
|
|
88
|
-
updateArgs({
|
|
89
|
-
visible: !visible
|
|
90
|
-
});
|
|
91
|
-
};
|
|
92
|
-
return <>
|
|
93
|
-
<Modal visible={visible} centered={centered}>
|
|
94
|
-
<Dialog dialog={{
|
|
95
|
-
...dialogProps,
|
|
96
|
-
onClose: toggleModal
|
|
97
|
-
}} />
|
|
98
|
-
</Modal>
|
|
99
|
-
<Button label="Open Modal" onClick={toggleModal} />
|
|
100
|
-
</>;
|
|
101
|
-
}`,...(H=(N=p.parameters)==null?void 0:N.docs)==null?void 0:H.source}}};var K,W,R;m.parameters={...m.parameters,docs:{...(K=m.parameters)==null?void 0:K.docs,source:{originalSource:`() => {
|
|
102
|
-
const [{
|
|
103
|
-
visible,
|
|
104
|
-
centered,
|
|
105
|
-
...dialogProps
|
|
106
|
-
}, updateArgs] = useArgs();
|
|
107
|
-
const toggleModal = () => {
|
|
108
|
-
updateArgs({
|
|
109
|
-
visible: !visible
|
|
110
|
-
});
|
|
111
|
-
};
|
|
112
|
-
return <>
|
|
113
|
-
<Modal visible={visible} centered={centered}>
|
|
114
|
-
<Dialog dialog={{
|
|
115
|
-
...dialogProps,
|
|
116
|
-
onClose: toggleModal
|
|
117
|
-
}} />
|
|
118
|
-
</Modal>
|
|
119
|
-
<Button label="Open Modal" onClick={toggleModal} />
|
|
120
|
-
</>;
|
|
121
|
-
}`,...(R=(W=m.parameters)==null?void 0:W.docs)==null?void 0:R.source}}};var U,G,Y;u.parameters={...u.parameters,docs:{...(U=u.parameters)==null?void 0:U.docs,source:{originalSource:`() => {
|
|
122
|
-
const [{
|
|
123
|
-
visible,
|
|
124
|
-
centered,
|
|
125
|
-
...dialogProps
|
|
126
|
-
}, updateArgs] = useArgs();
|
|
127
|
-
const toggleModal = () => {
|
|
128
|
-
updateArgs({
|
|
129
|
-
visible: !visible
|
|
130
|
-
});
|
|
131
|
-
};
|
|
132
|
-
return <>
|
|
133
|
-
<Modal visible={visible} centered={centered}>
|
|
134
|
-
<Dialog dialog={{
|
|
135
|
-
...dialogProps,
|
|
136
|
-
onClose: toggleModal
|
|
137
|
-
}} />
|
|
138
|
-
</Modal>
|
|
139
|
-
<Button label="Open Modal" onClick={toggleModal} />
|
|
140
|
-
</>;
|
|
141
|
-
}`,...(Y=(G=u.parameters)==null?void 0:G.docs)==null?void 0:Y.source}}};var q,z,J;b.parameters={...b.parameters,docs:{...(q=b.parameters)==null?void 0:q.docs,source:{originalSource:`() => {
|
|
142
|
-
const [visible, setVisible] = useState(false);
|
|
143
|
-
const openModal = () => {
|
|
144
|
-
setVisible(true);
|
|
145
|
-
};
|
|
146
|
-
const closeModal = () => {
|
|
147
|
-
setVisible(false);
|
|
148
|
-
};
|
|
149
|
-
const handleSubmit = () => {
|
|
150
|
-
console.log('Submit action');
|
|
151
|
-
closeModal();
|
|
152
|
-
};
|
|
153
|
-
return <>
|
|
154
|
-
<Modal visible={visible} onEnter={() => {
|
|
155
|
-
console.log('Enter');
|
|
156
|
-
handleSubmit();
|
|
157
|
-
}} onEscape={() => {
|
|
158
|
-
console.log('Escape');
|
|
159
|
-
closeModal();
|
|
160
|
-
}}>
|
|
161
|
-
<Dialog dialog={{
|
|
162
|
-
heading: 'Test key handling',
|
|
163
|
-
content: <Input />,
|
|
164
|
-
footer: <>
|
|
165
|
-
<Button label="Done" colored="red" onClick={handleSubmit} />
|
|
166
|
-
<Button label="Cancel" onClick={closeModal} />
|
|
167
|
-
</>,
|
|
168
|
-
onClose: closeModal
|
|
169
|
-
}} />
|
|
170
|
-
</Modal>
|
|
171
|
-
<Button label="Open Modal" onClick={openModal} />
|
|
172
|
-
</>;
|
|
173
|
-
}`,...(J=(z=b.parameters)==null?void 0:z.docs)==null?void 0:J.source}}};var Q,X,Z;M.parameters={...M.parameters,docs:{...(Q=M.parameters)==null?void 0:Q.docs,source:{originalSource:`() => {
|
|
174
|
-
const [visible1, setVisible1] = useState(false);
|
|
175
|
-
const toggleVisible1 = () => setVisible1(!visible1);
|
|
176
|
-
const [visible2, setVisible2] = useState(false);
|
|
177
|
-
const toggleVisible2 = () => setVisible2(!visible2);
|
|
178
|
-
return <>
|
|
179
|
-
<Modal visible={visible1}>
|
|
180
|
-
<Dialog dialog={{
|
|
181
|
-
heading: 'Modal 1',
|
|
182
|
-
content: 'Lorem ipsum dolor sit amet',
|
|
183
|
-
footer: <>
|
|
184
|
-
<Button label="Open modal 2" colored onClick={toggleVisible2} />
|
|
185
|
-
<Modal visible={visible2}>
|
|
186
|
-
<Dialog dialog={{
|
|
187
|
-
heading: 'Modal 2',
|
|
188
|
-
content: 'Lorem ipsum dolor sit amet',
|
|
189
|
-
footer: <Button label="Close" onClick={toggleVisible2} />,
|
|
190
|
-
onClose: toggleVisible2
|
|
191
|
-
}} />
|
|
192
|
-
</Modal>
|
|
193
|
-
<Button label="Close" onClick={toggleVisible1} />
|
|
194
|
-
</>,
|
|
195
|
-
onClose: toggleVisible1
|
|
196
|
-
}} />
|
|
197
|
-
</Modal>
|
|
198
|
-
<Button label="Open modal 1" onClick={toggleVisible1} />
|
|
199
|
-
</>;
|
|
200
|
-
}`,...(Z=(X=M.parameters)==null?void 0:X.docs)==null?void 0:Z.source}}};var $,ee,oe;i.parameters={...i.parameters,docs:{...($=i.parameters)==null?void 0:$.docs,source:{originalSource:`() => {
|
|
201
|
-
const [{
|
|
202
|
-
visible,
|
|
203
|
-
centered,
|
|
204
|
-
...dialogProps
|
|
205
|
-
}, updateArgs] = useArgs();
|
|
206
|
-
const toggleModal = () => {
|
|
207
|
-
updateArgs({
|
|
208
|
-
visible: !visible
|
|
209
|
-
});
|
|
210
|
-
};
|
|
211
|
-
return <>
|
|
212
|
-
<Modal visible={visible} centered={centered}>
|
|
213
|
-
<Dialog dialog={{
|
|
214
|
-
...dialogProps,
|
|
215
|
-
onClose: toggleModal
|
|
216
|
-
}} />
|
|
217
|
-
</Modal>
|
|
218
|
-
<Button label="Open Modal" onClick={toggleModal} />
|
|
219
|
-
</>;
|
|
220
|
-
}`,...(oe=(ee=i.parameters)==null?void 0:ee.docs)==null?void 0:oe.source}}};const ze=["Default","Centered","LineBreak","Scroll","FullWidth","NoContentPadding","WithPopoverLayers","KeyHandle","MultipleModals","Test"];export{d as Centered,C as Default,p as FullWidth,b as KeyHandle,c as LineBreak,M as MultipleModals,m as NoContentPadding,g as Scroll,i as Test,u as WithPopoverLayers,ze as __namedExportsOrder,qe as default};
|
|
@@ -1,180 +0,0 @@
|
|
|
1
|
-
import{j as a}from"./jsx-runtime-eps93zm2.js";import{r as l}from"./index-DhsZuJvc.js";import{w as d,u as n,e as u,f as H,a as N}from"./index-DMAnyMX5.js";import{d as qe}from"./index-C0x1JmaP.js";import{S as _}from"./spacer-BWoNR27H.js";import{G as Le}from"./grid-DRkC-bt8.js";import{C as p}from"./card-EcjmryU9.js";import{B as Ge}from"./button-DHevvVBE.js";import{H as m}from"./heading-CRNoBc7q.js";import{I as Ke}from"./input-group-addon-D68iUKV2.js";import{S as Ye}from"./select-DnRuRG_N.js";import{I as ze}from"./input-group-BaRSJAEN.js";import{F as G}from"./field-HrLaMLbx.js";import{T as W}from"./toggle-BbFVf61v.js";import{T as Je}from"./text-B3-TSWok.js";import{M as Qe}from"./message-Y48EomV-.js";import{I as We}from"./icon-BSFY3vDO.js";import{N as c}from"./number-input-Bpg4Yqmo.js";import"./index-CF7H4eMJ.js";import"./index-DRSy5Ssd.js";import"./styled-components.browser.esm-BQ9GQzDc.js";import"./index-Bk2sglWO.js";import"./common-types-Sih75Sav.js";import"./disabled-context-rmpd7YJS.js";import"./spinner-AWUe4xwQ.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";import"./help-icon-Buhx5nl6.js";import"./lodash-c4VUpsOs.js";import"./types-Dx2TtIG9.js";import"./index-CEuq6vkz.js";import"./inheritsLoose-DP0QEDDI.js";import"./assertThisInitialized-B9jnkVVz.js";import"./memoize-one.esm-CcMeOnPo.js";import"./types-BmbYqTX_.js";import"./actions-D-uVCDzk.js";import"./badge-CLQ59MDF.js";import"./select.input-D0UkAPd9.js";import"./label-CqmyC9he.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./input-DTXbDJaL.js";const{useArgs:Xe}=__STORYBOOK_MODULE_PREVIEW_API__,Lt={title:"Forms/NumberInput",component:c,parameters:{canvas:{page:null}},args:{label:"Label"}},i=s=>{const[r,t]=Xe(),o=e=>{t({value:e.target.value})};return a.jsx(c,{onChange:o,value:123,...s})},j=i.bind({}),C=i.bind({});C.args={small:!0};const w=i.bind({});w.args={width:"150px"};const T=i.bind({});T.args={left:!0};const f=i.bind({});f.args={disabled:!0};const x=i.bind({});x.args={allowEmpty:!0,value:""};const h=()=>{const[s,r]=l.useState("123|m");return a.jsx(c,{name:"example",onChange:t=>r(t.target.value),placeholder:"Type a value...",value:s,testId:"testId"})};h.play=async({canvasElement:s,step:r})=>{const t=d(s),o=d(s.ownerDocument.body);await r("Shows validation error for non-numeric input",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"123x45s6"),await u(t.getByDisplayValue("123x45s6")).toBeInTheDocument(),await H.mouseOver(e),await N(()=>{u(o.getByText("Must be a numerical value")).toBeInTheDocument()})})};const B=i.bind({});B.args={warning:"This input number is almost 100!",value:"99"};const S=i.bind({});S.args={error:"This is a error message"};const D=i.bind({});D.args={value:"123test"};const E=i.bind({});E.args={value:"123.123456789",enableDisplayRounding:!0};const V=i.bind({});V.args={value:"123.123456789",enableDisplayRounding:!0,roundDisplayValue:s=>qe.roundToFixed(s,4)};const R=()=>a.jsxs(ze,{small:!0,children:[a.jsx(c,{value:123}),a.jsx(Ke,{children:"to"}),a.jsx(c,{value:123}),a.jsx(Ye,{options:[{value:"units",label:"units"}],width:"auto",value:"units"})]}),v=()=>{const[s,r]=l.useState("123");return a.jsx(c,{value:s,onChange:t=>{r(t.target.value)},testId:"testId",enableDisplayRounding:!0})};v.play=async({canvasElement:s,step:r})=>{const t=d(s);await r("Value should be rounded on blur",async()=>{const o=t.getByTestId("testId");await n.clear(o),await n.type(o,"123.123456789"),await n.click(s),await u(t.getByDisplayValue("123.12")).toBeInTheDocument()}),await r("Full value shown on focus",async()=>{const o=t.getByTestId("testId");await n.click(o),await u(t.getByDisplayValue("123.123456789")).toBeInTheDocument()})};const A=()=>{const[s,r]=l.useState(!0),t=()=>{r(!1),setTimeout(()=>r(!0),0)},[o,e]=l.useState("123");return a.jsxs(Le,{columns:"1fr 1fr",gap:!0,children:[a.jsxs(p,{heading:a.jsx(m,{children:"Storage State (Redux)"}),children:[o,a.jsx(_,{}),a.jsx(Ge,{label:"Change value",onClick:()=>e(String(Math.floor(Math.random()*100)))})]}),a.jsx(p,{heading:a.jsx(m,{icon:a.jsx(We,{icon:"refresh"}),onIconClick:t,children:"NumberInput"}),children:s&&a.jsx(c,{value:o,onChange:b=>{e(b.target.value)},error:Number(o)>=0?"":"Value must be positive"})})]})},I=()=>{const[s,r]=l.useState(!0),t=()=>{r(!1),setTimeout(()=>r(!0),0)},[o,e]=l.useState(!1),[b,Oe]=l.useState(!0),[k,F]=l.useState("0.6889763779527558"),[L,Pe]=l.useState(""),Ue=Number(k)*.3048;return a.jsxs(Le,{columns:"1fr 1fr",gap:!0,children:[a.jsxs(p,{heading:a.jsx(m,{children:"Settings"}),children:[a.jsx(G,{label:"Enable display rounding:",labelLeft:!0,labelWidth:200,children:a.jsx(W,{checked:o,onChange:g=>e(g.target.checked)})}),a.jsx(G,{label:"Enable cosmetic rounding:",labelLeft:!0,labelWidth:200,children:a.jsx(W,{checked:b,onChange:g=>Oe(g.target.checked)})})]}),a.jsxs(p,{heading:a.jsx(m,{icon:a.jsx(We,{icon:"refresh",testId:"triggerRerenderTestId"}),onIconClick:t,children:"NumberInput (displayed in Meters)"}),children:[a.jsx(Je,{faint:!0,children:"Cosmetic Rounding Test Cases: type 0.21 then return (compare with enableCosmeticRounding on and off)"}),a.jsx(_,{}),s&&a.jsx(c,{name:"Example",value:Ue,onChange:g=>{const M=String(Number(g.target.value)/.3048);F(M)},enableDisplayRounding:o,enableCosmeticRounding:b,error:Number(k)>=0?"":"Value must be positive",validationCallback:(g,M)=>{Pe(M??"")},testId:"testId"})]}),a.jsxs(p,{heading:a.jsx(m,{children:"Storage State / Redux (stored in Feet)"}),children:[k,a.jsx(_,{}),a.jsx(Ge,{label:"Change value",onClick:()=>F(String(Math.floor(Math.random()*100)))})]}),a.jsx(p,{heading:a.jsx(m,{children:"Test Validation Callback"}),children:L&&a.jsx(Qe,{message:{content:L,icon:!0,type:"Error",visible:!0}})})]})};I.play=async({canvasElement:s,step:r})=>{const t=d(s),o=d(s.ownerDocument.body);await r("Can enter decimal values",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"123.123456789"),await n.click(s),await u(t.getByDisplayValue("123.123456789")).toBeInTheDocument()}),await r("Can enter scientific notation when storage unit is different",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"-1.12e-3"),await u(t.getByDisplayValue("-1.12e-3")).toBeInTheDocument(),await t.getByTestId("triggerRerenderTestId").click(),await N(()=>{u(t.getByDisplayValue(-.00112)).toBeInTheDocument()})}),await r("Can enter comma decimals (converts to dot)",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"123,456"),await u(t.getByDisplayValue("123.456")).toBeInTheDocument()}),await r("Can enter small numbers",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"0.0000000023"),await u(t.getByDisplayValue("0.0000000023")).toBeInTheDocument()}),await r("Can enter large numbers",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"999999999999"),await u(t.getByDisplayValue("999999999999")).toBeInTheDocument()}),await r("Shows validation error for non-numeric input",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"123x45s6"),await n.click(s),await u(t.getByDisplayValue("123x45s6")).toBeInTheDocument(),await H.mouseOver(e),await N(()=>{u(o.getAllByText("Must be a numerical value").length).toEqual(2)})})};const y=()=>{const[s,r]=l.useState("123");return a.jsx(c,{value:s,onChange:t=>{r(t.target.value)},testId:"testId"})};y.play=async({canvasElement:s,step:r})=>{const t=d(s),o=d(s.ownerDocument.body);await r("Can enter decimal values",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"123.123456789"),await u(t.getByDisplayValue("123.123456789")).toBeInTheDocument()}),await r("Can enter scientific notation",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"-1.12e3"),await u(t.getByDisplayValue("-1.12e3")).toBeInTheDocument()}),await r("Can enter comma decimals (converts to dot)",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"123,456"),await u(t.getByDisplayValue("123.456")).toBeInTheDocument()}),await r("Can enter small numbers",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"0.0000000023"),await u(t.getByDisplayValue("0.0000000023")).toBeInTheDocument()}),await r("Can enter large numbers",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"999999999999"),await u(t.getByDisplayValue("999999999999")).toBeInTheDocument()}),await r("Shows validation error for non-numeric input",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"123x45s6"),await u(t.getByDisplayValue("123x45s6")).toBeInTheDocument(),await H.mouseOver(e),await N(()=>{u(o.getByText("Must be a numerical value")).toBeInTheDocument()})})};h.__docgenInfo={description:"",methods:[{name:"play",docblock:null,modifiers:["static"],params:[{name:"{ canvasElement, step }",optional:!1,type:null}],returns:null}],displayName:"Placeholder"};R.__docgenInfo={description:"",methods:[],displayName:"TestInputGroup"};v.__docgenInfo={description:"",methods:[{name:"play",docblock:null,modifiers:["static"],params:[{name:"{ canvasElement, step }",optional:!1,type:null}],returns:null}],displayName:"TestDisplayRounding"};A.__docgenInfo={description:"",methods:[],displayName:"ManagedTestCase"};I.__docgenInfo={description:"",methods:[{name:"play",docblock:null,modifiers:["static"],params:[{name:"{ canvasElement, step }",optional:!1,type:null}],returns:null}],displayName:"DemoCosmeticRounding"};y.__docgenInfo={description:"",methods:[{name:"play",docblock:null,modifiers:["static"],params:[{name:"{ canvasElement, step }",optional:!1,type:null}],returns:null}],displayName:"TestUserInput"};var O,P,U;j.parameters={...j.parameters,docs:{...(O=j.parameters)==null?void 0:O.docs,source:{originalSource:`args => {
|
|
2
|
-
const [_, updateArgs] = useArgs();
|
|
3
|
-
const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
|
|
4
|
-
updateArgs({
|
|
5
|
-
value: evt.target.value
|
|
6
|
-
});
|
|
7
|
-
};
|
|
8
|
-
return <NumberInput onChange={handleChange} value={123} {...args} />;
|
|
9
|
-
}`,...(U=(P=j.parameters)==null?void 0:P.docs)==null?void 0:U.source}}};var q,K,Y;C.parameters={...C.parameters,docs:{...(q=C.parameters)==null?void 0:q.docs,source:{originalSource:`args => {
|
|
10
|
-
const [_, updateArgs] = useArgs();
|
|
11
|
-
const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
|
|
12
|
-
updateArgs({
|
|
13
|
-
value: evt.target.value
|
|
14
|
-
});
|
|
15
|
-
};
|
|
16
|
-
return <NumberInput onChange={handleChange} value={123} {...args} />;
|
|
17
|
-
}`,...(Y=(K=C.parameters)==null?void 0:K.docs)==null?void 0:Y.source}}};var z,J,Q;w.parameters={...w.parameters,docs:{...(z=w.parameters)==null?void 0:z.docs,source:{originalSource:`args => {
|
|
18
|
-
const [_, updateArgs] = useArgs();
|
|
19
|
-
const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
|
|
20
|
-
updateArgs({
|
|
21
|
-
value: evt.target.value
|
|
22
|
-
});
|
|
23
|
-
};
|
|
24
|
-
return <NumberInput onChange={handleChange} value={123} {...args} />;
|
|
25
|
-
}`,...(Q=(J=w.parameters)==null?void 0:J.docs)==null?void 0:Q.source}}};var X,Z,$;T.parameters={...T.parameters,docs:{...(X=T.parameters)==null?void 0:X.docs,source:{originalSource:`args => {
|
|
26
|
-
const [_, updateArgs] = useArgs();
|
|
27
|
-
const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
|
|
28
|
-
updateArgs({
|
|
29
|
-
value: evt.target.value
|
|
30
|
-
});
|
|
31
|
-
};
|
|
32
|
-
return <NumberInput onChange={handleChange} value={123} {...args} />;
|
|
33
|
-
}`,...($=(Z=T.parameters)==null?void 0:Z.docs)==null?void 0:$.source}}};var ee,te,ae;f.parameters={...f.parameters,docs:{...(ee=f.parameters)==null?void 0:ee.docs,source:{originalSource:`args => {
|
|
34
|
-
const [_, updateArgs] = useArgs();
|
|
35
|
-
const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
|
|
36
|
-
updateArgs({
|
|
37
|
-
value: evt.target.value
|
|
38
|
-
});
|
|
39
|
-
};
|
|
40
|
-
return <NumberInput onChange={handleChange} value={123} {...args} />;
|
|
41
|
-
}`,...(ae=(te=f.parameters)==null?void 0:te.docs)==null?void 0:ae.source}}};var ne,re,se;x.parameters={...x.parameters,docs:{...(ne=x.parameters)==null?void 0:ne.docs,source:{originalSource:`args => {
|
|
42
|
-
const [_, updateArgs] = useArgs();
|
|
43
|
-
const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
|
|
44
|
-
updateArgs({
|
|
45
|
-
value: evt.target.value
|
|
46
|
-
});
|
|
47
|
-
};
|
|
48
|
-
return <NumberInput onChange={handleChange} value={123} {...args} />;
|
|
49
|
-
}`,...(se=(re=x.parameters)==null?void 0:re.docs)==null?void 0:se.source}}};var oe,ue,ie;h.parameters={...h.parameters,docs:{...(oe=h.parameters)==null?void 0:oe.docs,source:{originalSource:`() => {
|
|
50
|
-
const [value, setValue] = useState('123|m');
|
|
51
|
-
return <NumberInput name="example" onChange={evt => setValue(evt.target.value)} placeholder="Type a value..." value={value} testId="testId" />;
|
|
52
|
-
}`,...(ie=(ue=h.parameters)==null?void 0:ue.docs)==null?void 0:ie.source}}};var le,ce,de;B.parameters={...B.parameters,docs:{...(le=B.parameters)==null?void 0:le.docs,source:{originalSource:`args => {
|
|
53
|
-
const [_, updateArgs] = useArgs();
|
|
54
|
-
const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
|
|
55
|
-
updateArgs({
|
|
56
|
-
value: evt.target.value
|
|
57
|
-
});
|
|
58
|
-
};
|
|
59
|
-
return <NumberInput onChange={handleChange} value={123} {...args} />;
|
|
60
|
-
}`,...(de=(ce=B.parameters)==null?void 0:ce.docs)==null?void 0:de.source}}};var ge,pe,me;S.parameters={...S.parameters,docs:{...(ge=S.parameters)==null?void 0:ge.docs,source:{originalSource:`args => {
|
|
61
|
-
const [_, updateArgs] = useArgs();
|
|
62
|
-
const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
|
|
63
|
-
updateArgs({
|
|
64
|
-
value: evt.target.value
|
|
65
|
-
});
|
|
66
|
-
};
|
|
67
|
-
return <NumberInput onChange={handleChange} value={123} {...args} />;
|
|
68
|
-
}`,...(me=(pe=S.parameters)==null?void 0:pe.docs)==null?void 0:me.source}}};var he,ve,Ie;D.parameters={...D.parameters,docs:{...(he=D.parameters)==null?void 0:he.docs,source:{originalSource:`args => {
|
|
69
|
-
const [_, updateArgs] = useArgs();
|
|
70
|
-
const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
|
|
71
|
-
updateArgs({
|
|
72
|
-
value: evt.target.value
|
|
73
|
-
});
|
|
74
|
-
};
|
|
75
|
-
return <NumberInput onChange={handleChange} value={123} {...args} />;
|
|
76
|
-
}`,...(Ie=(ve=D.parameters)==null?void 0:ve.docs)==null?void 0:Ie.source}}};var ye,be,Ce;E.parameters={...E.parameters,docs:{...(ye=E.parameters)==null?void 0:ye.docs,source:{originalSource:`args => {
|
|
77
|
-
const [_, updateArgs] = useArgs();
|
|
78
|
-
const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
|
|
79
|
-
updateArgs({
|
|
80
|
-
value: evt.target.value
|
|
81
|
-
});
|
|
82
|
-
};
|
|
83
|
-
return <NumberInput onChange={handleChange} value={123} {...args} />;
|
|
84
|
-
}`,...(Ce=(be=E.parameters)==null?void 0:be.docs)==null?void 0:Ce.source}}};var we,Te,fe;V.parameters={...V.parameters,docs:{...(we=V.parameters)==null?void 0:we.docs,source:{originalSource:`args => {
|
|
85
|
-
const [_, updateArgs] = useArgs();
|
|
86
|
-
const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
|
|
87
|
-
updateArgs({
|
|
88
|
-
value: evt.target.value
|
|
89
|
-
});
|
|
90
|
-
};
|
|
91
|
-
return <NumberInput onChange={handleChange} value={123} {...args} />;
|
|
92
|
-
}`,...(fe=(Te=V.parameters)==null?void 0:Te.docs)==null?void 0:fe.source}}};var xe,Be,Se;R.parameters={...R.parameters,docs:{...(xe=R.parameters)==null?void 0:xe.docs,source:{originalSource:`() => <InputGroup small>
|
|
93
|
-
<NumberInput value={123} />
|
|
94
|
-
<InputGroupAddon>to</InputGroupAddon>
|
|
95
|
-
<NumberInput value={123} />
|
|
96
|
-
<Select options={[{
|
|
97
|
-
value: 'units',
|
|
98
|
-
label: 'units'
|
|
99
|
-
}]} width="auto" value="units" />
|
|
100
|
-
</InputGroup>`,...(Se=(Be=R.parameters)==null?void 0:Be.docs)==null?void 0:Se.source}}};var De,Ee,Ve;v.parameters={...v.parameters,docs:{...(De=v.parameters)==null?void 0:De.docs,source:{originalSource:`() => {
|
|
101
|
-
const [value, setValue] = useState('123');
|
|
102
|
-
return <NumberInput value={value} onChange={evt => {
|
|
103
|
-
setValue(evt.target.value);
|
|
104
|
-
}} testId="testId" enableDisplayRounding />;
|
|
105
|
-
}`,...(Ve=(Ee=v.parameters)==null?void 0:Ee.docs)==null?void 0:Ve.source}}};var Re,Ae,je;A.parameters={...A.parameters,docs:{...(Re=A.parameters)==null?void 0:Re.docs,source:{originalSource:`() => {
|
|
106
|
-
const [visible, setVisible] = useState(true);
|
|
107
|
-
const triggerRerender = () => {
|
|
108
|
-
setVisible(false);
|
|
109
|
-
setTimeout(() => setVisible(true), 0);
|
|
110
|
-
};
|
|
111
|
-
const [value, setValue] = useState('123');
|
|
112
|
-
return <Grid columns="1fr 1fr" gap>
|
|
113
|
-
<Card heading={<Heading>Storage State (Redux)</Heading>}>
|
|
114
|
-
{value}
|
|
115
|
-
<Spacer />
|
|
116
|
-
<Button label="Change value" onClick={() => setValue(String(Math.floor(Math.random() * 100)))} />
|
|
117
|
-
</Card>
|
|
118
|
-
<Card heading={<Heading icon={<Icon icon="refresh" />} onIconClick={triggerRerender}>
|
|
119
|
-
NumberInput
|
|
120
|
-
</Heading>}>
|
|
121
|
-
{visible && <NumberInput value={value} onChange={evt => {
|
|
122
|
-
setValue(evt.target.value);
|
|
123
|
-
}} error={Number(value) >= 0 ? '' : 'Value must be positive'} />}
|
|
124
|
-
</Card>
|
|
125
|
-
</Grid>;
|
|
126
|
-
}`,...(je=(Ae=A.parameters)==null?void 0:Ae.docs)==null?void 0:je.source}}};var Ne,ke,Me;I.parameters={...I.parameters,docs:{...(Ne=I.parameters)==null?void 0:Ne.docs,source:{originalSource:`() => {
|
|
127
|
-
const [visible, setVisible] = useState(true);
|
|
128
|
-
const triggerRerender = () => {
|
|
129
|
-
setVisible(false);
|
|
130
|
-
setTimeout(() => setVisible(true), 0);
|
|
131
|
-
};
|
|
132
|
-
const [enableDisplayRounding, setEnableDisplayRounding] = useState(false);
|
|
133
|
-
const [enableCosmeticRounding, setEnableCosmeticRounding] = useState(true);
|
|
134
|
-
const [valueInFeet, setValueInFeet] = useState('0.6889763779527558');
|
|
135
|
-
const [callBackError, setCallBackError] = useState('');
|
|
136
|
-
const valueInMeters = Number(valueInFeet) * 0.3048;
|
|
137
|
-
return <Grid columns="1fr 1fr" gap>
|
|
138
|
-
<Card heading={<Heading>Settings</Heading>}>
|
|
139
|
-
<Field label="Enable display rounding:" labelLeft labelWidth={200}>
|
|
140
|
-
<Toggle checked={enableDisplayRounding} onChange={evt => setEnableDisplayRounding(evt.target.checked)} />
|
|
141
|
-
</Field>
|
|
142
|
-
<Field label="Enable cosmetic rounding:" labelLeft labelWidth={200}>
|
|
143
|
-
<Toggle checked={enableCosmeticRounding} onChange={evt => setEnableCosmeticRounding(evt.target.checked)} />
|
|
144
|
-
</Field>
|
|
145
|
-
</Card>
|
|
146
|
-
<Card heading={<Heading icon={<Icon icon="refresh" testId="triggerRerenderTestId" />} onIconClick={triggerRerender}>
|
|
147
|
-
NumberInput (displayed in Meters)
|
|
148
|
-
</Heading>}>
|
|
149
|
-
<Text faint>
|
|
150
|
-
Cosmetic Rounding Test Cases: type 0.21 then return (compare with
|
|
151
|
-
enableCosmeticRounding on and off)
|
|
152
|
-
</Text>
|
|
153
|
-
<Spacer />
|
|
154
|
-
{visible && <NumberInput name="Example" value={valueInMeters} onChange={evt => {
|
|
155
|
-
const nextValueInFeet = String(Number(evt.target.value) / 0.3048);
|
|
156
|
-
setValueInFeet(nextValueInFeet); // convert back to ft
|
|
157
|
-
}} enableDisplayRounding={enableDisplayRounding} enableCosmeticRounding={enableCosmeticRounding} error={Number(valueInFeet) >= 0 ? '' : 'Value must be positive'} validationCallback={(name, error) => {
|
|
158
|
-
setCallBackError(error ?? '');
|
|
159
|
-
}} testId="testId" />}
|
|
160
|
-
</Card>
|
|
161
|
-
<Card heading={<Heading>Storage State / Redux (stored in Feet)</Heading>}>
|
|
162
|
-
{valueInFeet}
|
|
163
|
-
<Spacer />
|
|
164
|
-
<Button label="Change value" onClick={() => setValueInFeet(String(Math.floor(Math.random() * 100)))} />
|
|
165
|
-
</Card>
|
|
166
|
-
<Card heading={<Heading>Test Validation Callback</Heading>}>
|
|
167
|
-
{callBackError && <Message message={{
|
|
168
|
-
content: callBackError,
|
|
169
|
-
icon: true,
|
|
170
|
-
type: 'Error',
|
|
171
|
-
visible: true
|
|
172
|
-
}} />}
|
|
173
|
-
</Card>
|
|
174
|
-
</Grid>;
|
|
175
|
-
}`,...(Me=(ke=I.parameters)==null?void 0:ke.docs)==null?void 0:Me.source}}};var _e,He,Fe;y.parameters={...y.parameters,docs:{...(_e=y.parameters)==null?void 0:_e.docs,source:{originalSource:`() => {
|
|
176
|
-
const [value, setValue] = useState('123');
|
|
177
|
-
return <NumberInput value={value} onChange={evt => {
|
|
178
|
-
setValue(evt.target.value);
|
|
179
|
-
}} testId="testId" />;
|
|
180
|
-
}`,...(Fe=(He=y.parameters)==null?void 0:He.docs)==null?void 0:Fe.source}}};const Gt=["Default","Small","Width","Left","Disabled","AllowEmpty","Placeholder","Warning","Error","BadInput","WithDisplayRounding","WithCustomDisplayRounding","TestInputGroup","TestDisplayRounding","ManagedTestCase","DemoCosmeticRounding","TestUserInput"];export{x as AllowEmpty,D as BadInput,j as Default,I as DemoCosmeticRounding,f as Disabled,S as Error,T as Left,A as ManagedTestCase,h as Placeholder,C as Small,v as TestDisplayRounding,R as TestInputGroup,y as TestUserInput,B as Warning,w as Width,V as WithCustomDisplayRounding,E as WithDisplayRounding,Gt as __namedExportsOrder,Lt as default};
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import{j as r}from"./jsx-runtime-eps93zm2.js";import{r as k}from"./index-DhsZuJvc.js";import{S as w}from"./spacer-BWoNR27H.js";import{P as i}from"./popover-rq33c1W2.js";import{I as c}from"./input-DTXbDJaL.js";import{B as l}from"./button-DHevvVBE.js";import{F as y}from"./flex-EllkLxgO.js";import{S as D}from"./select-DnRuRG_N.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";import"./index-Bk2sglWO.js";import"./common-types-Sih75Sav.js";import"./disabled-context-rmpd7YJS.js";import"./types-Dx2TtIG9.js";import"./lodash-c4VUpsOs.js";import"./spinner-AWUe4xwQ.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./inheritsLoose-DP0QEDDI.js";import"./index-CEuq6vkz.js";import"./assertThisInitialized-B9jnkVVz.js";import"./memoize-one.esm-CcMeOnPo.js";import"./types-BmbYqTX_.js";import"./text-B3-TSWok.js";import"./actions-D-uVCDzk.js";import"./badge-CLQ59MDF.js";import"./select.input-D0UkAPd9.js";const u=[{label:"Option 1",value:"1"},{label:"Option 2",value:"2"}],_=({close:e})=>r.jsxs(y,{gap:"var(--padding-xs)",children:[r.jsx(c,{value:"Value",width:"150px",small:!0}),r.jsx(D,{options:u,value:u[0],width:"auto",small:!0}),r.jsx(l,{colored:!0,label:"Save",onClick:()=>{},small:!0}),r.jsx(l,{label:"Cancel",onClick:e,small:!0})]}),lr={title:"Basic/Popover",component:i,args:{overflowContainer:!0,content:r.jsx(_,{}),children:r.jsx(l,{label:"Toggle me"})},decorators:[e=>r.jsx("div",{style:{display:"flex"},children:e()})],parameters:{docs:{source:{excludeDecorators:!0}}}},n=e=>r.jsx(i,{...e}),p=n.bind({}),o=n.bind({});o.args={children:r.jsx(c,{value:"Value",width:"100%"})};const s=n.bind({});s.args={closeOnOutsideClick:!1,showCloseButton:!0};const t=n.bind({});t.args={disabled:!0};const a=e=>{const[m,T]=k.useState(!1);return r.jsxs("div",{children:[r.jsx(l,{onClick:()=>T(!m),label:"Toggle Popover Externally"}),r.jsx(w,{}),r.jsx(i,{...e,isOpen:m,children:r.jsx(c,{})})]})};a.__docgenInfo={description:"",methods:[],displayName:"ExternalControl"};var d,g,x;p.parameters={...p.parameters,docs:{...(d=p.parameters)==null?void 0:d.docs,source:{originalSource:"args => <Popover {...args} />",...(x=(g=p.parameters)==null?void 0:g.docs)==null?void 0:x.source}}};var v,f,j;o.parameters={...o.parameters,docs:{...(v=o.parameters)==null?void 0:v.docs,source:{originalSource:"args => <Popover {...args} />",...(j=(f=o.parameters)==null?void 0:f.docs)==null?void 0:j.source}}};var b,S,C;s.parameters={...s.parameters,docs:{...(b=s.parameters)==null?void 0:b.docs,source:{originalSource:"args => <Popover {...args} />",...(C=(S=s.parameters)==null?void 0:S.docs)==null?void 0:C.source}}};var O,h,P;t.parameters={...t.parameters,docs:{...(O=t.parameters)==null?void 0:O.docs,source:{originalSource:"args => <Popover {...args} />",...(P=(h=t.parameters)==null?void 0:h.docs)==null?void 0:P.source}}};var I,E,B;a.parameters={...a.parameters,docs:{...(I=a.parameters)==null?void 0:I.docs,source:{originalSource:`args => {
|
|
2
|
-
const [isOpen, setIsOpen] = useState(false);
|
|
3
|
-
return <div>
|
|
4
|
-
<Button onClick={() => setIsOpen(!isOpen)} label="Toggle Popover Externally" />
|
|
5
|
-
<Spacer />
|
|
6
|
-
<Popover {...args} isOpen={isOpen}>
|
|
7
|
-
<Input />
|
|
8
|
-
</Popover>
|
|
9
|
-
</div>;
|
|
10
|
-
}`,...(B=(E=a.parameters)==null?void 0:E.docs)==null?void 0:B.source}}};const nr=["Default","InputTrigger","CloseButton","Disabled","ExternalControl"];export{s as CloseButton,p as Default,t as Disabled,a as ExternalControl,o as InputTrigger,nr as __namedExportsOrder,lr as default};
|