@oliasoft-open-source/react-ui-library 4.6.11 → 4.6.13
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.d.ts +22 -0
- package/dist/index.js +150 -1
- package/dist/index.js.map +1 -1
- package/dist/storybook/assets/Color-6VNJS4EI-0Es0Y_hf.js +1 -0
- package/dist/storybook/assets/DocsRenderer-NNNQARDV-8Agqr_1z.js +1 -0
- package/dist/storybook/assets/WithTooltip-V3YHNWJZ-VkPCPx4O.js +1 -0
- package/dist/storybook/assets/{accordion-M-sY23Hd.js → accordion-MRdNs3mQ.js} +1 -1
- package/dist/storybook/assets/{accordion.stories-Ckfdc3yE.js → accordion.stories-fQEMJlxQ.js} +2 -2
- package/dist/storybook/assets/{actions-eW7plDvv.js → actions-0lKGEXVi.js} +1 -1
- package/dist/storybook/assets/{actions.stories-v91cA8Aa.js → actions.stories-1G9apUqW.js} +1 -1
- package/dist/storybook/assets/{afe.stories-O_jbxAft.js → afe.stories-YtbvNBzx.js} +2 -2
- package/dist/storybook/assets/{badge.stories-AQYzIvli.js → badge.stories-YE5hHtSe.js} +1 -1
- package/dist/storybook/assets/{blowout.stories-Vff9htu-.js → blowout.stories-xSwBWe5T.js} +1 -1
- package/dist/storybook/assets/{button-group-rkjreZ1T.js → button-group-0RTzcUIP.js} +1 -1
- package/dist/storybook/assets/{button-group.stories-HnVY5ZDT.js → button-group.stories-eQ5h-50o.js} +1 -1
- package/dist/storybook/assets/{button-yLYf8aC9.js → button-pSDG6Ka2.js} +1 -1
- package/dist/storybook/assets/{button.stories-sp9SbrbR.js → button.stories-QDP0P6s7.js} +6 -6
- package/dist/storybook/assets/{buttons-and-links-05g5wWR_.js → buttons-and-links-dSpYF4I_.js} +2 -2
- package/dist/storybook/assets/{card.stories--XA-NPtn.js → card.stories-nEB15GEp.js} +1 -1
- package/dist/storybook/assets/{casing-loads.stories-qq7nVcz2.js → casing-loads.stories-uu-yK01O.js} +2 -2
- package/dist/storybook/assets/{cell.stories-7M24NqPM.js → cell.stories-jU_N8b9E.js} +2 -2
- package/dist/storybook/assets/{check-box-TRAFDvOc.js → check-box--ih7cmR1.js} +1 -1
- package/dist/storybook/assets/{check-box.stories-xj8y4pvN.js → check-box.stories-WFbOF7kK.js} +1 -1
- package/dist/storybook/assets/{chunk-HLWAVYOI-4ciTSFM-.js → chunk-HLWAVYOI-TfoHKvis.js} +1 -1
- package/dist/storybook/assets/color-LJZaNnUB.js +25 -0
- package/dist/storybook/assets/{column.stories-wGhSlroa.js → column.stories-uR7F6GLZ.js} +1 -1
- package/dist/storybook/assets/dialog-kardLd1s.js +1 -0
- package/dist/storybook/assets/{drawer-NuViVQqw.js → drawer-fq99yzU7.js} +1 -1
- package/dist/storybook/assets/{drawer.stories-mIhzICjZ.js → drawer.stories-zos7-Jef.js} +2 -2
- package/dist/storybook/assets/{empty.stories-3hs4gUgZ.js → empty.stories-V5nX7JMj.js} +1 -1
- package/dist/storybook/assets/extends-dGVwEr9R.js +1 -0
- package/dist/storybook/assets/{field-UZtORY6D.js → field-V2qkm8ON.js} +1 -1
- package/dist/storybook/assets/{field.stories-DPmPvDCm.js → field.stories-oQ-oKw9H.js} +1 -1
- package/dist/storybook/assets/file-input-ASEHnODl.js +1 -0
- package/dist/storybook/assets/file-input.stories-K1-X4A2h.js +66 -0
- package/dist/storybook/assets/{flex.stories-7GcqtV92.js → flex.stories-rUC8irnS.js} +1 -1
- package/dist/storybook/assets/footer.stories-6IYhl3Y9.js +3 -0
- package/dist/storybook/assets/form.stories-TfCufaed.js +49 -0
- package/dist/storybook/assets/formation.stories-arormd_z.js +74 -0
- package/dist/storybook/assets/{formatter-SWP5E3XI-zMN0v4F6.js → formatter-SWP5E3XI-E_AUyOmB.js} +2 -2
- package/dist/storybook/assets/{heading-AvGkZ8ae.js → heading-OSdaYHYE.js} +1 -1
- package/dist/storybook/assets/{heading.stories-aJs549tG.js → heading.stories-YhoAJ5xD.js} +1 -1
- package/dist/storybook/assets/{help-icon-4sFVvBkZ.js → help-icon-jdxRTcvs.js} +1 -1
- package/dist/storybook/assets/{help-icon.stories-9Apwwl_z.js → help-icon.stories-NKBYmv_o.js} +1 -1
- package/dist/storybook/assets/icon-_m67DAr0.js +8 -0
- package/dist/storybook/assets/{icon.stories-j-b_Exev.js → icon.stories-2aZia1VV.js} +1 -1
- package/dist/storybook/assets/iframe-XBWdLgXl.js +7 -0
- package/dist/storybook/assets/{index-ozIFb807.js → index-g34udPZo.js} +5 -5
- package/dist/storybook/assets/{index.es-VXFRDikp.js → index.es-HG2GUH9i.js} +4 -4
- package/dist/storybook/assets/inheritsLoose-Y9jOMJLd.js +1 -0
- package/dist/storybook/assets/{input-group.stories-wQfcKDtd.js → input-group.stories-HXoMZkHB.js} +2 -2
- package/dist/storybook/assets/{input-validation-K4-DmgHM.js → input-validation-EHlvLdps.js} +2 -2
- package/dist/storybook/assets/{inputs-erHcgGCK.js → inputs-UqnSQlzK.js} +2 -2
- package/dist/storybook/assets/{label-am612zWx.js → label-KLaw_y6R.js} +1 -1
- package/dist/storybook/assets/{label.stories-QPyTvO7T.js → label.stories-8KngvJd3.js} +1 -1
- package/dist/storybook/assets/layout-forms-n0KRZ2JT.js +16 -0
- package/dist/storybook/assets/{layout-general-nk8z6z9i.js → layout-general-4Z_dYwOs.js} +2 -2
- package/dist/storybook/assets/{list-LWmKQq1G.js → list-HBgplEUa.js} +1 -1
- package/dist/storybook/assets/{list.stories-fgw3Kx3W.js → list.stories-AC7IBnuA.js} +2 -2
- package/dist/storybook/assets/{list.stories-data-IWB082tu.js → list.stories-data-YuaX7eYb.js} +1 -1
- package/dist/storybook/assets/{loader.stories-NaDVDl7Z.js → loader.stories-A0lEe-_I.js} +1 -1
- package/dist/storybook/assets/{menu.stories-K4nBhFj_.js → menu.stories-wWr6qpLS.js} +6 -6
- package/dist/storybook/assets/{message-CRKuTfOl.js → message-bbAE2zjv.js} +1 -1
- package/dist/storybook/assets/{message.stories-CSw6ElMp.js → message.stories-rANJfalB.js} +1 -1
- package/dist/storybook/assets/{meta-content-70Z_mWPh.js → meta-content-xcMHnFul.js} +1 -1
- package/dist/storybook/assets/{modal.stories-10-XQKON.js → modal.stories-GY64tFtP.js} +2 -2
- package/dist/storybook/assets/{number-input.stories-59JRvVcf.js → number-input.stories-oaHrqqEo.js} +5 -5
- package/dist/storybook/assets/{option-dropdown.stories-ZCnTHpeT.js → option-dropdown.stories-IIXgJvpF.js} +1 -1
- package/dist/storybook/assets/{padding-and-spacing-uyBZRJ5c.js → padding-and-spacing-6Wmzdt8V.js} +2 -2
- package/dist/storybook/assets/{page.stories-GrhPKgmq.js → page.stories-jmoBCw29.js} +1 -1
- package/dist/storybook/assets/{pagination-yFWOmymz.js → pagination-LajpPl1E.js} +1 -1
- package/dist/storybook/assets/{pagination.stories-IahSsrYh.js → pagination.stories-QNaX-nfT.js} +2 -2
- package/dist/storybook/assets/{pop-confirm.stories-StkaY9mZ.js → pop-confirm.stories-qL_Z99O8.js} +1 -1
- package/dist/storybook/assets/{popover-YDVuwgEX.js → popover-dGHzPDyA.js} +1 -1
- package/dist/storybook/assets/popover.stories-4yXf4qke.js +1 -0
- package/dist/storybook/assets/{preview-mNdmFu2O.js → preview-izL99lIf.js} +3 -3
- package/dist/storybook/assets/preview-sTJNaY8B.js +7 -0
- package/dist/storybook/assets/projects.stories-gJiQXNLT.js +47 -0
- package/dist/storybook/assets/{radio-button-g10vtbgR.js → radio-button-YSXmxvG2.js} +1 -1
- package/dist/storybook/assets/{radio-button.stories-Lm3AgSPw.js → radio-button.stories-kcqjIFI9.js} +1 -1
- package/dist/storybook/assets/react-router-dom-4Z66xYqZ.js +8 -0
- package/dist/storybook/assets/{reservoirs.stories-UloVc7w8.js → reservoirs.stories-SK2d9Fio.js} +2 -2
- package/dist/storybook/assets/{rich-text-input.stories-g_yH3vr8.js → rich-text-input.stories-zaKtuZiu.js} +3 -3
- package/dist/storybook/assets/{row.stories-c7qJDc3O.js → row.stories-U-yrdTYI.js} +2 -2
- package/dist/storybook/assets/select-7lyQEtzA.js +1 -0
- package/dist/storybook/assets/{select.stories-XhlzQ7cL.js → select.stories-xDbB-kMM.js} +2 -2
- package/dist/storybook/assets/{side-bar-hJdv8LbH.js → side-bar-5P37lMUr.js} +1 -1
- package/dist/storybook/assets/{side-bar.stories-Yhz9jXs2.js → side-bar.stories-JTyeqg4a.js} +1 -1
- package/dist/storybook/assets/{site.stories-KJRfCDdv.js → site.stories-h1X4It52.js} +2 -2
- package/dist/storybook/assets/slider-bFd0qknB.js +7 -0
- package/dist/storybook/assets/{slider.stories-R5xGydpl.js → slider.stories-EBNa8dCL.js} +2 -2
- package/dist/storybook/assets/smart-upload-modal.stories--J7j_ykg.js +25 -0
- package/dist/storybook/assets/{spacer.stories-9tR72ZgH.js → spacer.stories-Bp11g7WY.js} +1 -1
- package/dist/storybook/assets/syntaxhighlighter-B5GMVT5T-ACJ3LFR3.js +1 -0
- package/dist/storybook/assets/{table-plX5wbPy.js → table-YO72eq6-.js} +1 -1
- package/dist/storybook/assets/{table.stories-w4weqjQS.js → table.stories-87uvXmuW.js} +2 -2
- package/dist/storybook/assets/{table.stories-data-9T_1BLo6.js → table.stories-data-hDQBe08f.js} +1 -1
- package/dist/storybook/assets/text-link.stories-Plmiu8NV.js +14 -0
- package/dist/storybook/assets/{textarea-dAYYNVTs.js → textarea-XY_iUfzV.js} +1 -1
- package/dist/storybook/assets/{textarea.stories-tvP01BwE.js → textarea.stories-tpIT4O3R.js} +1 -1
- package/dist/storybook/assets/{title.stories-o7fCo4X-.js → title.stories-mhWM-m41.js} +3 -3
- package/dist/storybook/assets/{toaster-yPcd4ELJ.js → toaster-IL_npIpU.js} +1 -1
- package/dist/storybook/assets/{toaster.stories-4aAkEVaa.js → toaster.stories-2399ErHt.js} +1 -1
- package/dist/storybook/assets/{toggle-m3EwNS6z.js → toggle-KddTHsTd.js} +1 -1
- package/dist/storybook/assets/{toggle.stories-jaduywRN.js → toggle.stories-ZPLKo1CO.js} +1 -1
- package/dist/storybook/assets/{tooltip.test-case.stories-Sq5qLreq.js → tooltip.test-case.stories-e7KXJ1zz.js} +1 -1
- package/dist/storybook/assets/{top-bar-8ASbRXqr.js → top-bar-xIrfLvE9.js} +1 -1
- package/dist/storybook/assets/top-bar.stories-OWyuBUT6.js +21 -0
- package/dist/storybook/assets/{top-bar.testcase.stories-Yjz8R3nX.js → top-bar.testcase.stories-uu_mJjq3.js} +1 -1
- package/dist/storybook/assets/{tree.stories-VhgtyM-i.js → tree.stories-KFifRduQ.js} +1 -1
- package/dist/storybook/assets/{unit-input.stories--JK_4hwn.js → unit-input.stories-EPjs0Jo3.js} +1 -1
- package/dist/storybook/assets/unit-table.stories-KSzMk2ae.js +142 -0
- package/dist/storybook/iframe.html +1 -1
- package/dist/storybook/index.json +1 -1
- package/dist/storybook/project.json +1 -1
- package/dist/storybook/stories.json +1 -1
- package/package.json +1 -1
- package/dist/storybook/assets/Color-6VNJS4EI-GQwgd_ld.js +0 -1
- package/dist/storybook/assets/DocsRenderer-NNNQARDV-A0C5N1_E.js +0 -1
- package/dist/storybook/assets/WithTooltip-V3YHNWJZ-_ZdSUz6-.js +0 -1
- package/dist/storybook/assets/color-Sklm1A7t.js +0 -25
- package/dist/storybook/assets/dialog--p0h3TPY.js +0 -1
- package/dist/storybook/assets/file-input.stories-Mcb6uqW7.js +0 -66
- package/dist/storybook/assets/footer.stories-rwoGk_OR.js +0 -3
- package/dist/storybook/assets/form.stories-56ONaO3q.js +0 -49
- package/dist/storybook/assets/formation.stories-DzFYQPb4.js +0 -74
- package/dist/storybook/assets/icon-8EQazuuW.js +0 -8
- package/dist/storybook/assets/iframe-SOjg2hBS.js +0 -7
- package/dist/storybook/assets/inheritsLoose-8sb_A2v4.js +0 -1
- package/dist/storybook/assets/layout-forms-Zo8OvCqi.js +0 -16
- package/dist/storybook/assets/popover.stories-QeTPelqE.js +0 -1
- package/dist/storybook/assets/preview-HCxJn5W4.js +0 -7
- package/dist/storybook/assets/projects.stories-HDwAJ2lH.js +0 -47
- package/dist/storybook/assets/react-router-dom-EZH1n7K1.js +0 -8
- package/dist/storybook/assets/select-xiPCWaz8.js +0 -1
- package/dist/storybook/assets/slider-at3_DXQg.js +0 -7
- package/dist/storybook/assets/syntaxhighlighter-B5GMVT5T-bjqZHg5d.js +0 -1
- package/dist/storybook/assets/text-link.stories-Mx9ojcOC.js +0 -14
- package/dist/storybook/assets/top-bar.stories-9LS979MG.js +0 -21
- package/dist/storybook/assets/unit-table.stories-fbIAsylx.js +0 -142
|
@@ -0,0 +1 @@
|
|
|
1
|
+
function e(t,o){return e=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(r,n){return r.__proto__=n,r},e(t,o)}function c(t,o){t.prototype=Object.create(o.prototype),t.prototype.constructor=t,e(t,o)}export{c as _,e as a};
|
package/dist/storybook/assets/{input-group.stories-wQfcKDtd.js → input-group.stories-HXoMZkHB.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as n}from"./jsx-runtime-FsUICBgo.js";import{T as x}from"./common-types-U65vzrrz.js";import{I as t}from"./input-group-R8LoqKRn.js";import{I as h}from"./input-group-addon-BHVsW9mL.js";import{I as M}from"./input-w-UScEUy.js";import{B as C}from"./button-
|
|
1
|
+
import{j as n}from"./jsx-runtime-FsUICBgo.js";import{T as x}from"./common-types-U65vzrrz.js";import{I as t}from"./input-group-R8LoqKRn.js";import{I as h}from"./input-group-addon-BHVsW9mL.js";import{I as M}from"./input-w-UScEUy.js";import{B as C}from"./button-pSDG6Ka2.js";import{M as f}from"./actions-0lKGEXVi.js";import{S as I}from"./select-7lyQEtzA.js";import{T as P}from"./tooltip-gljV_DQ0.js";import{M as o}from"./types-VB5zD18b.js";import"./index-RfLt4OUa.js";import"./index-VW3EWkuE.js";import"./disabled-context-urNQThQz.js";import"./types-5uVBABF4.js";import"./lodash-Bmg8FrMx.js";import"./spinner-R8Il4aRe.js";import"./icon-_m67DAr0.js";import"./objectWithoutPropertiesLoose-9Q1jwsKS.js";import"./inheritsLoose-Y9jOMJLd.js";import"./tslib.es6-OIsz3r9a.js";import"./index-4QtD-hFu.js";import"./badge-23Ty_zBt.js";import"./extends-dGVwEr9R.js";import"./assertThisInitialized-4q6YPdh3.js";import"./memoize-one.esm-hqe5SRxC.js";import"./text-6KQ6ntOV.js";import"./select.input-zP5tW20f.js";import"./index-miLrID2P.js";const an={title:"Forms/InputGroup",component:t,args:{}},s=i=>n.jsxs(t,{...i,children:[n.jsx(h,{children:"$"}),n.jsx(M,{width:"100%",name:"example",value:"123",onChange:()=>{}}),n.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}),n.jsx(f,{menu:{label:"E-06/degC",trigger:x.DROP_DOWN_BUTTON,small:i.small,sections:[{type:o.OPTION,label:"403.5433",description:"ft",inline:!0,onClick:()=>{}},{type:o.OPTION,label:"0.123",description:"km",inline:!0,onClick:()=>{}},{type:o.OPTION,label:"4842.4608",description:"in",inline:!0,onClick:()=>{}}]}}),n.jsx(C,{name:"example",label:"Confirm",colored:!0,onClick:()=>{}})]}),l=s.bind({}),e=s.bind({});e.args={width:"480px"};const a=s.bind({});a.args={small:!0};const r=()=>n.jsxs(t,{children:[n.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"}}),n.jsx(P,{text:"This is a tooltip",children:n.jsx(C,{name:"example",label:"Confirm",colored:!0,onClick:()=>{},groupOrder:"last"})})]});var u,p,m;l.parameters={...l.parameters,docs:{...(u=l.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}>
|
|
@@ -164,4 +164,4 @@ import{j as n}from"./jsx-runtime-FsUICBgo.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
|
-
}`,...(y=(O=r.parameters)==null?void 0:O.docs)==null?void 0:y.source}}};const
|
|
167
|
+
}`,...(y=(O=r.parameters)==null?void 0:O.docs)==null?void 0:y.source}}};const ln=["Default","FixedWidth","Small","SelectWithButton"];export{l as Default,e as FixedWidth,r as SelectWithButton,a as Small,ln as __namedExportsOrder,an as default};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-FsUICBgo.js";import{M as s,C as n}from"./index-
|
|
1
|
+
import{j as e}from"./jsx-runtime-FsUICBgo.js";import{M as s,C as n}from"./index-g34udPZo.js";import{NonExistentValue as a,Error as l}from"./select.stories-xDbB-kMM.js";import{useMDXComponents as r}from"./index-4YXVTraW.js";import"./index-RfLt4OUa.js";import"./iframe-XBWdLgXl.js";import"../sb-preview/runtime.js";import"./index-miLrID2P.js";import"./extends-dGVwEr9R.js";import"./assertThisInitialized-4q6YPdh3.js";import"./inheritsLoose-Y9jOMJLd.js";import"./index-R5dkQuFe.js";import"./index-PPLHz8o0.js";import"./select-7lyQEtzA.js";import"./index-VW3EWkuE.js";import"./common-types-U65vzrrz.js";import"./disabled-context-urNQThQz.js";import"./types-5uVBABF4.js";import"./lodash-Bmg8FrMx.js";import"./tooltip-gljV_DQ0.js";import"./index-4QtD-hFu.js";import"./memoize-one.esm-hqe5SRxC.js";import"./types-VB5zD18b.js";import"./text-6KQ6ntOV.js";import"./actions-0lKGEXVi.js";import"./button-pSDG6Ka2.js";import"./spinner-R8Il4aRe.js";import"./icon-_m67DAr0.js";import"./objectWithoutPropertiesLoose-9Q1jwsKS.js";import"./tslib.es6-OIsz3r9a.js";import"./badge-23Ty_zBt.js";import"./select.input-zP5tW20f.js";import"./spacer-Yji9g2AW.js";function o(t){const i=Object.assign({h1:"h1",h2:"h2",h3:"h3",p:"p",code:"code",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}=Object.assign({},r(),t.components);return i?e.jsx(i,Object.assign({},t,{children:e.jsx(o,t)})):o(t)}export{R as default};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-FsUICBgo.js";import{M as r,C as o}from"./index-
|
|
1
|
+
import{j as e}from"./jsx-runtime-FsUICBgo.js";import{M as r,C as o}from"./index-g34udPZo.js";import{Default as l}from"./button.stories-QDP0P6s7.js";import{Default as a}from"./check-box.stories-WFbOF7kK.js";import{Default as c}from"./file-input.stories-K1-X4A2h.js";import{Default as d,Date as p}from"./input.stories-NMD1Bqi4.js";import{Default as h}from"./number-input.stories-oaHrqqEo.js";import{Default as m}from"./option-dropdown.stories-IIXgJvpF.js";import{Default as u}from"./radio-button.stories-kcqjIFI9.js";import{Native as f,Default as x}from"./select.stories-xDbB-kMM.js";import{Default as j}from"./slider.stories-EBNa8dCL.js";import{Default as b}from"./textarea.stories-tpIT4O3R.js";import{Default as g}from"./toggle.stories-ZPLKo1CO.js";import{useMDXComponents as s}from"./index-4YXVTraW.js";import"./index-RfLt4OUa.js";import"./iframe-XBWdLgXl.js";import"../sb-preview/runtime.js";import"./index-miLrID2P.js";import"./extends-dGVwEr9R.js";import"./assertThisInitialized-4q6YPdh3.js";import"./inheritsLoose-Y9jOMJLd.js";import"./index-R5dkQuFe.js";import"./index-PPLHz8o0.js";import"./react-router-dom-4Z66xYqZ.js";import"./index-4QtD-hFu.js";import"./tiny-invariant-R4kOKlvx.js";import"./objectWithoutPropertiesLoose-9Q1jwsKS.js";import"./flex-RYZsoWEN.js";import"./button-pSDG6Ka2.js";import"./index-VW3EWkuE.js";import"./common-types-U65vzrrz.js";import"./disabled-context-urNQThQz.js";import"./spinner-R8Il4aRe.js";import"./icon-_m67DAr0.js";import"./tslib.es6-OIsz3r9a.js";import"./tooltip-gljV_DQ0.js";import"./check-box--ih7cmR1.js";import"./help-icon-jdxRTcvs.js";import"./file-input-ASEHnODl.js";import"./input-group-R8LoqKRn.js";import"./input-w-UScEUy.js";import"./types-5uVBABF4.js";import"./lodash-Bmg8FrMx.js";import"./spacer-Yji9g2AW.js";import"./message-bbAE2zjv.js";import"./textarea-XY_iUfzV.js";import"./index-qZmQ7nA9.js";import"./index-cCpkwrS5.js";import"./number-input-hrCn3Rag.js";import"./input-group-addon-BHVsW9mL.js";import"./select-7lyQEtzA.js";import"./memoize-one.esm-hqe5SRxC.js";import"./types-VB5zD18b.js";import"./text-6KQ6ntOV.js";import"./actions-0lKGEXVi.js";import"./badge-23Ty_zBt.js";import"./select.input-zP5tW20f.js";import"./divider-RwW2f_N0.js";import"./radio-button-YSXmxvG2.js";import"./slider-bFd0qknB.js";import"./objectSpread2-93s0nBry.js";import"./index-ugi_ZH6T.js";import"./toggle-KddTHsTd.js";function i(n){const t=Object.assign({h1:"h1",p:"p",h2:"h2",strong:"strong",ul:"ul",li:"li",code:"code",h3:"h3",a:"a"},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"}),`
|
|
@@ -59,4 +59,4 @@ particularly on touch devices.`]}),`
|
|
|
59
59
|
`,e.jsx(o,{of:j}),`
|
|
60
60
|
`,e.jsx(t.h2,{id:"file-input",children:"File Input"}),`
|
|
61
61
|
`,e.jsxs(t.p,{children:["Use a ",e.jsx(t.code,{children:"FileInput"})," when a user needs to upload a file. The ",e.jsx(t.code,{children:"accept"})," prop allows you to restrict the accepted file types."]}),`
|
|
62
|
-
`,e.jsx(o,{of:c})]})}function
|
|
62
|
+
`,e.jsx(o,{of:c})]})}function $e(n={}){const{wrapper:t}=Object.assign({},s(),n.components);return t?e.jsx(t,Object.assign({},n,{children:e.jsx(i,n)})):i(n)}export{$e as default};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as t}from"./jsx-runtime-FsUICBgo.js";import{c as m}from"./index-VW3EWkuE.js";import{I as a}from"./common-types-U65vzrrz.js";import{H as n}from"./help-icon-
|
|
1
|
+
import{j as t}from"./jsx-runtime-FsUICBgo.js";import{c as m}from"./index-VW3EWkuE.js";import{I as a}from"./common-types-U65vzrrz.js";import{H as n}from"./help-icon-jdxRTcvs.js";const b="_label_18pfe_1",v="_labelLeft_18pfe_5",x="_icons_18pfe_13",i={label:b,labelLeft:v,icons:x},u=({label:s=null,width:c="auto",helpText:o="",helpTextMaxWidth:p="300px",onClickHelp:r=void 0,lock:e={visible:!1,active:!1,onClick:()=>{},tooltip:"",testId:void 0},info:d,libraryIcon:l,labelLeft:f=!1})=>t.jsx("div",{className:m(i.label,f?i.labelLeft:""),children:t.jsxs("label",{style:{width:c||""},children:[s,t.jsxs("div",{className:i.icons,children:[(o||r)&&t.jsx(n,{text:o,onClick:r,maxWidth:p}),d&&t.jsx(n,{text:d,icon:a.INFO}),e&&e.visible&&e.onClick&&t.jsx(n,{onClick:e.onClick,icon:e.active?a.LOCK:a.UNLOCK,active:e.active,testId:e.testId}),l&&t.jsx(n,{text:(l==null?void 0:l.tooltip)??"",onClick:l.onClick,icon:a.LIBRARY})]})]})});try{u.displayName="Label",u.__docgenInfo={description:"",displayName:"Label",props:{label:{defaultValue:{value:"null"},description:"",name:"label",required:!1,type:{name:"string | number | boolean | ReactElement<any, string | JSXElementConstructor<any>> | Iterable<ReactNode> | ReactPortal | null"}},helpText:{defaultValue:{value:""},description:"",name:"helpText",required:!1,type:{name:"string | number | boolean | ReactElement<any, string | JSXElementConstructor<any>> | Iterable<ReactNode> | ReactPortal | null"}},helpTextMaxWidth:{defaultValue:{value:"300px"},description:"",name:"helpTextMaxWidth",required:!1,type:{name:"TStringOrNumber"}},width:{defaultValue:{value:"auto"},description:"",name:"width",required:!1,type:{name:"TStringOrNumber"}},info:{defaultValue:null,description:"",name:"info",required:!1,type:{name:"string"}},onClickHelp:{defaultValue:{value:"undefined"},description:"",name:"onClickHelp",required:!1,type:{name:"((event?: MouseEvent<HTMLDivElement, MouseEvent>) => void)"}},lock:{defaultValue:{value:`{
|
|
2
2
|
visible: false,
|
|
3
3
|
active: false,
|
|
4
4
|
onClick: () => {},
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j}from"./jsx-runtime-FsUICBgo.js";import{r as E}from"./index-RfLt4OUa.js";import{L as n}from"./label-
|
|
1
|
+
import{j}from"./jsx-runtime-FsUICBgo.js";import{r as E}from"./index-RfLt4OUa.js";import{L as n}from"./label-KLaw_y6R.js";import"./index-VW3EWkuE.js";import"./common-types-U65vzrrz.js";import"./help-icon-jdxRTcvs.js";import"./tooltip-gljV_DQ0.js";import"./index-miLrID2P.js";import"./icon-_m67DAr0.js";import"./objectWithoutPropertiesLoose-9Q1jwsKS.js";import"./inheritsLoose-Y9jOMJLd.js";import"./tslib.es6-OIsz3r9a.js";import"./index-4QtD-hFu.js";import"./disabled-context-urNQThQz.js";const K={title:"Forms/Label",component:n,args:{label:"Label"}},t=e=>j.jsx(n,{...e}),c=t.bind({}),o=t.bind({});o.args={helpText:"Tooltip goes here"};const r=t.bind({});r.args={onClickHelp:()=>{}};const s=t.bind({});s.args={info:"Info goes here"};const l=()=>{const[e,v]=E.useState(!1),y=()=>v(!e);return j.jsx(n,{label:"Label",lock:{visible:!0,active:e,onClick:y,tooltip:e?"Unlock":"Lock",testId:"testId"}})},a=t.bind({});a.args={libraryIcon:{onClick:()=>{},tooltip:"View in library"}};var p,i,m;c.parameters={...c.parameters,docs:{...(p=c.parameters)==null?void 0:p.docs,source:{originalSource:"(args: ILabelProps) => <Label {...args} />",...(m=(i=c.parameters)==null?void 0:i.docs)==null?void 0:m.source}}};var d,b,g;o.parameters={...o.parameters,docs:{...(d=o.parameters)==null?void 0:d.docs,source:{originalSource:"(args: ILabelProps) => <Label {...args} />",...(g=(b=o.parameters)==null?void 0:b.docs)==null?void 0:g.source}}};var L,u,k;r.parameters={...r.parameters,docs:{...(L=r.parameters)==null?void 0:L.docs,source:{originalSource:"(args: ILabelProps) => <Label {...args} />",...(k=(u=r.parameters)==null?void 0:u.docs)==null?void 0:k.source}}};var I,f,x;s.parameters={...s.parameters,docs:{...(I=s.parameters)==null?void 0:I.docs,source:{originalSource:"(args: ILabelProps) => <Label {...args} />",...(x=(f=s.parameters)==null?void 0:f.docs)==null?void 0:x.source}}};var S,T,h;l.parameters={...l.parameters,docs:{...(S=l.parameters)==null?void 0:S.docs,source:{originalSource:`() => {
|
|
2
2
|
const [locked, setLocked] = useState(false);
|
|
3
3
|
const handleToggleLock = () => setLocked(!locked);
|
|
4
4
|
return <Label label="Label" lock={{
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import{j as t}from"./jsx-runtime-FsUICBgo.js";import{M as s,C as o}from"./index-g34udPZo.js";import{Default as p,LabelOnLeft as m}from"./field.stories-oQ-oKw9H.js";import{Default as l,LabelsOnLeft as a,Row as h}from"./form.stories-TfCufaed.js";import{useMDXComponents as n}from"./index-4YXVTraW.js";import"./index-RfLt4OUa.js";import"./iframe-XBWdLgXl.js";import"../sb-preview/runtime.js";import"./index-miLrID2P.js";import"./extends-dGVwEr9R.js";import"./assertThisInitialized-4q6YPdh3.js";import"./inheritsLoose-Y9jOMJLd.js";import"./index-R5dkQuFe.js";import"./index-PPLHz8o0.js";import"./field-V2qkm8ON.js";import"./index-VW3EWkuE.js";import"./label-KLaw_y6R.js";import"./common-types-U65vzrrz.js";import"./help-icon-jdxRTcvs.js";import"./tooltip-gljV_DQ0.js";import"./icon-_m67DAr0.js";import"./objectWithoutPropertiesLoose-9Q1jwsKS.js";import"./tslib.es6-OIsz3r9a.js";import"./index-4QtD-hFu.js";import"./disabled-context-urNQThQz.js";import"./input-w-UScEUy.js";import"./types-5uVBABF4.js";import"./lodash-Bmg8FrMx.js";import"./text-6KQ6ntOV.js";import"./select-7lyQEtzA.js";import"./memoize-one.esm-hqe5SRxC.js";import"./types-VB5zD18b.js";import"./actions-0lKGEXVi.js";import"./button-pSDG6Ka2.js";import"./spinner-R8Il4aRe.js";import"./badge-23Ty_zBt.js";import"./select.input-zP5tW20f.js";import"./check-box--ih7cmR1.js";import"./button-group-0RTzcUIP.js";import"./toggle-KddTHsTd.js";import"./input-group-R8LoqKRn.js";import"./input-group-addon-BHVsW9mL.js";import"./slider-bFd0qknB.js";import"./objectSpread2-93s0nBry.js";import"./index-ugi_ZH6T.js";import"./textarea-XY_iUfzV.js";import"./radio-button-YSXmxvG2.js";import"./form-row-bwoDTUga.js";function r(e){const i=Object.assign({h1:"h1",h2:"h2",p:"p",code:"code"},n(),e.components);return t.jsxs(t.Fragment,{children:[t.jsx(s,{title:"Layout (Forms)"}),`
|
|
2
|
+
`,t.jsx(i.h1,{id:"layout-forms",children:"Layout (Forms)"}),`
|
|
3
|
+
`,t.jsx(i.h2,{id:"field",children:"Field"}),`
|
|
4
|
+
`,t.jsxs(i.p,{children:["This is a wrapper for any form element with default bottom margin, and props like ",t.jsx(i.code,{children:"label"})," for other default styling."]}),`
|
|
5
|
+
`,t.jsx(o,{of:p}),`
|
|
6
|
+
`,t.jsxs(i.p,{children:["For inline labels, use the ",t.jsx(i.code,{children:"labelLeft"})," prop (and the optional ",t.jsx(i.code,{children:"labelWidth"}),")."]}),`
|
|
7
|
+
`,t.jsx(o,{of:m}),`
|
|
8
|
+
`,t.jsx(i.h2,{id:"stacked",children:"Stacked"}),`
|
|
9
|
+
`,t.jsxs(i.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(i.code,{children:"TextArea"}),")."]}),`
|
|
10
|
+
`,t.jsx(o,{of:l}),`
|
|
11
|
+
`,t.jsx(i.h2,{id:"stacked-with-inline-labels",children:"Stacked with inline labels"}),`
|
|
12
|
+
`,t.jsxs(i.p,{children:["This has the same markup, but with ",t.jsx(i.code,{children:"labelLeft"})," and ",t.jsx(i.code,{children:"labelWidth"})," set on each field."]}),`
|
|
13
|
+
`,t.jsx(o,{of:a}),`
|
|
14
|
+
`,t.jsx(i.h2,{id:"row",children:"Row"}),`
|
|
15
|
+
`,t.jsxs(i.p,{children:["Wrapping a group of form controls in ",t.jsx(i.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 st(e={}){const{wrapper:i}=Object.assign({},n(),e.components);return i?t.jsx(i,Object.assign({},e,{children:t.jsx(r,e)})):r(e)}export{st as default};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-FsUICBgo.js";import{M as r,C as n}from"./index-
|
|
1
|
+
import{j as e}from"./jsx-runtime-FsUICBgo.js";import{M as r,C as n}from"./index-g34udPZo.js";import{Center as d,SpaceBetween as a,JustifyEnd as c,Column as l}from"./flex.stories-rUC8irnS.js";import{Default as h,CustomColumnWidth as p,DefaultGap as x,CustomGap as m,Responsive as j}from"./grid.stories-hPfW-CxX.js";import{Default as u,FixedWidth as f,NoPadding as g,ResponsiveWidth as w}from"./column.stories-uR7F6GLZ.js";import{useMDXComponents as s}from"./index-4YXVTraW.js";import"./index-RfLt4OUa.js";import"./iframe-XBWdLgXl.js";import"../sb-preview/runtime.js";import"./index-miLrID2P.js";import"./extends-dGVwEr9R.js";import"./assertThisInitialized-4q6YPdh3.js";import"./inheritsLoose-Y9jOMJLd.js";import"./index-R5dkQuFe.js";import"./index-PPLHz8o0.js";import"./flex-RYZsoWEN.js";import"./button-pSDG6Ka2.js";import"./index-VW3EWkuE.js";import"./common-types-U65vzrrz.js";import"./disabled-context-urNQThQz.js";import"./spinner-R8Il4aRe.js";import"./icon-_m67DAr0.js";import"./objectWithoutPropertiesLoose-9Q1jwsKS.js";import"./tslib.es6-OIsz3r9a.js";import"./index-4QtD-hFu.js";import"./tooltip-gljV_DQ0.js";import"./text-6KQ6ntOV.js";import"./grid-u1mZpaML.js";import"./styled-components.browser.esm-qIipjd6c.js";import"./card-0r8RRVk-.js";import"./row-vFUhHoz5.js";import"./heading-OSdaYHYE.js";import"./help-icon-jdxRTcvs.js";function t(i){const o=Object.assign({h1:"h1",h2:"h2",p:"p",code:"code",h3:"h3"},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."]}),`
|
|
@@ -32,4 +32,4 @@ import{j as e}from"./jsx-runtime-FsUICBgo.js";import{M as r,C as n}from"./index-
|
|
|
32
32
|
`,e.jsx(n,{of:g}),`
|
|
33
33
|
`,e.jsx(o.h3,{id:"responsive",children:"Responsive"}),`
|
|
34
34
|
`,e.jsxs(o.p,{children:["To change the layout on smaller devices, you can set props for ",e.jsx(o.code,{children:"widthTablet"})," (up to 992px wide) and/or ",e.jsx(o.code,{children:"widthMobile"})," (up to 575px wide)."]}),`
|
|
35
|
-
`,e.jsx(n,{of:w})]})}function
|
|
35
|
+
`,e.jsx(n,{of:w})]})}function Z(i={}){const{wrapper:o}=Object.assign({},s(),i.components);return o?e.jsx(o,Object.assign({},i,{children:e.jsx(t,i)})):t(i)}export{Z as default};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-FsUICBgo.js";import{r as o}from"./index-RfLt4OUa.js";import{c as V}from"./index-VW3EWkuE.js";import{P as ae,D as ne,C as re,I as te}from"./index.es-
|
|
1
|
+
import{j as e}from"./jsx-runtime-FsUICBgo.js";import{r as o}from"./index-RfLt4OUa.js";import{c as V}from"./index-VW3EWkuE.js";import{P as ae,D as ne,C as re,I as te}from"./index.es-HG2GUH9i.js";import{C as le}from"./card-0r8RRVk-.js";import{l as r,N as se,M as ie,L as oe}from"./meta-content-xcMHnFul.js";import{I as k}from"./common-types-U65vzrrz.js";import{D as B}from"./disabled-context-urNQThQz.js";import{A as G}from"./actions-0lKGEXVi.js";import{B as F}from"./badge-23Ty_zBt.js";import{I as w}from"./icon-_m67DAr0.js";import{L as ce}from"./loader-TGOJBZQG.js";const E=({label:a})=>a?e.jsx("span",{className:r.label,children:e.jsx(F,{color:a.color,title:a.value,small:a.small})}):null;try{E.displayName="Label",E.__docgenInfo={description:"",displayName:"Label",props:{label:{defaultValue:null,description:"",name:"label",required:!1,type:{name:"ILabel"}}}}}catch{}const L=({item:a})=>a.metaCount!==void 0?e.jsx(F,{color:"rgba(0,0,0,0.25)",title:a.metaCount}):null;try{L.displayName="MetaCount",L.__docgenInfo={description:"",displayName:"MetaCount",props:{item:{defaultValue:null,description:"",name:"item",required:!0,type:{name:"{ metaCount?: number | undefined; }"}}}}}catch{}const R=({item:a,expanding:i})=>{const c=d=>{d.preventDefault(),d.stopPropagation()};return i&&a.active&&a.content?e.jsx("div",{className:r.itemContent,onClick:c,children:a.content}):null};try{R.displayName="ItemContent",R.__docgenInfo={description:"",displayName:"ItemContent",props:{item:{defaultValue:null,description:"",name:"item",required:!0,type:{name:"{ active?: boolean | undefined; content?: ReactNode; }"}},expanding:{defaultValue:null,description:"",name:"expanding",required:!1,type:{name:"boolean"}}}}}catch{}const M=o.forwardRef(({item:a,index:i},c)=>{const d=o.useContext(B),{actions:_,disabled:u,expanded:g,onClick:b,title:t,name:s,icon:n,testId:p}=a;return e.jsx("div",{ref:f=>{c&&"current"in c&&Array.isArray(c.current)&&i!==void 0&&(c.current[i]=f)},"data-testid":p??null,className:V(r.item,r.heading,u||d?r.disabled:"",b?r.action:""),onClick:f=>{b&&b(f)},title:t,children:e.jsx("div",{children:e.jsxs("div",{className:r.itemHeader,children:[typeof g=="boolean"&&e.jsx("div",{className:V(r.expandIcon,g&&r.expanded),children:e.jsx(w,{icon:k.CHEVRON_RIGHT})}),e.jsx(se,{name:s,icon:n}),e.jsxs("div",{className:r.right,children:[e.jsx(L,{item:a}),!(u||d)&&_&&e.jsx("div",{className:r.actions,children:e.jsx(G,{actions:a.actions??[]})})]})]})})})});try{M.displayName="ListSubheading",M.__docgenInfo={description:"",displayName:"ListSubheading",props:{item:{defaultValue:null,description:"",name:"item",required:!0,type:{name:"IListSubheadingItem"}},index:{defaultValue:null,description:"",name:"index",required:!1,type:{name:"number"}}}}}catch{}const de=(a,i)=>a?{cursor:i.cursor?i.cursor:"",...a.style}:null,H=o.forwardRef(({items:a,expanding:i,invokeEditOnRowClick:c,provided:d,draggable:_},u)=>{const g=o.useContext(B),b=(t,s,n,p,f,y)=>{const h=n.component||"a";return o.createElement(h,{href:n.url,to:n.url,ref:s==null?void 0:s.innerRef,...s.draggableProps,style:de(s.draggableProps,n),className:V(r.item,n.active?r.active:"",n.disabled||g?r.disabled:"",f?r.action:""),onClick:m=>{if(c&&y&&y.onClick&&y.onClick(m,n.id),n.onClick)return n.onClick(m)},key:t,"data-id":t,title:n.title,"data-testid":n.testId},e.jsxs("div",{ref:m=>{u&&"current"in u&&Array.isArray(u.current)&&t!==void 0&&(u.current[t]=m)},style:{paddingLeft:p},children:[e.jsxs("div",{className:r.itemHeader,children:[_&&e.jsx("div",{className:r.drag,...s.dragHandleProps,children:e.jsx(w,{icon:k.DRAG})}),n.level&&n.level>0?e.jsx("div",{className:r.indentIcon,children:e.jsx(w,{icon:k.INDENT})}):null,e.jsx(E,{label:n.label}),e.jsx(ie,{item:n}),e.jsxs("div",{className:r.right,children:[e.jsx(L,{item:n}),!(n.disabled||g)&&n.actions&&e.jsx("div",{className:r.actions,children:e.jsx(G,{actions:n.actions})})]})]}),e.jsx(R,{item:n,expanding:i})]}))};return e.jsxs(e.Fragment,{children:[a.map((t,s)=>{const n=t.type==="Heading",p=t.actions&&t.actions.find(h=>{var m;return h.label&&((m=String(h.label))==null?void 0:m.toLowerCase())==="edit"}),f=!!(p||t.url||t.onClick),y=t.level&&t.level>1?(t.level-1)*20:0;return n?e.jsx(M,{ref:u,item:t,index:s},s):_?e.jsx(ae,{draggableId:t.id+"",index:s,children:h=>b(s,h,t,y,f,p)},t.id):b(s,d,t,y,f,p)}),d.placeholder]})});try{H.displayName="ListRow",H.__docgenInfo={description:"",displayName:"ListRow",props:{draggable:{defaultValue:null,description:"",name:"draggable",required:!1,type:{name:"boolean"}},expanding:{defaultValue:null,description:"",name:"expanding",required:!1,type:{name:"boolean"}},invokeEditOnRowClick:{defaultValue:null,description:"",name:"invokeEditOnRowClick",required:!1,type:{name:"boolean"}},onListReorder:{defaultValue:null,description:"",name:"onListReorder",required:!1,type:{name:"((args: { from?: number; to?: number; }) => void) | undefined"}},items:{defaultValue:null,description:"",name:"items",required:!0,type:{name:"IListItem[]"}},provided:{defaultValue:null,description:"",name:"provided",required:!1,type:{name:"any"}},snapshot:{defaultValue:null,description:"",name:"snapshot",required:!1,type:{name:"DroppableStateSnapshot"}}}}}catch{}const P=({list:a,bordered:i=!1,expanding:c=!1,narrow:d=!1,toggleNarrow:_=!1,onToggleNarrow:u=()=>{},invokeEditOnRowClick:g=!0,noHeader:b=!1,stickyHeader:t,draggable:s=!1,onListReorder:n=()=>{},marginBottom:p=0,height:f,testId:y,scrollDetails:h={scrollable:!1,hideScrollbar:!1,triggerScrollToActiveItem:!1,infiniteScroll:!1,limit:10,infiniteScrollTarget:void 0}})=>{const{scrollable:m,hideScrollbar:z,triggerScrollToActiveItem:T,infiniteScroll:A,infiniteScrollTarget:J}=h,v=o.useRef(null),I=o.useRef([]),j=o.useRef(null),O=A?Math.ceil(window.innerHeight/44):a.items.length,[N,K]=o.useState(O),[Q,U]=o.useState(N<(a==null?void 0:a.items.length));o.useEffect(()=>{I.current=I.current.slice(0,a.items.length)},[a.items.length]);const W=()=>{if(N>=a.items.length){U(!1);return}const l=O+N;K(l)},X=l=>l.findIndex(x=>x.active===!0),Y=l=>{if(!j.current||!v.current)return;const x=1;if(T&&l>=0){const D=I.current.reduce((q,$,ee)=>ee<l?q+$.clientHeight+x:q,0),S=j.current.clientHeight/2-I.current[l].clientHeight/2,C=D-S;if(t){const q=v.current.clientHeight/2;j.current.scrollTop=C+q}const Z=v.current.clientHeight;j.current.scrollTop=C+Z}};return o.useEffect(()=>{if(T){const l=X(a==null?void 0:a.items);Y(l)}},[j.current,v.current,T]),e.jsx(ne,{onDragEnd:l=>{var S,C;const x=(S=l==null?void 0:l.source)==null?void 0:S.index,D=(C=l==null?void 0:l.destination)==null?void 0:C.index;n({from:x,to:D})},children:e.jsx(re,{droppableId:"droppable",children:(l,x)=>e.jsx("div",{className:V(d?r.narrow:"",m?r.scrollableList:"",z?r.hideScrollbar:""),"data-testid":y,id:"scrollableDiv",style:{height:f,marginBottom:p},ref:j,children:e.jsx("div",{ref:l.innerRef,...l.droppableProps,children:e.jsxs(le,{bordered:i,padding:!1,children:[!b&&e.jsx(oe,{name:a.name,actions:a.actions,toggleNarrow:_,onToggleNarrow:u,stickyHeader:t,ref:v}),e.jsx("div",{className:V(r.list,i?r.bordered:""),children:A?e.jsx(te,{dataLength:N,next:W,hasMore:Q,scrollableTarget:J||"scrollableDiv",loader:e.jsx(ce,{}),className:r.infiniteScrollContainer,children:e.jsx(H,{draggable:s,items:a.items.slice(0,N),expanding:c,invokeEditOnRowClick:g,onListReorder:n,provided:l,snapshot:x,ref:I})}):e.jsx(H,{draggable:s,items:a.items,expanding:c,invokeEditOnRowClick:g,onListReorder:n,provided:l,snapshot:x,ref:I})})]})})})})})};try{P.displayName="List",P.__docgenInfo={description:"",displayName:"List",props:{drawer:{defaultValue:null,description:"",name:"drawer",required:!1,type:{name:"boolean"}},list:{defaultValue:null,description:"",name:"list",required:!0,type:{name:"IListData"}},bordered:{defaultValue:{value:"false"},description:"",name:"bordered",required:!1,type:{name:"boolean"}},expanding:{defaultValue:{value:"false"},description:"",name:"expanding",required:!1,type:{name:"boolean"}},narrow:{defaultValue:{value:"false"},description:"",name:"narrow",required:!1,type:{name:"boolean"}},toggleNarrow:{defaultValue:{value:"false"},description:"",name:"toggleNarrow",required:!1,type:{name:"boolean"}},onToggleNarrow:{defaultValue:{value:"() => {}"},description:"",name:"onToggleNarrow",required:!1,type:{name:"TEmpty"}},invokeEditOnRowClick:{defaultValue:{value:"true"},description:"",name:"invokeEditOnRowClick",required:!1,type:{name:"boolean"}},noHeader:{defaultValue:{value:"false"},description:"",name:"noHeader",required:!1,type:{name:"boolean"}},stickyHeader:{defaultValue:null,description:"",name:"stickyHeader",required:!1,type:{name:"boolean"}},draggable:{defaultValue:{value:"false"},description:"",name:"draggable",required:!1,type:{name:"boolean"}},onListReorder:{defaultValue:{value:"() => {}"},description:"",name:"onListReorder",required:!1,type:{name:"((args: IReorderData) => void)"}},marginBottom:{defaultValue:{value:"0"},description:"",name:"marginBottom",required:!1,type:{name:"string | number"}},height:{defaultValue:null,description:"",name:"height",required:!1,type:{name:"string | number"}},testId:{defaultValue:null,description:"",name:"testId",required:!1,type:{name:"string"}},scrollDetails:{defaultValue:{value:`{
|
|
2
2
|
scrollable: false,
|
|
3
3
|
hideScrollbar: false,
|
|
4
4
|
triggerScrollToActiveItem: false,
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as s}from"./jsx-runtime-FsUICBgo.js";import{r as B}from"./index-RfLt4OUa.js";import{f as x}from"./immer.esm-bD7SSJ7T.js";import{H as on,S as dn,R as z,L as G}from"./react-router-dom-
|
|
1
|
+
import{j as s}from"./jsx-runtime-FsUICBgo.js";import{r as B}from"./index-RfLt4OUa.js";import{f as x}from"./immer.esm-bD7SSJ7T.js";import{H as on,S as dn,R as z,L as G}from"./react-router-dom-4Z66xYqZ.js";import{L as y,a as P}from"./list-HBgplEUa.js";import{L as mn}from"./meta-content-xcMHnFul.js";import{F as ln}from"./flex-RYZsoWEN.js";import{a as cn,b as pn,c as un,d as gn,e as hn,f as yn,g as bn,h as kn,i as xn,j as fn,k as Sn,m as In,n as Cn,o as rn}from"./list.stories-data-YuaX7eYb.js";import"./inheritsLoose-Y9jOMJLd.js";import"./index-4QtD-hFu.js";import"./extends-dGVwEr9R.js";import"./tiny-invariant-R4kOKlvx.js";import"./objectWithoutPropertiesLoose-9Q1jwsKS.js";import"./index-VW3EWkuE.js";import"./index.es-HG2GUH9i.js";import"./redux-F5dueAP3.js";import"./objectSpread2-93s0nBry.js";import"./index-miLrID2P.js";import"./memoize-one.esm-hqe5SRxC.js";import"./card-0r8RRVk-.js";import"./common-types-U65vzrrz.js";import"./disabled-context-urNQThQz.js";import"./actions-0lKGEXVi.js";import"./lodash-Bmg8FrMx.js";import"./button-pSDG6Ka2.js";import"./spinner-R8Il4aRe.js";import"./icon-_m67DAr0.js";import"./tslib.es6-OIsz3r9a.js";import"./tooltip-gljV_DQ0.js";import"./types-VB5zD18b.js";import"./types-5uVBABF4.js";import"./badge-23Ty_zBt.js";import"./loader-TGOJBZQG.js";import"./heading-OSdaYHYE.js";import"./help-icon-jdxRTcvs.js";const sa={title:"Basic/List",component:y,args:{list:cn,noHeader:!0},parameters:{layout:"fullscreen"}},o=d=>s.jsx(y,{...d}),O=o.bind({}),L=o.bind({});L.args={list:pn};const D=o.bind({});D.args={list:un};const v=o.bind({});v.args={list:gn};const K=o.bind({});K.args={list:hn,expanding:!0};const H=o.bind({});H.args={list:yn,noHeader:!1};const M=o.bind({});M.args={list:bn};const j=o.bind({});j.args={list:kn};const R=o.bind({});R.args={list:xn};const T=o.bind({});T.args={list:fn};const E=o.bind({});E.args={list:Sn,noHeader:!1};const w=o.bind({});w.args={bordered:!0};const N=o.bind({});N.args={list:In};const $=o.bind({});$.args={list:Cn};const S=o.bind({});S.args={list:rn,noHeader:!1,stickyHeader:!0};S.parameters={docs:{story:{inline:!1,iframeHeight:200}}};const f=o.bind({});f.args={list:rn,scrollDetails:{scrollable:!0}};f.parameters={docs:{description:{story:"Adds an internal scrollbar to the `List`, which will fill its parent height unless a `height` is set. The scrollbar can be toggled using `hideScrollbar`."}}};f.decorators=[d=>s.jsx("div",{style:{height:200,overflow:"hidden"},children:d()})];const J=()=>{const[d,b]=B.useState(0),k={name:"Animals",items:[...Array(50)].map((m,l)=>({id:l,name:`Aardvark #${l+1}`,active:l===d,onClick:()=>b(l)}))};return s.jsx("div",{style:{height:200,overflow:"auto"},children:s.jsx(y,{list:k,scrollDetails:{infiniteScroll:!0,scrollable:!0,limit:10}})})},_=()=>{const d=(e,a)=>{switch(a.type){case"headingClicked":{const{headingKey:t}=a.payload;return x(e,r=>{const i=r[t];i.expanded=!i.expanded})}case"itemClicked":{const{headingKey:t,itemIndex:r}=a.payload;return x(e,i=>{Object.keys(i).forEach(h=>{i[h].items.forEach((A,sn)=>{A.active=h===t&&sn===r})})})}case"addClicked":{const{headingKey:t}=a.payload;return x(e,r=>{const i=r[t];i.expanded=!0,i.items.push({name:`${i.label} #${i.items.length+1}`})})}case"deleteClicked":{const{headingKey:t,itemIndex:r}=a.payload;return x(e,i=>{let{items:h}=i[t];delete h[r],i[t].items=h.filter(A=>A)})}default:return e}},b=()=>({mammals:{draggable:!0,name:"Mammals",key:"mammals",label:"Mammals",expanded:!0,items:[{name:"Click item to scroll",type:"Heading"},{name:"Mammal #1",active:!0},{name:"Mammal #2"},{name:"Mammal #3"},{name:"Mammal #4"},{name:"Mammal #5"},{name:"Mammal #6"},{name:"Mammal #7"},{name:"Mammal #8"},{name:"Mammal #9"},{name:"Mammal #10"}]},amphibians:{name:"Amphibians (sticky header)",key:"amphibians",label:"Amphibians",expanded:!0,items:[{name:"Click item to scroll",type:"Heading"},{name:"Amphibian #1",active:!0},{name:"Amphibian #2"},{name:"Amphibian #3"},{name:"Amphibian #4"},{name:"Amphibian #5"},{name:"Amphibian #6"},{name:"Amphibian #7"},{name:"Amphibian #8"},{name:"Amphibian #9"},{name:"Amphibian #10"}]}}),[k,m]=B.useReducer(d,{},()=>b()),[l,u]=B.useState(!1),c=(e,a)=>{u(!0),m({type:"itemClicked",payload:{headingKey:e,itemIndex:a}}),setTimeout(()=>u(!1),0)},p=e=>{m({type:"addClicked",payload:{headingKey:e}})},g=(e,a)=>m({type:"deleteClicked",payload:{headingKey:e,itemIndex:a}}),{mammals:I,amphibians:F}=k,C=e=>({...e,actions:[{label:"Add",primary:!0,icon:"add",onClick:()=>p(e.key)}],items:e.items.map((a,t)=>a.type=="Heading"?{...a,id:t}:{...a,id:t,onClick:()=>c(e.key,t),actions:[{label:"Delete",icon:"delete",onClick:()=>g(e.key,t)}]})}),n=300;return s.jsxs(ln,{gap:!0,children:[s.jsx(y,{list:C(I),bordered:!0,height:n,scrollDetails:{scrollable:!0,hideScrollbar:!1,triggerScrollToActiveItem:l}}),s.jsx(y,{list:C(F),bordered:!0,stickyHeader:!0,height:n,scrollDetails:{scrollable:!0,hideScrollbar:!1,triggerScrollToActiveItem:l}})]})},W=()=>{const d=(n,e)=>{switch(e.type){case"headingClicked":{const{headingKey:a}=e.payload;return x(n,t=>{const r=t[a];r.expanded=!r.expanded})}case"itemClicked":{const{headingKey:a,itemIndex:t}=e.payload;return x(n,r=>{Object.keys(r).forEach(i=>{r[i].items.forEach((h,A)=>{h.active=i===a&&A===t})})})}case"addClicked":{const{headingKey:a}=e.payload;return x(n,t=>{const r=t[a];r.expanded=!0,r.items.push({name:`${r.label} #${r.items.length+1}`})})}case"deleteClicked":{const{headingKey:a,itemIndex:t}=e.payload;return x(n,r=>{let{items:i}=r[a];delete i[t],r[a].items=i.filter(h=>h)})}default:return n}},b=()=>({mammals:{key:"mammals",label:"Mammals",expanded:!0,items:[{name:"Aardvark",active:!0},{name:"Kangaroo"}]},amphibians:{key:"amphibians",label:"Amphibians",expanded:!0,items:[{name:"Frog"}]}}),[k,m]=B.useReducer(d,b()),l=n=>m({type:"headingClicked",payload:{headingKey:n}}),u=(n,e)=>m({type:"itemClicked",payload:{headingKey:n,itemIndex:e}}),c=n=>m({type:"addClicked",payload:{headingKey:n}}),p=(n,e)=>m({type:"deleteClicked",payload:{headingKey:n,itemIndex:e}}),{mammals:g,amphibians:I}=k,F=n=>({name:n.label,metaCount:n.items.length,expanded:n.expanded,onClick:()=>l(n.key),actions:[{label:"Add",primary:!0,icon:"add",onClick:()=>c(n.key)}]}),C=n=>({...n,items:n.items.map((e,a)=>({...e,id:a,onClick:()=>u(n.key,a),actions:[{label:"Delete",icon:"delete",onClick:()=>p(n.key,a)}]}))});return s.jsxs(s.Fragment,{children:[s.jsx(mn,{name:"Animals"}),s.jsx(P,{item:F(g)}),g.expanded&&s.jsx(y,{noHeader:!0,list:C(g)}),s.jsx(P,{item:F(I)}),I.expanded&&s.jsx(y,{noHeader:!0,list:C(I)})]})},X=()=>{const d=(u,c,p)=>{if(c&&isNaN(c)||p&&isNaN(p)||c===p)return u;const g=[...u];return typeof p=="number"&&typeof c=="number"&&g.splice(p,0,g.splice(c,1)[0]),g},b={name:"List Name",draggable:!0,items:[{id:1,name:"element 1",actions:[{label:"Delete",icon:"delete",onClick:()=>{}}]},{id:2,name:"Long element name goes here lorem ipsum dolor lorem ipsum dolor",actions:[{label:"Delete",icon:"delete",onClick:()=>{}}]},{id:3,name:"element 3"},{id:4,name:"element 4",actions:[{label:"Delete",icon:"delete",onClick:()=>{}}]},{id:5,name:"element 5",actions:[{label:"Delete",icon:"delete",onClick:()=>{}}]}]},[k,m]=B.useState(b.items),l=u=>{const{to:c,from:p}=u;m(d(k,p,c))};return s.jsx(y,{list:{...b,items:k},draggable:!0,onListReorder:l})},q=()=>{const d={items:[{id:1,name:"Dashboard",component:G,url:"/dashboard"},{id:2,name:"Settings",component:G,url:"/settings"}]};return s.jsxs(on,{children:[s.jsx(y,{list:d,noHeader:!0}),s.jsxs(dn,{children:[s.jsx(z,{path:"/dashboard",children:"Dashboard"}),s.jsx(z,{path:"/settings",children:"Settings"})]})]})};var Q,U,V;O.parameters={...O.parameters,docs:{...(Q=O.parameters)==null?void 0:Q.docs,source:{originalSource:`args => {
|
|
2
2
|
return <List {...args} />;
|
|
3
3
|
}`,...(V=(U=O.parameters)==null?void 0:U.docs)==null?void 0:V.source}}};var Y,Z,ee;L.parameters={...L.parameters,docs:{...(Y=L.parameters)==null?void 0:Y.docs,source:{originalSource:`args => {
|
|
4
4
|
return <List {...args} />;
|
|
@@ -475,4 +475,4 @@ import{j as s}from"./jsx-runtime-FsUICBgo.js";import{r as B}from"./index-RfLt4OU
|
|
|
475
475
|
<Route path="/settings">Settings</Route>
|
|
476
476
|
</Switch>
|
|
477
477
|
</HashRouter>;
|
|
478
|
-
}`,...(tn=(an=q.parameters)==null?void 0:an.docs)==null?void 0:tn.source}}};const
|
|
478
|
+
}`,...(tn=(an=q.parameters)==null?void 0:an.docs)==null?void 0:tn.source}}};const ia=["Default","Actions","Menus","Details","Expanding","Header","Badges","BadgesSmall","Nested","InvalidItems","JSXTitles","Bordered","IconWithTooltip","Metacount","StickyHeader","Scrollable","InfiniteScroll","ScrollToActiveItem","HeadingsManaged","ManagedDragAndDrop","AsRouterLink"];export{L as Actions,q as AsRouterLink,M as Badges,j as BadgesSmall,w as Bordered,O as Default,v as Details,K as Expanding,H as Header,W as HeadingsManaged,N as IconWithTooltip,J as InfiniteScroll,T as InvalidItems,E as JSXTitles,X as ManagedDragAndDrop,D as Menus,$ as Metacount,R as Nested,_ as ScrollToActiveItem,f as Scrollable,S as StickyHeader,ia as __namedExportsOrder,sa as default};
|
package/dist/storybook/assets/{list.stories-data-IWB082tu.js → list.stories-data-YuaX7eYb.js}
RENAMED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{j as t}from"./jsx-runtime-FsUICBgo.js";import{I as i,T as c}from"./common-types-U65vzrrz.js";import{F as o}from"./flex-RYZsoWEN.js";import{M as d}from"./actions-
|
|
1
|
+
import{j as t}from"./jsx-runtime-FsUICBgo.js";import{I as i,T as c}from"./common-types-U65vzrrz.js";import{F as o}from"./flex-RYZsoWEN.js";import{M as d}from"./actions-0lKGEXVi.js";import{I as n}from"./icon-_m67DAr0.js";import{M as l}from"./types-VB5zD18b.js";const a=[{id:1,name:"Aardvark"},{id:2,name:"Kangaroo",active:!0},{id:3,name:"Jaguar",disabled:!0}],p=[{id:1,name:"Marsupials",type:"Heading",metaCount:1},{id:2,name:"Aardvark"},{id:3,name:"Kangaroo",active:!0},{id:4,name:"Mammals",type:"Heading",metaCount:1},{id:5,name:"Jaguar"}],g=[{id:1,name:"Aardvark"},{id:2,name:"Kangaroo",active:!0},{id:3,name:"Grey",level:1},{id:4,name:"Eastern",level:2},{id:5,name:"Macropus giganteus giganteus",title:"Macropus giganteus giganteus",level:3},{id:6,name:"Macropus giganteus tasmaniensis",title:"Macropus giganteus tasmaniensis",level:3},{id:7,name:"Western",level:2},{id:8,name:"Red",level:1},{id:9,name:"Jaguar"}],h={items:a},r={name:"Animals",actions:[{label:"More",subActions:[{label:"Item",icon:"up",onClick:()=>{}},{label:"Item",icon:"down",onClick:()=>{}}]},{label:"Add",primary:!0,icon:"add",onClick:()=>{}}],items:a},m={...r,items:p},A={...r,name:t.jsxs(o,{gap:"var(--padding-xs)",alignItems:"center",children:["Animals",t.jsx(n,{icon:i.STAR})]}),items:a.map(e=>({...e,name:t.jsxs(o,{gap:"var(--padding-xs)",alignItems:"center",children:[e.name,t.jsx(n,{icon:i.STAR})]})}))};a.map(e=>({...e,actions:[{childComponent:t.jsx(d,{menu:{trigger:c.COMPONENT,component:t.jsx(n,{icon:i.MENU}),placement:"bottom-end",sections:[{type:l.OPTION,label:"Item",onClick:()=>{}},{type:l.OPTION,label:"Item",onClick:()=>{}}]}})}]}));const C={items:a.map(e=>({...e,actions:[{label:"More",subActions:[{label:"Move Up",icon:"up",onClick:()=>{}},{label:"Move Down",icon:"down",onClick:()=>{}}]}]}))},k={items:a.map((e,s)=>({...e,label:{value:String(s+1),color:"var(--color-text-info)"}}))},j={items:a.map(e=>({...e,label:{value:t.jsx(t.Fragment,{children:" "}),color:"var(--color-text-info)",small:!0}}))},T={...m,items:m.items.map((e,s)=>({...e,label:{value:String(s+1),color:"var(--color-text-info)"}}))},f={items:a.map(e=>({...e,actions:[{label:"Delete",icon:"delete",onClick:()=>{}}]}))},y={items:a.map((e,s)=>({...e,details:"Description goes here",metadata:"2019-05-03 09:03:51",testId:`story-list-item-${s}`}))},S={items:a.map(e=>({...e,content:t.jsx("div",{children:"Example content element (for show/hide)."})}))},N={items:g},E={items:[...a,{id:4,name:"Dodo",invalid:!0}]},O={items:a.map(e=>({...e,icon:{icon:"success",color:"var(--color-text-success)",tooltip:{text:t.jsx(t.Fragment,{children:"Tooltip goes here"})}}}))},D={items:a.map(e=>({...e,metaCount:3}))},w={name:"Animals",items:[...Array(50)].map((e,s)=>({id:s,name:`Aardvark #${s+1}`}))};export{h as a,f as b,C as c,y as d,S as e,r as f,k as g,j as h,N as i,E as j,A as k,T as l,O as m,D as n,w as o};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-FsUICBgo.js";import{r as N}from"./index-RfLt4OUa.js";import{a as l}from"./common-types-U65vzrrz.js";import{L as g}from"./loader-TGOJBZQG.js";import{P as M}from"./progress-bar-NRjN2baY.js";import{S as x}from"./spinner-R8Il4aRe.js";import{S as m}from"./spacer-Yji9g2AW.js";import{B as L}from"./button-
|
|
1
|
+
import{j as e}from"./jsx-runtime-FsUICBgo.js";import{r as N}from"./index-RfLt4OUa.js";import{a as l}from"./common-types-U65vzrrz.js";import{L as g}from"./loader-TGOJBZQG.js";import{P as M}from"./progress-bar-NRjN2baY.js";import{S as x}from"./spinner-R8Il4aRe.js";import{S as m}from"./spacer-Yji9g2AW.js";import{B as L}from"./button-pSDG6Ka2.js";import{C as q}from"./card-0r8RRVk-.js";import"./index-VW3EWkuE.js";import"./disabled-context-urNQThQz.js";import"./icon-_m67DAr0.js";import"./objectWithoutPropertiesLoose-9Q1jwsKS.js";import"./inheritsLoose-Y9jOMJLd.js";import"./tslib.es6-OIsz3r9a.js";import"./index-4QtD-hFu.js";import"./tooltip-gljV_DQ0.js";import"./index-miLrID2P.js";const ge={title:"Progress/Loader",component:g,argTypes:{theme:{control:{type:"inline-radio"},options:["white","light","dark"]}},args:{theme:"white",text:"Loading...",width:"100%",height:"100%",fullViewPortSize:!1},decorators:[r=>e.jsx("div",{style:{height:"200px",position:"relative"},children:r()})],parameters:{docs:{source:{excludeDecorators:!0}}}},S=r=>{const{theme:t}=r;return e.jsx(g,{...r,children:e.jsx(x,{dark:t!=="dark"})})},h=r=>{const{theme:t}=r;return e.jsx(g,{...r,children:e.jsx(M,{width:"300px",inverted:t==="dark",percentage:40})})},a=S.bind({});a.args={testId:"story-default-spinner"};const u=h.bind({}),s=S.bind({});s.args={theme:l.LIGHT};const o=S.bind({});o.args={theme:l.DARK,fullViewPortSize:!0};const n=h.bind({});n.args={theme:l.DARK,fullViewPortSize:!0};const i=h.bind({});i.args={details:"Some extra info"};const d=h.bind({});d.args={text:"",details:e.jsxs(e.Fragment,{children:[e.jsx("div",{style:{opacity:.5},children:"Step 1: Lorem ipsum...DONE"}),e.jsx(m,{height:"var(--padding-xs)"}),e.jsx("div",{children:"Step 2: Dolor est"}),e.jsx(m,{height:"var(--padding-xs)"}),e.jsx("div",{style:{opacity:.5},children:"Step 3: Compendum"}),e.jsx(m,{height:"var(--padding-xs)"}),e.jsx(L,{label:"Cancel",onClick:()=>{}})]})};const c=()=>{const[r,t]=N.useState(!0);return e.jsxs(e.Fragment,{children:[e.jsx(L,{label:"Toggle loading",onClick:()=>t(!r)}),e.jsx(m,{}),e.jsx(q,{children:e.jsxs("div",{style:{position:"relative"},children:[r&&e.jsx(g,{cover:!0,theme:l.WHITE,children:e.jsx(x,{dark:!0})}),"Lorem ipsum dolor sit amet, consectetur adipiscing elit. ".repeat(20)]})})]})};c.parameters={docs:{story:{inline:!1,iframeHeight:400}}};const p=()=>{const[r,t]=N.useState(!0);return e.jsxs(e.Fragment,{children:[e.jsx(L,{label:"Toggle loading",onClick:()=>t(!r)}),e.jsx(m,{}),e.jsx(q,{children:e.jsx("div",{style:{position:"relative"},children:r?e.jsx(g,{theme:l.WHITE,height:"200px",children:e.jsx(x,{dark:!0})}):e.jsx("div",{children:"Lorem ipsum dolor sit amet, consectetur adipiscing elit. ".repeat(20)})})})]})};p.parameters={docs:{story:{inline:!1,iframeHeight:400}}};var j,v,k;a.parameters={...a.parameters,docs:{...(j=a.parameters)==null?void 0:j.docs,source:{originalSource:`(args: ILoaderProps) => {
|
|
2
2
|
const {
|
|
3
3
|
theme
|
|
4
4
|
} = args;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as r}from"./jsx-runtime-FsUICBgo.js";import{r as br}from"./index-RfLt4OUa.js";import{H as xr,L as W,S as Sr,R as w}from"./react-router-dom-
|
|
1
|
+
import{j as r}from"./jsx-runtime-FsUICBgo.js";import{r as br}from"./index-RfLt4OUa.js";import{H as xr,L as W,S as Sr,R as w}from"./react-router-dom-4Z66xYqZ.js";import{T as L,I as hr}from"./common-types-U65vzrrz.js";import{M as N}from"./actions-0lKGEXVi.js";import{B}from"./button-pSDG6Ka2.js";import{F as jr}from"./flex-RYZsoWEN.js";import{m as s,a as Tr,b as Mr,c as Or,d as Cr,e as Dr,f as Rr,g as fr,h as yr,i as kr}from"./menu.stories-data-hEz8P1yK.js";import{M as A}from"./types-VB5zD18b.js";import"./inheritsLoose-Y9jOMJLd.js";import"./index-4QtD-hFu.js";import"./extends-dGVwEr9R.js";import"./tiny-invariant-R4kOKlvx.js";import"./objectWithoutPropertiesLoose-9Q1jwsKS.js";import"./index-VW3EWkuE.js";import"./lodash-Bmg8FrMx.js";import"./disabled-context-urNQThQz.js";import"./tooltip-gljV_DQ0.js";import"./index-miLrID2P.js";import"./icon-_m67DAr0.js";import"./tslib.es6-OIsz3r9a.js";import"./types-5uVBABF4.js";import"./badge-23Ty_zBt.js";import"./spinner-R8Il4aRe.js";const $r={title:"Basic/Menu",component:N,args:{menu:s}},e=a=>r.jsx(N,{...a}),E=e.bind({}),n=e.bind({});n.args={menu:{...s,colored:!0}};const o=e.bind({});o.args={menu:{...s,label:"Delete",colored:"danger"}};const t=e.bind({});t.args={menu:{...s,trigger:L.TEXT}};const i=e.bind({});i.args={menu:{...s,trigger:L.COMPONENT,component:r.jsx(B,{small:!0,colored:!0,round:!0,icon:hr.SETTINGS})}};const c=e.bind({});c.args={menu:Tr};const p=e.bind({});p.args={menu:Mr};const d=e.bind({});d.args={menu:Or};const l=e.bind({});l.args={menu:Cr};const m=e.bind({});m.args={disabled:!0};const u=e.bind({});u.args={tooltip:"Tooltip goes here"};const g=e.bind({});g.args={error:"Error goes here"};const b=e.bind({});b.args={warning:"Warning goes here"};const x=e.bind({});x.args={loading:!0,disabled:!0};const S=e.bind({});S.args={badgeTitle:"3"};const h=e.bind({});h.args={badgeDot:!0};const j=e.bind({});j.args={menu:Dr};const T=e.bind({});T.args={menu:Rr};const M=e.bind({});M.args={closeOnOptionClick:!1};const O=e.bind({});O.args={contextMenu:!0,menu:{...s,trigger:L.TEXT,label:"Right-click me"}};const C=e.bind({});C.args={width:"100%"};const D=e.bind({});D.args={menu:{...s,small:!0}};const R=e.bind({});R.args={menu:fr};const f=e.bind({});f.args={menu:{...s,sections:r.jsx("div",{children:"Testing"})}};const y=e.bind({});y.args={menu:yr};const k=e.bind({});k.args={menu:kr};const I=()=>{const[a,P]=br.useState(!1);return r.jsxs(jr,{gap:!0,children:[r.jsx(N,{menu:s,open:a,setOpen:P}),r.jsx(B,{label:"Open",onClick:()=>P(!0),disabled:a}),r.jsx(B,{label:"Close",onClick:()=>P(!1),disabled:!a})]})},F=()=>r.jsxs(xr,{children:[r.jsx(N,{menu:{label:"Go to",trigger:L.DROP_DOWN_BUTTON,sections:[{type:A.OPTION,label:"Dashboard",url:"/dashboard",component:W},{type:A.OPTION,label:"Settings",url:"/settings",component:W}]}}),r.jsxs(Sr,{children:[r.jsx(w,{path:"/dashboard",children:"Dashboard"}),r.jsx(w,{path:"/settings",children:"Settings"})]})]});var _,X,J;E.parameters={...E.parameters,docs:{...(_=E.parameters)==null?void 0:_.docs,source:{originalSource:`args => <Menu
|
|
2
2
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
3
3
|
{...args} />`,...(J=(X=E.parameters)==null?void 0:X.docs)==null?void 0:J.source}}};var U,H,v;n.parameters={...n.parameters,docs:{...(U=n.parameters)==null?void 0:U.docs,source:{originalSource:`args => <Menu
|
|
4
4
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
@@ -16,11 +16,11 @@ import{j as r}from"./jsx-runtime-FsUICBgo.js";import{r as br}from"./index-RfLt4O
|
|
|
16
16
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
17
17
|
{...args} />`,...(ce=(ie=d.parameters)==null?void 0:ie.docs)==null?void 0:ce.source}}};var pe,de,le;l.parameters={...l.parameters,docs:{...(pe=l.parameters)==null?void 0:pe.docs,source:{originalSource:`args => <Menu
|
|
18
18
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
19
|
-
{...args} />`,...(le=(de=l.parameters)==null?void 0:de.docs)==null?void 0:le.source}}};var ue,
|
|
19
|
+
{...args} />`,...(le=(de=l.parameters)==null?void 0:de.docs)==null?void 0:le.source}}};var me,ue,ge;m.parameters={...m.parameters,docs:{...(me=m.parameters)==null?void 0:me.docs,source:{originalSource:`args => <Menu
|
|
20
20
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
21
|
-
{...args} />`,...(ge=(
|
|
21
|
+
{...args} />`,...(ge=(ue=m.parameters)==null?void 0:ue.docs)==null?void 0:ge.source}}};var be,xe,Se;u.parameters={...u.parameters,docs:{...(be=u.parameters)==null?void 0:be.docs,source:{originalSource:`args => <Menu
|
|
22
22
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
23
|
-
{...args} />`,...(Se=(xe=
|
|
23
|
+
{...args} />`,...(Se=(xe=u.parameters)==null?void 0:xe.docs)==null?void 0:Se.source}}};var he,je,Te;g.parameters={...g.parameters,docs:{...(he=g.parameters)==null?void 0:he.docs,source:{originalSource:`args => <Menu
|
|
24
24
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
25
25
|
{...args} />`,...(Te=(je=g.parameters)==null?void 0:je.docs)==null?void 0:Te.source}}};var Me,Oe,Ce;b.parameters={...b.parameters,docs:{...(Me=b.parameters)==null?void 0:Me.docs,source:{originalSource:`args => <Menu
|
|
26
26
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
@@ -57,7 +57,7 @@ import{j as r}from"./jsx-runtime-FsUICBgo.js";import{r as br}from"./index-RfLt4O
|
|
|
57
57
|
<Button label="Open" onClick={() => setOpen(true)} disabled={open} />
|
|
58
58
|
<Button label="Close" onClick={() => setOpen(false)} disabled={!open} />
|
|
59
59
|
</Flex>;
|
|
60
|
-
}`,...(lr=(dr=I.parameters)==null?void 0:dr.docs)==null?void 0:lr.source}}};var ur,
|
|
60
|
+
}`,...(lr=(dr=I.parameters)==null?void 0:dr.docs)==null?void 0:lr.source}}};var mr,ur,gr;F.parameters={...F.parameters,docs:{...(mr=F.parameters)==null?void 0:mr.docs,source:{originalSource:`() => {
|
|
61
61
|
return <HashRouter>
|
|
62
62
|
<Menu menu={{
|
|
63
63
|
label: 'Go to',
|
|
@@ -79,4 +79,4 @@ import{j as r}from"./jsx-runtime-FsUICBgo.js";import{r as br}from"./index-RfLt4O
|
|
|
79
79
|
<Route path="/settings">Settings</Route>
|
|
80
80
|
</Switch>
|
|
81
81
|
</HashRouter>;
|
|
82
|
-
}`,...(gr=(
|
|
82
|
+
}`,...(gr=(ur=F.parameters)==null?void 0:ur.docs)==null?void 0:gr.source}}};const es=["Default","PrimaryTrigger","DestructiveTrigger","TextTrigger","CustomTrigger","FileUpload","DescriptionOnRight","Actions","Icons","Disabled","Tooltip","Error","Warning","Loading","Badge","Dot","Empty","Submenus","WithoutCloseOnOptionClick","RightClickContextMenu","FullWidth","Small","JSXItems","JSXContent","ShowAll","Long","ControlOpenStateFromParent","AsRouterLink"];export{d as Actions,F as AsRouterLink,S as Badge,I as ControlOpenStateFromParent,i as CustomTrigger,E as Default,p as DescriptionOnRight,o as DestructiveTrigger,m as Disabled,h as Dot,j as Empty,g as Error,c as FileUpload,C as FullWidth,l as Icons,f as JSXContent,R as JSXItems,x as Loading,k as Long,n as PrimaryTrigger,O as RightClickContextMenu,y as ShowAll,D as Small,T as Submenus,t as TextTrigger,u as Tooltip,b as Warning,M as WithoutCloseOnOptionClick,es as __namedExportsOrder,$r as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-FsUICBgo.js";import{r as b}from"./index-RfLt4OUa.js";import{c as l}from"./index-VW3EWkuE.js";import{I as r}from"./common-types-U65vzrrz.js";import{I as c}from"./icon-
|
|
1
|
+
import{j as e}from"./jsx-runtime-FsUICBgo.js";import{r as b}from"./index-RfLt4OUa.js";import{c as l}from"./index-VW3EWkuE.js";import{I as r}from"./common-types-U65vzrrz.js";import{I as c}from"./icon-_m67DAr0.js";const j="_inputInTable_s49vk_1",R="_inputHover_s49vk_13",T="_inputFocus_s49vk_18",C="_inputError_s49vk_25",y="_inputWarning_s49vk_26",D="_inputDisabled_s49vk_61",O="_hideScrollbars_s49vk_67",G="_container_s49vk_83",w="_block_s49vk_101",A="_info_s49vk_104",F="_success_s49vk_108",L="_warning_s49vk_112",W="_error_s49vk_116",V="_content_s49vk_120",z="_heading_s49vk_124",H="_icon_s49vk_131",U="_dismiss_s49vk_139",q="_absolute_s49vk_143",M="_legendToggle_s49vk_155",B="_detailsText_s49vk_165",J="_footer_s49vk_169",n={inputInTable:j,inputHover:R,inputFocus:T,inputError:C,inputWarning:y,inputDisabled:D,hideScrollbars:O,container:G,block:w,info:A,success:F,warning:L,error:W,content:V,heading:z,icon:H,dismiss:U,absolute:q,legendToggle:M,detailsText:B,footer:J};var i=(s=>(s.INFO="Info",s.SUCCESS="Success",s.WARNING="Warning",s.ERROR="Error",s))(i||{}),d=(s=>(s.TOGGLE_DETAILS="TOGGLE_DETAILS",s))(d||{});const a=({type:s,onClose:t,isInToast:o})=>e.jsx("div",{className:l(n.dismiss,o?n.absolute:"",s===i.INFO?n.info:s===i.SUCCESS?n.success:s===i.WARNING?n.warning:s===i.ERROR?n.error:null),children:e.jsx(c,{icon:r.CLOSE,onClick:t})});try{a.displayName="Dismiss",a.__docgenInfo={description:"",displayName:"Dismiss",props:{type:{defaultValue:null,description:"",name:"type",required:!0,type:{name:"string"}},onClose:{defaultValue:null,description:"",name:"onClose",required:!1,type:{name:"TFunction"}},isInToast:{defaultValue:null,description:"",name:"isInToast",required:!1,type:{name:"boolean"}}}}}catch{}const K=(s,t)=>{switch(t.type){case d.TOGGLE_DETAILS:return{...s,detailsVisible:!s.detailsVisible};default:return s}},P=({details:s,visible:t,dispatch:o})=>e.jsxs("div",{children:[e.jsx("div",{className:l(n.legendToggle),onClick:o,children:t?"Hide details":"Show details"}),t?e.jsx("div",{className:n.detailsText,children:s}):null]}),Q=({type:s})=>{switch(s){case i.SUCCESS:return e.jsx(c,{icon:r.SUCCESS,size:16});case i.WARNING:return e.jsx(c,{icon:r.WARNING,size:16});case i.ERROR:return e.jsx(c,{icon:r.ERROR,size:16});default:return e.jsx(c,{icon:r.INFO,size:16})}},v=({message:s})=>{const{visible:t,type:o=i.INFO,icon:g,heading:_,content:h,details:u,detailsVisible:x=!1,footer:p,withDismiss:f,onClose:k,width:m,maxHeight:I}=s,N={detailsVisible:x},[S,E]=b.useReducer(K,N);return e.jsx(e.Fragment,{children:t?e.jsxs("div",{className:l(n.container,m?n.block:null,o===i.SUCCESS?n.success:o===i.WARNING?n.warning:o===i.ERROR?n.error:n.info),style:{width:m,maxHeight:I},children:[e.jsx("div",{children:g?e.jsx("div",{className:n.icon,children:e.jsx(Q,{type:o})}):null}),e.jsxs("div",{className:n.content,children:[_?e.jsx("div",{className:n.heading,children:_}):null,e.jsx("div",{children:h}),u?e.jsx(P,{details:u,visible:S.detailsVisible,dispatch:()=>E({type:d.TOGGLE_DETAILS})}):null,!!p&&e.jsx("div",{className:n.footer,children:p})]}),f?e.jsx(a,{type:o,onClose:k}):null]}):null})};try{v.displayName="Message",v.__docgenInfo={description:"",displayName:"Message",props:{message:{defaultValue:null,description:"",name:"message",required:!0,type:{name:"IMessage"}}}}}catch{}export{a as D,v as M,i as a};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as s}from"./jsx-runtime-FsUICBgo.js";import{M as a,a as n}from"./message-
|
|
1
|
+
import{j as s}from"./jsx-runtime-FsUICBgo.js";import{M as a,a as n}from"./message-bbAE2zjv.js";import{B as M}from"./button-pSDG6Ka2.js";import{G as z}from"./grid-u1mZpaML.js";import"./index-RfLt4OUa.js";import"./index-VW3EWkuE.js";import"./common-types-U65vzrrz.js";import"./icon-_m67DAr0.js";import"./objectWithoutPropertiesLoose-9Q1jwsKS.js";import"./inheritsLoose-Y9jOMJLd.js";import"./tslib.es6-OIsz3r9a.js";import"./index-4QtD-hFu.js";import"./disabled-context-urNQThQz.js";import"./spinner-R8Il4aRe.js";import"./tooltip-gljV_DQ0.js";import"./index-miLrID2P.js";import"./styled-components.browser.esm-qIipjd6c.js";const{useArgs:J}=__STORYBOOK_MODULE_ADDONS__,Q={visible:!0,heading:void 0,content:"Here is some info",withDismiss:!1,icon:!1,details:void 0,maxHeight:void 0,type:n.INFO},Ce={title:"Basic/Message",component:a,args:{...Q},argTypes:{heading:{control:{type:"text"}},details:{control:{type:"text"}}}},e=u=>{const[X,y]=J(),c=()=>{y({visible:!1}),setTimeout(()=>{y({visible:!0})},1e3)};return s.jsxs(z,{gap:!0,children:[s.jsx(a,{message:{...u,onClose:c,type:n.INFO}}),s.jsx(a,{message:{...u,onClose:c,type:n.ERROR}}),s.jsx(a,{message:{...u,onClose:c,type:n.WARNING}}),s.jsx(a,{message:{...u,onClose:c,type:n.SUCCESS}})]})},C=e.bind({}),o=e.bind({});o.args={heading:"Message Heading"};const r=e.bind({});r.args={icon:!0};const t=e.bind({});t.args={details:"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque at mi ac quam condimentum blandit at sit amet lectus. Nullam volutpat erat maximus, venenatis nisl sed, aliquam libero."};const g=e.bind({});g.args={details:"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque at mi ac quam condimentum blandit at sit amet lectus. Nullam volutpat erat maximus, venenatis nisl sed, aliquam libero.",detailsVisible:!0};const l=e.bind({});l.args={type:n.ERROR,icon:!0,content:"Unable to sync because connection settings are not set.",footer:s.jsxs(s.Fragment,{children:[s.jsx(M,{small:!0,label:"Edit connection settings",colored:"primary"},"edit-settings"),s.jsx(M,{small:!0,label:"Cancel sync"},"cancel-sync"),","]})};const i=e.bind({});i.args={width:"100%"};const p=e.bind({});p.args={width:"300px"};const d=e.bind({});d.args={maxHeight:"100px",content:"Lorem ipsum dolor sit amet, consectetur adipiscing elit. ".repeat(20)};const m=e.bind({});m.args={withDismiss:!0,onClose:()=>{}};var h,T,A;C.parameters={...C.parameters,docs:{...(h=C.parameters)==null?void 0:h.docs,source:{originalSource:`args => {
|
|
2
2
|
const [_, updateArgs] = useArgs();
|
|
3
3
|
const handleClose = () => {
|
|
4
4
|
updateArgs({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-FsUICBgo.js";import{r as f}from"./index-RfLt4OUa.js";import{c as u}from"./index-VW3EWkuE.js";import{I as N}from"./common-types-U65vzrrz.js";import{I as g}from"./icon-
|
|
1
|
+
import{j as e}from"./jsx-runtime-FsUICBgo.js";import{r as f}from"./index-RfLt4OUa.js";import{c as u}from"./index-VW3EWkuE.js";import{I as N}from"./common-types-U65vzrrz.js";import{I as g}from"./icon-_m67DAr0.js";import{H as y}from"./heading-OSdaYHYE.js";import{A as h}from"./actions-0lKGEXVi.js";import{B as x}from"./badge-23Ty_zBt.js";import{T as b}from"./tooltip-gljV_DQ0.js";const I="_inputInTable_tn20e_1",T="_inputHover_tn20e_13",j="_inputFocus_tn20e_18",w="_inputError_tn20e_25",H="_inputWarning_tn20e_26",v="_inputDisabled_tn20e_61",C="_hideScrollbars_tn20e_67",V="_header_tn20e_77",q="_headerTitle_tn20e_77",E="_heading_tn20e_78",R="_itemHeader_tn20e_78",S="_narrow_tn20e_81",k="_stickyHeader_tn20e_85",M="_title_tn20e_96",L="_name_tn20e_102",F="_iconTooltipMargin_tn20e_105",P="_bold_tn20e_108",W="_toggleNarrow_tn20e_117",$="_drag_tn20e_135",B="_list_tn20e_155",D="_bordered_tn20e_159",A="_item_tn20e_78",J="_action_tn20e_192",O="_active_tn20e_195",X="_indented_tn20e_202",z="_disabled_tn20e_215",G="_label_tn20e_226",K="_details_tn20e_237",Q="_metadata_tn20e_238",U="_itemContent_tn20e_246",Y="_indentIcon_tn20e_253",Z="_expandIcon_tn20e_258",ee="_expanded_tn20e_265",te="_right_tn20e_268",ne="_actions_tn20e_276",ae="_scrollableList_tn20e_281",oe="_infiniteScrollContainer_tn20e_286",re="_hideScrollbar_tn20e_67",ie="_noPointerEvents_tn20e_303",a={inputInTable:I,inputHover:T,inputFocus:j,inputError:w,inputWarning:H,inputDisabled:v,hideScrollbars:C,header:V,headerTitle:q,heading:E,itemHeader:R,narrow:S,stickyHeader:k,title:M,name:L,iconTooltipMargin:F,bold:P,toggleNarrow:W,drag:$,list:B,bordered:D,item:A,action:J,active:O,indented:X,disabled:z,label:G,details:K,metadata:Q,itemContent:U,indentIcon:Y,expandIcon:Z,expanded:ee,right:te,actions:ne,scrollableList:ae,infiniteScrollContainer:oe,hideScrollbar:re,noPointerEvents:ie},c=({toggleNarrow:n,onClickToggleNarrow:t})=>n?e.jsx("a",{className:a.toggleNarrow,onClick:t,children:e.jsx(g,{icon:N.CHEVRON_LEFT})}):null;try{c.displayName="ToggleNarrow",c.__docgenInfo={description:"",displayName:"ToggleNarrow",props:{toggleNarrow:{defaultValue:null,description:"",name:"toggleNarrow",required:!1,type:{name:"boolean"}},onClickToggleNarrow:{defaultValue:null,description:"",name:"onClickToggleNarrow",required:!1,type:{name:"TEmpty"}}}}}catch{}const p=f.forwardRef(({name:n,actions:t=[],toggleNarrow:i=!1,onToggleNarrow:o=()=>{},stickyHeader:s},l)=>e.jsxs("div",{ref:l,className:u(a.header,s?a.stickyHeader:""),children:[e.jsx(c,{toggleNarrow:i,onClickToggleNarrow:o}),n&&e.jsx("div",{className:a.headerTitle,children:e.jsx(y,{top:!0,marginBottom:0,children:n})}),e.jsx("div",{className:a.right,children:e.jsx("div",{className:a.actions,children:e.jsx(h,{actions:t})})})]}));try{p.displayName="ListHeading",p.__docgenInfo={description:"",displayName:"ListHeading",props:{name:{defaultValue:null,description:"",name:"name",required:!0,type:{name:"string | number | boolean | ReactElement<any, string | JSXElementConstructor<any>> | Iterable<ReactNode> | ReactPortal | null | undefined"}},actions:{defaultValue:{value:"[]"},description:"",name:"actions",required:!1,type:{name:"any[]"}},toggleNarrow:{defaultValue:{value:"false"},description:"",name:"toggleNarrow",required:!1,type:{name:"boolean"}},onToggleNarrow:{defaultValue:{value:"() => {}"},description:"",name:"onToggleNarrow",required:!1,type:{name:"TEmpty"}},stickyHeader:{defaultValue:null,description:"",name:"stickyHeader",required:!1,type:{name:"boolean"}}}}}catch{}const _=({name:n,icon:t,testId:i})=>{const o=t&&e.jsx(g,{icon:t.icon,color:t.color||"#db2828"});return e.jsxs("span",{className:u(a.name,a.bold),"data-testid":i,children:[n,t&&t.tooltip&&t.tooltip.text?e.jsx("span",{className:a.iconTooltipMargin,children:e.jsx(b,{text:t.tooltip.text,maxWidth:"350px",children:o})}):t&&t.icon&&e.jsx("span",{className:a.iconTooltipMargin,children:o})]})};try{_.displayName="Name",_.__docgenInfo={description:"",displayName:"Name",props:{name:{defaultValue:null,description:"",name:"name",required:!0,type:{name:"ReactNode"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"{ icon: ReactNode; color?: string; tooltip?: { text: ReactNode; }; } | undefined"}},testId:{defaultValue:null,description:"",name:"testId",required:!1,type:{name:"string"}}}}}catch{}try{name.displayName="name",name.__docgenInfo={description:"",displayName:"name",props:{name:{defaultValue:null,description:"",name:"name",required:!0,type:{name:"ReactNode"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"{ icon: ReactNode; color?: string; tooltip?: { text: ReactNode; }; } | undefined"}},testId:{defaultValue:null,description:"",name:"testId",required:!1,type:{name:"string"}}}}}catch{}const m=({item:n})=>{const{name:t,icon:i,details:o,metadata:s,invalid:l,testId:r}=n;let d=e.jsx(_,{name:t,icon:i,testId:r&&`${r}-name`});return l&&(d=e.jsx(x,{small:!0,margin:"-2px",title:"!",children:d})),e.jsxs("span",{className:a.title,children:[d,o&&e.jsx("span",{className:a.details,"data-testid":r&&`${r}-details`,children:o}),s&&e.jsx("span",{className:a.metadata,"data-testid":r&&`${r}-metadata`,children:s})]})};try{m.displayName="MetaContent",m.__docgenInfo={description:"",displayName:"MetaContent",props:{item:{defaultValue:null,description:"",name:"item",required:!0,type:{name:"IMetaContentItem"}}}}}catch{}export{p as L,m as M,_ as N,a as l};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-FsUICBgo.js";import{r as h}from"./index-RfLt4OUa.js";import{T as X}from"./common-types-U65vzrrz.js";import{M as u,D as C}from"./dialog
|
|
1
|
+
import{j as e}from"./jsx-runtime-FsUICBgo.js";import{r as h}from"./index-RfLt4OUa.js";import{T as X}from"./common-types-U65vzrrz.js";import{M as u,D as C}from"./dialog-kardLd1s.js";import{B as o}from"./button-pSDG6Ka2.js";import{P as Z}from"./popover-dGHzPDyA.js";import{I as Q}from"./input-w-UScEUy.js";import{I as $}from"./input-group-R8LoqKRn.js";import{F as j}from"./field-V2qkm8ON.js";import{M as ee}from"./actions-0lKGEXVi.js";import{S as oe}from"./select-7lyQEtzA.js";import{S as ne}from"./spacer-Yji9g2AW.js";import{T as le}from"./tooltip-gljV_DQ0.js";import{M as k}from"./types-VB5zD18b.js";import"./index-VW3EWkuE.js";import"./portal-zPiHHKoC.js";import"./index-miLrID2P.js";import"./lodash-Bmg8FrMx.js";import"./heading-OSdaYHYE.js";import"./help-icon-jdxRTcvs.js";import"./icon-_m67DAr0.js";import"./objectWithoutPropertiesLoose-9Q1jwsKS.js";import"./inheritsLoose-Y9jOMJLd.js";import"./tslib.es6-OIsz3r9a.js";import"./index-4QtD-hFu.js";import"./disabled-context-urNQThQz.js";import"./spinner-R8Il4aRe.js";import"./types-5uVBABF4.js";import"./label-KLaw_y6R.js";import"./badge-23Ty_zBt.js";import"./extends-dGVwEr9R.js";import"./assertThisInitialized-4q6YPdh3.js";import"./memoize-one.esm-hqe5SRxC.js";import"./text-6KQ6ntOV.js";import"./select.input-zP5tW20f.js";const{useArgs:se}=__STORYBOOK_MODULE_ADDONS__,He={title:"Modals/Modal",component:u,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(o,{label:"Okay",colored:!0,onClick:()=>{}}),e.jsx(o,{label:"Cancel",onClick:()=>{}})]}),onClose:()=>{}},parameters:{docs:{story:{inline:!1,iframeHeight:400}}}},a=()=>{const[{visible:l,centered:r,...s},n]=se(),t=()=>{n({visible:!l})};return e.jsxs(e.Fragment,{children:[e.jsx(u,{visible:l,centered:r,children:e.jsx(C,{dialog:{...s,onClose:t}})}),e.jsx(o,{label:"Open Modal",onClick:t})]})},b=a.bind({}),i=a.bind({});i.args={centered:!0};const d=a.bind({});d.args={content:["This is a","new line!"]};const c=a.bind({});c.args={scroll:!0,content:e.jsx("div",{children:"Example modal content goes here lorem ipsum. ".repeat(100)})};const g=a.bind({});g.args={width:"100%",content:e.jsx("div",{children:"Example modal content goes here lorem ipsum. ".repeat(100)})};const p=a.bind({});p.args={contentPadding:0};const m=a.bind({});m.args={content:e.jsxs(e.Fragment,{children:[e.jsx(le,{text:"Tooltip text",children:"Hover for tooltip"}),e.jsx(ne,{}),e.jsx(j,{label:"Custom Select",helpText:"Select an animal",children:e.jsx(oe,{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(j,{label:"Nested Menu",children:e.jsx(ee,{maxHeight:"240px",menu:{label:"Menu",trigger:X.DROP_DOWN_BUTTON,sections:[{type:k.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:k.OPTION,label:Math.random().toString(36).substring(7),onClick:()=>{}}))]}})}),e.jsx(Z,{content:e.jsxs($,{small:!0,children:[e.jsx(Q,{value:"Value",width:"150px",error:"Bad value"}),e.jsx(o,{colored:!0,label:"Save",onClick:()=>{}}),e.jsx(o,{label:"Cancel",onClick:()=>{}})]}),children:e.jsx(o,{colored:!0,label:"Toggle me",onClick:()=>{}})})]})};const M=()=>{const[l,r]=h.useState(!1),s=()=>{r(!0)},n=()=>{r(!1)},t=()=>{console.log("Submit action"),n()};return e.jsxs(e.Fragment,{children:[e.jsx(u,{visible:l,onEnter:()=>{console.log("Enter"),t()},onEscape:()=>{console.log("Escape"),n()},children:e.jsx(C,{dialog:{heading:"Test key handling",content:e.jsx(Q,{}),footer:e.jsxs(e.Fragment,{children:[e.jsx(o,{label:"Done",colored:"red",onClick:t}),e.jsx(o,{label:"Cancel",onClick:n})]}),onClose:n}})}),e.jsx(o,{label:"Open Modal",onClick:s})]})},v=()=>{const[l,r]=h.useState(!1),s=()=>r(!l),[n,t]=h.useState(!1),x=()=>t(!n);return e.jsxs(e.Fragment,{children:[e.jsx(u,{visible:l,children:e.jsx(C,{dialog:{heading:"Modal 1",content:"Lorem ipsum dolor sit amet",footer:e.jsxs(e.Fragment,{children:[e.jsx(o,{label:"Open modal 2",colored:!0,onClick:x}),e.jsx(u,{visible:n,children:e.jsx(C,{dialog:{heading:"Modal 2",content:"Lorem ipsum dolor sit amet",footer:e.jsx(o,{label:"Close",onClick:x}),onClose:x}})}),e.jsx(o,{label:"Close",onClick:s})]}),onClose:s}})}),e.jsx(o,{label:"Open modal 1",onClick:s})]})};var f,S,P;b.parameters={...b.parameters,docs:{...(f=b.parameters)==null?void 0:f.docs,source:{originalSource:`() => {
|
|
2
2
|
const [{
|
|
3
3
|
visible,
|
|
4
4
|
centered,
|
|
@@ -197,4 +197,4 @@ import{j as e}from"./jsx-runtime-FsUICBgo.js";import{r as h}from"./index-RfLt4OU
|
|
|
197
197
|
</Modal>
|
|
198
198
|
<Button label="Open modal 1" onClick={toggleVisible1} />
|
|
199
199
|
</>;
|
|
200
|
-
}`,...(J=(z=v.parameters)==null?void 0:z.docs)==null?void 0:J.source}}};const
|
|
200
|
+
}`,...(J=(z=v.parameters)==null?void 0:z.docs)==null?void 0:J.source}}};const Ke=["Default","Centered","LineBreak","Scroll","FullWidth","NoContentPadding","WithPopoverLayers","KeyHandle","MultipleModals"];export{i as Centered,b as Default,g as FullWidth,M as KeyHandle,d as LineBreak,v as MultipleModals,p as NoContentPadding,c as Scroll,m as WithPopoverLayers,Ke as __namedExportsOrder,He as default};
|
package/dist/storybook/assets/{number-input.stories-59JRvVcf.js → number-input.stories-oaHrqqEo.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as n}from"./jsx-runtime-FsUICBgo.js";import{d as ne}from"./index-qZmQ7nA9.js";import{N as i}from"./number-input-hrCn3Rag.js";import{I as
|
|
1
|
+
import{j as n}from"./jsx-runtime-FsUICBgo.js";import{d as ne}from"./index-qZmQ7nA9.js";import{N as i}from"./number-input-hrCn3Rag.js";import{I as re}from"./input-group-R8LoqKRn.js";import{I as ae}from"./input-group-addon-BHVsW9mL.js";import{S as te}from"./select-7lyQEtzA.js";import"./index-RfLt4OUa.js";import"./index-cCpkwrS5.js";import"./lodash-Bmg8FrMx.js";import"./input-w-UScEUy.js";import"./index-VW3EWkuE.js";import"./disabled-context-urNQThQz.js";import"./types-5uVBABF4.js";import"./tooltip-gljV_DQ0.js";import"./index-miLrID2P.js";import"./common-types-U65vzrrz.js";import"./index-4QtD-hFu.js";import"./extends-dGVwEr9R.js";import"./assertThisInitialized-4q6YPdh3.js";import"./inheritsLoose-Y9jOMJLd.js";import"./memoize-one.esm-hqe5SRxC.js";import"./types-VB5zD18b.js";import"./text-6KQ6ntOV.js";import"./actions-0lKGEXVi.js";import"./button-pSDG6Ka2.js";import"./spinner-R8Il4aRe.js";import"./icon-_m67DAr0.js";import"./objectWithoutPropertiesLoose-9Q1jwsKS.js";import"./tslib.es6-OIsz3r9a.js";import"./badge-23Ty_zBt.js";import"./select.input-zP5tW20f.js";const{useArgs:se}=__STORYBOOK_MODULE_ADDONS__,Oe={title:"Forms/NumberInput",component:i,parameters:{canvas:{page:null}},args:{label:"Label"}},e=v=>{const[ue,Z]=se(),$=ee=>{Z({value:ee.target.value})};return n.jsx(i,{onChange:$,value:123,...v})},d=e.bind({}),r=e.bind({});r.args={small:!0};const a=e.bind({});a.args={width:"150px"};const t=e.bind({});t.args={left:!0};const s=e.bind({});s.args={disabled:!0};const u=e.bind({});u.args={allowEmpty:!0,value:""};const o=e.bind({});o.args={warning:"This input number is almost 100!",value:"99"};const p=e.bind({});p.args={error:"This is a error message"};const g=e.bind({});g.args={value:"123test"};const l=e.bind({});l.args={value:"123.123456789",enableDisplayRounding:!0};const m=e.bind({});m.args={value:"123.123456789",enableDisplayRounding:!0,roundDisplayValue:v=>ne.roundToFixed(v,4)};const c=()=>n.jsxs(re,{small:!0,children:[n.jsx(i,{value:123}),n.jsx(ae,{children:"to"}),n.jsx(i,{value:123}),n.jsx(te,{options:[{value:"units",label:"units"}],width:"auto",value:"units"})]});var h,C,A;d.parameters={...d.parameters,docs:{...(h=d.parameters)==null?void 0:h.docs,source:{originalSource:`args => {
|
|
2
2
|
const [_, updateArgs] = useArgs();
|
|
3
3
|
const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
|
|
4
4
|
updateArgs({
|
|
@@ -6,7 +6,7 @@ import{j as n}from"./jsx-runtime-FsUICBgo.js";import{d as ne}from"./index-qZmQ7n
|
|
|
6
6
|
});
|
|
7
7
|
};
|
|
8
8
|
return <NumberInput onChange={handleChange} value={123} {...args} />;
|
|
9
|
-
}`,...(A=(C=d.parameters)==null?void 0:C.docs)==null?void 0:A.source}}};var I,b,E;
|
|
9
|
+
}`,...(A=(C=d.parameters)==null?void 0:C.docs)==null?void 0:A.source}}};var I,b,E;r.parameters={...r.parameters,docs:{...(I=r.parameters)==null?void 0:I.docs,source:{originalSource:`args => {
|
|
10
10
|
const [_, updateArgs] = useArgs();
|
|
11
11
|
const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
|
|
12
12
|
updateArgs({
|
|
@@ -14,7 +14,7 @@ import{j as n}from"./jsx-runtime-FsUICBgo.js";import{d as ne}from"./index-qZmQ7n
|
|
|
14
14
|
});
|
|
15
15
|
};
|
|
16
16
|
return <NumberInput onChange={handleChange} value={123} {...args} />;
|
|
17
|
-
}`,...(E=(b=
|
|
17
|
+
}`,...(E=(b=r.parameters)==null?void 0:b.docs)==null?void 0:E.source}}};var _,S,T;a.parameters={...a.parameters,docs:{...(_=a.parameters)==null?void 0:_.docs,source:{originalSource:`args => {
|
|
18
18
|
const [_, updateArgs] = useArgs();
|
|
19
19
|
const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
|
|
20
20
|
updateArgs({
|
|
@@ -22,7 +22,7 @@ import{j as n}from"./jsx-runtime-FsUICBgo.js";import{d as ne}from"./index-qZmQ7n
|
|
|
22
22
|
});
|
|
23
23
|
};
|
|
24
24
|
return <NumberInput onChange={handleChange} value={123} {...args} />;
|
|
25
|
-
}`,...(T=(S=
|
|
25
|
+
}`,...(T=(S=a.parameters)==null?void 0:S.docs)==null?void 0:T.source}}};var N,L,D;t.parameters={...t.parameters,docs:{...(N=t.parameters)==null?void 0:N.docs,source:{originalSource:`args => {
|
|
26
26
|
const [_, updateArgs] = useArgs();
|
|
27
27
|
const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
|
|
28
28
|
updateArgs({
|
|
@@ -94,4 +94,4 @@ import{j as n}from"./jsx-runtime-FsUICBgo.js";import{d as ne}from"./index-qZmQ7n
|
|
|
94
94
|
value: 'units',
|
|
95
95
|
label: 'units'
|
|
96
96
|
}]} width="auto" value="units" />
|
|
97
|
-
</InputGroup>`,...(X=(Q=c.parameters)==null?void 0:Q.docs)==null?void 0:X.source}}};const
|
|
97
|
+
</InputGroup>`,...(X=(Q=c.parameters)==null?void 0:Q.docs)==null?void 0:X.source}}};const Be=["Default","Small","Width","Left","Disabled","AllowEmpty","Warning","Error","BadInput","WithDisplayRounding","WithCustomDisplayRounding","TestInputGroup"];export{u as AllowEmpty,g as BadInput,d as Default,s as Disabled,p as Error,t as Left,r as Small,c as TestInputGroup,o as Warning,a as Width,m as WithCustomDisplayRounding,l as WithDisplayRounding,Be as __namedExportsOrder,Oe as default};
|