@oliasoft-open-source/react-ui-library 4.7.3-beta-1 → 4.7.3-beta-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/assets/{index-7PLAdoQ9.js → index-D5kcnHmD.js} +0 -1
- package/dist/index.html +1 -1
- package/dist/index.js +3 -0
- package/dist/index.js.map +1 -1
- package/dist/storybook/assets/{Color-KGDBMAHA-flSaV_MJ.js → Color-KGDBMAHA-BDaGFyls.js} +1 -1
- package/dist/storybook/assets/{DocsRenderer-PKQXORMH-B2MpYyNq.js → DocsRenderer-PKQXORMH-DeAerz72.js} +1 -1
- package/dist/storybook/assets/{accordion.stories-sb-Y7MMb.js → accordion.stories-Beb4y7rL.js} +1 -1
- package/dist/storybook/assets/{afe.stories--E_j7kET.js → afe.stories-WJoC6FVV.js} +1 -1
- package/dist/storybook/assets/{buttons-and-links-BYEAhhA9.js → buttons-and-links-GWWpybLw.js} +1 -1
- package/dist/storybook/assets/{casing-loads.stories-EZlP6XsN.js → casing-loads.stories-DeIAdq5K.js} +1 -1
- package/dist/storybook/assets/{cell.stories-D9KrTmCA.js → cell.stories-DZKcKOIi.js} +1 -1
- package/dist/storybook/assets/check-box.stories-Dqopb7XV.js +126 -0
- package/dist/storybook/assets/{chunk-HLWAVYOI-BYDWICmD.js → chunk-HLWAVYOI-rY5YQOb2.js} +1 -1
- package/dist/storybook/assets/{color-Da1CW6lH.js → color-lBkUm7cb.js} +1 -1
- package/dist/storybook/assets/dialog-dXhT3sJF.js +1 -0
- package/dist/storybook/assets/{file-input.stories-aiTQE5UN.js → file-input.stories-CJLU_nqW.js} +1 -1
- package/dist/storybook/assets/{footer.stories-B5zvZawz.js → footer.stories-BlfgJYnF.js} +1 -1
- package/dist/storybook/assets/{form.stories-D58sdhOk.js → form.stories-RD2lXS5Q.js} +1 -1
- package/dist/storybook/assets/{formation.stories-OtA8Hcp6.js → formation.stories-BC2p8tEp.js} +1 -1
- package/dist/storybook/assets/iframe-D9Shj_Nm.js +2 -0
- package/dist/storybook/assets/{index-DJ8hSxGk.js → index-4gO9mIeA.js} +4 -4
- package/dist/storybook/assets/index-Be0hXiyp.js +179 -0
- package/dist/storybook/assets/index-CF7H4eMJ.js +28 -0
- package/dist/storybook/assets/{index-B9beUMCC.js → index-NK2Pj-Tv.js} +1 -1
- package/dist/storybook/assets/{input-group.stories-hHCmTbtu.js → input-group.stories-Dtak6Me2.js} +1 -1
- package/dist/storybook/assets/{input-validation-D54Tgh0X.js → input-validation-wltu7rhx.js} +2 -2
- package/dist/storybook/assets/{inputs-D7FnSkCy.js → inputs-Bsfja93s.js} +4 -4
- package/dist/storybook/assets/{layout-forms-DMszHpOu.js → layout-forms-Bf7y_Hym.js} +1 -1
- package/dist/storybook/assets/{layout-general-CWsbvxgT.js → layout-general-DJOJ7Xv5.js} +1 -1
- package/dist/storybook/assets/menu.stories-BD7P2iMQ.js +84 -0
- package/dist/storybook/assets/message-BYzRg8Ae.js +1 -0
- package/dist/storybook/assets/{message.stories-CXOrrAOR.js → message.stories-B02RIMXw.js} +1 -1
- package/dist/storybook/assets/modal.stories-l76yG1FY.js +228 -0
- package/dist/storybook/assets/number-input.stories-CmgIvuEY.js +105 -0
- package/dist/storybook/assets/{padding-and-spacing-vB3pUNzW.js → padding-and-spacing-BnOF4Ueu.js} +1 -1
- package/dist/storybook/assets/{pagination-0wY_w1xz.js → pagination-DRdJ9LGH.js} +1 -1
- package/dist/storybook/assets/{pagination.stories-BagAIIz3.js → pagination.stories-C_4kzgcf.js} +1 -1
- package/dist/storybook/assets/{pop-confirm.stories-D4L3erpj.js → pop-confirm.stories-Dlm0BaMY.js} +1 -1
- package/dist/storybook/assets/{popover.stories-ChwzGOlc.js → popover.stories-D6_Ulo0d.js} +1 -1
- package/dist/storybook/assets/preview-DLBQXbKW.js +1 -0
- package/dist/storybook/assets/{preview-DMFuiETZ.js → preview-DtaSOELl.js} +1 -1
- package/dist/storybook/assets/{preview-1T5p1vXe.js → preview-Dyti8xUp.js} +2 -2
- package/dist/storybook/assets/radio-button.stories-Ds-DfLlj.js +71 -0
- package/dist/storybook/assets/{reservoirs.stories-DywuU8EY.js → reservoirs.stories-BUs7WSxB.js} +1 -1
- package/dist/storybook/assets/{rich-text-input.stories-Cw_6EJx8.js → rich-text-input.stories-BP79IJ53.js} +1 -1
- package/dist/storybook/assets/{row.stories-D7V0fxhq.js → row.stories-CIJowbkv.js} +1 -1
- package/dist/storybook/assets/select-BeEJzL_0.js +40 -0
- package/dist/storybook/assets/select.stories-DgC9Agq6.js +579 -0
- package/dist/storybook/assets/{smart-upload-modal.stories-Cot88l9r.js → smart-upload-modal.stories-PeStvjoa.js} +1 -1
- package/dist/storybook/assets/{table-DmwpXp_Q.js → table-B7Ro6zGB.js} +1 -1
- package/dist/storybook/assets/{table.stories-DKcZk5JR.js → table.stories-1mHu1R2T.js} +1 -1
- package/dist/storybook/assets/{title.stories-CKbl0CB2.js → title.stories-CcK2ZS1r.js} +1 -1
- package/dist/storybook/assets/toaster-BNO0suPv.js +1 -0
- package/dist/storybook/assets/toaster.stories-DYw4Syxn.js +89 -0
- package/dist/storybook/assets/toggle.stories-DKENe2T9.js +141 -0
- package/dist/storybook/assets/{unit-input.stories-DeyzCbvE.js → unit-input.stories-BdhJ50Pr.js} +24 -24
- package/dist/storybook/assets/{unit-table.stories-BoNWlaAe.js → unit-table.stories-_Z6tTx-x.js} +1 -1
- package/dist/storybook/iframe.html +1 -1
- package/dist/storybook/index.html +6 -2
- package/dist/storybook/index.json +1 -1
- package/dist/storybook/project.json +1 -1
- package/dist/storybook/sb-addons/interactions-2/manager-bundle.js +233 -0
- package/dist/storybook/sb-addons/storybook-dark-mode-esm-preset-3/manager-bundle.js.LEGAL.txt +0 -0
- package/package.json +1 -1
- package/dist/storybook/assets/check-box.stories-Do-GOmLf.js +0 -102
- package/dist/storybook/assets/dialog-B-R6eAnf.js +0 -1
- package/dist/storybook/assets/iframe-BCuVAzCF.js +0 -2
- package/dist/storybook/assets/menu.stories-Bc2kf356.js +0 -82
- package/dist/storybook/assets/message-ZenLdkrf.js +0 -1
- package/dist/storybook/assets/modal.stories-ChRLG9ud.js +0 -200
- package/dist/storybook/assets/number-input.stories-COWyMRAs.js +0 -97
- package/dist/storybook/assets/radio-button.stories-BFp_qyyE.js +0 -61
- package/dist/storybook/assets/select-yqiMF9-4.js +0 -40
- package/dist/storybook/assets/select.stories-VMcOn7Ri.js +0 -914
- package/dist/storybook/assets/toaster-B8A3xIYu.js +0 -1
- package/dist/storybook/assets/toaster.stories-DuE6vvV6.js +0 -86
- package/dist/storybook/assets/toggle.stories-Cre2gnIB.js +0 -117
- /package/dist/storybook/sb-addons/{storybook-dark-mode-esm-preset-2 → interactions-2}/manager-bundle.js.LEGAL.txt +0 -0
- /package/dist/storybook/sb-addons/{storybook-dark-mode-esm-preset-2 → storybook-dark-mode-esm-preset-3}/manager-bundle.js +0 -0
|
@@ -0,0 +1,228 @@
|
|
|
1
|
+
import{j as e}from"./jsx-runtime-eps93zm2.js";import{r as j}from"./index-DhsZuJvc.js";import{w as le,u as k,e as P}from"./index-Be0hXiyp.js";import{T as se}from"./common-types-Sih75Sav.js";import{M as v,D as h}from"./dialog-dXhT3sJF.js";import{B as l}from"./button-CdEIDAx8.js";import{P as te}from"./popover-CvS_kBVF.js";import{I as ne}from"./input-D97ganXq.js";import{I as ae}from"./input-group-BaRSJAEN.js";import{F as f}from"./field-nInV3MuR.js";import{M as re}from"./actions-4w-EOz3m.js";import{S as ie}from"./select-BeEJzL_0.js";import{S as de}from"./spacer-BWoNR27H.js";import{T as ce}from"./tooltip-C_E_6ym5.js";import{M as S}from"./types-BmbYqTX_.js";import"./index-CF7H4eMJ.js";import"./index-Bk2sglWO.js";import"./portal-GQ0_cLB6.js";import"./index-CUZDtIZe.js";import"./lodash-BHd_uQHh.js";import"./heading-EzI5s4VN.js";import"./help-icon-CfV3_Ais.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-UmZ4Y_CR.js";import"./label-Cz6TT90s.js";import"./badge-CLQ59MDF.js";import"./assertThisInitialized-B9jnkVVz.js";import"./memoize-one.esm-CcMeOnPo.js";import"./text-B3-TSWok.js";import"./select.input-DIKP56UZ.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 console.log(o),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(f,{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(f,{label:"Nested Menu",children:e.jsx(re,{maxHeight:"240px",menu:{label:"Menu",trigger:se.DROP_DOWN_BUTTON,sections:[{type:S.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:S.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]=j.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]=j.useState(!1),o=()=>a(!t),[n,s]=j.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;o&&(await a("Modal should appear when triggered",async()=>{const n=o.getByText("Open Modal");await k.click(n);const s=o.getByTestId("testId");await P(s).toBeInTheDocument()}),await a("Modal should disappear when close button pressed",async()=>{const n=o.getByTestId("testId"),s=o.getByTestId("testId-dismiss");await k.click(s),await P(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
|
+
console.log(dialogProps);
|
|
13
|
+
return <>
|
|
14
|
+
<Modal visible={visible} centered={centered}>
|
|
15
|
+
<Dialog dialog={{
|
|
16
|
+
...dialogProps,
|
|
17
|
+
onClose: toggleModal
|
|
18
|
+
}} />
|
|
19
|
+
</Modal>
|
|
20
|
+
<Button label="Open Modal" onClick={toggleModal} />
|
|
21
|
+
</>;
|
|
22
|
+
}`,...(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:`() => {
|
|
23
|
+
const [{
|
|
24
|
+
visible,
|
|
25
|
+
centered,
|
|
26
|
+
...dialogProps
|
|
27
|
+
}, updateArgs] = useArgs();
|
|
28
|
+
const toggleModal = () => {
|
|
29
|
+
updateArgs({
|
|
30
|
+
visible: !visible
|
|
31
|
+
});
|
|
32
|
+
};
|
|
33
|
+
console.log(dialogProps);
|
|
34
|
+
return <>
|
|
35
|
+
<Modal visible={visible} centered={centered}>
|
|
36
|
+
<Dialog dialog={{
|
|
37
|
+
...dialogProps,
|
|
38
|
+
onClose: toggleModal
|
|
39
|
+
}} />
|
|
40
|
+
</Modal>
|
|
41
|
+
<Button label="Open Modal" onClick={toggleModal} />
|
|
42
|
+
</>;
|
|
43
|
+
}`,...(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:`() => {
|
|
44
|
+
const [{
|
|
45
|
+
visible,
|
|
46
|
+
centered,
|
|
47
|
+
...dialogProps
|
|
48
|
+
}, updateArgs] = useArgs();
|
|
49
|
+
const toggleModal = () => {
|
|
50
|
+
updateArgs({
|
|
51
|
+
visible: !visible
|
|
52
|
+
});
|
|
53
|
+
};
|
|
54
|
+
console.log(dialogProps);
|
|
55
|
+
return <>
|
|
56
|
+
<Modal visible={visible} centered={centered}>
|
|
57
|
+
<Dialog dialog={{
|
|
58
|
+
...dialogProps,
|
|
59
|
+
onClose: toggleModal
|
|
60
|
+
}} />
|
|
61
|
+
</Modal>
|
|
62
|
+
<Button label="Open Modal" onClick={toggleModal} />
|
|
63
|
+
</>;
|
|
64
|
+
}`,...(E=(I=c.parameters)==null?void 0:I.docs)==null?void 0:E.source}}};var _,w,F;g.parameters={...g.parameters,docs:{...(_=g.parameters)==null?void 0:_.docs,source:{originalSource:`() => {
|
|
65
|
+
const [{
|
|
66
|
+
visible,
|
|
67
|
+
centered,
|
|
68
|
+
...dialogProps
|
|
69
|
+
}, updateArgs] = useArgs();
|
|
70
|
+
const toggleModal = () => {
|
|
71
|
+
updateArgs({
|
|
72
|
+
visible: !visible
|
|
73
|
+
});
|
|
74
|
+
};
|
|
75
|
+
console.log(dialogProps);
|
|
76
|
+
return <>
|
|
77
|
+
<Modal visible={visible} centered={centered}>
|
|
78
|
+
<Dialog dialog={{
|
|
79
|
+
...dialogProps,
|
|
80
|
+
onClose: toggleModal
|
|
81
|
+
}} />
|
|
82
|
+
</Modal>
|
|
83
|
+
<Button label="Open Modal" onClick={toggleModal} />
|
|
84
|
+
</>;
|
|
85
|
+
}`,...(F=(w=g.parameters)==null?void 0:w.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:`() => {
|
|
86
|
+
const [{
|
|
87
|
+
visible,
|
|
88
|
+
centered,
|
|
89
|
+
...dialogProps
|
|
90
|
+
}, updateArgs] = useArgs();
|
|
91
|
+
const toggleModal = () => {
|
|
92
|
+
updateArgs({
|
|
93
|
+
visible: !visible
|
|
94
|
+
});
|
|
95
|
+
};
|
|
96
|
+
console.log(dialogProps);
|
|
97
|
+
return <>
|
|
98
|
+
<Modal visible={visible} centered={centered}>
|
|
99
|
+
<Dialog dialog={{
|
|
100
|
+
...dialogProps,
|
|
101
|
+
onClose: toggleModal
|
|
102
|
+
}} />
|
|
103
|
+
</Modal>
|
|
104
|
+
<Button label="Open Modal" onClick={toggleModal} />
|
|
105
|
+
</>;
|
|
106
|
+
}`,...(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:`() => {
|
|
107
|
+
const [{
|
|
108
|
+
visible,
|
|
109
|
+
centered,
|
|
110
|
+
...dialogProps
|
|
111
|
+
}, updateArgs] = useArgs();
|
|
112
|
+
const toggleModal = () => {
|
|
113
|
+
updateArgs({
|
|
114
|
+
visible: !visible
|
|
115
|
+
});
|
|
116
|
+
};
|
|
117
|
+
console.log(dialogProps);
|
|
118
|
+
return <>
|
|
119
|
+
<Modal visible={visible} centered={centered}>
|
|
120
|
+
<Dialog dialog={{
|
|
121
|
+
...dialogProps,
|
|
122
|
+
onClose: toggleModal
|
|
123
|
+
}} />
|
|
124
|
+
</Modal>
|
|
125
|
+
<Button label="Open Modal" onClick={toggleModal} />
|
|
126
|
+
</>;
|
|
127
|
+
}`,...(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:`() => {
|
|
128
|
+
const [{
|
|
129
|
+
visible,
|
|
130
|
+
centered,
|
|
131
|
+
...dialogProps
|
|
132
|
+
}, updateArgs] = useArgs();
|
|
133
|
+
const toggleModal = () => {
|
|
134
|
+
updateArgs({
|
|
135
|
+
visible: !visible
|
|
136
|
+
});
|
|
137
|
+
};
|
|
138
|
+
console.log(dialogProps);
|
|
139
|
+
return <>
|
|
140
|
+
<Modal visible={visible} centered={centered}>
|
|
141
|
+
<Dialog dialog={{
|
|
142
|
+
...dialogProps,
|
|
143
|
+
onClose: toggleModal
|
|
144
|
+
}} />
|
|
145
|
+
</Modal>
|
|
146
|
+
<Button label="Open Modal" onClick={toggleModal} />
|
|
147
|
+
</>;
|
|
148
|
+
}`,...(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:`() => {
|
|
149
|
+
const [visible, setVisible] = useState(false);
|
|
150
|
+
const openModal = () => {
|
|
151
|
+
setVisible(true);
|
|
152
|
+
};
|
|
153
|
+
const closeModal = () => {
|
|
154
|
+
setVisible(false);
|
|
155
|
+
};
|
|
156
|
+
const handleSubmit = () => {
|
|
157
|
+
console.log('Submit action');
|
|
158
|
+
closeModal();
|
|
159
|
+
};
|
|
160
|
+
return <>
|
|
161
|
+
<Modal visible={visible} onEnter={() => {
|
|
162
|
+
console.log('Enter');
|
|
163
|
+
handleSubmit();
|
|
164
|
+
}} onEscape={() => {
|
|
165
|
+
console.log('Escape');
|
|
166
|
+
closeModal();
|
|
167
|
+
}}>
|
|
168
|
+
<Dialog dialog={{
|
|
169
|
+
heading: 'Test key handling',
|
|
170
|
+
content: <Input />,
|
|
171
|
+
footer: <>
|
|
172
|
+
<Button label="Done" colored="red" onClick={handleSubmit} />
|
|
173
|
+
<Button label="Cancel" onClick={closeModal} />
|
|
174
|
+
</>,
|
|
175
|
+
onClose: closeModal
|
|
176
|
+
}} />
|
|
177
|
+
</Modal>
|
|
178
|
+
<Button label="Open Modal" onClick={openModal} />
|
|
179
|
+
</>;
|
|
180
|
+
}`,...(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:`() => {
|
|
181
|
+
const [visible1, setVisible1] = useState(false);
|
|
182
|
+
const toggleVisible1 = () => setVisible1(!visible1);
|
|
183
|
+
const [visible2, setVisible2] = useState(false);
|
|
184
|
+
const toggleVisible2 = () => setVisible2(!visible2);
|
|
185
|
+
return <>
|
|
186
|
+
<Modal visible={visible1}>
|
|
187
|
+
<Dialog dialog={{
|
|
188
|
+
heading: 'Modal 1',
|
|
189
|
+
content: 'Lorem ipsum dolor sit amet',
|
|
190
|
+
footer: <>
|
|
191
|
+
<Button label="Open modal 2" colored onClick={toggleVisible2} />
|
|
192
|
+
<Modal visible={visible2}>
|
|
193
|
+
<Dialog dialog={{
|
|
194
|
+
heading: 'Modal 2',
|
|
195
|
+
content: 'Lorem ipsum dolor sit amet',
|
|
196
|
+
footer: <Button label="Close" onClick={toggleVisible2} />,
|
|
197
|
+
onClose: toggleVisible2
|
|
198
|
+
}} />
|
|
199
|
+
</Modal>
|
|
200
|
+
<Button label="Close" onClick={toggleVisible1} />
|
|
201
|
+
</>,
|
|
202
|
+
onClose: toggleVisible1
|
|
203
|
+
}} />
|
|
204
|
+
</Modal>
|
|
205
|
+
<Button label="Open modal 1" onClick={toggleVisible1} />
|
|
206
|
+
</>;
|
|
207
|
+
}`,...(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:`() => {
|
|
208
|
+
const [{
|
|
209
|
+
visible,
|
|
210
|
+
centered,
|
|
211
|
+
...dialogProps
|
|
212
|
+
}, updateArgs] = useArgs();
|
|
213
|
+
const toggleModal = () => {
|
|
214
|
+
updateArgs({
|
|
215
|
+
visible: !visible
|
|
216
|
+
});
|
|
217
|
+
};
|
|
218
|
+
console.log(dialogProps);
|
|
219
|
+
return <>
|
|
220
|
+
<Modal visible={visible} centered={centered}>
|
|
221
|
+
<Dialog dialog={{
|
|
222
|
+
...dialogProps,
|
|
223
|
+
onClose: toggleModal
|
|
224
|
+
}} />
|
|
225
|
+
</Modal>
|
|
226
|
+
<Button label="Open Modal" onClick={toggleModal} />
|
|
227
|
+
</>;
|
|
228
|
+
}`,...(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,105 @@
|
|
|
1
|
+
import{j as t}from"./jsx-runtime-eps93zm2.js";import{w as pe,u as I,e as E}from"./index-Be0hXiyp.js";import{d as ge}from"./index-DQs5XS8h.js";import{N as A}from"./number-input-B-Nmya5O.js";import{I as le}from"./input-group-BaRSJAEN.js";import{I as de}from"./input-group-addon-D68iUKV2.js";import{S as ce}from"./select-BeEJzL_0.js";import"./index-DhsZuJvc.js";import"./index-CF7H4eMJ.js";import"./index-DRSy5Ssd.js";import"./lodash-BHd_uQHh.js";import"./input-D97ganXq.js";import"./index-Bk2sglWO.js";import"./disabled-context-rmpd7YJS.js";import"./types-UmZ4Y_CR.js";import"./tooltip-C_E_6ym5.js";import"./index-CUZDtIZe.js";import"./common-types-Sih75Sav.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-4w-EOz3m.js";import"./button-CdEIDAx8.js";import"./spinner-AWUe4xwQ.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./badge-CLQ59MDF.js";import"./select.input-DIKP56UZ.js";const{useArgs:ie}=__STORYBOOK_MODULE_PREVIEW_API__,Ue={title:"Forms/NumberInput",component:A,parameters:{canvas:{page:null}},args:{label:"Label"}},e=a=>{const[b,n]=ie(),r=oe=>{n({value:oe.target.value})};return t.jsx(A,{onChange:r,value:123,...a})},C=e.bind({}),u=e.bind({});u.args={small:!0};const o=e.bind({});o.args={width:"150px"};const p=e.bind({});p.args={left:!0};const g=e.bind({});g.args={disabled:!0};const l=e.bind({});l.args={allowEmpty:!0,value:""};const d=e.bind({});d.args={warning:"This input number is almost 100!",value:"99"};const c=e.bind({});c.args={error:"This is a error message"};const i=e.bind({});i.args={value:"123test"};const m=e.bind({});m.args={value:"123.123456789",enableDisplayRounding:!0};const h=e.bind({});h.args={value:"123.123456789",enableDisplayRounding:!0,roundDisplayValue:a=>ge.roundToFixed(a,4)};const v=()=>t.jsxs(le,{small:!0,children:[t.jsx(A,{value:123}),t.jsx(de,{children:"to"}),t.jsx(A,{value:123}),t.jsx(ce,{options:[{value:"units",label:"units"}],width:"auto",value:"units"})]}),s=e.bind({});s.args={testId:"testId",enableDisplayRounding:!0};s.play=async({canvasElement:a,step:b})=>{const n=pe(a);await b("Value should be rounded on blur",async()=>{const r=n.getByTestId("testId");await I.clear(r),await I.type(r,"123.123456789"),await I.click(a),await E(n.getByDisplayValue("123.12")).toBeInTheDocument()}),await b("Full value shown on focus",async()=>{const r=n.getByTestId("testId");await I.click(r),await E(n.getByDisplayValue("123.123456789")).toBeInTheDocument()})};v.__docgenInfo={description:"",methods:[],displayName:"TestInputGroup"};var T,y,_;C.parameters={...C.parameters,docs:{...(T=C.parameters)==null?void 0:T.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
|
+
}`,...(_=(y=C.parameters)==null?void 0:y.docs)==null?void 0:_.source}}};var D,S,w;u.parameters={...u.parameters,docs:{...(D=u.parameters)==null?void 0:D.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
|
+
}`,...(w=(S=u.parameters)==null?void 0:S.docs)==null?void 0:w.source}}};var N,L,f;o.parameters={...o.parameters,docs:{...(N=o.parameters)==null?void 0:N.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
|
+
}`,...(f=(L=o.parameters)==null?void 0:L.docs)==null?void 0:f.source}}};var x,M,H;p.parameters={...p.parameters,docs:{...(x=p.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
|
+
}`,...(H=(M=p.parameters)==null?void 0:M.docs)==null?void 0:H.source}}};var R,B,G;g.parameters={...g.parameters,docs:{...(R=g.parameters)==null?void 0:R.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
|
+
}`,...(G=(B=g.parameters)==null?void 0:B.docs)==null?void 0:G.source}}};var W,j,O;l.parameters={...l.parameters,docs:{...(W=l.parameters)==null?void 0:W.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
|
+
}`,...(O=(j=l.parameters)==null?void 0:j.docs)==null?void 0:O.source}}};var V,F,k;d.parameters={...d.parameters,docs:{...(V=d.parameters)==null?void 0:V.docs,source:{originalSource:`args => {
|
|
50
|
+
const [_, updateArgs] = useArgs();
|
|
51
|
+
const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
|
|
52
|
+
updateArgs({
|
|
53
|
+
value: evt.target.value
|
|
54
|
+
});
|
|
55
|
+
};
|
|
56
|
+
return <NumberInput onChange={handleChange} value={123} {...args} />;
|
|
57
|
+
}`,...(k=(F=d.parameters)==null?void 0:F.docs)==null?void 0:k.source}}};var P,K,U;c.parameters={...c.parameters,docs:{...(P=c.parameters)==null?void 0:P.docs,source:{originalSource:`args => {
|
|
58
|
+
const [_, updateArgs] = useArgs();
|
|
59
|
+
const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
|
|
60
|
+
updateArgs({
|
|
61
|
+
value: evt.target.value
|
|
62
|
+
});
|
|
63
|
+
};
|
|
64
|
+
return <NumberInput onChange={handleChange} value={123} {...args} />;
|
|
65
|
+
}`,...(U=(K=c.parameters)==null?void 0:K.docs)==null?void 0:U.source}}};var Y,q,z;i.parameters={...i.parameters,docs:{...(Y=i.parameters)==null?void 0:Y.docs,source:{originalSource:`args => {
|
|
66
|
+
const [_, updateArgs] = useArgs();
|
|
67
|
+
const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
|
|
68
|
+
updateArgs({
|
|
69
|
+
value: evt.target.value
|
|
70
|
+
});
|
|
71
|
+
};
|
|
72
|
+
return <NumberInput onChange={handleChange} value={123} {...args} />;
|
|
73
|
+
}`,...(z=(q=i.parameters)==null?void 0:q.docs)==null?void 0:z.source}}};var J,Q,X;m.parameters={...m.parameters,docs:{...(J=m.parameters)==null?void 0:J.docs,source:{originalSource:`args => {
|
|
74
|
+
const [_, updateArgs] = useArgs();
|
|
75
|
+
const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
|
|
76
|
+
updateArgs({
|
|
77
|
+
value: evt.target.value
|
|
78
|
+
});
|
|
79
|
+
};
|
|
80
|
+
return <NumberInput onChange={handleChange} value={123} {...args} />;
|
|
81
|
+
}`,...(X=(Q=m.parameters)==null?void 0:Q.docs)==null?void 0:X.source}}};var Z,$,ee;h.parameters={...h.parameters,docs:{...(Z=h.parameters)==null?void 0:Z.docs,source:{originalSource:`args => {
|
|
82
|
+
const [_, updateArgs] = useArgs();
|
|
83
|
+
const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
|
|
84
|
+
updateArgs({
|
|
85
|
+
value: evt.target.value
|
|
86
|
+
});
|
|
87
|
+
};
|
|
88
|
+
return <NumberInput onChange={handleChange} value={123} {...args} />;
|
|
89
|
+
}`,...(ee=($=h.parameters)==null?void 0:$.docs)==null?void 0:ee.source}}};var ae,ne,re;v.parameters={...v.parameters,docs:{...(ae=v.parameters)==null?void 0:ae.docs,source:{originalSource:`() => <InputGroup small>
|
|
90
|
+
<NumberInput value={123} />
|
|
91
|
+
<InputGroupAddon>to</InputGroupAddon>
|
|
92
|
+
<NumberInput value={123} />
|
|
93
|
+
<Select options={[{
|
|
94
|
+
value: 'units',
|
|
95
|
+
label: 'units'
|
|
96
|
+
}]} width="auto" value="units" />
|
|
97
|
+
</InputGroup>`,...(re=(ne=v.parameters)==null?void 0:ne.docs)==null?void 0:re.source}}};var te,se,ue;s.parameters={...s.parameters,docs:{...(te=s.parameters)==null?void 0:te.docs,source:{originalSource:`args => {
|
|
98
|
+
const [_, updateArgs] = useArgs();
|
|
99
|
+
const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
|
|
100
|
+
updateArgs({
|
|
101
|
+
value: evt.target.value
|
|
102
|
+
});
|
|
103
|
+
};
|
|
104
|
+
return <NumberInput onChange={handleChange} value={123} {...args} />;
|
|
105
|
+
}`,...(ue=(se=s.parameters)==null?void 0:se.docs)==null?void 0:ue.source}}};const Ye=["Default","Small","Width","Left","Disabled","AllowEmpty","Warning","Error","BadInput","WithDisplayRounding","WithCustomDisplayRounding","TestInputGroup","TestDisplayRounding"];export{l as AllowEmpty,i as BadInput,C as Default,g as Disabled,c as Error,p as Left,u as Small,s as TestDisplayRounding,v as TestInputGroup,d as Warning,o as Width,h as WithCustomDisplayRounding,m as WithDisplayRounding,Ye as __namedExportsOrder,Ue as default};
|
package/dist/storybook/assets/{padding-and-spacing-vB3pUNzW.js → padding-and-spacing-BnOF4Ueu.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-4gO9mIeA.js";import"./index-DhsZuJvc.js";import"./iframe-D9Shj_Nm.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-BeEJzL_0.js";import{I}from"./input-D97ganXq.js";import{B as p}from"./button-CdEIDAx8.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-BagAIIz3.js → pagination.stories-C_4kzgcf.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-DRdJ9LGH.js";import"./common-types-Sih75Sav.js";import"./select-BeEJzL_0.js";import"./index-Bk2sglWO.js";import"./disabled-context-rmpd7YJS.js";import"./types-UmZ4Y_CR.js";import"./lodash-BHd_uQHh.js";import"./tooltip-C_E_6ym5.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-4w-EOz3m.js";import"./button-CdEIDAx8.js";import"./spinner-AWUe4xwQ.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./badge-CLQ59MDF.js";import"./select.input-DIKP56UZ.js";import"./input-D97ganXq.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,
|
package/dist/storybook/assets/{pop-confirm.stories-D4L3erpj.js → pop-confirm.stories-Dlm0BaMY.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as t}from"./jsx-runtime-eps93zm2.js";import{P as S}from"./popover-CvS_kBVF.js";import{B as u}from"./button-CdEIDAx8.js";import{T as I}from"./text-B3-TSWok.js";import{t as A}from"./toaster-
|
|
1
|
+
import{j as t}from"./jsx-runtime-eps93zm2.js";import{P as S}from"./popover-CvS_kBVF.js";import{B as u}from"./button-CdEIDAx8.js";import{T as I}from"./text-B3-TSWok.js";import{t as A}from"./toaster-BNO0suPv.js";import"./index-DhsZuJvc.js";import"./tooltip-C_E_6ym5.js";import"./index-CUZDtIZe.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"./toaster-7wnI6hqB.js";import"./message-BYzRg8Ae.js";const R="_popConfirm_1x6ye_1",$="_content_1x6ye_7",W="_buttons_1x6ye_13",y={popConfirm:R,content:$,buttons:W},O=({title:e,okText:p,onClickOk:d,disableConfirmButton:m,cancelText:f,onClickCancel:g,close:a,testId:o})=>t.jsxs("div",{className:y.popConfirm,children:[e&&t.jsx("div",{className:y.content,children:t.jsx(I,{small:!0,children:e})}),t.jsxs("div",{className:y.buttons,children:[t.jsx(u,{small:!0,colored:!0,label:p,onClick:()=>d(a),disabled:m,testId:`${o}-ok-button`}),t.jsx(u,{small:!0,label:f,onClick:()=>g(a),testId:`${o}-cancel-button`})]})]});O.__docgenInfo={description:"",methods:[],displayName:"Content",props:{title:{required:!1,tsType:{name:"string"},description:""},okText:{required:!0,tsType:{name:"string"},description:""},onClickOk:{required:!0,tsType:{name:"signature",type:"function",raw:"(close?: TEmpty) => void",signature:{arguments:[{type:{name:"signature",type:"function",raw:"() => void",signature:{arguments:[],return:{name:"void"}}},name:"close"}],return:{name:"void"}}},description:""},disableConfirmButton:{required:!1,tsType:{name:"boolean"},description:""},cancelText:{required:!0,tsType:{name:"string"},description:""},onClickCancel:{required:!0,tsType:{name:"signature",type:"function",raw:"(close?: TEmpty) => void",signature:{arguments:[{type:{name:"signature",type:"function",raw:"() => void",signature:{arguments:[],return:{name:"void"}}},name:"close"}],return:{name:"void"}}},description:""},close:{required:!1,tsType:{name:"signature",type:"function",raw:"() => void",signature:{arguments:[],return:{name:"void"}}},description:""},testId:{required:!1,tsType:{name:"string"},description:""}}};const v=({children:e,placement:p="top-center",closeOnOutsideClick:d=!0,fullWidth:m=!1,title:f="",cancelText:g="Cancel",onClickCancel:a=i=>i&&i(),okText:o="Ok",onClickOk:D=()=>{},disableConfirmButton:E=!1,overflowContainer:N=!1,testId:C=void 0})=>{const i=t.jsx(O,{title:f,okText:o,onClickOk:D,disableConfirmButton:E,cancelText:g,onClickCancel:a,testId:C});return t.jsx(S,{content:i,placement:p,closeOnOutsideClick:d,fullWidth:m,overflowContainer:N,testId:C,children:e})};v.__docgenInfo={description:"",methods:[],displayName:"PopConfirm",props:{children:{required:!1,tsType:{name:"ReactNode"},description:""},placement:{required:!1,tsType:{name:"Placement"},description:"",defaultValue:{value:"'top-center'",computed:!1}},closeOnOutsideClick:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"true",computed:!1}},fullWidth:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},title:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:"''",computed:!1}},cancelText:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:"'Cancel'",computed:!1}},onClickCancel:{required:!1,tsType:{name:"signature",type:"function",raw:"(close?: TEmpty) => void",signature:{arguments:[{type:{name:"signature",type:"function",raw:"() => void",signature:{arguments:[],return:{name:"void"}}},name:"close"}],return:{name:"void"}}},description:"",defaultValue:{value:"(close) => close && close()",computed:!1}},disableConfirmButton:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},okText:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:"'Ok'",computed:!1}},onClickOk:{required:!1,tsType:{name:"signature",type:"function",raw:"(close?: TEmpty) => void",signature:{arguments:[{type:{name:"signature",type:"function",raw:"() => void",signature:{arguments:[],return:{name:"void"}}},name:"close"}],return:{name:"void"}}},description:"",defaultValue:{value:"() => {}",computed:!1}},overflowContainer:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},testId:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:"undefined",computed:!0}}}};const Y=e=>{A({message:{type:"Success",content:"success!",details:"You successfully booked your cruise to Bahamas."}}),e()},oe={title:"Basic/PopConfirm",component:v,args:{title:"Do you want a free cruise to Bahamas?",onClickCancel:e=>e(),onClickOk:Y,children:t.jsx(u,{label:"Click me!"}),overflowContainer:!0,placement:"top-center"},decorators:[e=>t.jsx("div",{style:{display:"flex",justifyContent:"center"},children:e()})],parameters:{docs:{source:{excludeDecorators:!0}}}},c=e=>t.jsx(v,{...e}),l=c.bind({}),r=c.bind({});r.args={children:t.jsx(u,{small:!0,round:!0,basic:!0,colored:"muted",icon:"delete"})};const s=c.bind({});s.args={placement:"bottom-end"};const n=c.bind({});n.args={disableConfirmButton:!0};var x,b,T;l.parameters={...l.parameters,docs:{...(x=l.parameters)==null?void 0:x.docs,source:{originalSource:`args => <PopConfirm
|
|
2
2
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
3
3
|
{...args} />`,...(T=(b=l.parameters)==null?void 0:b.docs)==null?void 0:T.source}}};var k,q,j;r.parameters={...r.parameters,docs:{...(k=r.parameters)==null?void 0:k.docs,source:{originalSource:`args => <PopConfirm
|
|
4
4
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
@@ -1,4 +1,4 @@
|
|
|
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-CvS_kBVF.js";import{I as c}from"./input-D97ganXq.js";import{B as l}from"./button-CdEIDAx8.js";import{F as y}from"./flex-EllkLxgO.js";import{S as D}from"./select-
|
|
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-CvS_kBVF.js";import{I as c}from"./input-D97ganXq.js";import{B as l}from"./button-CdEIDAx8.js";import{F as y}from"./flex-EllkLxgO.js";import{S as D}from"./select-BeEJzL_0.js";import"./tooltip-C_E_6ym5.js";import"./index-CUZDtIZe.js";import"./index-Bk2sglWO.js";import"./common-types-Sih75Sav.js";import"./disabled-context-rmpd7YJS.js";import"./types-UmZ4Y_CR.js";import"./lodash-BHd_uQHh.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-4w-EOz3m.js";import"./badge-CLQ59MDF.js";import"./select.input-DIKP56UZ.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
2
|
const [isOpen, setIsOpen] = useState(false);
|
|
3
3
|
return <div>
|
|
4
4
|
<Button onClick={() => setIsOpen(!isOpen)} label="Toggle Popover Externally" />
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{i as r}from"./index-CF7H4eMJ.js";var{step:a}=r({step:(p,t,e)=>t(e)},{intercept:!0}),i={throwPlayFunctionExceptions:!1};export{i as parameters,a as runStep};
|
|
@@ -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-
|
|
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-BYzRg8Ae.js";import{a4 as d,a5 as M}from"./index-4gO9mIeA.js";import{e as _}from"./index-DRSy5Ssd.js";import"./chunk-HLWAVYOI-rY5YQOb2.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-D9Shj_Nm.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 k(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 A(r){for(var t=1;t<arguments.length;t++){var e=arguments[t]!=null?arguments[t]:{};t%2?k(Object(e),!0).forEach(function(n){R(r,n,e[n])}):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(e)):k(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)||N(r)||L()}function L(){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 N(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 A(A({},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,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-DeAerz72.js","./chunk-HLWAVYOI-rY5YQOb2.js","./iframe-D9Shj_Nm.js","./index-DhsZuJvc.js","./react-16-DXAfArL2.js","./index-CUZDtIZe.js","./index-4gO9mIeA.js","./inheritsLoose-DP0QEDDI.js","./assertThisInitialized-B9jnkVVz.js","./index-D6rZ4wEC.js"])))=>i.map(i=>d[i]);
|
|
2
|
+
import{_ as a}from"./iframe-D9Shj_Nm.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-DeAerz72.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};
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
import{j as A}from"./jsx-runtime-eps93zm2.js";import{r as F}from"./index-DhsZuJvc.js";import{w as K,u as q,e as m}from"./index-Be0hXiyp.js";import{R as j}from"./radio-button-J4oEQdxt.js";import"./index-CF7H4eMJ.js";import"./index-Bk2sglWO.js";import"./disabled-context-rmpd7YJS.js";import"./select.input-DIKP56UZ.js";import"./types-BmbYqTX_.js";import"./common-types-Sih75Sav.js";import"./help-icon-CfV3_Ais.js";import"./tooltip-C_E_6ym5.js";import"./index-CUZDtIZe.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./inheritsLoose-DP0QEDDI.js";import"./index-CEuq6vkz.js";const s=[{label:"Aardvarks",value:"termites"},{label:"Kangaroos",value:"grass"},{label:"Monkeys",value:"bananas",disabled:!0}],re={title:"Forms/RadioButton",component:j,args:{options:s,inline:!1,noMargin:!1,disabled:!1,small:!1}},a=t=>{const[e,u]=F.useState(s[0]),n=_=>{const $=_.target.value,g=s.find(W=>W.value===$);g&&u(g)};return A.jsx(j,{...t,value:e,onChange:n})},d=a.bind({}),o=a.bind({});o.args={small:!0};const l=a.bind({});l.args={options:s.map((t,e)=>({...t,helpText:`Help text #${e}`}))};const r=a.bind({});r.args={options:s.map((t,e)=>({...t,onClickHelp:()=>console.log(`Help #${e} clicked`)}))};const i=a.bind({});i.args={inline:!0};const c=a.bind({});c.args={options:s.map((t,e)=>({...t,helpText:`Help text #${e}`,disabled:!0}))};const p=a.bind({});p.play=async({canvasElement:t,step:e})=>{const u=K(t);await e("Clicking a radio should activate it",async()=>{const n=u.getByDisplayValue("grass");await q.click(n),await m(n).toBeChecked()}),await e("Clicking a disabled radio shouldn't activate it",async()=>{const n=u.getByDisplayValue("bananas");await n.click(),await m(n).not.toBeChecked()})};var v,h,C;d.parameters={...d.parameters,docs:{...(v=d.parameters)==null?void 0:v.docs,source:{originalSource:`args => {
|
|
2
|
+
const [value, setValue] = useState<OptionType>(options[0]);
|
|
3
|
+
const handleChange = (evt: React.ChangeEvent<HTMLInputElement>) => {
|
|
4
|
+
const selectedValue = evt.target.value;
|
|
5
|
+
const selectedOption = options.find(opt => opt.value === selectedValue);
|
|
6
|
+
if (selectedOption) {
|
|
7
|
+
setValue(selectedOption);
|
|
8
|
+
}
|
|
9
|
+
};
|
|
10
|
+
return <RadioButton {...args} value={value} onChange={handleChange} />;
|
|
11
|
+
}`,...(C=(h=d.parameters)==null?void 0:h.docs)==null?void 0:C.source}}};var O,V,f;o.parameters={...o.parameters,docs:{...(O=o.parameters)==null?void 0:O.docs,source:{originalSource:`args => {
|
|
12
|
+
const [value, setValue] = useState<OptionType>(options[0]);
|
|
13
|
+
const handleChange = (evt: React.ChangeEvent<HTMLInputElement>) => {
|
|
14
|
+
const selectedValue = evt.target.value;
|
|
15
|
+
const selectedOption = options.find(opt => opt.value === selectedValue);
|
|
16
|
+
if (selectedOption) {
|
|
17
|
+
setValue(selectedOption);
|
|
18
|
+
}
|
|
19
|
+
};
|
|
20
|
+
return <RadioButton {...args} value={value} onChange={handleChange} />;
|
|
21
|
+
}`,...(f=(V=o.parameters)==null?void 0:V.docs)==null?void 0:f.source}}};var T,b,E;l.parameters={...l.parameters,docs:{...(T=l.parameters)==null?void 0:T.docs,source:{originalSource:`args => {
|
|
22
|
+
const [value, setValue] = useState<OptionType>(options[0]);
|
|
23
|
+
const handleChange = (evt: React.ChangeEvent<HTMLInputElement>) => {
|
|
24
|
+
const selectedValue = evt.target.value;
|
|
25
|
+
const selectedOption = options.find(opt => opt.value === selectedValue);
|
|
26
|
+
if (selectedOption) {
|
|
27
|
+
setValue(selectedOption);
|
|
28
|
+
}
|
|
29
|
+
};
|
|
30
|
+
return <RadioButton {...args} value={value} onChange={handleChange} />;
|
|
31
|
+
}`,...(E=(b=l.parameters)==null?void 0:b.docs)==null?void 0:E.source}}};var R,H,S;r.parameters={...r.parameters,docs:{...(R=r.parameters)==null?void 0:R.docs,source:{originalSource:`args => {
|
|
32
|
+
const [value, setValue] = useState<OptionType>(options[0]);
|
|
33
|
+
const handleChange = (evt: React.ChangeEvent<HTMLInputElement>) => {
|
|
34
|
+
const selectedValue = evt.target.value;
|
|
35
|
+
const selectedOption = options.find(opt => opt.value === selectedValue);
|
|
36
|
+
if (selectedOption) {
|
|
37
|
+
setValue(selectedOption);
|
|
38
|
+
}
|
|
39
|
+
};
|
|
40
|
+
return <RadioButton {...args} value={value} onChange={handleChange} />;
|
|
41
|
+
}`,...(S=(H=r.parameters)==null?void 0:H.docs)==null?void 0:S.source}}};var y,x,B;i.parameters={...i.parameters,docs:{...(y=i.parameters)==null?void 0:y.docs,source:{originalSource:`args => {
|
|
42
|
+
const [value, setValue] = useState<OptionType>(options[0]);
|
|
43
|
+
const handleChange = (evt: React.ChangeEvent<HTMLInputElement>) => {
|
|
44
|
+
const selectedValue = evt.target.value;
|
|
45
|
+
const selectedOption = options.find(opt => opt.value === selectedValue);
|
|
46
|
+
if (selectedOption) {
|
|
47
|
+
setValue(selectedOption);
|
|
48
|
+
}
|
|
49
|
+
};
|
|
50
|
+
return <RadioButton {...args} value={value} onChange={handleChange} />;
|
|
51
|
+
}`,...(B=(x=i.parameters)==null?void 0:x.docs)==null?void 0:B.source}}};var k,I,M;c.parameters={...c.parameters,docs:{...(k=c.parameters)==null?void 0:k.docs,source:{originalSource:`args => {
|
|
52
|
+
const [value, setValue] = useState<OptionType>(options[0]);
|
|
53
|
+
const handleChange = (evt: React.ChangeEvent<HTMLInputElement>) => {
|
|
54
|
+
const selectedValue = evt.target.value;
|
|
55
|
+
const selectedOption = options.find(opt => opt.value === selectedValue);
|
|
56
|
+
if (selectedOption) {
|
|
57
|
+
setValue(selectedOption);
|
|
58
|
+
}
|
|
59
|
+
};
|
|
60
|
+
return <RadioButton {...args} value={value} onChange={handleChange} />;
|
|
61
|
+
}`,...(M=(I=c.parameters)==null?void 0:I.docs)==null?void 0:M.source}}};var w,L,D;p.parameters={...p.parameters,docs:{...(w=p.parameters)==null?void 0:w.docs,source:{originalSource:`args => {
|
|
62
|
+
const [value, setValue] = useState<OptionType>(options[0]);
|
|
63
|
+
const handleChange = (evt: React.ChangeEvent<HTMLInputElement>) => {
|
|
64
|
+
const selectedValue = evt.target.value;
|
|
65
|
+
const selectedOption = options.find(opt => opt.value === selectedValue);
|
|
66
|
+
if (selectedOption) {
|
|
67
|
+
setValue(selectedOption);
|
|
68
|
+
}
|
|
69
|
+
};
|
|
70
|
+
return <RadioButton {...args} value={value} onChange={handleChange} />;
|
|
71
|
+
}`,...(D=(L=p.parameters)==null?void 0:L.docs)==null?void 0:D.source}}};const ie=["Default","Small","HelpText","OnClickHelp","Inline","DisabledWithHelpText","Test"];export{d as Default,c as DisabledWithHelpText,l as HelpText,i as Inline,r as OnClickHelp,o as Small,p as Test,ie as __namedExportsOrder,re as default};
|
package/dist/storybook/assets/{reservoirs.stories-DywuU8EY.js → reservoirs.stories-BUs7WSxB.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-eps93zm2.js";import{r as b}from"./index-DhsZuJvc.js";import{I as j}from"./common-types-Sih75Sav.js";import{T as w}from"./top-bar-mKg-xcLh.js";import{S as L}from"./side-bar-DAMfASqb.js";import{H as t}from"./heading-EzI5s4VN.js";import{B as m}from"./button-CdEIDAx8.js";import{D as v}from"./drawer-BOl7GxGI.js";import{L as C}from"./list-BtA0jYMp.js";import{F as l}from"./field-nInV3MuR.js";import{I as i}from"./input-D97ganXq.js";import{C as p}from"./check-box-2fHPdAZG.js";import{R as h}from"./radio-button-J4oEQdxt.js";import{C as d}from"./card-EcjmryU9.js";import{F}from"./form-row-CM112EYF.js";import{P as g}from"./page-7SSpdYhb.js";import{R as a,C as r}from"./row-4iAGREkV.js";import{S as R}from"./select-
|
|
1
|
+
import{j as e}from"./jsx-runtime-eps93zm2.js";import{r as b}from"./index-DhsZuJvc.js";import{I as j}from"./common-types-Sih75Sav.js";import{T as w}from"./top-bar-mKg-xcLh.js";import{S as L}from"./side-bar-DAMfASqb.js";import{H as t}from"./heading-EzI5s4VN.js";import{B as m}from"./button-CdEIDAx8.js";import{D as v}from"./drawer-BOl7GxGI.js";import{L as C}from"./list-BtA0jYMp.js";import{F as l}from"./field-nInV3MuR.js";import{I as i}from"./input-D97ganXq.js";import{C as p}from"./check-box-2fHPdAZG.js";import{R as h}from"./radio-button-J4oEQdxt.js";import{C as d}from"./card-EcjmryU9.js";import{F}from"./form-row-CM112EYF.js";import{P as g}from"./page-7SSpdYhb.js";import{R as a,C as r}from"./row-4iAGREkV.js";import{S as R}from"./select-BeEJzL_0.js";import{S as f}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"./actions-4w-EOz3m.js";import"./lodash-BHd_uQHh.js";import"./tooltip-C_E_6ym5.js";import"./index-CUZDtIZe.js";import"./types-BmbYqTX_.js";import"./types-UmZ4Y_CR.js";import"./badge-CLQ59MDF.js";import"./index-BI4_Bp97.js";import"./help-icon-CfV3_Ais.js";import"./spinner-AWUe4xwQ.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"./meta-content-BdypOdcN.js";import"./loader-XHoVniao.js";import"./label-Cz6TT90s.js";import"./select.input-DIKP56UZ.js";import"./styled-components.browser.esm-Bf0q9Yjk.js";import"./assertThisInitialized-B9jnkVVz.js";import"./text-B3-TSWok.js";const k=({width:o,height:n})=>e.jsx("div",{style:{background:"#ddd",width:o,height:n}}),ve={title:"Layout/Layout Examples",parameters:{layout:"fullscreen",docs:{story:{inline:!1,iframeHeight:400}}}},s=()=>{const[o,n]=b.useState(!0);return e.jsxs(e.Fragment,{children:[e.jsx(w,{}),e.jsx(L,{options:{title:"",sections:[]}}),e.jsx(g,{padding:!1,scroll:!1,children:e.jsxs(a,{spacing:0,height:"100%",children:[e.jsx(v,{button:e.jsx(m,{onClick:()=>n(!o),round:!0,icon:j.CHEVRON_LEFT}),open:o,width:300,closedWidth:"var(--size-sidebar)",children:e.jsx(C,{drawer:!0,narrow:!o,list:{name:"Reservoirs",items:[{id:1,name:"Lorem",active:!0},{id:2,name:"Ipsum"}]}})}),e.jsxs(r,{scroll:!0,padding:!0,borderLeft:!0,children:[e.jsxs(a,{children:[e.jsxs(r,{children:[e.jsx(t,{top:!0,children:"Reservoir name here"}),e.jsxs(F,{children:[e.jsx(l,{label:"Name",children:e.jsx(i,{value:"Reservoir name here",width:"200px"})}),e.jsx(l,{label:"Lorem",children:e.jsx(h,{name:"example",options:[{label:"Aardvarks",value:"termites"},{label:"Monkeys",value:"bananas"}],value:{label:"Monkeys",value:"bananas"},inline:!0})}),e.jsx(l,{label:"Ipsum",children:e.jsx(R,{name:"example",options:[{label:"Monkeys",value:"bananas"},{label:"Possums",value:"slugs"}],value:{label:"Monkeys",value:"bananas"},native:!0})}),e.jsx(l,{children:e.jsx(p,{label:"Dolor"})})]})]}),e.jsx(r,{flex:!1,children:e.jsx(m,{onClick:()=>{},round:!0,icon:"question"})})]}),e.jsxs(a,{children:[e.jsx(r,{width:"50%",children:e.jsx(d,{heading:e.jsx(t,{onClickHelp:()=>console.log("help!"),children:"Reservoir Zone"}),children:e.jsxs(a,{children:[e.jsxs(r,{width:"50%",children:[e.jsxs(l,{label:"Label",helpText:"Lorem ipsum",children:[e.jsx(h,{options:[{label:"Aardvarks",value:"termites"},{label:"Monkeys",value:"bananas"}],value:{label:"Monkeys",value:"bananas"},inline:!0}),e.jsx(i,{width:"100%"})]}),e.jsxs(l,{label:"Label",helpText:"Lorem ipsum",children:[e.jsx(p,{label:"Lorem ipsum"}),e.jsx(i,{width:"100%",disabled:!0})]}),e.jsx(l,{label:"Label",helpText:"Lorem ipsum",children:e.jsx(i,{width:"100%"})}),e.jsx(l,{label:"Label",helpText:"Lorem ipsum",children:e.jsx(i,{width:"100%"})})]}),e.jsxs(r,{width:"50%",children:[e.jsx(l,{label:"Label",helpText:"Lorem ipsum",children:e.jsx(i,{width:"100%"})}),e.jsx(l,{label:"Label",helpText:"Lorem ipsum",children:e.jsx(i,{width:"100%"})}),e.jsx(l,{label:"Label",helpText:"Lorem ipsum",children:e.jsx(i,{width:"100%"})}),e.jsx(l,{label:"Label",helpText:"Lorem ipsum",children:e.jsx(i,{width:"100%"})})]})]})})}),e.jsxs(r,{width:"50%",children:[e.jsx(d,{heading:e.jsx(t,{children:"Reservoir Size"}),children:e.jsxs(a,{children:[e.jsxs(r,{width:"160px",children:[e.jsx(l,{label:"Length",children:e.jsx(i,{width:"100%"})}),e.jsx(l,{label:"Width",children:e.jsx(i,{width:"100%"})})]}),e.jsx(r,{children:e.jsx(k,{width:"100%",height:"100%"})})]})}),e.jsx(f,{}),e.jsx(d,{heading:e.jsx(t,{children:"Reservoir Properties"}),children:e.jsxs(a,{children:[e.jsx(r,{children:e.jsx(l,{label:"Label",children:e.jsx(i,{width:"100%"})})}),e.jsx(r,{children:e.jsx(l,{label:"Label",children:e.jsx(i,{width:"100%"})})}),e.jsx(r,{children:e.jsx(l,{label:"Label",children:e.jsx(i,{width:"100%"})})})]})})]})]})]})]})})]})};s.__docgenInfo={description:"",methods:[],displayName:"Reservoirs"};var u,x,c;s.parameters={...s.parameters,docs:{...(u=s.parameters)==null?void 0:u.docs,source:{originalSource:`() => {
|
|
2
2
|
const [open, setOpen] = useState(true);
|
|
3
3
|
return <>
|
|
4
4
|
<TopBar />
|