@oliasoft-open-source/react-ui-library 4.9.0 → 4.9.2
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/index.js +83 -143
- package/dist/index.js.map +1 -1
- package/dist/storybook/assets/{Color-KGDBMAHA-BnHaqcsT.js → Color-KGDBMAHA-sr_lo8VN.js} +1 -1
- package/dist/storybook/assets/{DocsRenderer-PKQXORMH-DcoD1y-5.js → DocsRenderer-PKQXORMH-Dio4TQT6.js} +1 -1
- package/dist/storybook/assets/{accordion.stories-D0wb2n-9.js → accordion.stories-BtQXhKld.js} +2 -2
- package/dist/storybook/assets/{afe.stories-DM18uTAa.js → afe.stories-DFQsvqIV.js} +2 -2
- package/dist/storybook/assets/{buttons-and-links-jPZ2UUsp.js → buttons-and-links-BOcv8xIU.js} +1 -1
- package/dist/storybook/assets/{casing-loads.stories-Dga1QkGC.js → casing-loads.stories-1KCWDoR3.js} +2 -2
- package/dist/storybook/assets/{cell.stories-DfyQwzEH.js → cell.stories-CBq3IOiP.js} +2 -2
- package/dist/storybook/assets/{chunk-HLWAVYOI-D2AwGCE9.js → chunk-HLWAVYOI-SLqzrZ8s.js} +1 -1
- package/dist/storybook/assets/{color-CLf9xt55.js → color-D1FmkH7Y.js} +1 -1
- package/dist/storybook/assets/footer.stories-D-rIL9Q8.js +3 -0
- package/dist/storybook/assets/form.stories-BrUnmw7R.js +49 -0
- package/dist/storybook/assets/{formation.stories-CZGQhWyA.js → formation.stories-ByGQlyM6.js} +2 -2
- package/dist/storybook/assets/iframe-NUuxNiwO.js +2 -0
- package/dist/storybook/assets/{index-Sr04i8ct.js → index-Bhtru3gK.js} +4 -4
- package/dist/storybook/assets/{index-BQ_6rM6u.js → index-DNcuiqfZ.js} +1 -1
- package/dist/storybook/assets/{input-group.stories-EhmORqH9.js → input-group.stories-CElwRt3p.js} +3 -3
- package/dist/storybook/assets/{input-validation-Tr-aD1VJ.js → input-validation-FFJCXfNa.js} +2 -2
- package/dist/storybook/assets/{inputs-BGIgggtv.js → inputs-D3ZjmDIl.js} +1 -1
- package/dist/storybook/assets/{layout-forms-n-mRkolR.js → layout-forms-DNUCHjRh.js} +5 -5
- package/dist/storybook/assets/{layout-general-CNsKoPG6.js → layout-general-CuxE1EOt.js} +1 -1
- package/dist/storybook/assets/{modal.stories-C6Bh0Oda.js → modal.stories-LhoWfDE6.js} +2 -2
- package/dist/storybook/assets/number-input-F3bqJ0z5.js +16 -0
- package/dist/storybook/assets/number-input.stories-Dw2eW2Mc.js +166 -0
- package/dist/storybook/assets/{padding-and-spacing-B10oZ-Ww.js → padding-and-spacing-B-LaxRb4.js} +1 -1
- package/dist/storybook/assets/{pagination-DWc8zp3k.js → pagination-CLt-kUlx.js} +1 -1
- package/dist/storybook/assets/{pagination.stories-B5cOvzik.js → pagination.stories-CTRM0Xou.js} +2 -2
- package/dist/storybook/assets/popover.stories-CGm0M5fv.js +10 -0
- package/dist/storybook/assets/{preview-Cym3ID9p.js → preview-ClcAw55r.js} +2 -2
- package/dist/storybook/assets/{preview-pQMX-q5x.js → preview-DQgT2zeu.js} +1 -1
- package/dist/storybook/assets/{projects.stories-Co_WnKSx.js → projects.stories-BQswWVCx.js} +2 -2
- package/dist/storybook/assets/{radio-button-C4ljBRED.js → radio-button-DmDuw4DA.js} +1 -1
- package/dist/storybook/assets/{radio-button.stories-BzyW2CtK.js → radio-button.stories-5gvV0LD0.js} +2 -2
- package/dist/storybook/assets/{reservoirs.stories-UW_8sofe.js → reservoirs.stories-B12tIrmZ.js} +2 -2
- package/dist/storybook/assets/{rich-text-input.stories-0pm7-gTq.js → rich-text-input.stories-hAHCnDHk.js} +3 -3
- package/dist/storybook/assets/{row.stories-B8OWE9yd.js → row.stories-ghcsAzwW.js} +2 -2
- package/dist/storybook/assets/select-DnRuRG_N.js +61 -0
- package/dist/storybook/assets/select.input-D0UkAPd9.js +1 -0
- package/dist/storybook/assets/{select.stories-B0KIHiMX.js → select.stories-B9w9ONzj.js} +2 -2
- package/dist/storybook/assets/{site.stories-ZGohyW6Z.js → site.stories-umpPYjkq.js} +2 -2
- package/dist/storybook/assets/{table-qmf29AIJ.js → table-BCdvBxub.js} +1 -1
- package/dist/storybook/assets/{table.stories-DzHGqXth.js → table.stories-DkmbUVHr.js} +2 -2
- package/dist/storybook/assets/{tabs-BoToLVEP.js → tabs-C3NG6m9W.js} +1 -1
- package/dist/storybook/assets/tabs.stories-dsXjRHJy.js +30 -0
- package/dist/storybook/assets/{title.stories-B8l1sfdo.js → title.stories-DpFDK9o1.js} +3 -3
- package/dist/storybook/assets/unit-input.stories-BHTxKnOU.js +380 -0
- package/dist/storybook/assets/unit-table.stories-u1PeEt0F.js +152 -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/enum-Bnn40S8Q.js +0 -1
- package/dist/storybook/assets/footer.stories-DYBxUtZh.js +0 -3
- package/dist/storybook/assets/form.stories-BLcmnfy8.js +0 -49
- package/dist/storybook/assets/helpers-JJxzGegQ.js +0 -1
- package/dist/storybook/assets/iframe-BnDar59m.js +0 -2
- package/dist/storybook/assets/number-input-DZ9ERbK_.js +0 -16
- package/dist/storybook/assets/number-input.stories-CmVUHT2d.js +0 -124
- package/dist/storybook/assets/popover.stories-p9_-pH_Q.js +0 -10
- package/dist/storybook/assets/select-03uRbc4I.js +0 -61
- package/dist/storybook/assets/select.input-CJed_LLR.js +0 -1
- package/dist/storybook/assets/tabs.stories-B52iEaHf.js +0 -30
- package/dist/storybook/assets/unit-input.stories-BnLB_Avl.js +0 -316
- package/dist/storybook/assets/unit-table.stories-DquyyMbD.js +0 -152
|
@@ -1 +1 @@
|
|
|
1
|
-
import{o as n,X as T,m as l,a as c,A as H,l as L,u as B,s as b,b as S,J as u,O as C,w as h,c as d,p as g,d as y,f as F,h as I,e as k,g as x,D as A,v as P,i as R,B as W,j as f,q as D,k as E,y as N,n as q,z as v,r as w,C as O,x as U,_ as j,E as z,t as G,F as J,G as K,H as M,I as Q,K as V,L as X,S as Y,M as Z,N as _,P as $,Q as aa,R as sa,T as oa,U as ta,W as ra,V as ea,Y as ia}from"./index-
|
|
1
|
+
import{o as n,X as T,m as l,a as c,A as H,l as L,u as B,s as b,b as S,J as u,O as C,w as h,c as d,p as g,d as y,f as F,h as I,e as k,g as x,D as A,v as P,i as R,B as W,j as f,q as D,k as E,y as N,n as q,z as v,r as w,C as O,x as U,_ as j,E as z,t as G,F as J,G as K,H as M,I as Q,K as V,L as X,S as Y,M as Z,N as _,P as $,Q as aa,R as sa,T as oa,U as ta,W as ra,V as ea,Y as ia}from"./index-Bhtru3gK.js";import"./iframe-NUuxNiwO.js";import"../sb-preview/runtime.js";import"./index-DhsZuJvc.js";import"./index-CUZDtIZe.js";import"./inheritsLoose-DP0QEDDI.js";import"./assertThisInitialized-B9jnkVVz.js";import"./index-D6rZ4wEC.js";export{n as A,T as ActionBar,l as Bar,c as Blockquote,H as Button,L as Code,B as DL,b as Div,S as EmptyTabContent,u as ErrorFormatter,C as FlexBar,h as Form,d as H1,g as H2,y as H3,F as H4,I as H5,k as H6,x as HR,A as IconButton,P as Img,R as LI,W as Link,f as ListItem,D as Loader,E as OL,N as P,q as Pre,v as ResetWrapper,w as ScrollArea,O as Separator,U as Span,j as SyntaxHighlighter,z as TT,G as TabBar,J as TabButton,K as Table,M as Tabs,Q as TabsState,V as TooltipLinkList,X as TooltipNote,Y as UL,Z as WithTooltip,_ as WithTooltipPure,$ as Zoom,aa as codeCommon,sa as components,oa as createCopyToClipboardFunction,ta as getStoryHref,ra as icons,ea as nameSpaceClassNames,ia as withReset};
|
package/dist/storybook/assets/{input-group.stories-EhmORqH9.js → input-group.stories-CElwRt3p.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-eps93zm2.js";import{T as x}from"./common-types-Sih75Sav.js";import{I as t}from"./input-group-BaRSJAEN.js";import{I as h}from"./input-group-addon-D68iUKV2.js";import{I as M}from"./input-DTXbDJaL.js";import{B as C}from"./button-DHevvVBE.js";import{M as f}from"./actions-D-uVCDzk.js";import{S as I}from"./select-
|
|
1
|
+
import{j as e}from"./jsx-runtime-eps93zm2.js";import{T as x}from"./common-types-Sih75Sav.js";import{I as t}from"./input-group-BaRSJAEN.js";import{I as h}from"./input-group-addon-D68iUKV2.js";import{I as M}from"./input-DTXbDJaL.js";import{B as C}from"./button-DHevvVBE.js";import{M as f}from"./actions-D-uVCDzk.js";import{S as I}from"./select-DnRuRG_N.js";import{T as P}from"./tooltip-1V7clEnw.js";import{M as r}from"./types-BmbYqTX_.js";import"./index-DhsZuJvc.js";import"./index-Bk2sglWO.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"./badge-CLQ59MDF.js";import"./assertThisInitialized-B9jnkVVz.js";import"./memoize-one.esm-CcMeOnPo.js";import"./text-B3-TSWok.js";import"./select.input-D0UkAPd9.js";import"./index-CUZDtIZe.js";const ee={title:"Forms/InputGroup",component:t,args:{}},s=i=>e.jsxs(t,{...i,children:[e.jsx(h,{children:"$"}),e.jsx(M,{width:"100%",name:"example",value:"123",onChange:()=>{}}),e.jsx(I,{options:[{label:"Aardvarks",value:"termites"},{label:"Kangaroos",value:"grass"},{label:"Monkeys",value:"bananas"},{label:"Possums",value:"slugs"}],onChange:()=>{},value:{label:"Monkeys",value:"bananas"},width:"auto",native:!0}),e.jsx(f,{menu:{label:"E-06/degC",trigger:x.DROP_DOWN_BUTTON,small:i.small,sections:[{type:r.OPTION,label:"403.5433",description:"ft",inline:!0,onClick:()=>{}},{type:r.OPTION,label:"0.123",description:"km",inline:!0,onClick:()=>{}},{type:r.OPTION,label:"4842.4608",description:"in",inline:!0,onClick:()=>{}}]}}),e.jsx(C,{name:"example",label:"Confirm",colored:!0,onClick:()=>{}})]}),o=s.bind({}),a=s.bind({});a.args={width:"480px"};const l=s.bind({});l.args={small:!0};const n=()=>e.jsxs(t,{children:[e.jsx(I,{options:[{label:"Aardvarks",value:"termites"},{label:"Kangaroos",value:"grass"},{label:"Monkeys",value:"bananas"},{label:"Possums",value:"slugs"}],onChange:()=>{},value:{label:"Monkeys",value:"bananas"}}),e.jsx(P,{text:"This is a tooltip",children:e.jsx(C,{name:"example",label:"Confirm",colored:!0,onClick:()=>{},groupOrder:"last"})})]});n.__docgenInfo={description:"",methods:[],displayName:"SelectWithButton"};var u,p,m;o.parameters={...o.parameters,docs:{...(u=o.parameters)==null?void 0:u.docs,source:{originalSource:`args => {
|
|
2
2
|
return <InputGroup
|
|
3
3
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
4
4
|
{...args}>
|
|
@@ -46,7 +46,7 @@ import{j as e}from"./jsx-runtime-eps93zm2.js";import{T as x}from"./common-types-
|
|
|
46
46
|
}} />
|
|
47
47
|
<Button name="example" label="Confirm" colored onClick={() => {}} />
|
|
48
48
|
</InputGroup>;
|
|
49
|
-
}`,...(m=(
|
|
49
|
+
}`,...(m=(p=o.parameters)==null?void 0:p.docs)==null?void 0:m.source}}};var c,d,b;a.parameters={...a.parameters,docs:{...(c=a.parameters)==null?void 0:c.docs,source:{originalSource:`args => {
|
|
50
50
|
return <InputGroup
|
|
51
51
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
52
52
|
{...args}>
|
|
@@ -164,4 +164,4 @@ import{j as e}from"./jsx-runtime-eps93zm2.js";import{T as x}from"./common-types-
|
|
|
164
164
|
<Button name="example" label="Confirm" colored onClick={() => {}} groupOrder="last" />
|
|
165
165
|
</Tooltip>
|
|
166
166
|
</InputGroup>;
|
|
167
|
-
}`,...(O=(y=n.parameters)==null?void 0:y.docs)==null?void 0:O.source}}};const
|
|
167
|
+
}`,...(O=(y=n.parameters)==null?void 0:y.docs)==null?void 0:O.source}}};const ae=["Default","FixedWidth","Small","SelectWithButton"];export{o as Default,a as FixedWidth,n as SelectWithButton,l as Small,ae as __namedExportsOrder,ee as default};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-eps93zm2.js";import{useMDXComponents as r}from"./index-BcNHZKhG.js";import{Z as s,$ as n}from"./index-
|
|
1
|
+
import{j as e}from"./jsx-runtime-eps93zm2.js";import{useMDXComponents as r}from"./index-BcNHZKhG.js";import{Z as s,$ as n}from"./index-Bhtru3gK.js";import{NonExistentValue as a,Error as l}from"./select.stories-B9w9ONzj.js";import"./index-DhsZuJvc.js";import"./iframe-NUuxNiwO.js";import"../sb-preview/runtime.js";import"./index-CUZDtIZe.js";import"./inheritsLoose-DP0QEDDI.js";import"./assertThisInitialized-B9jnkVVz.js";import"./index-D6rZ4wEC.js";import"./index-DMAnyMX5.js";import"./index-CF7H4eMJ.js";import"./select-DnRuRG_N.js";import"./lodash-c4VUpsOs.js";import"./index-Bk2sglWO.js";import"./common-types-Sih75Sav.js";import"./disabled-context-rmpd7YJS.js";import"./types-Dx2TtIG9.js";import"./tooltip-1V7clEnw.js";import"./index-CEuq6vkz.js";import"./memoize-one.esm-CcMeOnPo.js";import"./types-BmbYqTX_.js";import"./text-B3-TSWok.js";import"./actions-D-uVCDzk.js";import"./button-DHevvVBE.js";import"./spinner-AWUe4xwQ.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./badge-CLQ59MDF.js";import"./select.input-D0UkAPd9.js";import"./spacer-BWoNR27H.js";function o(t){const i={code:"code",h1:"h1",h2:"h2",h3:"h3",p:"p",strong:"strong",...r(),...t.components};return e.jsxs(e.Fragment,{children:[e.jsx(s,{title:"Input Validation"}),`
|
|
2
2
|
`,e.jsx(i.h1,{id:"input-validation",children:"Input Validation"}),`
|
|
3
3
|
`,e.jsx(i.h2,{id:"select",children:"Select"}),`
|
|
4
4
|
`,e.jsx(i.h3,{id:"invalid-states",children:"Invalid states"}),`
|
|
@@ -23,4 +23,4 @@ application layer.`}),`
|
|
|
23
23
|
`,e.jsxs(i.p,{children:[`For a 'hard invalid' state (where the value is unusable, but required), it is recommended for the business logic to not
|
|
24
24
|
set a value (use `,e.jsx(i.code,{children:"null"})," or ",e.jsx(i.code,{children:"undefined"}),"), and to set the ",e.jsx(i.code,{children:"error"}),` prop with an appropriate message
|
|
25
25
|
(e.g. "Value is required").`]}),`
|
|
26
|
-
`,e.jsx(n,{of:l})]})}function
|
|
26
|
+
`,e.jsx(n,{of:l})]})}function R(t={}){const{wrapper:i}={...r(),...t.components};return i?e.jsx(i,{...t,children:e.jsx(o,{...t})}):o(t)}export{R as default};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-eps93zm2.js";import{useMDXComponents as s}from"./index-BcNHZKhG.js";import{Z as r,$ as o}from"./index-
|
|
1
|
+
import{j as e}from"./jsx-runtime-eps93zm2.js";import{useMDXComponents as s}from"./index-BcNHZKhG.js";import{Z as r,$ as o}from"./index-Bhtru3gK.js";import{Default as l}from"./button.stories-DA9DGYD2.js";import{Default as a}from"./check-box.stories-DfbWw6mD.js";import{Default as c}from"./file-input.stories-CWD5XYE9.js";import{Default as d,Date as p}from"./input.stories-FKl0qVhm.js";import{Default as h}from"./number-input.stories-Dw2eW2Mc.js";import{Default as m}from"./option-dropdown.stories-CIvqMhQ3.js";import{Default as u}from"./radio-button.stories-5gvV0LD0.js";import{Native as f,Default as x}from"./select.stories-B9w9ONzj.js";import{Default as j}from"./slider.stories-BzBb3PkP.js";import{Default as b}from"./textarea.stories-CJ-Oqytp.js";import{Default as g}from"./toggle.stories-qTHFTXxI.js";import"./index-DhsZuJvc.js";import"./iframe-NUuxNiwO.js";import"../sb-preview/runtime.js";import"./index-CUZDtIZe.js";import"./inheritsLoose-DP0QEDDI.js";import"./assertThisInitialized-B9jnkVVz.js";import"./index-D6rZ4wEC.js";import"./react-router-dom-Ck2Y_Fzc.js";import"./index-CEuq6vkz.js";import"./tiny-invariant-DqLgxztJ.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./flex-EllkLxgO.js";import"./button-DHevvVBE.js";import"./index-Bk2sglWO.js";import"./common-types-Sih75Sav.js";import"./disabled-context-rmpd7YJS.js";import"./spinner-AWUe4xwQ.js";import"./icon-BSFY3vDO.js";import"./tooltip-1V7clEnw.js";import"./index-DMAnyMX5.js";import"./index-CF7H4eMJ.js";import"./check-box-DPLaOkRR.js";import"./help-icon-Buhx5nl6.js";import"./file-input-X3BnZaHk.js";import"./lodash-c4VUpsOs.js";import"./input-group-BaRSJAEN.js";import"./input-DTXbDJaL.js";import"./types-Dx2TtIG9.js";import"./spacer-BWoNR27H.js";import"./message-Y48EomV-.js";import"./textarea-D6ltcKhz.js";import"./index-C0x1JmaP.js";import"./index-DRSy5Ssd.js";import"./grid-DRkC-bt8.js";import"./styled-components.browser.esm-BQ9GQzDc.js";import"./card-EcjmryU9.js";import"./heading-CRNoBc7q.js";import"./input-group-addon-D68iUKV2.js";import"./select-DnRuRG_N.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";import"./field-HrLaMLbx.js";import"./label-CqmyC9he.js";import"./toggle-BbFVf61v.js";import"./number-input-F3bqJ0z5.js";import"./divider-DY9nJ_7N.js";import"./radio-button-DmDuw4DA.js";import"./slider-C7vnj_3M.js";import"./objectSpread2-DW4nTBoq.js";import"./index-BI4_Bp97.js";function i(n){const t={a:"a",code:"code",h1:"h1",h2:"h2",h3:"h3",li:"li",p:"p",strong:"strong",ul:"ul",...s(),...n.components};return e.jsxs(e.Fragment,{children:[e.jsx(r,{title:"Inputs"}),`
|
|
2
2
|
`,e.jsx(t.h1,{id:"inputs",children:"Inputs"}),`
|
|
3
3
|
`,e.jsx(t.p,{children:"React UI Library provides a comprehensive set of user input components."}),`
|
|
4
4
|
`,e.jsx(t.h2,{id:"button",children:"Button"}),`
|
|
@@ -1,16 +1,16 @@
|
|
|
1
|
-
import{j as t}from"./jsx-runtime-eps93zm2.js";import{useMDXComponents as n}from"./index-BcNHZKhG.js";import{Z as s,$ as o}from"./index-
|
|
1
|
+
import{j as t}from"./jsx-runtime-eps93zm2.js";import{useMDXComponents as n}from"./index-BcNHZKhG.js";import{Z as s,$ as o}from"./index-Bhtru3gK.js";import{Default as l,LabelOnLeft as p}from"./field.stories-DUGMwi1O.js";import{Default as m,LabelsOnLeft as a,Row as h}from"./form.stories-BrUnmw7R.js";import"./index-DhsZuJvc.js";import"./iframe-NUuxNiwO.js";import"../sb-preview/runtime.js";import"./index-CUZDtIZe.js";import"./inheritsLoose-DP0QEDDI.js";import"./assertThisInitialized-B9jnkVVz.js";import"./index-D6rZ4wEC.js";import"./field-HrLaMLbx.js";import"./index-Bk2sglWO.js";import"./label-CqmyC9he.js";import"./common-types-Sih75Sav.js";import"./help-icon-Buhx5nl6.js";import"./tooltip-1V7clEnw.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./index-CEuq6vkz.js";import"./disabled-context-rmpd7YJS.js";import"./input-DTXbDJaL.js";import"./types-Dx2TtIG9.js";import"./lodash-c4VUpsOs.js";import"./text-B3-TSWok.js";import"./select-DnRuRG_N.js";import"./memoize-one.esm-CcMeOnPo.js";import"./types-BmbYqTX_.js";import"./actions-D-uVCDzk.js";import"./button-DHevvVBE.js";import"./spinner-AWUe4xwQ.js";import"./badge-CLQ59MDF.js";import"./select.input-D0UkAPd9.js";import"./check-box-DPLaOkRR.js";import"./button-group-1DEZPmxq.js";import"./toggle-BbFVf61v.js";import"./input-group-BaRSJAEN.js";import"./input-group-addon-D68iUKV2.js";import"./slider-C7vnj_3M.js";import"./objectSpread2-DW4nTBoq.js";import"./index-BI4_Bp97.js";import"./textarea-D6ltcKhz.js";import"./radio-button-DmDuw4DA.js";import"./form-row-CM112EYF.js";function r(i){const e={code:"code",h1:"h1",h2:"h2",p:"p",...n(),...i.components};return t.jsxs(t.Fragment,{children:[t.jsx(s,{title:"Layout (Forms)"}),`
|
|
2
2
|
`,t.jsx(e.h1,{id:"layout-forms",children:"Layout (Forms)"}),`
|
|
3
3
|
`,t.jsx(e.h2,{id:"field",children:"Field"}),`
|
|
4
4
|
`,t.jsxs(e.p,{children:["This is a wrapper for any form element with default bottom margin, and props like ",t.jsx(e.code,{children:"label"})," for other default styling."]}),`
|
|
5
|
-
`,t.jsx(o,{of:
|
|
5
|
+
`,t.jsx(o,{of:l}),`
|
|
6
6
|
`,t.jsxs(e.p,{children:["For inline labels, use the ",t.jsx(e.code,{children:"labelLeft"})," prop (and the optional ",t.jsx(e.code,{children:"labelWidth"}),")."]}),`
|
|
7
|
-
`,t.jsx(o,{of:
|
|
7
|
+
`,t.jsx(o,{of:p}),`
|
|
8
8
|
`,t.jsx(e.h2,{id:"stacked",children:"Stacked"}),`
|
|
9
9
|
`,t.jsxs(e.p,{children:["This is the simplest form layout, and works well when horizontal space is limited, or inputs vary in height (e.g. ",t.jsx(e.code,{children:"TextArea"}),")."]}),`
|
|
10
|
-
`,t.jsx(o,{of:
|
|
10
|
+
`,t.jsx(o,{of:m}),`
|
|
11
11
|
`,t.jsx(e.h2,{id:"stacked-with-inline-labels",children:"Stacked with inline labels"}),`
|
|
12
12
|
`,t.jsxs(e.p,{children:["This has the same markup, but with ",t.jsx(e.code,{children:"labelLeft"})," and ",t.jsx(e.code,{children:"labelWidth"})," set on each field."]}),`
|
|
13
13
|
`,t.jsx(o,{of:a}),`
|
|
14
14
|
`,t.jsx(e.h2,{id:"row",children:"Row"}),`
|
|
15
15
|
`,t.jsxs(e.p,{children:["Wrapping a group of form controls in ",t.jsx(e.code,{children:"FormRow"})," arranges them horizontally, and applies default spacing between each item. This works well when vertical space is limited, because inputs will only wrap onto the next line when they need to."]}),`
|
|
16
|
-
`,t.jsx(o,{of:h})]})}function
|
|
16
|
+
`,t.jsx(o,{of:h})]})}function ot(i={}){const{wrapper:e}={...n(),...i.components};return e?t.jsx(e,{...i,children:t.jsx(r,{...i})}):r(i)}export{ot as default};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-eps93zm2.js";import{useMDXComponents as s}from"./index-BcNHZKhG.js";import{Z as r,$ as n}from"./index-
|
|
1
|
+
import{j as e}from"./jsx-runtime-eps93zm2.js";import{useMDXComponents as s}from"./index-BcNHZKhG.js";import{Z as r,$ as n}from"./index-Bhtru3gK.js";import{Center as d,SpaceBetween as l,JustifyEnd as a,Column as c}from"./flex.stories-BhvJpHpN.js";import{Default as h,CustomColumnWidth as p,DefaultGap as x,CustomGap as m,Responsive as u}from"./grid.stories-DqjhHHwX.js";import{Default as j,FixedWidth as f,NoPadding as w,ResponsiveWidth as g}from"./column.stories-DDTHFELF.js";import"./index-DhsZuJvc.js";import"./iframe-NUuxNiwO.js";import"../sb-preview/runtime.js";import"./index-CUZDtIZe.js";import"./inheritsLoose-DP0QEDDI.js";import"./assertThisInitialized-B9jnkVVz.js";import"./index-D6rZ4wEC.js";import"./flex-EllkLxgO.js";import"./button-DHevvVBE.js";import"./index-Bk2sglWO.js";import"./common-types-Sih75Sav.js";import"./disabled-context-rmpd7YJS.js";import"./spinner-AWUe4xwQ.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./index-CEuq6vkz.js";import"./tooltip-1V7clEnw.js";import"./text-B3-TSWok.js";import"./grid-DRkC-bt8.js";import"./styled-components.browser.esm-BQ9GQzDc.js";import"./card-EcjmryU9.js";import"./row-Bmiy2Lh0.js";import"./heading-CRNoBc7q.js";import"./help-icon-Buhx5nl6.js";function t(i){const o={code:"code",h1:"h1",h2:"h2",h3:"h3",p:"p",...s(),...i.components};return e.jsxs(e.Fragment,{children:[e.jsx(r,{title:"Layout (General)"}),`
|
|
2
2
|
`,e.jsx(o.h1,{id:"layout-general",children:"Layout (General)"}),`
|
|
3
3
|
`,e.jsx(o.h2,{id:"flex",children:"Flex"}),`
|
|
4
4
|
`,e.jsxs(o.p,{children:["The ",e.jsx(o.code,{children:"Flex"})," component is a basic flexbox wrapper with optional props for ",e.jsx(o.code,{children:"alignItems"}),", ",e.jsx(o.code,{children:"justifyContent"})," and ",e.jsx(o.code,{children:"flexDirection"}),". This is a conveninent way to center items vertically and/or horizontally, to align them to opposite edges, or align them to the far side."]}),`
|
|
@@ -1,4 +1,4 @@
|
|
|
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-
|
|
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
2
|
const [{
|
|
3
3
|
visible,
|
|
4
4
|
centered,
|
|
@@ -217,4 +217,4 @@ import{j as e}from"./jsx-runtime-eps93zm2.js";import{r as k}from"./index-DhsZuJv
|
|
|
217
217
|
</Modal>
|
|
218
218
|
<Button label="Open Modal" onClick={toggleModal} />
|
|
219
219
|
</>;
|
|
220
|
-
}`,...(oe=(ee=i.parameters)==null?void 0:ee.docs)==null?void 0:oe.source}}};const
|
|
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};
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import{j as S}from"./jsx-runtime-eps93zm2.js";import{r as i}from"./index-DhsZuJvc.js";import{d as t}from"./index-C0x1JmaP.js";import{K as J,E as Q}from"./select-DnRuRG_N.js";import{l as X}from"./lodash-c4VUpsOs.js";import{I as Y}from"./input-DTXbDJaL.js";const $=14,ee=n=>t.isScientificStringNum(n)?n:t.roundToPrecision(n,$),m=n=>String(t.toString(n)),ne=n=>n?typeof n=="string"?n:X.isArray(n)?n[0]:n.fieldName:"",ae=({name:n,placeholder:v="",disabled:C=!1,error:T=!1,left:L=!1,small:R=!1,width:k="100%",value:p="",onChange:x=()=>{},onFocus:j=()=>{},onBlur:M=()=>{},tabIndex:H=0,testId:O,tooltip:K=null,warning:_=!1,validationCallback:b=()=>{},allowEmpty:A=!1,isInTable:P,groupOrder:B,enableCosmeticRounding:E=!1,enableDisplayRounding:f=!1,roundDisplayValue:w,disableInternalErrorValidationMessages:D=!1})=>{const r=i.useRef(null),[s,q]=i.useState(m(p)),[u,N]=i.useState(!1),o=ne(n),V=e=>{const a=t.validateNumber(e);return A&&e===""||a.valid?{...a,valid:!0,errors:void 0}:a},{valid:d,errors:c}=V(s),I=c&&c.length&&!D?c[0]:null;i.useEffect(()=>{q(m(p))},[p,E,f]),i.useEffect(()=>{!u&&!d?b(o,I):b(o,null)},[u,d,T]);const g=e=>{var h,F;const a=e instanceof KeyboardEvent?s:(h=e==null?void 0:e.target)==null?void 0:h.value,y=t.cleanNumStr(a.replaceAll(" ","").replaceAll("|",""));if(q(y),(F=V(y))!=null&&F.valid){const z={...e,target:{...e.target,value:t.stripLeadingZeros(m(y)),name:o}};x(z)}};i.useEffect(()=>{if(r&&(r!=null&&r.current)&&f&&u){const e=r.current;e&&setTimeout(()=>{const{length:a}=m(s);e.setSelectionRange(a,a)},0)}},[u]);const U=e=>{N(!0),j(e)},W=e=>{N(!1),g(e),M(e)},l=f&&!u&&d?w?m(w(s)):t.roundToFixed(s,2):s,Z=!!(l!=null&&l.endsWith("0")),G=E&&l&&!Z&&d?ee(l):l;return S.jsx(J,{handleKeys:[Q.ENTER],onKeyEvent:(e,a)=>g(a),children:S.jsx(Y,{type:"text",name:o,testId:O,disabled:C,placeholder:v,value:G,onChange:g,onFocus:U,onBlur:W,error:I||T,warning:_,right:!L,small:R,width:k,isInTable:P,groupOrder:B,tabIndex:H,tooltip:K,ref:r},o)})};ae.__docgenInfo={description:"",methods:[],displayName:"NumberInput",props:{name:{required:!1,tsType:{name:"union",raw:"string | { fieldName: string }",elements:[{name:"string"},{name:"signature",type:"object",raw:"{ fieldName: string }",signature:{properties:[{key:"fieldName",value:{name:"string",required:!0}}]}}]},description:""},placeholder:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:"''",computed:!1}},disabled:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},error:{required:!1,tsType:{name:"union",raw:"string | boolean",elements:[{name:"string"},{name:"boolean"}]},description:"",defaultValue:{value:"false",computed:!1}},left:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},small:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},width:{required:!1,tsType:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},description:"",defaultValue:{value:"'100%'",computed:!1}},value:{required:!1,tsType:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},description:"",defaultValue:{value:"''",computed:!1}},onChange:{required:!1,tsType:{name:"signature",type:"function",raw:`(
|
|
2
|
+
event: TChangeEvent<T>,
|
|
3
|
+
...additionalProps: { [key: string]: any }[]
|
|
4
|
+
) => void`,signature:{arguments:[{type:{name:"intersection",raw:`ChangeEvent<T> & {
|
|
5
|
+
target:
|
|
6
|
+
| T
|
|
7
|
+
| { name: string; value: any; label?: string; files?: FileList | null };
|
|
8
|
+
}`,elements:[{name:"ChangeEvent",elements:[{name:"T"}],raw:"ChangeEvent<T>"},{name:"signature",type:"object",raw:`{
|
|
9
|
+
target:
|
|
10
|
+
| T
|
|
11
|
+
| { name: string; value: any; label?: string; files?: FileList | null };
|
|
12
|
+
}`,signature:{properties:[{key:"target",value:{name:"union",raw:`| T
|
|
13
|
+
| { name: string; value: any; label?: string; files?: FileList | null }`,elements:[{name:"T"},{name:"signature",type:"object",raw:"{ name: string; value: any; label?: string; files?: FileList | null }",signature:{properties:[{key:"name",value:{name:"string",required:!0}},{key:"value",value:{name:"any",required:!0}},{key:"label",value:{name:"string",required:!1}},{key:"files",value:{name:"union",raw:"FileList | null",elements:[{name:"FileList"},{name:"null"}],required:!1}}]}}],required:!0}}]}}]},name:"event"},{type:{name:"Array",elements:[{name:"signature",type:"object",raw:"{ [key: string]: any }",signature:{properties:[{key:{name:"string"},value:{name:"any",required:!0}}]}}],raw:"{ [key: string]: any }[]"},name:"additionalProps",rest:!0}],return:{name:"void"}}},description:"",defaultValue:{value:"() => {}",computed:!1}},onFocus:{required:!1,tsType:{name:"signature",type:"function",raw:"(evt: FocusEvent<HTMLInputElement>) => void",signature:{arguments:[{type:{name:"FocusEvent",elements:[{name:"HTMLInputElement"}],raw:"FocusEvent<HTMLInputElement>"},name:"evt"}],return:{name:"void"}}},description:"",defaultValue:{value:"() => {}",computed:!1}},onBlur:{required:!1,tsType:{name:"signature",type:"function",raw:"(evt: FocusEvent<HTMLInputElement>) => void",signature:{arguments:[{type:{name:"FocusEvent",elements:[{name:"HTMLInputElement"}],raw:"FocusEvent<HTMLInputElement>"},name:"evt"}],return:{name:"void"}}},description:"",defaultValue:{value:"() => {}",computed:!1}},tabIndex:{required:!1,tsType:{name:"number"},description:"",defaultValue:{value:"0",computed:!1}},testId:{required:!1,tsType:{name:"string"},description:""},tooltip:{required:!1,tsType:{name:"union",raw:"TStringOrNumber | React.ReactNode",elements:[{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},{name:"ReactReactNode",raw:"React.ReactNode"}]},description:"",defaultValue:{value:"null",computed:!1}},warning:{required:!1,tsType:{name:"union",raw:"string | boolean",elements:[{name:"string"},{name:"boolean"}]},description:"",defaultValue:{value:"false",computed:!1}},validationCallback:{required:!1,tsType:{name:"signature",type:"function",raw:`(
|
|
14
|
+
name: string | { fieldName: string },
|
|
15
|
+
error: string | null,
|
|
16
|
+
) => void`,signature:{arguments:[{type:{name:"union",raw:"string | { fieldName: string }",elements:[{name:"string"},{name:"signature",type:"object",raw:"{ fieldName: string }",signature:{properties:[{key:"fieldName",value:{name:"string",required:!0}}]}}]},name:"name"},{type:{name:"union",raw:"string | null",elements:[{name:"string"},{name:"null"}]},name:"error"}],return:{name:"void"}}},description:"",defaultValue:{value:"() => {}",computed:!1}},allowEmpty:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},isInTable:{required:!1,tsType:{name:"boolean"},description:""},groupOrder:{required:!1,tsType:{name:"any"},description:""},enableCosmeticRounding:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},enableDisplayRounding:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},roundDisplayValue:{required:!1,tsType:{name:"signature",type:"function",raw:"(args: TStringOrNumber) => TStringOrNumber",signature:{arguments:[{type:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},name:"args"}],return:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]}}},description:""},disableInternalErrorValidationMessages:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}}}};export{ae as N,ee as r};
|
|
@@ -0,0 +1,166 @@
|
|
|
1
|
+
import{j as r}from"./jsx-runtime-eps93zm2.js";import{r as c}from"./index-DhsZuJvc.js";import{w as d,u as t,e as o,f as j,a as M}from"./index-DMAnyMX5.js";import{d as We}from"./index-C0x1JmaP.js";import{S as N}from"./spacer-BWoNR27H.js";import{G as He}from"./grid-DRkC-bt8.js";import{C as g}from"./card-EcjmryU9.js";import{B as Fe}from"./button-DHevvVBE.js";import{H as m}from"./heading-CRNoBc7q.js";import{I as Oe}from"./input-group-addon-D68iUKV2.js";import{S as Pe}from"./select-DnRuRG_N.js";import{I as Ue}from"./input-group-BaRSJAEN.js";import{F}from"./field-HrLaMLbx.js";import{T as L}from"./toggle-BbFVf61v.js";import{T as qe}from"./text-B3-TSWok.js";import{M as Ke}from"./message-Y48EomV-.js";import{N as i}from"./number-input-F3bqJ0z5.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"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./inheritsLoose-DP0QEDDI.js";import"./index-CEuq6vkz.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";import"./help-icon-Buhx5nl6.js";import"./lodash-c4VUpsOs.js";import"./types-Dx2TtIG9.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"./input-DTXbDJaL.js";const{useArgs:Ye}=__STORYBOOK_MODULE_PREVIEW_API__,Ma={title:"Forms/NumberInput",component:i,parameters:{canvas:{page:null}},args:{label:"Label"}},l=n=>{const[s,a]=Ye(),u=e=>{a({value:e.target.value})};return r.jsx(i,{onChange:u,value:123,...n})},A=l.bind({}),b=l.bind({});b.args={small:!0};const C=l.bind({});C.args={width:"150px"};const w=l.bind({});w.args={left:!0};const T=l.bind({});T.args={disabled:!0};const f=l.bind({});f.args={allowEmpty:!0,value:""};const h=()=>{const[n,s]=c.useState("123|m");return r.jsx(i,{name:"example",onChange:a=>s(a.target.value),placeholder:"Type a value...",value:n,testId:"testId"})};h.play=async({canvasElement:n,step:s})=>{const a=d(n),u=d(n.ownerDocument.body);await s("Shows validation error for non-numeric input",async()=>{const e=a.getByTestId("testId");await t.clear(e),await t.type(e,"123x45s6"),await t.click(n),await o(a.getByDisplayValue("123x45s6")).toBeInTheDocument(),await j.mouseOver(e),await M(()=>{o(u.getByText("Must be a numerical value")).toBeInTheDocument()})})};const x=l.bind({});x.args={warning:"This input number is almost 100!",value:"99"};const B=l.bind({});B.args={error:"This is a error message"};const D=l.bind({});D.args={value:"123test"};const S=l.bind({});S.args={value:"123.123456789",enableDisplayRounding:!0};const E=l.bind({});E.args={value:"123.123456789",enableDisplayRounding:!0,roundDisplayValue:n=>We.roundToFixed(n,4)};const V=()=>r.jsxs(Ue,{small:!0,children:[r.jsx(i,{value:123}),r.jsx(Oe,{children:"to"}),r.jsx(i,{value:123}),r.jsx(Pe,{options:[{value:"units",label:"units"}],width:"auto",value:"units"})]}),v=()=>{const[n,s]=c.useState("123");return r.jsx(i,{value:n,onChange:a=>{s(a.target.value)},testId:"testId",enableDisplayRounding:!0})};v.play=async({canvasElement:n,step:s})=>{const a=d(n);await s("Value should be rounded on blur",async()=>{const u=a.getByTestId("testId");await t.clear(u),await t.type(u,"123.123456789"),await t.click(n),await o(a.getByDisplayValue("123.12")).toBeInTheDocument()}),await s("Full value shown on focus",async()=>{const u=a.getByTestId("testId");await t.click(u),await o(a.getByDisplayValue("123.123456789")).toBeInTheDocument()})};const k=()=>{const[n,s]=c.useState("123");return r.jsxs(He,{columns:"1fr 1fr",gap:!0,children:[r.jsxs(g,{heading:r.jsx(m,{children:"Storage State (Redux)"}),children:[n,r.jsx(N,{}),r.jsx(Fe,{label:"Change value",onClick:()=>s(String(Math.floor(Math.random()*100)))})]}),r.jsx(g,{heading:r.jsx(m,{children:"NumberInput"}),children:r.jsx(i,{value:n,onChange:a=>{s(a.target.value)},error:Number(n)>=0?"":"Value must be positive"})})]})},y=()=>{const[n,s]=c.useState(!1),[a,u]=c.useState(!0),[e,_]=c.useState("0.6889763779527558"),[H,Le]=c.useState(""),Ge=Number(e)*.3048;return r.jsxs(He,{columns:"1fr 1fr",gap:!0,children:[r.jsxs(g,{heading:r.jsx(m,{children:"Settings"}),children:[r.jsx(F,{label:"Enable display rounding:",labelLeft:!0,labelWidth:200,children:r.jsx(L,{checked:n,onChange:p=>s(p.target.checked)})}),r.jsx(F,{label:"Enable cosmetic rounding:",labelLeft:!0,labelWidth:200,children:r.jsx(L,{checked:a,onChange:p=>u(p.target.checked)})})]}),r.jsxs(g,{heading:r.jsx(m,{children:"NumberInput (displayed in Meters)"}),children:[r.jsx(qe,{faint:!0,children:"Cosmetic Rounding Test Cases: type 0.21 then return (compare with enableCosmeticRounding on and off)"}),r.jsx(N,{}),r.jsx(i,{name:"Example",value:Ge,onChange:p=>{const R=String(Number(p.target.value)/.3048);_(R)},enableDisplayRounding:n,enableCosmeticRounding:a,error:Number(e)>=0?"":"Value must be positive",validationCallback:(p,R)=>{Le(R??"")},testId:"testId"})]}),r.jsxs(g,{heading:r.jsx(m,{children:"Storage State / Redux (stored in Feet)"}),children:[e,r.jsx(N,{}),r.jsx(Fe,{label:"Change value",onClick:()=>_(String(Math.floor(Math.random()*100)))})]}),r.jsx(g,{heading:r.jsx(m,{children:"Test Validation Callback"}),children:H&&r.jsx(Ke,{message:{content:H,icon:!0,type:"Error",visible:!0}})})]})};y.play=async({canvasElement:n,step:s})=>{const a=d(n),u=d(n.ownerDocument.body);await s("Can enter decimal values",async()=>{const e=a.getByTestId("testId");await t.clear(e),await t.type(e,"123.123456789"),await t.click(n),await o(a.getByDisplayValue("123.123456789")).toBeInTheDocument()}),await s("Cannot enter scientific notation when storage unit is different (expected)",async()=>{const e=a.getByTestId("testId");await t.clear(e),await t.type(e,"-1.12e3"),await t.click(n),await o(a.getByDisplayValue("-1120")).toBeInTheDocument()}),await s("Can enter comma decimals (converts to dot)",async()=>{const e=a.getByTestId("testId");await t.clear(e),await t.type(e,"123,456"),await t.click(n),await o(a.getByDisplayValue("123.456")).toBeInTheDocument()}),await s("Can enter small numbers",async()=>{const e=a.getByTestId("testId");await t.clear(e),await t.type(e,"0.0000000023"),await t.click(n),await o(a.getByDisplayValue("0.0000000023")).toBeInTheDocument()}),await s("Can enter large numbers",async()=>{const e=a.getByTestId("testId");await t.clear(e),await t.type(e,"999999999999"),await t.click(n),await o(a.getByDisplayValue("999999999999")).toBeInTheDocument()}),await s("Shows validation error for non-numeric input",async()=>{const e=a.getByTestId("testId");await t.clear(e),await t.type(e,"123x45s6"),await t.click(n),await o(a.getByDisplayValue("123x45s6")).toBeInTheDocument(),await j.mouseOver(e),await M(()=>{o(u.getAllByText("Must be a numerical value").length).toEqual(2)})})};const I=()=>{const[n,s]=c.useState("123");return r.jsx(i,{value:n,onChange:a=>{s(a.target.value)},testId:"testId"})};I.play=async({canvasElement:n,step:s})=>{const a=d(n),u=d(n.ownerDocument.body);await s("Can enter decimal values",async()=>{const e=a.getByTestId("testId");await t.clear(e),await t.type(e,"123.123456789"),await t.click(n),await o(a.getByDisplayValue("123.123456789")).toBeInTheDocument()}),await s("Can enter scientific notation",async()=>{const e=a.getByTestId("testId");await t.clear(e),await t.type(e,"-1.12e3"),await t.click(n),await o(a.getByDisplayValue("-1.12e3")).toBeInTheDocument()}),await s("Can enter comma decimals (converts to dot)",async()=>{const e=a.getByTestId("testId");await t.clear(e),await t.type(e,"123,456"),await t.click(n),await o(a.getByDisplayValue("123.456")).toBeInTheDocument()}),await s("Can enter small numbers",async()=>{const e=a.getByTestId("testId");await t.clear(e),await t.type(e,"0.0000000023"),await t.click(n),await o(a.getByDisplayValue("0.0000000023")).toBeInTheDocument()}),await s("Can enter large numbers",async()=>{const e=a.getByTestId("testId");await t.clear(e),await t.type(e,"999999999999"),await t.click(n),await o(a.getByDisplayValue("999999999999")).toBeInTheDocument()}),await s("Shows validation error for non-numeric input",async()=>{const e=a.getByTestId("testId");await t.clear(e),await t.type(e,"123x45s6"),await t.click(n),await o(a.getByDisplayValue("123x45s6")).toBeInTheDocument(),await j.mouseOver(e),await M(()=>{o(u.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"};V.__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"};k.__docgenInfo={description:"",methods:[],displayName:"ManagedTestCase"};y.__docgenInfo={description:"",methods:[{name:"play",docblock:null,modifiers:["static"],params:[{name:"{ canvasElement, step }",optional:!1,type:null}],returns:null}],displayName:"DemoCosmeticRounding"};I.__docgenInfo={description:"",methods:[{name:"play",docblock:null,modifiers:["static"],params:[{name:"{ canvasElement, step }",optional:!1,type:null}],returns:null}],displayName:"TestUserInput"};var G,W,O;A.parameters={...A.parameters,docs:{...(G=A.parameters)==null?void 0:G.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
|
+
}`,...(O=(W=A.parameters)==null?void 0:W.docs)==null?void 0:O.source}}};var P,U,q;b.parameters={...b.parameters,docs:{...(P=b.parameters)==null?void 0:P.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
|
+
}`,...(q=(U=b.parameters)==null?void 0:U.docs)==null?void 0:q.source}}};var K,Y,z;C.parameters={...C.parameters,docs:{...(K=C.parameters)==null?void 0:K.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
|
+
}`,...(z=(Y=C.parameters)==null?void 0:Y.docs)==null?void 0:z.source}}};var J,Q,X;w.parameters={...w.parameters,docs:{...(J=w.parameters)==null?void 0:J.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
|
+
}`,...(X=(Q=w.parameters)==null?void 0:Q.docs)==null?void 0:X.source}}};var Z,$,ee;T.parameters={...T.parameters,docs:{...(Z=T.parameters)==null?void 0:Z.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
|
+
}`,...(ee=($=T.parameters)==null?void 0:$.docs)==null?void 0:ee.source}}};var ae,te,ne;f.parameters={...f.parameters,docs:{...(ae=f.parameters)==null?void 0:ae.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
|
+
}`,...(ne=(te=f.parameters)==null?void 0:te.docs)==null?void 0:ne.source}}};var re,se,oe;h.parameters={...h.parameters,docs:{...(re=h.parameters)==null?void 0:re.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
|
+
}`,...(oe=(se=h.parameters)==null?void 0:se.docs)==null?void 0:oe.source}}};var ue,le,ie;x.parameters={...x.parameters,docs:{...(ue=x.parameters)==null?void 0:ue.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
|
+
}`,...(ie=(le=x.parameters)==null?void 0:le.docs)==null?void 0:ie.source}}};var ce,de,pe;B.parameters={...B.parameters,docs:{...(ce=B.parameters)==null?void 0:ce.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
|
+
}`,...(pe=(de=B.parameters)==null?void 0:de.docs)==null?void 0:pe.source}}};var ge,me,he;D.parameters={...D.parameters,docs:{...(ge=D.parameters)==null?void 0:ge.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
|
+
}`,...(he=(me=D.parameters)==null?void 0:me.docs)==null?void 0:he.source}}};var ve,ye,Ie;S.parameters={...S.parameters,docs:{...(ve=S.parameters)==null?void 0:ve.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
|
+
}`,...(Ie=(ye=S.parameters)==null?void 0:ye.docs)==null?void 0:Ie.source}}};var be,Ce,we;E.parameters={...E.parameters,docs:{...(be=E.parameters)==null?void 0:be.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
|
+
}`,...(we=(Ce=E.parameters)==null?void 0:Ce.docs)==null?void 0:we.source}}};var Te,fe,xe;V.parameters={...V.parameters,docs:{...(Te=V.parameters)==null?void 0:Te.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>`,...(xe=(fe=V.parameters)==null?void 0:fe.docs)==null?void 0:xe.source}}};var Be,De,Se;v.parameters={...v.parameters,docs:{...(Be=v.parameters)==null?void 0:Be.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
|
+
}`,...(Se=(De=v.parameters)==null?void 0:De.docs)==null?void 0:Se.source}}};var Ee,Ve,ke;k.parameters={...k.parameters,docs:{...(Ee=k.parameters)==null?void 0:Ee.docs,source:{originalSource:`() => {
|
|
106
|
+
const [value, setValue] = useState('123');
|
|
107
|
+
return <Grid columns="1fr 1fr" gap>
|
|
108
|
+
<Card heading={<Heading>Storage State (Redux)</Heading>}>
|
|
109
|
+
{value}
|
|
110
|
+
<Spacer />
|
|
111
|
+
<Button label="Change value" onClick={() => setValue(String(Math.floor(Math.random() * 100)))} />
|
|
112
|
+
</Card>
|
|
113
|
+
<Card heading={<Heading>NumberInput</Heading>}>
|
|
114
|
+
<NumberInput value={value} onChange={evt => {
|
|
115
|
+
setValue(evt.target.value);
|
|
116
|
+
}} error={Number(value) >= 0 ? '' : 'Value must be positive'} />
|
|
117
|
+
</Card>
|
|
118
|
+
</Grid>;
|
|
119
|
+
}`,...(ke=(Ve=k.parameters)==null?void 0:Ve.docs)==null?void 0:ke.source}}};var Ae,Re,Ne;y.parameters={...y.parameters,docs:{...(Ae=y.parameters)==null?void 0:Ae.docs,source:{originalSource:`() => {
|
|
120
|
+
const [enableDisplayRounding, setEnableDisplayRounding] = useState(false);
|
|
121
|
+
const [enableCosmeticRounding, setEnableCosmeticRounding] = useState(true);
|
|
122
|
+
const [valueInFeet, setValueInFeet] = useState('0.6889763779527558');
|
|
123
|
+
const [callBackError, setCallBackError] = useState('');
|
|
124
|
+
const valueInMeters = Number(valueInFeet) * 0.3048;
|
|
125
|
+
return <Grid columns="1fr 1fr" gap>
|
|
126
|
+
<Card heading={<Heading>Settings</Heading>}>
|
|
127
|
+
<Field label="Enable display rounding:" labelLeft labelWidth={200}>
|
|
128
|
+
<Toggle checked={enableDisplayRounding} onChange={evt => setEnableDisplayRounding(evt.target.checked)} />
|
|
129
|
+
</Field>
|
|
130
|
+
<Field label="Enable cosmetic rounding:" labelLeft labelWidth={200}>
|
|
131
|
+
<Toggle checked={enableCosmeticRounding} onChange={evt => setEnableCosmeticRounding(evt.target.checked)} />
|
|
132
|
+
</Field>
|
|
133
|
+
</Card>
|
|
134
|
+
<Card heading={<Heading>NumberInput (displayed in Meters)</Heading>}>
|
|
135
|
+
<Text faint>
|
|
136
|
+
Cosmetic Rounding Test Cases: type 0.21 then return (compare with
|
|
137
|
+
enableCosmeticRounding on and off)
|
|
138
|
+
</Text>
|
|
139
|
+
<Spacer />
|
|
140
|
+
<NumberInput name="Example" value={valueInMeters} onChange={evt => {
|
|
141
|
+
const nextValueInFeet = String(Number(evt.target.value) / 0.3048);
|
|
142
|
+
setValueInFeet(nextValueInFeet); // convert back to ft
|
|
143
|
+
}} enableDisplayRounding={enableDisplayRounding} enableCosmeticRounding={enableCosmeticRounding} error={Number(valueInFeet) >= 0 ? '' : 'Value must be positive'} validationCallback={(name, error) => {
|
|
144
|
+
setCallBackError(error ?? '');
|
|
145
|
+
}} testId="testId" />
|
|
146
|
+
</Card>
|
|
147
|
+
<Card heading={<Heading>Storage State / Redux (stored in Feet)</Heading>}>
|
|
148
|
+
{valueInFeet}
|
|
149
|
+
<Spacer />
|
|
150
|
+
<Button label="Change value" onClick={() => setValueInFeet(String(Math.floor(Math.random() * 100)))} />
|
|
151
|
+
</Card>
|
|
152
|
+
<Card heading={<Heading>Test Validation Callback</Heading>}>
|
|
153
|
+
{callBackError && <Message message={{
|
|
154
|
+
content: callBackError,
|
|
155
|
+
icon: true,
|
|
156
|
+
type: 'Error',
|
|
157
|
+
visible: true
|
|
158
|
+
}} />}
|
|
159
|
+
</Card>
|
|
160
|
+
</Grid>;
|
|
161
|
+
}`,...(Ne=(Re=y.parameters)==null?void 0:Re.docs)==null?void 0:Ne.source}}};var je,Me,_e;I.parameters={...I.parameters,docs:{...(je=I.parameters)==null?void 0:je.docs,source:{originalSource:`() => {
|
|
162
|
+
const [value, setValue] = useState('123');
|
|
163
|
+
return <NumberInput value={value} onChange={evt => {
|
|
164
|
+
setValue(evt.target.value);
|
|
165
|
+
}} testId="testId" />;
|
|
166
|
+
}`,...(_e=(Me=I.parameters)==null?void 0:Me.docs)==null?void 0:_e.source}}};const _a=["Default","Small","Width","Left","Disabled","AllowEmpty","Placeholder","Warning","Error","BadInput","WithDisplayRounding","WithCustomDisplayRounding","TestInputGroup","TestDisplayRounding","ManagedTestCase","DemoCosmeticRounding","TestUserInput"];export{f as AllowEmpty,D as BadInput,A as Default,y as DemoCosmeticRounding,T as Disabled,B as Error,w as Left,k as ManagedTestCase,h as Placeholder,b as Small,v as TestDisplayRounding,V as TestInputGroup,I as TestUserInput,x as Warning,C as Width,E as WithCustomDisplayRounding,S as WithDisplayRounding,_a as __namedExportsOrder,Ma as default};
|
package/dist/storybook/assets/{padding-and-spacing-B10oZ-Ww.js → padding-and-spacing-B-LaxRb4.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-eps93zm2.js";import{useMDXComponents as r}from"./index-BcNHZKhG.js";import{Z as t}from"./index-
|
|
1
|
+
import{j as e}from"./jsx-runtime-eps93zm2.js";import{useMDXComponents as r}from"./index-BcNHZKhG.js";import{Z as t}from"./index-Bhtru3gK.js";import"./index-DhsZuJvc.js";import"./iframe-NUuxNiwO.js";import"../sb-preview/runtime.js";import"./index-CUZDtIZe.js";import"./inheritsLoose-DP0QEDDI.js";import"./assertThisInitialized-B9jnkVVz.js";import"./index-D6rZ4wEC.js";function i(s){const n={code:"code",h1:"h1",h2:"h2",li:"li",p:"p",strong:"strong",ul:"ul",...r(),...s.components};return e.jsxs(e.Fragment,{children:[e.jsx(t,{title:"Padding, Margin & Size"}),`
|
|
2
2
|
`,e.jsx(n.h1,{id:"padding-margin--size",children:"Padding, Margin & Size"}),`
|
|
3
3
|
`,e.jsx(n.h2,{id:"padding--margin",children:"Padding & Margin"}),`
|
|
4
4
|
`,e.jsx(n.p,{children:"There are standard CSS spacing variables for padding and margin."}),`
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{j as o}from"./jsx-runtime-eps93zm2.js";import{r as b}from"./index-DhsZuJvc.js";import{I as l}from"./common-types-Sih75Sav.js";import{S as C}from"./select-
|
|
1
|
+
import{j as o}from"./jsx-runtime-eps93zm2.js";import{r as b}from"./index-DhsZuJvc.js";import{I as l}from"./common-types-Sih75Sav.js";import{S as C}from"./select-DnRuRG_N.js";import{I}from"./input-DTXbDJaL.js";import{B as p}from"./button-DHevvVBE.js";import{I as N}from"./input-group-BaRSJAEN.js";import{I as j}from"./input-group-addon-D68iUKV2.js";const E=(n,i)=>i||n&&n.reduce((e,t)=>t.selected?Number(t.value):e,10)||10,_=(n,i)=>{if(!i||!n)return 10;const{options:e,value:t}=i,a=Number(t);return a===0?1:Math.ceil(n/E(e,a))},S=(n,i,e="Selected page must be a positive whole number between 1 and")=>{const t=`${e} ${i}`,a={valid:!0,error:null};return n===""?a:!n.match(/^\d+$/g)||parseInt(n)<=0||parseInt(n)>i?{valid:!1,error:t}:a},P="_paginationContainer_1tmz4_1",R={paginationContainer:P},T=({pagination:n})=>{const{rowCount:i,selectedPage:e,small:t,onSelectPage:a,rowsPerPage:r,errorMessageTemplate:g,testIds:m}=n,d=Number(r==null?void 0:r.value)===0,u=_(i,r),[f,h]=b.useState(String(e));b.useEffect(()=>{h(String(e))},[e]);const{error:v}=S(f,u,g),c=s=>{const{valid:x}=S(s,u,g);h(s),x&&s!==""&&a&&a(Number(s))};return o.jsxs("div",{className:R.paginationContainer,children:[r&&o.jsx("div",{style:{flexShrink:0},children:o.jsx(C,{onChange:s=>{r.onChange&&r.onChange(s),c(String(1))},options:r.options,native:!!r.options,small:t,width:"auto",value:r.value})}),o.jsx(p,{small:t,round:!0,basic:!0,icon:l.CHEVRON_DOUBLE_LEFT,onClick:()=>c(String(1)),disabled:d||e===1}),o.jsx(p,{small:t,round:!0,basic:!0,icon:l.CHEVRON_LEFT,onClick:()=>c(String(Number(e)-1)),disabled:d||e===1}),o.jsxs(N,{small:t,width:"auto",children:[o.jsx(I,{right:!0,value:f,placeholder:String(e),onChange:s=>c(s.target.value),width:"50px",disabled:d||u<=1,error:v}),o.jsxs(j,{children:["of ",u]})]}),o.jsx(p,{small:t,round:!0,basic:!0,icon:l.CHEVRON_RIGHT,onClick:()=>c(String(Number(e)+1)),disabled:d||e===u}),o.jsx(p,{small:t,round:!0,basic:!0,icon:l.CHEVRON_DOUBLE_RIGHT,onClick:()=>c(String(u)),disabled:d||e===u,testId:m==null?void 0:m.doubleRightBtn})]})};T.__docgenInfo={description:"",methods:[],displayName:"Pagination",props:{pagination:{required:!0,tsType:{name:"IPagination"},description:""}}};export{T as P};
|
package/dist/storybook/assets/{pagination.stories-B5cOvzik.js → pagination.stories-CTRM0Xou.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as p}from"./jsx-runtime-eps93zm2.js";import{r as l}from"./index-DhsZuJvc.js";import{P as g}from"./pagination-
|
|
1
|
+
import{j as p}from"./jsx-runtime-eps93zm2.js";import{r as l}from"./index-DhsZuJvc.js";import{P as g}from"./pagination-CLt-kUlx.js";import"./common-types-Sih75Sav.js";import"./select-DnRuRG_N.js";import"./lodash-c4VUpsOs.js";import"./index-Bk2sglWO.js";import"./disabled-context-rmpd7YJS.js";import"./types-Dx2TtIG9.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";import"./index-CEuq6vkz.js";import"./inheritsLoose-DP0QEDDI.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"./button-DHevvVBE.js";import"./spinner-AWUe4xwQ.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./badge-CLQ59MDF.js";import"./select.input-D0UkAPd9.js";import"./input-DTXbDJaL.js";import"./input-group-BaRSJAEN.js";import"./input-group-addon-D68iUKV2.js";const h={rowCount:500,selectedPage:1,onSelectPage:()=>{}},V={title:"Basic/Pagination",component:g,args:{pagination:h}},n=()=>{const[a,t]=l.useState(1);return p.jsx(g,{pagination:{rowCount:500,selectedPage:a,onSelectPage:o=>t(o)}})},r=()=>{const[a,t]=l.useState(1),[o,i]=l.useState(20);return p.jsx(g,{pagination:{rowCount:500,selectedPage:a,rowsPerPage:{onChange:e=>i(Number(e.target.value)),options:[{label:"10 / page",value:10},{label:"20 / page",value:20},{label:"50 / page",value:50},{label:"Show all",value:0}],value:o},onSelectPage:e=>t(e)}})},s=()=>{const[a,t]=l.useState(1),[o,i]=l.useState(20);return p.jsx(g,{pagination:{small:!0,rowCount:500,selectedPage:a,rowsPerPage:{onChange:e=>i(Number(e.target.value)),options:[{label:"10 / page",value:10},{label:"20 / page",value:20},{label:"50 / page",value:50},{label:"Show all",value:0}],value:o},onSelectPage:e=>t(e)}})};n.__docgenInfo={description:"",methods:[],displayName:"Default"};r.__docgenInfo={description:"",methods:[],displayName:"RowsPerPage"};s.__docgenInfo={description:"",methods:[],displayName:"Small"};var P,c,u;n.parameters={...n.parameters,docs:{...(P=n.parameters)==null?void 0:P.docs,source:{originalSource:`() => {
|
|
2
2
|
const [selectedPage, setSelectedPage] = useState(1);
|
|
3
3
|
return <Pagination pagination={{
|
|
4
4
|
rowCount: 500,
|
|
@@ -56,4 +56,4 @@ import{j as p}from"./jsx-runtime-eps93zm2.js";import{r as l}from"./index-DhsZuJv
|
|
|
56
56
|
},
|
|
57
57
|
onSelectPage: evt => setSelectedPage(evt)
|
|
58
58
|
}} />;
|
|
59
|
-
}`,...(b=(w=s.parameters)==null?void 0:w.docs)==null?void 0:b.source}}};const
|
|
59
|
+
}`,...(b=(w=s.parameters)==null?void 0:w.docs)==null?void 0:b.source}}};const W=["Default","RowsPerPage","Small"];export{n as Default,r as RowsPerPage,s as Small,W as __namedExportsOrder,V as default};
|
|
@@ -0,0 +1,10 @@
|
|
|
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};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["./DocsRenderer-PKQXORMH-
|
|
2
|
-
import{_ as a}from"./iframe-
|
|
1
|
+
const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["./DocsRenderer-PKQXORMH-Dio4TQT6.js","./chunk-HLWAVYOI-SLqzrZ8s.js","./iframe-NUuxNiwO.js","./index-DhsZuJvc.js","./react-16-DXAfArL2.js","./index-CUZDtIZe.js","./index-Bhtru3gK.js","./inheritsLoose-DP0QEDDI.js","./assertThisInitialized-B9jnkVVz.js","./index-D6rZ4wEC.js"])))=>i.map(i=>d[i]);
|
|
2
|
+
import{_ as a}from"./iframe-NUuxNiwO.js";import"../sb-preview/runtime.js";const{global:s}=__STORYBOOK_MODULE_GLOBAL__;var _=Object.entries(s.TAGS_OPTIONS??{}).reduce((e,r)=>{let[t,o]=r;return o.excludeFromDocsStories&&(e[t]=!0),e},{}),d={docs:{renderer:async()=>{let{DocsRenderer:e}=await a(()=>import("./DocsRenderer-PKQXORMH-Dio4TQT6.js"),__vite__mapDeps([0,1,2,3,4,5,6,7,8,9]),import.meta.url);return new e},stories:{filter:e=>{var r;return(e.tags||[]).filter(t=>_[t]).length===0&&!((r=e.parameters.docs)!=null&&r.disable)}}}};export{d as parameters};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import{j as s}from"./jsx-runtime-eps93zm2.js";import{r as P,R as C}from"./index-DhsZuJvc.js";import{T as I}from"./toaster-7wnI6hqB.js";import"./message-Y48EomV-.js";import{a4 as d,a5 as M}from"./index-
|
|
1
|
+
import{j as s}from"./jsx-runtime-eps93zm2.js";import{r as P,R as C}from"./index-DhsZuJvc.js";import{T as I}from"./toaster-7wnI6hqB.js";import"./message-Y48EomV-.js";import{a4 as d,a5 as M}from"./index-Bhtru3gK.js";import{e as _}from"./index-DRSy5Ssd.js";import"./chunk-HLWAVYOI-SLqzrZ8s.js";import"./index-CUZDtIZe.js";import"./index-Bk2sglWO.js";import"./common-types-Sih75Sav.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./inheritsLoose-DP0QEDDI.js";import"./index-CEuq6vkz.js";import"./disabled-context-rmpd7YJS.js";import"./iframe-NUuxNiwO.js";import"../sb-preview/runtime.js";import"./assertThisInitialized-B9jnkVVz.js";import"./index-D6rZ4wEC.js";import"./react-16-DXAfArL2.js";var v="DARK_MODE";function f(r){"@babel/helpers - typeof";return f=typeof Symbol=="function"&&typeof Symbol.iterator=="symbol"?function(t){return typeof t}:function(t){return t&&typeof Symbol=="function"&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},f(r)}var b;function A(r,t){var e=Object.keys(r);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(r);t&&(n=n.filter(function(a){return Object.getOwnPropertyDescriptor(r,a).enumerable})),e.push.apply(e,n)}return e}function k(r){for(var t=1;t<arguments.length;t++){var e=arguments[t]!=null?arguments[t]:{};t%2?A(Object(e),!0).forEach(function(n){R(r,n,e[n])}):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(e)):A(Object(e)).forEach(function(n){Object.defineProperty(r,n,Object.getOwnPropertyDescriptor(e,n))})}return r}function R(r,t,e){return t=x(t),t in r?Object.defineProperty(r,t,{value:e,enumerable:!0,configurable:!0,writable:!0}):r[t]=e,r}function x(r){var t=K(r,"string");return f(t)==="symbol"?t:String(t)}function K(r,t){if(f(r)!=="object"||r===null)return r;var e=r[Symbol.toPrimitive];if(e!==void 0){var n=e.call(r,t||"default");if(f(n)!=="object")return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return(t==="string"?String:Number)(r)}function p(r){return B(r)||U(r)||L(r)||N()}function N(){throw new TypeError(`Invalid attempt to spread non-iterable instance.
|
|
2
2
|
In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}function L(r,t){if(r){if(typeof r=="string")return h(r,t);var e=Object.prototype.toString.call(r).slice(8,-1);if(e==="Object"&&r.constructor&&(e=r.constructor.name),e==="Map"||e==="Set")return Array.from(r);if(e==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e))return h(r,t)}}function U(r){if(typeof Symbol<"u"&&r[Symbol.iterator]!=null||r["@@iterator"]!=null)return Array.from(r)}function B(r){if(Array.isArray(r))return h(r)}function h(r,t){(t==null||t>r.length)&&(t=r.length);for(var e=0,n=new Array(t);e<t;e++)n[e]=r[e];return n}const{global:Y}=__STORYBOOK_MODULE_GLOBAL__;__STORYBOOK_MODULE_CORE_EVENTS__;var T=Y,$=T.document,g=T.window,j="sb-addon-themes-3";(b=g.matchMedia)===null||b===void 0||b.call(g,"(prefers-color-scheme: dark)");var O={classTarget:"body",dark:d.dark,darkClass:["dark"],light:d.light,lightClass:["light"],stylePreview:!1,userHasExplicitlySetTheTheme:!1},E=function(t){g.localStorage.setItem(j,JSON.stringify(t))},H=function(t,e){var n=e.current,a=e.darkClass,l=a===void 0?O.darkClass:a,o=e.lightClass,i=o===void 0?O.lightClass:o;if(n==="dark"){var u,c;(u=t.classList).remove.apply(u,p(y(i))),(c=t.classList).add.apply(c,p(y(l)))}else{var m,S;(m=t.classList).remove.apply(m,p(y(l))),(S=t.classList).add.apply(S,p(y(i)))}},y=function(t){var e=[];return e.concat(t).map(function(n){return n})},V=function(t){var e=$.querySelector(t.classTarget);e&&H(e,t)},D=function(){var t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{},e=g.localStorage.getItem(j);if(typeof e=="string"){var n=JSON.parse(e);return t&&(t.dark&&!_(n.dark,t.dark)&&(n.dark=t.dark,E(n)),t.light&&!_(n.light,t.light)&&(n.light=t.light,E(n))),n}return k(k({},O),t)};V(D());function W(r,t){return F(r)||J(r,t)||G(r,t)||q()}function q(){throw new TypeError(`Invalid attempt to destructure non-iterable instance.
|
|
3
3
|
In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}function G(r,t){if(r){if(typeof r=="string")return w(r,t);var e=Object.prototype.toString.call(r).slice(8,-1);if(e==="Object"&&r.constructor&&(e=r.constructor.name),e==="Map"||e==="Set")return Array.from(r);if(e==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e))return w(r,t)}}function w(r,t){(t==null||t>r.length)&&(t=r.length);for(var e=0,n=new Array(t);e<t;e++)n[e]=r[e];return n}function J(r,t){var e=r==null?null:typeof Symbol<"u"&&r[Symbol.iterator]||r["@@iterator"];if(e!=null){var n,a,l,o,i=[],u=!0,c=!1;try{if(l=(e=e.call(r)).next,t!==0)for(;!(u=(n=l.call(e)).done)&&(i.push(n.value),i.length!==t);u=!0);}catch(m){c=!0,a=m}finally{try{if(!u&&e.return!=null&&(o=e.return(),Object(o)!==o))return}finally{if(c)throw a}}return i}}function F(r){if(Array.isArray(r))return r}const{addons:z,useState:Q,useEffect:X}=__STORYBOOK_MODULE_PREVIEW_API__;function Z(){var r=Q(D().current==="dark"),t=W(r,2),e=t[0],n=t[1];return X(function(){var a=z.getChannel();return a.on(v,n),function(){return a.off(v,n)}},[]),e}const Or=[r=>s.jsxs(s.Fragment,{children:[s.jsx(r,{}),s.jsx(I,{})]}),r=>{const t=Z();return P.useEffect(()=>document.documentElement.dataset.theme=t?"dark":"default",[t]),s.jsx(r,{})}],Sr={docs:{container:r=>{const[t,e]=C.useState(!1);r.context.channel.on(v,a=>e(a));const n={...r};return n.theme=t?d.dark:d.light,s.jsx(M,{...n})}},darkMode:{current:"light",stylePreview:!0}},_r=["autodocs"];export{Or as decorators,Sr as parameters,_r as tags};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-eps93zm2.js";import"./index-DhsZuJvc.js";import{T as n}from"./top-bar-DkXSzzqt.js";import{L as r}from"./list-bKpz6I9Q.js";import{P as p}from"./page-7SSpdYhb.js";import{R as c,C as o}from"./row-Bmiy2Lh0.js";import{T as d}from"./tabs-
|
|
1
|
+
import{j as e}from"./jsx-runtime-eps93zm2.js";import"./index-DhsZuJvc.js";import{T as n}from"./top-bar-DkXSzzqt.js";import{L as r}from"./list-bKpz6I9Q.js";import{P as p}from"./page-7SSpdYhb.js";import{R as c,C as o}from"./row-Bmiy2Lh0.js";import{T as d}from"./tabs-C3NG6m9W.js";import{S as u}from"./spacer-BWoNR27H.js";import"./index-Bk2sglWO.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./inheritsLoose-DP0QEDDI.js";import"./index-CEuq6vkz.js";import"./disabled-context-rmpd7YJS.js";import"./common-types-Sih75Sav.js";import"./button-DHevvVBE.js";import"./spinner-AWUe4xwQ.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";import"./actions-D-uVCDzk.js";import"./lodash-c4VUpsOs.js";import"./types-BmbYqTX_.js";import"./types-Dx2TtIG9.js";import"./badge-CLQ59MDF.js";import"./index.es-DazXb-ul.js";import"./redux-tRgGMjwY.js";import"./objectSpread2-DW4nTBoq.js";import"./tiny-invariant-DqLgxztJ.js";import"./memoize-one.esm-CcMeOnPo.js";import"./card-EcjmryU9.js";import"./meta-content-DWZbURV2.js";import"./heading-CRNoBc7q.js";import"./help-icon-Buhx5nl6.js";import"./loader-XHoVniao.js";import"./styled-components.browser.esm-BQ9GQzDc.js";import"./select.input-D0UkAPd9.js";const t=[{label:"Browse",value:"Browse"},{label:"Recent",value:"Recent"},{label:"My Projects",value:"My Projects"}],s=[{id:1,name:"Lorem",active:!0},{id:2,name:"Ipsum"},{id:3,name:"Dolor"},{id:4,name:"Long name goes here lorem ipsum"},{id:5,name:"Lorem"},{id:6,name:"Ipsum"},{id:7,name:"Dolor"},{id:8,name:"Long name goes here lorem ipsum"},{id:9,name:"Lorem"},{id:10,name:"Ipsum"},{id:11,name:"Dolor"},{id:12,name:"Long name goes here lorem ipsum"},{id:13,name:"Lorem"},{id:14,name:"Ipsum"},{id:15,name:"Dolor"},{id:16,name:"Long name goes here lorem ipsum"}],X={title:"Layout/Layout Examples",parameters:{layout:"fullscreen",docs:{story:{inline:!1,iframeHeight:400}}}},l=()=>e.jsxs(e.Fragment,{children:[e.jsx(n,{}),e.jsxs(p,{padding:!1,left:0,scroll:!1,children:[e.jsx(u,{}),e.jsx(d,{margin:!1,padding:!0,options:t,value:t[0]}),e.jsxs(c,{spacing:0,flex:!0,height:"100%",children:[e.jsx(o,{borderRight:!0,scroll:!0,showScrollbar:!1,children:e.jsx(r,{list:{name:"Country",items:s}})}),e.jsx(o,{borderRight:!0,scroll:!0,showScrollbar:!1,children:e.jsx(r,{list:{name:"Field",items:s}})}),e.jsx(o,{borderRight:!0,scroll:!0,showScrollbar:!1,children:e.jsx(r,{list:{name:"Site",items:s}})}),e.jsx(o,{borderRight:!0,scroll:!0,showScrollbar:!1,children:e.jsx(r,{list:{name:"Well",items:s}})}),e.jsx(o,{borderRight:!0,scroll:!0,showScrollbar:!1,children:e.jsx(r,{list:{name:"Wellbore",items:s}})}),e.jsx(o,{scroll:!0,showScrollbar:!1,children:e.jsx(r,{list:{name:"Design",items:s}})})]})]})]});l.__docgenInfo={description:"",methods:[],displayName:"Projects"};var i,m,a;l.parameters={...l.parameters,docs:{...(i=l.parameters)==null?void 0:i.docs,source:{originalSource:`() => {
|
|
2
2
|
return <>
|
|
3
3
|
<TopBar />
|
|
4
4
|
<Page padding={false} left={0} scroll={false}>
|
|
@@ -44,4 +44,4 @@ import{j as e}from"./jsx-runtime-eps93zm2.js";import"./index-DhsZuJvc.js";import
|
|
|
44
44
|
</Row>
|
|
45
45
|
</Page>
|
|
46
46
|
</>;
|
|
47
|
-
}`,...(a=(m=l.parameters)==null?void 0:m.docs)==null?void 0:a.source}}};const
|
|
47
|
+
}`,...(a=(m=l.parameters)==null?void 0:m.docs)==null?void 0:a.source}}};const Y=["Projects"];export{l as Projects,Y as __namedExportsOrder,X as default};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as a}from"./jsx-runtime-eps93zm2.js";import{r as x}from"./index-DhsZuJvc.js";import{c as y}from"./index-Bk2sglWO.js";import{D as C}from"./disabled-context-rmpd7YJS.js";import{s as R}from"./select.input-
|
|
1
|
+
import{j as a}from"./jsx-runtime-eps93zm2.js";import{r as x}from"./index-DhsZuJvc.js";import{c as y}from"./index-Bk2sglWO.js";import{D as C}from"./disabled-context-rmpd7YJS.js";import{s as R}from"./select.input-D0UkAPd9.js";import{b as j}from"./common-types-Sih75Sav.js";import{H as L}from"./help-icon-Buhx5nl6.js";const V="_wrapper_1fbik_1",H="_inline_1fbik_1",O="_radio_1fbik_5",B="_labelMargin_1fbik_8",D="_small_1fbik_27",F="_noMargin_1fbik_32",N="_disabled_1fbik_90",A="_isInTable_1fbik_106",S="_helpIconEnabled_1fbik_111",n={wrapper:V,inline:H,radio:O,labelMargin:B,small:D,noMargin:F,disabled:N,isInTable:A,helpIconEnabled:S},T=({name:m,label:p,value:r,selected:c,disabled:t=!1,small:f=!1,onChange:g,noMargin:b=!1,testId:v,helpText:l,onClickHelp:s})=>{const u=l||s;return a.jsxs("div",{className:y(n.radio,t?n.disabled:null,f?n.small:null,b?n.noMargin:null),onClick:g,"data-testid":v,children:[a.jsx("input",{type:j.RADIO,value:r,checked:c,onChange:()=>{},disabled:t}),a.jsx("label",{"data-name":m,"data-value":r,children:p}),u&&a.jsx("div",{className:n.helpIconEnabled,onClick:s,children:a.jsx(L,{text:l})})]})};T.__docgenInfo={description:"",methods:[],displayName:"RadioInput",props:{name:{required:!0,tsType:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},description:""},label:{required:!0,tsType:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},description:""},value:{required:!0,tsType:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},description:""},selected:{required:!0,tsType:{name:"boolean"},description:""},disabled:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},small:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},onChange:{required:!1,tsType:{name:"signature",type:"function",raw:"(evt: React.MouseEvent<HTMLDivElement, MouseEvent>) => void",signature:{arguments:[{type:{name:"ReactMouseEvent",raw:"React.MouseEvent<HTMLDivElement, MouseEvent>",elements:[{name:"HTMLDivElement"},{name:"MouseEvent"}]},name:"evt"}],return:{name:"void"}}},description:""},noMargin:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},testId:{required:!1,tsType:{name:"string"},description:""},helpText:{required:!1,tsType:{name:"string"},description:""},onClickHelp:{required:!1,tsType:{name:"signature",type:"function",raw:"(event?: any) => void",signature:{arguments:[{type:{name:"any"},name:"event"}],return:{name:"void"}}},description:""}}};const P=({name:m,label:p,options:r,value:c,onChange:t,disabled:f=!1,small:g=!1,noMargin:b=!1,onClick:v=()=>{},inline:l=!1,mainLabel:s="",radioButtonsData:u,classForContainer:_="grouped fields"})=>{const q=x.useContext(C),o=u!==void 0,{simpleInputs:I,options:w,selectedOptions:d}=o?{simpleInputs:!1,options:u,selectedOptions:void 0}:R(r,c),k=o||d===void 0||d===null?void 0:I?d:d.value,h=o?s:p;return a.jsxs("div",{className:y(n.wrapper,l?n.inline:null,_==="inline fields"?n.inline:null),children:[s&&a.jsx("label",{className:y(l&&n.labelMargin),children:h}),w.map((e,E)=>{const M=e.checked||e.value===k||!1;return a.jsx(T,{name:e.name||e.value,label:e.label,value:e.value,selected:M,disabled:f||e.disabled||q,small:g,noMargin:b,onChange:e.disabled?void 0:i=>{o?v(i.target):(i.target.name=m,i.target.value=e.value.toString(),i.target.label=e.label.toString(),t&&t(i))},testId:e.testId,helpText:e.helpText,onClickHelp:e.onClickHelp},E)})]})};P.__docgenInfo={description:"",methods:[],displayName:"RadioButton",props:{name:{required:!1,tsType:{name:"string"},description:""},label:{required:!1,tsType:{name:"union",raw:"string | null",elements:[{name:"string"},{name:"null"}]},description:""},options:{required:!0,tsType:{name:"Array",elements:[{name:"IRadioButtonOption"}],raw:"IRadioButtonOption[]"},description:""},value:{required:!0,tsType:{name:"union",raw:"TStringOrNumber | IRadioButtonOption",elements:[{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},{name:"IRadioButtonOption"}]},description:""},inline:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},disabled:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},small:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},onChange:{required:!1,tsType:{name:"signature",type:"function",raw:`(
|
|
2
2
|
event: TChangeEvent<T>,
|
|
3
3
|
...additionalProps: { [key: string]: any }[]
|
|
4
4
|
) => void`,signature:{arguments:[{type:{name:"intersection",raw:`ChangeEvent<T> & {
|