@oliasoft-open-source/react-ui-library 4.7.3 → 4.8.0-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-D5kcnHmD.js → index-Csdt18_R.js} +1 -9
- package/dist/global.css +4 -1
- package/dist/index.d.ts +16 -6
- package/dist/index.html +1 -1
- package/dist/index.js +121 -158
- package/dist/index.js.map +1 -1
- package/dist/storybook/assets/Color-KGDBMAHA-BS-rAnbo.js +1 -0
- package/dist/storybook/assets/DocsRenderer-PKQXORMH-DZ7r3cmw.js +1 -0
- package/dist/storybook/assets/{accordion-6ouB0WTt.js → accordion-BiuI_LCA.js} +1 -1
- package/dist/storybook/assets/{accordion.stories-DlFZNmdv.js → accordion.stories-CKrpJWRn.js} +2 -2
- package/dist/storybook/assets/{actions-Cu_0szZ4.js → actions-CHgr8eL8.js} +1 -1
- package/dist/storybook/assets/{actions.stories-SCPuAp0T.js → actions.stories-CCDxFKFk.js} +1 -1
- package/dist/storybook/assets/{afe.stories-G3SzS3sg.js → afe.stories-80-X2oCf.js} +2 -2
- package/dist/storybook/assets/{badge.stories-DGYA6_1I.js → badge.stories-D5DA-vxC.js} +1 -1
- package/dist/storybook/assets/{blowout.stories-P0LHuXSY.js → blowout.stories-ES-Fuaqn.js} +1 -1
- package/dist/storybook/assets/{button-_0DiND6h.js → button-VxhoNhrV.js} +1 -1
- package/dist/storybook/assets/{button-group-BYiHMljF.js → button-group-CwJdFo2z.js} +1 -1
- package/dist/storybook/assets/{button-group.stories-Bz6NHaeB.js → button-group.stories-DU5k5qCY.js} +1 -1
- package/dist/storybook/assets/{button.stories-vVBGddVf.js → button.stories-DVtec2Eo.js} +2 -2
- package/dist/storybook/assets/{buttons-and-links-B6aQa-f5.js → buttons-and-links-sTGnmj6h.js} +2 -2
- package/dist/storybook/assets/{card.stories-DIlqxO94.js → card.stories-CsTB0DuM.js} +1 -1
- package/dist/storybook/assets/{casing-loads.stories-0T--WlaD.js → casing-loads.stories-Do3mZuX2.js} +2 -2
- package/dist/storybook/assets/{cell.stories-C5Tkxyfr.js → cell.stories-B0YsumDa.js} +2 -2
- package/dist/storybook/assets/{check-box-DkdQxC5c.js → check-box-BtCGePRy.js} +1 -1
- package/dist/storybook/assets/check-box.stories-B6vW-2Fd.js +126 -0
- package/dist/storybook/assets/{chunk-HLWAVYOI-dB_9CZG8.js → chunk-HLWAVYOI-BqK-R5cR.js} +1 -1
- package/dist/storybook/assets/color-Cvx86PKp.js +25 -0
- package/dist/storybook/assets/{column.stories-C1Sxwh4f.js → column.stories-BxfR9Tla.js} +1 -1
- package/dist/storybook/assets/dialog-Di8hNunM.js +1 -0
- package/dist/storybook/assets/{drawer-vbDFqa4U.js → drawer-BhuWxI7V.js} +1 -1
- package/dist/storybook/assets/{drawer.stories-CmbGsKmS.js → drawer.stories-B-PsNJJ6.js} +4 -4
- package/dist/storybook/assets/{empty.stories-iHPKKy4z.js → empty.stories-BVYXwvpa.js} +1 -1
- package/dist/storybook/assets/{field-DwLk_uWj.js → field-HrLaMLbx.js} +1 -1
- package/dist/storybook/assets/{field.stories-s-0LQVbp.js → field.stories-B9p9nBgY.js} +1 -1
- package/dist/storybook/assets/{file-button.stories-C90kcfbw.js → file-button.stories-FOaiNPt-.js} +1 -1
- package/dist/storybook/assets/{file-input-C_2w1dKj.js → file-input-BpMtsZ2S.js} +1 -1
- package/dist/storybook/assets/{file-input.stories-BEsZox6U.js → file-input.stories-Jrdw5k-s.js} +1 -1
- package/dist/storybook/assets/{flex.stories-D-QN0gkk.js → flex.stories-BEXf0VqI.js} +1 -1
- package/dist/storybook/assets/footer.stories-CMN_mVki.js +3 -0
- package/dist/storybook/assets/form.stories-C1Qx3M_1.js +49 -0
- package/dist/storybook/assets/formation.stories-CCJYaUpG.js +74 -0
- package/dist/storybook/assets/{heading-DkSFysAb.js → heading-CRNoBc7q.js} +1 -1
- package/dist/storybook/assets/{heading.stories-Dtq7LNlB.js → heading.stories-DahFxeiX.js} +1 -1
- package/dist/storybook/assets/{help-icon-LfPZiYla.js → help-icon-Buhx5nl6.js} +1 -1
- package/dist/storybook/assets/{help-icon.stories-Dh2ylnGq.js → help-icon.stories-DbmZ1fgP.js} +1 -1
- package/dist/storybook/assets/icon-BSFY3vDO.js +8 -0
- package/dist/storybook/assets/{icon.stories-B-tKaIKA.js → icon.stories-C1hZXIMX.js} +1 -1
- package/dist/storybook/assets/iframe-CUVhB5TR.js +2 -0
- package/dist/storybook/assets/{index-ccPuy0l1.js → index-B8zF6D3V.js} +8 -8
- package/dist/storybook/assets/index-Be0hXiyp.js +179 -0
- package/dist/storybook/assets/index-CF7H4eMJ.js +28 -0
- package/dist/storybook/assets/index-omjWi7I7.js +1 -0
- package/dist/storybook/assets/{index.es-D2piFfFj.js → index.es-DazXb-ul.js} +4 -4
- package/dist/storybook/assets/inheritsLoose-DP0QEDDI.js +1 -0
- package/dist/storybook/assets/{input-D97ganXq.js → input-BW9trNAW.js} +1 -1
- package/dist/storybook/assets/{input-group.stories-BcoORZ9x.js → input-group.stories-44quIZTV.js} +2 -2
- package/dist/storybook/assets/{input-validation-CLVu4gtl.js → input-validation-BREYBXzB.js} +2 -2
- package/dist/storybook/assets/{input.stories-BHdUwYqV.js → input.stories-BruLeJ44.js} +1 -1
- package/dist/storybook/assets/{inputs-qWlLPYX_.js → inputs-DkxT6vDD.js} +2 -2
- package/dist/storybook/assets/{label-tWjEmTQJ.js → label-CqmyC9he.js} +1 -1
- package/dist/storybook/assets/{label.stories-BTA8N7tD.js → label.stories-C0AO5F1a.js} +1 -1
- package/dist/storybook/assets/layout-forms-Y0Chz5wF.js +16 -0
- package/dist/storybook/assets/{layout-general-Dn1nlXYw.js → layout-general-CRJUCd3s.js} +2 -2
- package/dist/storybook/assets/{list-BpVed6Pw.js → list-yVTOdmpX.js} +1 -1
- package/dist/storybook/assets/{list.stories-CiT9J_FH.js → list.stories-ChqQXY5M.js} +2 -2
- package/dist/storybook/assets/{list.stories-data-CnVYk3eo.js → list.stories-data-Iq66w9oH.js} +1 -1
- package/dist/storybook/assets/{loader.stories-BKBFctQ1.js → loader.stories-DM7ZJBgz.js} +1 -1
- package/dist/storybook/assets/menu.stories-Dozt6Npk.js +84 -0
- package/dist/storybook/assets/message-BYzRg8Ae.js +1 -0
- package/dist/storybook/assets/{message.stories-C8YRT7nL.js → message.stories-K3bQ-5bJ.js} +1 -1
- package/dist/storybook/assets/{meta-content-Djgg-tiF.js → meta-content-cbHGvPJ7.js} +1 -1
- package/dist/storybook/assets/modal.stories-BX49dKIM.js +220 -0
- package/dist/storybook/assets/{number-input-B-Nmya5O.js → number-input-CD-fbjVQ.js} +1 -1
- package/dist/storybook/assets/number-input.stories-h1PlFB_G.js +105 -0
- package/dist/storybook/assets/{option-dropdown.stories-COGmMWEl.js → option-dropdown.stories-CoLsSS95.js} +1 -1
- package/dist/storybook/assets/{padding-and-spacing-BNiScrzg.js → padding-and-spacing-DYx_u7EA.js} +2 -2
- package/dist/storybook/assets/{page.stories-BB3g1zwB.js → page.stories-Cse3cMsO.js} +1 -1
- package/dist/storybook/assets/{pagination-DSQeMPG_.js → pagination-iSMIbR33.js} +1 -1
- package/dist/storybook/assets/pagination.stories-BUPaZD5R.js +59 -0
- package/dist/storybook/assets/{pop-confirm.stories-Cr_ZBbLn.js → pop-confirm.stories-Dhid1FK8.js} +1 -1
- package/dist/storybook/assets/popover-CzZdWNnB.js +1 -0
- package/dist/storybook/assets/popover.stories-Duemqiqp.js +10 -0
- package/dist/storybook/assets/{preview-DhMlVLsE.js → preview-B2Xzz4-3.js} +2 -2
- package/dist/storybook/assets/preview-DLBQXbKW.js +1 -0
- package/dist/storybook/assets/preview-kt6m1zZo.js +2 -0
- package/dist/storybook/assets/projects.stories-DU-QlBa6.js +47 -0
- package/dist/storybook/assets/{radio-button-BD7pi0ao.js → radio-button-YBwYcMaM.js} +1 -1
- package/dist/storybook/assets/radio-button.stories-8QEKlNvO.js +71 -0
- package/dist/storybook/assets/react-router-dom-Ck2Y_Fzc.js +8 -0
- package/dist/storybook/assets/{reservoirs.stories-kxVBoa7Y.js → reservoirs.stories-aSZ9r1Pu.js} +2 -2
- package/dist/storybook/assets/{rich-text-input.stories-C5pcIbSa.js → rich-text-input.stories-CsFyrKRA.js} +3 -3
- package/dist/storybook/assets/{row.stories-ATsrjumb.js → row.stories-ZCrMoTuY.js} +2 -2
- package/dist/storybook/assets/select-C8iu4-uz.js +40 -0
- package/dist/storybook/assets/select.stories-DbgjgsiX.js +579 -0
- package/dist/storybook/assets/{side-bar-WsK6pkmj.js → side-bar-CKbHPgIV.js} +1 -1
- package/dist/storybook/assets/{side-bar.stories-Bu2q_b_w.js → side-bar.stories-MUj_dj1F.js} +1 -1
- package/dist/storybook/assets/{site.stories-Yh4uNi3Q.js → site.stories-Ci4g5W2A.js} +2 -2
- package/dist/storybook/assets/{slider-CxVlS0fh.js → slider-DAramr8j.js} +4 -4
- package/dist/storybook/assets/{slider.stories-_wS70xsm.js → slider.stories-Cd0rLfHP.js} +2 -2
- package/dist/storybook/assets/{smart-upload-modal.stories-DDlO9y2j.js → smart-upload-modal.stories-DgnJ79fa.js} +1 -1
- package/dist/storybook/assets/{spacer.stories-B3LrTr7b.js → spacer.stories-CHEZdgDM.js} +1 -1
- package/dist/storybook/assets/{table-DPvzYjoq.js → table-ZQD4ELIM.js} +1 -1
- package/dist/storybook/assets/{table.stories-BGQ1O9nw.js → table.stories-DGedoAir.js} +2 -2
- package/dist/storybook/assets/{table.stories-data-2STKbgzG.js → table.stories-data-CR9VpXHs.js} +1 -1
- package/dist/storybook/assets/text-link.stories-BQAkVO-W.js +14 -0
- package/dist/storybook/assets/{textarea-DOJDK8hI.js → textarea-BV7xWEdt.js} +1 -1
- package/dist/storybook/assets/{textarea.stories-CKm5MlQF.js → textarea.stories-aRLEoDHg.js} +1 -1
- package/dist/storybook/assets/{title.stories-CVRTXggL.js → title.stories-jQBBSflc.js} +2 -2
- package/dist/storybook/assets/toaster-BNO0suPv.js +1 -0
- package/dist/storybook/assets/toaster.stories-CAqrDYpd.js +89 -0
- package/dist/storybook/assets/{toggle-t1iTuSL7.js → toggle-CBpNgTrm.js} +1 -1
- package/dist/storybook/assets/toggle.stories-t0T4HV1D.js +141 -0
- package/dist/storybook/assets/{tooltip-C_E_6ym5.js → tooltip-1V7clEnw.js} +1 -1
- package/dist/storybook/assets/{tooltip.stories-C70ADjjJ.js → tooltip.stories-1YexWg6N.js} +1 -1
- package/dist/storybook/assets/{tooltip.test-case.stories-BtrJUImB.js → tooltip.test-case.stories-i9YQqba1.js} +1 -1
- package/dist/storybook/assets/{top-bar-R-CjhJ21.js → top-bar-C_tn2Pc5.js} +1 -1
- package/dist/storybook/assets/top-bar.stories-B2a-RgK-.js +21 -0
- package/dist/storybook/assets/{top-bar.testcase.stories-ZPaSRyIh.js → top-bar.testcase.stories-DoPEAMYc.js} +1 -1
- package/dist/storybook/assets/{tree.stories-Ghxps-dL.js → tree.stories-6UHASEZu.js} +1 -1
- package/dist/storybook/assets/{unit-input.stories-Bqt0CdF7.js → unit-input.stories-C7XlUSaC.js} +1 -1
- package/dist/storybook/assets/unit-table.stories-BJbxGp7Y.js +150 -0
- 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/404.html +0 -1
- package/dist/storybook/assets/Color-KGDBMAHA-RK4YYQs0.js +0 -1
- package/dist/storybook/assets/DocsRenderer-PKQXORMH-B0ryFlHH.js +0 -1
- package/dist/storybook/assets/check-box.stories-D8C12IQo.js +0 -102
- package/dist/storybook/assets/color-BSzeqkLx.js +0 -25
- package/dist/storybook/assets/dialog-CAWCUmp3.js +0 -1
- package/dist/storybook/assets/extends-CF3RwP-h.js +0 -1
- package/dist/storybook/assets/footer.stories-U_zMDmxF.js +0 -3
- package/dist/storybook/assets/form.stories-1L75MGpX.js +0 -49
- package/dist/storybook/assets/formation.stories-YHpXrXvC.js +0 -74
- package/dist/storybook/assets/icon-BP4BO6-k.js +0 -8
- package/dist/storybook/assets/iframe-CNFcCVDc.js +0 -2
- package/dist/storybook/assets/index-BIwFZkUc.js +0 -1
- package/dist/storybook/assets/inheritsLoose-DR8r8Ogv.js +0 -1
- package/dist/storybook/assets/layout-forms-p4s8eHw6.js +0 -16
- package/dist/storybook/assets/menu.stories-Bp8L83xx.js +0 -82
- package/dist/storybook/assets/message-ttrR1AaP.js +0 -1
- package/dist/storybook/assets/modal.stories-BoVj2EsX.js +0 -200
- package/dist/storybook/assets/number-input.stories-CcNTeD25.js +0 -97
- package/dist/storybook/assets/pagination.stories-DjIohcDx.js +0 -59
- package/dist/storybook/assets/popover-Dq3iC_lM.js +0 -1
- package/dist/storybook/assets/popover.stories-CoWCb2Mn.js +0 -10
- package/dist/storybook/assets/preview-CZPuAPNr.js +0 -2
- package/dist/storybook/assets/projects.stories-BesbPJ8Z.js +0 -47
- package/dist/storybook/assets/radio-button.stories-B84Ip3NV.js +0 -61
- package/dist/storybook/assets/react-router-dom-CMITYWBH.js +0 -8
- package/dist/storybook/assets/select-78sreKsp.js +0 -40
- package/dist/storybook/assets/select.stories-CZwsHVDB.js +0 -914
- package/dist/storybook/assets/text-link.stories-BsuVBOWo.js +0 -14
- package/dist/storybook/assets/toaster-DPbde9Mi.js +0 -1
- package/dist/storybook/assets/toaster.stories-DfbfDavp.js +0 -86
- package/dist/storybook/assets/toggle.stories-D44S3Nix.js +0 -117
- package/dist/storybook/assets/top-bar.stories-BYN9rcUw.js +0 -21
- package/dist/storybook/assets/unit-table.stories-DXies3fA.js +0 -150
- /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
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as u}from"./jsx-runtime-eps93zm2.js";import{T as s}from"./textarea-
|
|
1
|
+
import{j as u}from"./jsx-runtime-eps93zm2.js";import{T as s}from"./textarea-BV7xWEdt.js";import"./index-DhsZuJvc.js";import"./index-Bk2sglWO.js";import"./types-UmZ4Y_CR.js";import"./lodash-BHd_uQHh.js";import"./disabled-context-rmpd7YJS.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";const{useArgs:g}=__STORYBOOK_MODULE_PREVIEW_API__,f={title:"Forms/TextArea",component:s,args:{disabled:!1}},c=n=>{const[i,o]=g(),m=p=>{o({value:p.target.value})};return u.jsx(s,{...n,onChange:m})},e=c.bind({});var t,r,a;e.parameters={...e.parameters,docs:{...(t=e.parameters)==null?void 0:t.docs,source:{originalSource:`args => {
|
|
2
2
|
const [_, updateArgs] = useArgs();
|
|
3
3
|
const handleChange = (evt: ChangeEvent<HTMLTextAreaElement>) => {
|
|
4
4
|
updateArgs({
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as G}from"./jsx-runtime-eps93zm2.js";import{T as X}from"./table-
|
|
1
|
+
import{j as G}from"./jsx-runtime-eps93zm2.js";import{T as X}from"./table-ZQD4ELIM.js";import{t as K,E as O,s as W,F as k,G as q,H as z,I as D,J as M,K as P,L as Q}from"./table.stories-data-CR9VpXHs.js";import"./index-DhsZuJvc.js";import"./index-Bk2sglWO.js";import"./index.es-DazXb-ul.js";import"./inheritsLoose-DP0QEDDI.js";import"./redux-tRgGMjwY.js";import"./objectSpread2-DW4nTBoq.js";import"./tiny-invariant-DqLgxztJ.js";import"./index-CUZDtIZe.js";import"./memoize-one.esm-CcMeOnPo.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./lodash-BHd_uQHh.js";import"./actions-CHgr8eL8.js";import"./common-types-Sih75Sav.js";import"./disabled-context-rmpd7YJS.js";import"./button-VxhoNhrV.js";import"./spinner-AWUe4xwQ.js";import"./icon-BSFY3vDO.js";import"./index-CEuq6vkz.js";import"./tooltip-1V7clEnw.js";import"./types-BmbYqTX_.js";import"./types-UmZ4Y_CR.js";import"./badge-CLQ59MDF.js";import"./heading-CRNoBc7q.js";import"./help-icon-Buhx5nl6.js";import"./pagination-iSMIbR33.js";import"./select-C8iu4-uz.js";import"./assertThisInitialized-B9jnkVVz.js";import"./text-B3-TSWok.js";import"./select.input-DIKP56UZ.js";import"./input-BW9trNAW.js";import"./input-group-BaRSJAEN.js";import"./input-group-addon-D68iUKV2.js";import"./number-input-CD-fbjVQ.js";import"./index-DQs5XS8h.js";import"./index-DRSy5Ssd.js";import"./check-box-BtCGePRy.js";import"./slider-DAramr8j.js";import"./index-BI4_Bp97.js";import"./popover-CzZdWNnB.js";import"./flex-EllkLxgO.js";const Gr={title:"Basic/Table/Title & Header",component:X,args:{table:{...K}}},r=B=>G.jsx(X,{...B}),e=r.bind({});e.args={table:O};const s=r.bind({});s.args={table:W};const a=r.bind({});a.args={table:k};const t=r.bind({});t.args={table:q};const o=r.bind({});o.args={table:z};const n=r.bind({});n.args={table:D};const i=r.bind({});i.args={table:M};const p=r.bind({});p.args={table:P};const l=r.bind({});l.args={table:Q};var m,c,d;e.parameters={...e.parameters,docs:{...(m=e.parameters)==null?void 0:m.docs,source:{originalSource:`args => {
|
|
2
2
|
return <Table
|
|
3
3
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
4
4
|
{...args} />;
|
|
@@ -34,4 +34,4 @@ import{j as G}from"./jsx-runtime-eps93zm2.js";import{T as X}from"./table-DPvzYjo
|
|
|
34
34
|
return <Table
|
|
35
35
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
36
36
|
{...args} />;
|
|
37
|
-
}`,...(_=(U=l.parameters)==null?void 0:U.docs)==null?void 0:_.source}}};const
|
|
37
|
+
}`,...(_=(U=l.parameters)==null?void 0:U.docs)==null?void 0:_.source}}};const Kr=["Units","ActiveRow","Title","TitleJSX","ChildComponent","Filter","Sort","HeaderActionsNoLabel","HelpAndLibraryIcons"];export{s as ActiveRow,o as ChildComponent,n as Filter,p as HeaderActionsNoLabel,l as HelpAndLibraryIcons,i as Sort,a as Title,t as TitleJSX,e as Units,Kr as __namedExportsOrder,Gr as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{j as c}from"./jsx-runtime-eps93zm2.js";import{t as s,S as l}from"./toaster-7wnI6hqB.js";import{a as r,M as f,D as E}from"./message-BYzRg8Ae.js";const I=({id:t,message:e={type:r.INFO,content:""},autoClose:o=6e3,onClose:i})=>{const{type:p=r.INFO}=e??{},u=({closeToast:d})=>c.jsx(E,{type:p,onClose:d,isInToast:!0,testId:t!==void 0?t.toString()+"-dismiss":void 0}),n=c.jsx(f,{message:{...e,visible:!0,width:"100%",maxHeight:"500px",withDismiss:!1}}),a=(()=>{switch(e==null?void 0:e.type){case r.SUCCESS:return s.TYPE.SUCCESS;case r.WARNING:return s.TYPE.WARNING;case r.ERROR:return s.TYPE.ERROR;default:return s.TYPE.INFO}})();return t!==void 0&&s.isActive(t)?s.update(t,{render:n,autoClose:o,onClose:i,type:a}):s(n,{toastId:t,autoClose:o,onClose:i,hideProgressBar:o===!1,icon:!1,closeOnClick:!1,pauseOnHover:!0,draggable:!1,closeButton:u,transition:l,type:a})},T=t=>{s.dismiss(t)};export{T as d,I as t};
|
|
@@ -0,0 +1,89 @@
|
|
|
1
|
+
import{j as s}from"./jsx-runtime-eps93zm2.js";import{w as ss,e as l,u as y,a as E}from"./index-Be0hXiyp.js";import{G as X}from"./grid-B6LFPf51.js";import{T as w}from"./text-B3-TSWok.js";import{F as Z}from"./flex-EllkLxgO.js";import{t as S,d as b}from"./toaster-BNO0suPv.js";import{B as t}from"./button-VxhoNhrV.js";import{S as $}from"./spacer-BWoNR27H.js";import{a as C}from"./message-BYzRg8Ae.js";import"./index-DhsZuJvc.js";import"./index-CF7H4eMJ.js";import"./styled-components.browser.esm-Bf0q9Yjk.js";import"./index-Bk2sglWO.js";import"./toaster-7wnI6hqB.js";import"./index-CUZDtIZe.js";import"./common-types-Sih75Sav.js";import"./disabled-context-rmpd7YJS.js";import"./spinner-AWUe4xwQ.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./inheritsLoose-DP0QEDDI.js";import"./index-CEuq6vkz.js";import"./tooltip-1V7clEnw.js";const es={type:C.SUCCESS,icon:!0,heading:"Heading",content:"Great results"},os={type:C.ERROR,icon:!0,heading:"Heading",content:"An error has happened",details:"Bad input data lorem ipsum dolor est compendum lorem ipsum."},ts={type:C.WARNING,icon:!0,heading:"Heading",content:"Warning message"},as={type:C.INFO,icon:!0,heading:"Heading",content:"Long content lorem ipsum dolor est compendum lorem ipsum."},Ds={title:"Modals/Toaster",parameters:{docs:{story:{inline:!1,iframeHeight:400}}},source:{type:"code"},args:{id:void 0,message:as,autoClose:6e3,onClose:()=>{}}},h=e=>s.jsx(t,{onClick:()=>S({...e,onClose:()=>console.log("toast closed")}),label:"Show toast"}),T=h.bind({}),u=h.bind({});u.args={message:es};const d=h.bind({});d.args={message:ts};const m=h.bind({});m.args={message:os};const i=()=>s.jsx(t,{label:"Show Toast",onClick:()=>{const e=Math.random()>=.5;S({message:{type:e?"Success":"Error",icon:!0,content:e?"Success":"Error"},onClose:()=>console.log("toast closed"),id:"uniqueId"})}});i.parameters={docs:{iframeHeight:200,description:{story:"Pass a unique `id` in the `toast` object to prevent duplicates. Successive toasts with the same ID will update the existing toast."}}};const p=()=>{const e="sessionExpiring",a={type:"Info",content:s.jsxs(X,{children:[s.jsx(w,{bold:!0,children:"You will be signed out soon"}),s.jsx(w,{children:"For your security, you will be automatically signed out in 30 minutes unless you extend your session."}),s.jsx($,{height:"var(--padding-xxs)"}),s.jsxs(Z,{gap:"var(--padding-xs)",children:[s.jsx(t,{label:"Extend session",small:!0,colored:"success",onClick:()=>b(e)}),s.jsx(t,{label:"Dismiss",small:!0,onClick:()=>b(e)})]})]})};return s.jsx(t,{label:"Show Toast",onClick:()=>S({message:a,autoClose:!1,id:e})})},g=()=>{const e="sessionExpiringSoon",a={type:"Error",content:s.jsxs(X,{children:[s.jsx(w,{bold:!0,children:"You will be signed out very soon"}),s.jsx(w,{children:"For your security, you will be automatically signed out in 30 minutes unless you extend your session."}),s.jsx($,{height:"var(--padding-xxs)"}),s.jsxs(Z,{gap:"var(--padding-xs)",children:[s.jsx(t,{label:"Extend session",small:!0,colored:"success",onClick:()=>b(e)}),s.jsx(t,{label:"Dismiss",small:!0,onClick:()=>b(e)})]})]})};return s.jsx(t,{label:"Show Toast",onClick:()=>S({message:a,autoClose:!1,id:e})})},x=()=>{const e={type:"Success",content:"Your session has been extended for 1 hour"};return s.jsx(t,{label:"Show Toast",onClick:()=>S({message:e})})},c=h.bind({});c.args={id:"testId",autoClose:50};c.play=async({canvasElement:e,step:a})=>{const o=e.parentElement?ss(e.parentElement):null;await l(o).toBeTruthy(),o&&(await a("Toast should appear when triggered",async()=>{const r=o.getByText("Show toast");await y.click(r);const n=o.getByRole("alert");await l(n).toBeInTheDocument()}),await a("Duplicate toasts shouldn't be created",async()=>{const r=o.getByText("Show toast");await y.click(r);const n=o.queryAllByRole("alert");await l(n).toHaveLength(1)}),await a("Toast should disappear when close button pressed",async()=>{const r=o.getByRole("alert"),n=o.getByTestId("testId-dismiss");await y.click(n),await E(()=>l(r).not.toBeInTheDocument(),{timeout:2e3})}),await a("Toast should automatically close",async()=>{const r=o.getByText("Show toast");await y.click(r);const n=o.getByRole("alert");await E(()=>l(n).not.toBeInTheDocument(),{timeout:2e3})}))};i.__docgenInfo={description:"",methods:[],displayName:"PreventDuplicates"};p.__docgenInfo={description:"",methods:[],displayName:"SessionExpiring"};g.__docgenInfo={description:"",methods:[],displayName:"SessionExpiringSoon"};x.__docgenInfo={description:"",methods:[],displayName:"SessionExtended"};var I,f,B;T.parameters={...T.parameters,docs:{...(I=T.parameters)==null?void 0:I.docs,source:{originalSource:`args => {
|
|
2
|
+
return <Button onClick={() => toast({
|
|
3
|
+
...args,
|
|
4
|
+
onClose: () => console.log('toast closed')
|
|
5
|
+
})} label="Show toast" />;
|
|
6
|
+
}`,...(B=(f=T.parameters)==null?void 0:f.docs)==null?void 0:B.source}}};var k,D,j;u.parameters={...u.parameters,docs:{...(k=u.parameters)==null?void 0:k.docs,source:{originalSource:`args => {
|
|
7
|
+
return <Button onClick={() => toast({
|
|
8
|
+
...args,
|
|
9
|
+
onClose: () => console.log('toast closed')
|
|
10
|
+
})} label="Show toast" />;
|
|
11
|
+
}`,...(j=(D=u.parameters)==null?void 0:D.docs)==null?void 0:j.source}}};var _,v,A;d.parameters={...d.parameters,docs:{...(_=d.parameters)==null?void 0:_.docs,source:{originalSource:`args => {
|
|
12
|
+
return <Button onClick={() => toast({
|
|
13
|
+
...args,
|
|
14
|
+
onClose: () => console.log('toast closed')
|
|
15
|
+
})} label="Show toast" />;
|
|
16
|
+
}`,...(A=(v=d.parameters)==null?void 0:v.docs)==null?void 0:A.source}}};var O,F,R;m.parameters={...m.parameters,docs:{...(O=m.parameters)==null?void 0:O.docs,source:{originalSource:`args => {
|
|
17
|
+
return <Button onClick={() => toast({
|
|
18
|
+
...args,
|
|
19
|
+
onClose: () => console.log('toast closed')
|
|
20
|
+
})} label="Show toast" />;
|
|
21
|
+
}`,...(R=(F=m.parameters)==null?void 0:F.docs)==null?void 0:R.source}}};var G,M,H;i.parameters={...i.parameters,docs:{...(G=i.parameters)==null?void 0:G.docs,source:{originalSource:`() => <Button label="Show Toast" onClick={() => {
|
|
22
|
+
const isSuccess = Math.random() >= 0.5;
|
|
23
|
+
toast({
|
|
24
|
+
message: ({
|
|
25
|
+
type: isSuccess ? 'Success' : 'Error',
|
|
26
|
+
icon: true,
|
|
27
|
+
content: isSuccess ? 'Success' : 'Error'
|
|
28
|
+
} as IMessageType),
|
|
29
|
+
onClose: () => console.log('toast closed'),
|
|
30
|
+
id: 'uniqueId'
|
|
31
|
+
});
|
|
32
|
+
}} />`,...(H=(M=i.parameters)==null?void 0:M.docs)==null?void 0:H.source}}};var N,Y,W;p.parameters={...p.parameters,docs:{...(N=p.parameters)==null?void 0:N.docs,source:{originalSource:`() => {
|
|
33
|
+
const TOAST_ID = 'sessionExpiring';
|
|
34
|
+
const message = ({
|
|
35
|
+
type: 'Info',
|
|
36
|
+
content: <Grid>
|
|
37
|
+
<Text bold>You will be signed out soon</Text>
|
|
38
|
+
<Text>
|
|
39
|
+
For your security, you will be automatically signed out in 30 minutes
|
|
40
|
+
unless you extend your session.
|
|
41
|
+
</Text>
|
|
42
|
+
<Spacer height="var(--padding-xxs)" />
|
|
43
|
+
<Flex gap="var(--padding-xs)">
|
|
44
|
+
<Button label="Extend session" small colored="success" onClick={() => dismissToast(TOAST_ID)} />
|
|
45
|
+
<Button label="Dismiss" small onClick={() => dismissToast(TOAST_ID)} />
|
|
46
|
+
</Flex>
|
|
47
|
+
</Grid>
|
|
48
|
+
} as IMessageType);
|
|
49
|
+
return <Button label="Show Toast" onClick={() => toast({
|
|
50
|
+
message,
|
|
51
|
+
autoClose: false,
|
|
52
|
+
id: TOAST_ID
|
|
53
|
+
})} />;
|
|
54
|
+
}`,...(W=(Y=p.parameters)==null?void 0:Y.docs)==null?void 0:W.source}}};var q,P,L;g.parameters={...g.parameters,docs:{...(q=g.parameters)==null?void 0:q.docs,source:{originalSource:`() => {
|
|
55
|
+
const TOAST_ID = 'sessionExpiringSoon';
|
|
56
|
+
const message = ({
|
|
57
|
+
type: 'Error',
|
|
58
|
+
content: <Grid>
|
|
59
|
+
<Text bold>You will be signed out very soon</Text>
|
|
60
|
+
<Text>
|
|
61
|
+
For your security, you will be automatically signed out in 30 minutes
|
|
62
|
+
unless you extend your session.
|
|
63
|
+
</Text>
|
|
64
|
+
<Spacer height="var(--padding-xxs)" />
|
|
65
|
+
<Flex gap="var(--padding-xs)">
|
|
66
|
+
<Button label="Extend session" small colored="success" onClick={() => dismissToast(TOAST_ID)} />
|
|
67
|
+
<Button label="Dismiss" small onClick={() => dismissToast(TOAST_ID)} />
|
|
68
|
+
</Flex>
|
|
69
|
+
</Grid>
|
|
70
|
+
} as IMessageType);
|
|
71
|
+
return <Button label="Show Toast" onClick={() => toast({
|
|
72
|
+
message,
|
|
73
|
+
autoClose: false,
|
|
74
|
+
id: TOAST_ID
|
|
75
|
+
})} />;
|
|
76
|
+
}`,...(L=(P=g.parameters)==null?void 0:P.docs)==null?void 0:L.source}}};var U,z,J;x.parameters={...x.parameters,docs:{...(U=x.parameters)==null?void 0:U.docs,source:{originalSource:`() => {
|
|
77
|
+
const message = ({
|
|
78
|
+
type: 'Success',
|
|
79
|
+
content: 'Your session has been extended for 1 hour'
|
|
80
|
+
} as IMessageType);
|
|
81
|
+
return <Button label="Show Toast" onClick={() => toast({
|
|
82
|
+
message
|
|
83
|
+
})} />;
|
|
84
|
+
}`,...(J=(z=x.parameters)==null?void 0:z.docs)==null?void 0:J.source}}};var K,Q,V;c.parameters={...c.parameters,docs:{...(K=c.parameters)==null?void 0:K.docs,source:{originalSource:`args => {
|
|
85
|
+
return <Button onClick={() => toast({
|
|
86
|
+
...args,
|
|
87
|
+
onClose: () => console.log('toast closed')
|
|
88
|
+
})} label="Show toast" />;
|
|
89
|
+
}`,...(V=(Q=c.parameters)==null?void 0:Q.docs)==null?void 0:V.source}}};const js=["Default","Success","Warning","Error","PreventDuplicates","SessionExpiring","SessionExpiringSoon","SessionExtended","Test"];export{T as Default,m as Error,i as PreventDuplicates,p as SessionExpiring,g as SessionExpiringSoon,x as SessionExtended,u as Success,c as Test,d as Warning,js as __namedExportsOrder,Ds as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{j as n}from"./jsx-runtime-eps93zm2.js";import{r as b}from"./index-DhsZuJvc.js";import{c as T}from"./index-Bk2sglWO.js";import{b as _}from"./common-types-Sih75Sav.js";import{D as E}from"./disabled-context-rmpd7YJS.js";import{H as v}from"./help-icon-
|
|
1
|
+
import{j as n}from"./jsx-runtime-eps93zm2.js";import{r as b}from"./index-DhsZuJvc.js";import{c as T}from"./index-Bk2sglWO.js";import{b as _}from"./common-types-Sih75Sav.js";import{D as E}from"./disabled-context-rmpd7YJS.js";import{H as v}from"./help-icon-Buhx5nl6.js";const x="_toggle_1mo1i_9",C="_small_1mo1i_25",q="_disabled_1mo1i_102",I="_noMargin_1mo1i_113",R="_helpIconEnabled_1mo1i_116",a={toggle:x,small:C,disabled:q,noMargin:I,helpIconEnabled:R},h=({name:l,label:r,checked:e=!1,disabled:m,display:d,small:p=!1,onChange:u,noMargin:c=!1,testId:g,helpText:i,onClickHelp:o})=>{const f=b.useContext(E),y=i||o,s=m||f;return n.jsxs("div",{className:T(a.toggle,s?a.disabled:null,p?a.small:null,c?a.noMargin:null),style:{display:d},onClick:t=>{s||(t.target.name=l,t.target.checked=!e,t.target.value=!e,u(t))},"data-testid":g,children:[n.jsx("input",{type:_.CHECKBOX,name:l,value:e==null?void 0:e.toString(),disabled:s,checked:e,onChange:()=>{}}),n.jsx("label",{children:r}),y&&n.jsx("div",{className:a.helpIconEnabled,onClick:o,children:n.jsx(v,{text:i})})]})};h.__docgenInfo={description:"",methods:[],displayName:"Toggle",props:{name:{required:!1,tsType:{name:"string"},description:""},label:{required:!1,tsType:{name:"union",raw:"string | React.ReactElement | null",elements:[{name:"string"},{name:"ReactReactElement",raw:"React.ReactElement"},{name:"null"}]},description:""},checked:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},disabled:{required:!1,tsType:{name:"boolean"},description:""},display:{required:!1,tsType:{name:"string"},description:""},small:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},onChange:{required:!0,tsType:{name:"signature",type:"function",raw:"(evt: React.ChangeEvent<HTMLInputElement>) => void",signature:{arguments:[{type:{name:"ReactChangeEvent",raw:"React.ChangeEvent<HTMLInputElement>",elements:[{name:"HTMLInputElement"}]},name:"evt"}],return:{name:"void"}}},description:""},noMargin:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},testId:{required:!1,tsType:{name:"string"},description:""},helpText:{required:!1,tsType:{name:"string"},description:""},onClickHelp:{required:!1,tsType:{name:"signature",type:"function",raw:"(evt: any) => void",signature:{arguments:[{type:{name:"any"},name:"evt"}],return:{name:"void"}}},description:""}}};export{h as T};
|
|
@@ -0,0 +1,141 @@
|
|
|
1
|
+
import{j as e}from"./jsx-runtime-eps93zm2.js";import{r as de}from"./index-DhsZuJvc.js";import{w as oe,u as j,e as A}from"./index-Be0hXiyp.js";import{F as f}from"./flex-EllkLxgO.js";import{T as C}from"./text-B3-TSWok.js";import{T as x}from"./toggle-CBpNgTrm.js";import"./index-CF7H4eMJ.js";import"./index-Bk2sglWO.js";import"./common-types-Sih75Sav.js";import"./disabled-context-rmpd7YJS.js";import"./help-icon-Buhx5nl6.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./inheritsLoose-DP0QEDDI.js";import"./index-CEuq6vkz.js";const{useArgs:le}=__STORYBOOK_MODULE_PREVIEW_API__,De={title:"Forms/Toggle",component:x,args:{label:"Label"}},s=a=>{const[{checked:r},t]=le(),n=()=>{t({checked:!r})};return e.jsx(x,{...a,onChange:n})},T=s.bind({}),d=s.bind({});d.args={disabled:!0};const l=s.bind({});l.args={checked:!0,disabled:!0};const g=s.bind({});g.args={small:!0};const p=s.bind({});p.args={label:null};const i=s.bind({});i.args={helpText:"Help text"};const h=s.bind({});h.args={onClickHelp:()=>console.log("Help clicked")};const u=()=>e.jsxs(e.Fragment,{children:[e.jsx(x,{display:"block",label:e.jsxs(f,{justifyContent:"space-between",wrap:!1,gap:!0,children:[e.jsx(C,{bold:!0,children:"Label"}),e.jsx(C,{success:!0,children:"Released yesterday"})]}),onChange:()=>{}}),e.jsx(x,{label:e.jsxs(f,{justifyContent:"space-between",wrap:!1,gap:!0,children:[e.jsx(C,{bold:!0,children:"Label"}),e.jsx(C,{success:!0,children:"Released yesterday"})]}),onChange:()=>{}})]}),m=()=>{const[a,r]=de.useState(!1);return e.jsx(x,{name:"name",label:"Label",checked:a,onChange:t=>{const{name:n,value:b,checked:y}=t.target;r(y),console.log(n,b,y)}})},k=s.bind({});k.args={helpText:"Help text",disabled:!0};const c=s.bind({});c.args={testId:"testId"};c.play=async({canvasElement:a,step:r})=>{const t=oe(a);await r("Clicking checkbox should toggle it",async()=>{const n=t.getByTestId("testId"),b=n.querySelector("input");await j.click(n),await A(b).toBeChecked(),await j.click(n),await A(b).not.toBeChecked()})};const o=s.bind({});o.args={testId:"testId",disabled:!0};o.play=async({canvasElement:a,step:r})=>{const t=oe(a);await r("Clicking disabled checkbox shouldn't toggle it",async()=>{const n=t.getByTestId("testId");await n.click(),await A(n.querySelector("input")).not.toBeChecked()})};u.__docgenInfo={description:"",methods:[],displayName:"Display"};m.__docgenInfo={description:"",methods:[],displayName:"TestClickevt"};var S,w,D;T.parameters={...T.parameters,docs:{...(S=T.parameters)==null?void 0:S.docs,source:{originalSource:`args => {
|
|
2
|
+
const [{
|
|
3
|
+
checked
|
|
4
|
+
}, updateArgs] = useArgs();
|
|
5
|
+
const handleChange = () => {
|
|
6
|
+
updateArgs({
|
|
7
|
+
checked: !checked
|
|
8
|
+
});
|
|
9
|
+
};
|
|
10
|
+
return <Toggle
|
|
11
|
+
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
12
|
+
{...args} onChange={handleChange} />;
|
|
13
|
+
}`,...(D=(w=T.parameters)==null?void 0:w.docs)==null?void 0:D.source}}};var _,I,v;d.parameters={...d.parameters,docs:{...(_=d.parameters)==null?void 0:_.docs,source:{originalSource:`args => {
|
|
14
|
+
const [{
|
|
15
|
+
checked
|
|
16
|
+
}, updateArgs] = useArgs();
|
|
17
|
+
const handleChange = () => {
|
|
18
|
+
updateArgs({
|
|
19
|
+
checked: !checked
|
|
20
|
+
});
|
|
21
|
+
};
|
|
22
|
+
return <Toggle
|
|
23
|
+
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
24
|
+
{...args} onChange={handleChange} />;
|
|
25
|
+
}`,...(v=(I=d.parameters)==null?void 0:I.docs)==null?void 0:v.source}}};var H,F,L;l.parameters={...l.parameters,docs:{...(H=l.parameters)==null?void 0:H.docs,source:{originalSource:`args => {
|
|
26
|
+
const [{
|
|
27
|
+
checked
|
|
28
|
+
}, updateArgs] = useArgs();
|
|
29
|
+
const handleChange = () => {
|
|
30
|
+
updateArgs({
|
|
31
|
+
checked: !checked
|
|
32
|
+
});
|
|
33
|
+
};
|
|
34
|
+
return <Toggle
|
|
35
|
+
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
36
|
+
{...args} onChange={handleChange} />;
|
|
37
|
+
}`,...(L=(F=l.parameters)==null?void 0:F.docs)==null?void 0:L.source}}};var E,O,R;g.parameters={...g.parameters,docs:{...(E=g.parameters)==null?void 0:E.docs,source:{originalSource:`args => {
|
|
38
|
+
const [{
|
|
39
|
+
checked
|
|
40
|
+
}, updateArgs] = useArgs();
|
|
41
|
+
const handleChange = () => {
|
|
42
|
+
updateArgs({
|
|
43
|
+
checked: !checked
|
|
44
|
+
});
|
|
45
|
+
};
|
|
46
|
+
return <Toggle
|
|
47
|
+
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
48
|
+
{...args} onChange={handleChange} />;
|
|
49
|
+
}`,...(R=(O=g.parameters)==null?void 0:O.docs)==null?void 0:R.source}}};var B,W,q;p.parameters={...p.parameters,docs:{...(B=p.parameters)==null?void 0:B.docs,source:{originalSource:`args => {
|
|
50
|
+
const [{
|
|
51
|
+
checked
|
|
52
|
+
}, updateArgs] = useArgs();
|
|
53
|
+
const handleChange = () => {
|
|
54
|
+
updateArgs({
|
|
55
|
+
checked: !checked
|
|
56
|
+
});
|
|
57
|
+
};
|
|
58
|
+
return <Toggle
|
|
59
|
+
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
60
|
+
{...args} onChange={handleChange} />;
|
|
61
|
+
}`,...(q=(W=p.parameters)==null?void 0:W.docs)==null?void 0:q.source}}};var N,P,K;i.parameters={...i.parameters,docs:{...(N=i.parameters)==null?void 0:N.docs,source:{originalSource:`args => {
|
|
62
|
+
const [{
|
|
63
|
+
checked
|
|
64
|
+
}, updateArgs] = useArgs();
|
|
65
|
+
const handleChange = () => {
|
|
66
|
+
updateArgs({
|
|
67
|
+
checked: !checked
|
|
68
|
+
});
|
|
69
|
+
};
|
|
70
|
+
return <Toggle
|
|
71
|
+
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
72
|
+
{...args} onChange={handleChange} />;
|
|
73
|
+
}`,...(K=(P=i.parameters)==null?void 0:P.docs)==null?void 0:K.source}}};var M,U,V;h.parameters={...h.parameters,docs:{...(M=h.parameters)==null?void 0:M.docs,source:{originalSource:`args => {
|
|
74
|
+
const [{
|
|
75
|
+
checked
|
|
76
|
+
}, updateArgs] = useArgs();
|
|
77
|
+
const handleChange = () => {
|
|
78
|
+
updateArgs({
|
|
79
|
+
checked: !checked
|
|
80
|
+
});
|
|
81
|
+
};
|
|
82
|
+
return <Toggle
|
|
83
|
+
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
84
|
+
{...args} onChange={handleChange} />;
|
|
85
|
+
}`,...(V=(U=h.parameters)==null?void 0:U.docs)==null?void 0:V.source}}};var Y,z,G;u.parameters={...u.parameters,docs:{...(Y=u.parameters)==null?void 0:Y.docs,source:{originalSource:`() => <>
|
|
86
|
+
<Toggle display="block" label={<Flex justifyContent="space-between" wrap={false} gap>
|
|
87
|
+
<Text bold>Label</Text>
|
|
88
|
+
<Text success>Released yesterday</Text>
|
|
89
|
+
</Flex>} onChange={() => {}} />
|
|
90
|
+
<Toggle label={<Flex justifyContent="space-between" wrap={false} gap>
|
|
91
|
+
<Text bold>Label</Text>
|
|
92
|
+
<Text success>Released yesterday</Text>
|
|
93
|
+
</Flex>} onChange={() => {}} />
|
|
94
|
+
</>`,...(G=(z=u.parameters)==null?void 0:z.docs)==null?void 0:G.source}}};var J,Q,X;m.parameters={...m.parameters,docs:{...(J=m.parameters)==null?void 0:J.docs,source:{originalSource:`() => {
|
|
95
|
+
const [checked, setChecked] = useState(false);
|
|
96
|
+
return <Toggle name="name" label="Label" checked={checked} onChange={evt => {
|
|
97
|
+
const {
|
|
98
|
+
name,
|
|
99
|
+
value,
|
|
100
|
+
checked
|
|
101
|
+
} = evt.target;
|
|
102
|
+
setChecked(checked);
|
|
103
|
+
console.log(name, value, checked);
|
|
104
|
+
}} />;
|
|
105
|
+
}`,...(X=(Q=m.parameters)==null?void 0:Q.docs)==null?void 0:X.source}}};var Z,$,ee;k.parameters={...k.parameters,docs:{...(Z=k.parameters)==null?void 0:Z.docs,source:{originalSource:`args => {
|
|
106
|
+
const [{
|
|
107
|
+
checked
|
|
108
|
+
}, updateArgs] = useArgs();
|
|
109
|
+
const handleChange = () => {
|
|
110
|
+
updateArgs({
|
|
111
|
+
checked: !checked
|
|
112
|
+
});
|
|
113
|
+
};
|
|
114
|
+
return <Toggle
|
|
115
|
+
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
116
|
+
{...args} onChange={handleChange} />;
|
|
117
|
+
}`,...(ee=($=k.parameters)==null?void 0:$.docs)==null?void 0:ee.source}}};var ne,se,ae;c.parameters={...c.parameters,docs:{...(ne=c.parameters)==null?void 0:ne.docs,source:{originalSource:`args => {
|
|
118
|
+
const [{
|
|
119
|
+
checked
|
|
120
|
+
}, updateArgs] = useArgs();
|
|
121
|
+
const handleChange = () => {
|
|
122
|
+
updateArgs({
|
|
123
|
+
checked: !checked
|
|
124
|
+
});
|
|
125
|
+
};
|
|
126
|
+
return <Toggle
|
|
127
|
+
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
128
|
+
{...args} onChange={handleChange} />;
|
|
129
|
+
}`,...(ae=(se=c.parameters)==null?void 0:se.docs)==null?void 0:ae.source}}};var re,te,ce;o.parameters={...o.parameters,docs:{...(re=o.parameters)==null?void 0:re.docs,source:{originalSource:`args => {
|
|
130
|
+
const [{
|
|
131
|
+
checked
|
|
132
|
+
}, updateArgs] = useArgs();
|
|
133
|
+
const handleChange = () => {
|
|
134
|
+
updateArgs({
|
|
135
|
+
checked: !checked
|
|
136
|
+
});
|
|
137
|
+
};
|
|
138
|
+
return <Toggle
|
|
139
|
+
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
140
|
+
{...args} onChange={handleChange} />;
|
|
141
|
+
}`,...(ce=(te=o.parameters)==null?void 0:te.docs)==null?void 0:ce.source}}};const _e=["Default","Disabled","DisabledChecked","Small","Standalone","HelpText","OnClickHelp","Display","TestClickevt","DisabledWithHelpText","Test","TestDisabled"];export{T as Default,d as Disabled,l as DisabledChecked,k as DisabledWithHelpText,u as Display,i as HelpText,h as OnClickHelp,g as Small,p as Standalone,c as Test,m as TestClickevt,o as TestDisabled,_e as __namedExportsOrder,De as default};
|
|
@@ -6,7 +6,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
|
|
|
6
6
|
top: 0px;
|
|
7
7
|
left: 0px;
|
|
8
8
|
right: 0px;
|
|
9
|
-
`,document.body.appendChild(r))}return r}var Qt=["size","angle","borderWidth","borderColor","roundness","backgroundColor","layerSide","style"],ie="left",oe="top",se="bottom",ae="right";function fe(e,r){return Math.tan(e*(Math.PI/180))*r}function er(e,r,n,t){var i,o=(i={},i[se]="0 "+-t+" "+r+" "+e,i[oe]="0 0 "+r+" "+(e+t),i[ae]=-t+" 0 "+e+" "+r,i[ie]="0 0 "+(e+t)+" "+r,i);return o[n.prop]}function tr(e,r,n,t,i){var o,s,a,l=t/10*e*2,u=(o={},o[se]=[0,e],o[oe]=[0,0],o[ae]=[e,r],o[ie]=[0,r],o)[n.prop].join(" "),c=n.isHorizontal?"V 0":"H "+r,f=r/2,d=r/2+fe(i,e/8),p=e/8,v=(s={},s[se]=["C",d,p,f+l,0,f,0],s[oe]=["C",d,e-p,f+l,e,f,e],s[ae]=["C",p,r-d,0,f-l,0,f],s[ie]=["C",e-p,r-d,e,f-l,e,f],s)[n.prop].join(" "),h=r/2-fe(i,e/8),m=e/8,y=(a={},a[se]=["C",f-l,0,h,m,u],a[oe]=["C",f-l,e,h,e-m,u],a[ae]=["C",0,f+l,m,r-h,u],a[ie]=["C",e,f+l,e-m,r-h,u],a)[n.prop].join(" ");return["M",u,c,v,y].join(" ")}function rr(e,r,n,t,i){var o=fe(i,n),s=t.isPush?[0,n]:[e,e-n],a=s[0],l=s[1];return t.isHorizontal?["M",a,n,"V",r-n,"L",l,r-n-o,"V",o+n,"Z"].join(" "):["M",n,a,"H",r-n,"L",r-n-o,l,"H",o+n,"Z"].join(" ")}var nr=g.forwardRef(function(r,n){var t=r.size,i=t===void 0?8:t,o=r.angle,s=o===void 0?45:o,a=r.borderWidth,l=a===void 0?0:a,u=r.borderColor,c=u===void 0?"black":u,f=r.roundness,d=f===void 0?0:f,p=r.backgroundColor,v=p===void 0?"white":p,h=r.layerSide,m=h===void 0?"top":h,y=r.style,b=y===void 0?{}:y,C=jt(r,Qt);if(m==="center")return null;var L=_[m],O=i,T=fe(s,i)*2,M=Math.max(O,T);return g.createElement("svg",x({ref:n},C,{style:x({},b,{transform:"translate"+(L.isHorizontal?"Y":"X")+"(-50%)"}),width:M,height:M,preserveAspectRatio:L.isPush?"xMinYMin":"xMaxYMax",viewBox:er(O,T,L,l)}),g.createElement("path",{fill:v,strokeWidth:l,stroke:c,d:tr(O,T,L,d,s)}),g.createElement("path",{fill:v,d:rr(O,T,l,L,s)}))}),$;(function(e){e[e.ENTERING=0]="ENTERING",e[e.LEAVING=1]="LEAVING",e[e.IDLE=2]="IDLE"})($||($={}));function ir(e){var r=e===void 0?{}:e,n=r.delayEnter,t=n===void 0?0:n,i=r.delayLeave,o=i===void 0?0:i,s=r.hideOnScroll,a=s===void 0?!0:s,l=g.useState(!1),u=l[0],c=l[1],f=g.useRef(null),d=g.useRef($.IDLE),p=g.useRef(!1),v=g.useCallback(function(){clearTimeout(f.current),f.current=null,d.current=$.IDLE},[]);function h(){d.current===$.LEAVING&&f.current&&v(),!u&&(d.current=$.ENTERING,f.current=window.setTimeout(function(){c(!0),f.current=null,d.current=$.IDLE},t))}function m(b,C){if(d.current===$.ENTERING&&f.current&&v(),!!u){if(C){c(!1),f.current=null,d.current=$.IDLE;return}d.current=$.LEAVING,f.current=window.setTimeout(function(){c(!1),f.current=null,d.current=$.IDLE},o)}}g.useEffect(function(){function b(){u&&a&&(v(),c(!1))}return window.addEventListener("scroll",b,!0),function(){window.removeEventListener("scroll",b,!0),f.current&&clearTimeout(f.current)}},[u,a,v]);var y={onMouseEnter:h,onMouseLeave:m,onTouchStart:function(){p.current=!1},onTouchMove:function(){p.current=!0},onTouchEnd:function(){!p.current&&!u&&c(!0),p.current=!1}};return[u,y,function(){return m(null,!0)}]}const or="_tooltip_wli9z_1",sr="_error_wli9z_15",ar="_warning_wli9z_19",me={tooltip:or,error:sr,warning:ar},Xe=({text:e="",error:r=!1,warning:n=!1,maxWidth:t="none",fontSize:i="inherit",padding:o="var(--padding-xxs) var(--padding-xs)",layerProps:s={style:{position:"fixed"}},arrowProps:a={style:{top:"100%",bottom:void 0,left:"50%",right:void 0,position:"absolute"}}})=>W.jsxs("div",{className:dt(me.tooltip,r?me.error:n?me.warning:""),...s,children:[W.jsx("div",{style:{maxWidth:t,fontSize:i,padding:o},children:e}),W.jsx(nr,{...a,size:6
|
|
9
|
+
`,document.body.appendChild(r))}return r}var Qt=["size","angle","borderWidth","borderColor","roundness","backgroundColor","layerSide","style"],ie="left",oe="top",se="bottom",ae="right";function fe(e,r){return Math.tan(e*(Math.PI/180))*r}function er(e,r,n,t){var i,o=(i={},i[se]="0 "+-t+" "+r+" "+e,i[oe]="0 0 "+r+" "+(e+t),i[ae]=-t+" 0 "+e+" "+r,i[ie]="0 0 "+(e+t)+" "+r,i);return o[n.prop]}function tr(e,r,n,t,i){var o,s,a,l=t/10*e*2,u=(o={},o[se]=[0,e],o[oe]=[0,0],o[ae]=[e,r],o[ie]=[0,r],o)[n.prop].join(" "),c=n.isHorizontal?"V 0":"H "+r,f=r/2,d=r/2+fe(i,e/8),p=e/8,v=(s={},s[se]=["C",d,p,f+l,0,f,0],s[oe]=["C",d,e-p,f+l,e,f,e],s[ae]=["C",p,r-d,0,f-l,0,f],s[ie]=["C",e-p,r-d,e,f-l,e,f],s)[n.prop].join(" "),h=r/2-fe(i,e/8),m=e/8,y=(a={},a[se]=["C",f-l,0,h,m,u],a[oe]=["C",f-l,e,h,e-m,u],a[ae]=["C",0,f+l,m,r-h,u],a[ie]=["C",e,f+l,e-m,r-h,u],a)[n.prop].join(" ");return["M",u,c,v,y].join(" ")}function rr(e,r,n,t,i){var o=fe(i,n),s=t.isPush?[0,n]:[e,e-n],a=s[0],l=s[1];return t.isHorizontal?["M",a,n,"V",r-n,"L",l,r-n-o,"V",o+n,"Z"].join(" "):["M",n,a,"H",r-n,"L",r-n-o,l,"H",o+n,"Z"].join(" ")}var nr=g.forwardRef(function(r,n){var t=r.size,i=t===void 0?8:t,o=r.angle,s=o===void 0?45:o,a=r.borderWidth,l=a===void 0?0:a,u=r.borderColor,c=u===void 0?"black":u,f=r.roundness,d=f===void 0?0:f,p=r.backgroundColor,v=p===void 0?"white":p,h=r.layerSide,m=h===void 0?"top":h,y=r.style,b=y===void 0?{}:y,C=jt(r,Qt);if(m==="center")return null;var L=_[m],O=i,T=fe(s,i)*2,M=Math.max(O,T);return g.createElement("svg",x({ref:n},C,{style:x({},b,{transform:"translate"+(L.isHorizontal?"Y":"X")+"(-50%)"}),width:M,height:M,preserveAspectRatio:L.isPush?"xMinYMin":"xMaxYMax",viewBox:er(O,T,L,l)}),g.createElement("path",{fill:v,strokeWidth:l,stroke:c,d:tr(O,T,L,d,s)}),g.createElement("path",{fill:v,d:rr(O,T,l,L,s)}))}),$;(function(e){e[e.ENTERING=0]="ENTERING",e[e.LEAVING=1]="LEAVING",e[e.IDLE=2]="IDLE"})($||($={}));function ir(e){var r=e===void 0?{}:e,n=r.delayEnter,t=n===void 0?0:n,i=r.delayLeave,o=i===void 0?0:i,s=r.hideOnScroll,a=s===void 0?!0:s,l=g.useState(!1),u=l[0],c=l[1],f=g.useRef(null),d=g.useRef($.IDLE),p=g.useRef(!1),v=g.useCallback(function(){clearTimeout(f.current),f.current=null,d.current=$.IDLE},[]);function h(){d.current===$.LEAVING&&f.current&&v(),!u&&(d.current=$.ENTERING,f.current=window.setTimeout(function(){c(!0),f.current=null,d.current=$.IDLE},t))}function m(b,C){if(d.current===$.ENTERING&&f.current&&v(),!!u){if(C){c(!1),f.current=null,d.current=$.IDLE;return}d.current=$.LEAVING,f.current=window.setTimeout(function(){c(!1),f.current=null,d.current=$.IDLE},o)}}g.useEffect(function(){function b(){u&&a&&(v(),c(!1))}return window.addEventListener("scroll",b,!0),function(){window.removeEventListener("scroll",b,!0),f.current&&clearTimeout(f.current)}},[u,a,v]);var y={onMouseEnter:h,onMouseLeave:m,onTouchStart:function(){p.current=!1},onTouchMove:function(){p.current=!0},onTouchEnd:function(){!p.current&&!u&&c(!0),p.current=!1}};return[u,y,function(){return m(null,!0)}]}const or="_tooltip_wli9z_1",sr="_error_wli9z_15",ar="_warning_wli9z_19",me={tooltip:or,error:sr,warning:ar},Xe=({text:e="",error:r=!1,warning:n=!1,maxWidth:t="none",fontSize:i="inherit",padding:o="var(--padding-xxs) var(--padding-xs)",layerProps:s={style:{position:"fixed"}},arrowProps:a={style:{top:"100%",bottom:void 0,left:"50%",right:void 0,position:"absolute"}}})=>W.jsxs("div",{className:dt(me.tooltip,r?me.error:n?me.warning:""),...s,children:[W.jsx("div",{style:{maxWidth:t,fontSize:i,padding:o},children:e}),W.jsx(nr,{...a,size:6})]});Xe.__docgenInfo={description:"",methods:[],displayName:"TooltipLayer",props:{text:{required:!1,tsType:{name:"union",raw:"TStringOrNumber | ReactNode",elements:[{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},{name:"ReactNode"}]},description:"",defaultValue:{value:"''",computed:!1}},error:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},warning:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},fontSize:{required:!1,tsType:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},description:"",defaultValue:{value:"'inherit'",computed:!1}},padding:{required:!1,tsType:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},description:"",defaultValue:{value:"'var(--padding-xxs) var(--padding-xs)'",computed:!1}},maxWidth:{required:!1,tsType:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},description:"",defaultValue:{value:"'none'",computed:!1}},layerProps:{required:!1,tsType:{name:"signature",type:"object",raw:`{
|
|
10
10
|
style?: CSSProperties;
|
|
11
11
|
[key: string]: any;
|
|
12
12
|
}`,signature:{properties:[{key:"style",value:{name:"CSSProperties",required:!1}},{key:{name:"string"},value:{name:"any",required:!0}}]}},description:"",defaultValue:{value:`{
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-eps93zm2.js";import{T as P}from"./tooltip-
|
|
1
|
+
import{j as e}from"./jsx-runtime-eps93zm2.js";import{T as P}from"./tooltip-1V7clEnw.js";import"./index-DhsZuJvc.js";import"./index-CUZDtIZe.js";import"./index-Bk2sglWO.js";const A={title:"Basic/Tooltip",component:P,args:{text:"Tooltip text",error:!1,warning:!1,enabled:!0,placement:void 0,triggerOffset:void 0,fontSize:void 0,padding:void 0,maxWidth:void 0,display:void 0,children:e.jsx("span",{children:"Hover over me"})}},r=X=>e.jsx(P,{...X}),p=r.bind({}),a=r.bind({});a.args={error:!0};const o=r.bind({});o.args={warning:!0};const t=r.bind({});t.args={text:e.jsxs(e.Fragment,{children:["Select from options:",e.jsxs("ul",{children:[e.jsx("li",{children:"One"}),e.jsx("li",{children:"Two"})]})]})};const n=r.bind({});n.args={placement:"right-end"};const i=r.bind({});i.args={triggerOffset:30};const c=r.bind({});c.args={forceOpen:!0};const s=r.bind({});s.args={display:"block",children:e.jsx("div",{style:{background:"lightgray"},children:"Block element"})};s.parameters={docs:{source:{type:"code"},description:{story:"The `Tooltip` trigger wrapper defaults to `display: inline`. If you encounter layout issues, try changing this to match its content (i.e. `display: block` for `block` elements)"}}};var l,d,g;p.parameters={...p.parameters,docs:{...(l=p.parameters)==null?void 0:l.docs,source:{originalSource:`args => <Tooltip
|
|
2
2
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
3
3
|
{...args} />`,...(g=(d=p.parameters)==null?void 0:d.docs)==null?void 0:g.source}}};var m,u,x;a.parameters={...a.parameters,docs:{...(m=a.parameters)==null?void 0:m.docs,source:{originalSource:`args => <Tooltip
|
|
4
4
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as o}from"./jsx-runtime-eps93zm2.js";import{T as m}from"./tooltip-
|
|
1
|
+
import{j as o}from"./jsx-runtime-eps93zm2.js";import{T as m}from"./tooltip-1V7clEnw.js";import{M as u}from"./actions-CHgr8eL8.js";import{m as d}from"./menu.stories-data-DeDnsKpk.js";import"./index-DhsZuJvc.js";import"./index-CUZDtIZe.js";import"./index-Bk2sglWO.js";import"./lodash-BHd_uQHh.js";import"./common-types-Sih75Sav.js";import"./disabled-context-rmpd7YJS.js";import"./button-VxhoNhrV.js";import"./spinner-AWUe4xwQ.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./inheritsLoose-DP0QEDDI.js";import"./index-CEuq6vkz.js";import"./types-BmbYqTX_.js";import"./types-UmZ4Y_CR.js";import"./badge-CLQ59MDF.js";import"./flex-EllkLxgO.js";const B={title:"Basic/Tooltip/Test Cases",component:m,args:{text:"Tooltip text"}},l=c=>o.jsx(m,{...c}),e=l.bind({});e.args={children:o.jsx(u,{menu:d}),placement:"bottom-end",display:"inline-block"};const s=l.bind({});s.args={children:o.jsx("span",{children:"Hover over me"}),text:"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean pharetra tellus eu cursus suscipit. Maecenas leo sapien, convallis ac urna ullamcorper, tempus porttitor eros. Suspendisse pellentesque odio ac metus semper, nec sagittis nisi cursus. Aenean felis libero, bibendum id accumsan id, commodo suscipit ex. Pellentesque gravida rhoncus neque, ac tincidunt libero maximus vel. In lacus nisi, malesuada vitae velit vel, laoreet porta nisl."};var t,r,i;e.parameters={...e.parameters,docs:{...(t=e.parameters)==null?void 0:t.docs,source:{originalSource:`args => <Tooltip
|
|
2
2
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
3
3
|
{...args} />`,...(i=(r=e.parameters)==null?void 0:r.docs)==null?void 0:i.source}}};var a,n,p;s.parameters={...s.parameters,docs:{...(a=s.parameters)==null?void 0:a.docs,source:{originalSource:`args => <Tooltip
|
|
4
4
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as n}from"./jsx-runtime-eps93zm2.js";import{c as d}from"./index-Bk2sglWO.js";import{I as q}from"./icon-
|
|
1
|
+
import{j as n}from"./jsx-runtime-eps93zm2.js";import{c as d}from"./index-Bk2sglWO.js";import{I as q}from"./icon-BSFY3vDO.js";import{T}from"./common-types-Sih75Sav.js";import{B as E}from"./button-VxhoNhrV.js";import{M as w}from"./actions-CHgr8eL8.js";import{r as N}from"./index-DhsZuJvc.js";import{D as M}from"./disabled-context-rmpd7YJS.js";const R="_topbar_oyr59_11",_="_fixed_oyr59_21",j="_appSwitcher_oyr59_29",h="_title_oyr59_75",C="_logo_oyr59_91",x="_label_oyr59_94",I="_brand_oyr59_99",B="_version_oyr59_104",H="_left_oyr59_111",L="_right_oyr59_112",P="_item_oyr59_126",A="_link_oyr59_127",D="_button_oyr59_138",O="_menu_oyr59_139",S="_active_oyr59_168",V="_alert_oyr59_193",a={topbar:R,fixed:_,appSwitcher:j,title:h,logo:C,label:x,brand:I,version:B,left:H,right:L,item:P,link:A,button:D,menu:O,active:S,alert:V},g=({warning:e})=>n.jsx("div",{className:a.alert,children:e});g.__docgenInfo={description:"",methods:[],displayName:"Warning",props:{warning:{required:!0,tsType:{name:"ReactNode"},description:""}}};const f=({icon:e,url:t,onClick:s})=>{const r=n.jsx(q,{icon:e});return t?n.jsx("a",{href:t,onClick:s,className:a.appSwitcher,children:r}):n.jsx("div",{onClick:s,className:a.appSwitcher,children:r})};f.__docgenInfo={description:"",methods:[],displayName:"AppSwitcher",props:{icon:{required:!1,tsType:{name:"ReactReactNode",raw:"React.ReactNode"},description:""},url:{required:!1,tsType:{name:"string"},description:""},onClick:{required:!1,tsType:{name:"MouseEventHandler",elements:[{name:"union",raw:"HTMLDivElement | HTMLAnchorElement",elements:[{name:"HTMLDivElement"},{name:"HTMLAnchorElement"}]}],raw:"MouseEventHandler<HTMLDivElement | HTMLAnchorElement>"},description:""}}};const b=({label:e,logo:t,url:s,version:r,onClick:i})=>{const l=n.jsxs("div",{className:a.title,children:[t&&n.jsx("div",{className:a.logo,children:t}),e&&n.jsx("span",{className:a.label,children:e}),r&&n.jsx("div",{className:a.version,children:r})]});return n.jsx("div",{className:d(a.item,a.brand),children:s?n.jsx("a",{href:s,onClick:i,children:l}):n.jsx("div",{onClick:i,children:l})})};b.__docgenInfo={description:"",methods:[],displayName:"Title",props:{label:{required:!1,tsType:{name:"union",raw:"string | null",elements:[{name:"string"},{name:"null"}]},description:""},logo:{required:!1,tsType:{name:"ReactReactNode",raw:"React.ReactNode"},description:""},url:{required:!1,tsType:{name:"string"},description:""},version:{required:!1,tsType:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},description:""},onClick:{required:!1,tsType:{name:"MouseEventHandler",elements:[{name:"union",raw:"HTMLDivElement | HTMLAnchorElement",elements:[{name:"HTMLDivElement"},{name:"HTMLAnchorElement"}]}],raw:"MouseEventHandler<HTMLDivElement | HTMLAnchorElement>"},description:""}}};var m=(e=>(e.LINK="Link",e.BUTTON="Button",e.MENU="Menu",e.COMPONENT="Component",e))(m||{});const p=({label:e,url:t,icon:s,onClick:r,active:i,disabled:l,testId:c,component:o="a"})=>{const u=N.useContext(M),k=v=>{(l||u)&&v.preventDefault(),r==null||r(v)};return n.jsxs(o,{className:d(a.link,i?a.active:""),href:t||"#",to:t,onClick:k,"aria-disabled":l||u,"data-testid":c,role:r&&!t?"button":void 0,children:[s,n.jsx("span",{className:a.label,children:e})]})};p.__docgenInfo={description:"",methods:[],displayName:"Link",props:{label:{required:!1,tsType:{name:"union",raw:"string | null",elements:[{name:"string"},{name:"null"}]},description:""},url:{required:!1,tsType:{name:"string"},description:""},icon:{required:!1,tsType:{name:"ReactReactNode",raw:"React.ReactNode"},description:""},onClick:{required:!1,tsType:{name:"MouseEventHandler",elements:[{name:"HTMLAnchorElement"}],raw:"MouseEventHandler<HTMLAnchorElement>"},description:""},active:{required:!1,tsType:{name:"boolean"},description:""},disabled:{required:!1,tsType:{name:"boolean"},description:""},testId:{required:!1,tsType:{name:"string"},description:""},component:{required:!1,tsType:{name:"ReactElementType",raw:"React.ElementType"},description:"",defaultValue:{value:"'a'",computed:!1}}}};const y=({element:e})=>{switch(e.type){case m.LINK:return n.jsx("div",{className:a.item,children:n.jsx(p,{label:e.label,url:e.url,icon:e.icon,onClick:e.onClick,active:e.active,disabled:e.disabled,testId:e.testId,component:e.component})});case m.BUTTON:return n.jsx("div",{className:d(a.item,a.button),children:n.jsx(E,{label:e.label,colored:e.colored,pill:!0,disabled:e.disabled,onClick:e.onClick,icon:e.icon,testId:e.testId})});case m.MENU:return n.jsx("div",{className:d(a.item,a.menu),children:n.jsx(w,{maxHeight:"100%",menu:{trigger:T.COMPONENT,fullHeightTrigger:!0,placement:"bottom-start",component:n.jsx(p,{label:e.label,icon:e.icon,onClick:e.onClick}),sections:e.sections}})});case m.COMPONENT:return n.jsx("div",{className:a.item,children:e.component});default:return null}};y.__docgenInfo={description:"",methods:[],displayName:"Element",props:{element:{required:!0,tsType:{name:"union",raw:"TLinkElement | TButtonElement | TMenuElement | TComponentElement",elements:[{name:"intersection",raw:`TBaseElementProps & {
|
|
2
2
|
type: 'Link';
|
|
3
3
|
url?: string;
|
|
4
4
|
active?: boolean;
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import{j as e}from"./jsx-runtime-eps93zm2.js";import{H as I,L as c,S as D,R as l}from"./react-router-dom-Ck2Y_Fzc.js";import{I as O,T as A}from"./common-types-Sih75Sav.js";import{T as p}from"./top-bar-C_tn2Pc5.js";import{P as w}from"./page-7SSpdYhb.js";import{M as N}from"./actions-CHgr8eL8.js";import{B as m}from"./button-VxhoNhrV.js";import{B as P}from"./badge-CLQ59MDF.js";import{L as v}from"./logo-BVP9045W.js";import{s as H}from"./icon-custom-Xcl4YkWP.js";import{M as s}from"./types-BmbYqTX_.js";import"./index-DhsZuJvc.js";import"./inheritsLoose-DP0QEDDI.js";import"./index-CEuq6vkz.js";import"./tiny-invariant-DqLgxztJ.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./index-Bk2sglWO.js";import"./icon-BSFY3vDO.js";import"./disabled-context-rmpd7YJS.js";import"./lodash-BHd_uQHh.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";import"./types-UmZ4Y_CR.js";import"./spinner-AWUe4xwQ.js";const M=[{type:"Link",label:"Link",onClick:()=>{}},{type:"Link",label:"Active",active:!0,onClick:()=>{}},{type:"Link",label:"Disabled",disabled:!0,onClick:()=>{}},{type:"Menu",label:"Dropdown",onClick:()=>{},sections:[{type:"Option",label:"Alpacas",onClick:()=>{}},{type:"Option",label:"Llamas",onClick:()=>{}}]},{type:"Button",label:"Save",colored:!0,onClick:()=>{},testId:"top-bar-button-save"}],E=[{type:"Component",component:e.jsx(P,{title:"3",small:!0,margin:"5px",children:e.jsx(m,{icon:O.NOTIFICATION,round:!0,onClick:()=>{}})})},{type:"Component",component:e.jsx(N,{menu:{trigger:A.COMPONENT,fullHeightTrigger:!0,placement:"bottom-end",component:e.jsx(m,{label:"TU",round:!0,onClick:()=>{}}),sections:[{type:s.HEADING,label:"Test User"},{type:s.OPTION,label:"Profile",icon:"user",onClick:()=>{}},{type:s.DIVIDER},{type:s.OPTION,label:"Sign out",icon:"lock",onClick:()=>{}}]}})}],ce={title:"Navigation/TopBar",component:p,parameters:{layout:"fullscreen",docs:{story:{inline:!1,iframeHeight:400}}},argTypes:{height:{control:"text"}},args:{title:{logo:e.jsx("img",{src:v,alt:"logo"}),onClick:()=>{}},content:M,contentRight:E}},i=j=>e.jsx(p,{...j}),n=i.bind({}),t=i.bind({});t.args={warning:"Application update available. Please refresh your browser."};const r=i.bind({});r.args={title:{label:"Text Branding",onClick:()=>{}}};const o=i.bind({});o.args={appSwitcher:{icon:H,onClick:()=>{}}};const a=()=>e.jsx(I,{children:e.jsxs(w,{left:0,children:[e.jsx(p,{content:[{type:"Link",label:"Dashboard",component:c,url:"/dashboard"},{type:"Link",label:"Settings",component:c,url:"/settings"}]}),e.jsxs(D,{children:[e.jsx(l,{path:"/dashboard",children:"Dashboard"}),e.jsx(l,{path:"/settings",children:"Settings"})]})]})});a.__docgenInfo={description:"",methods:[],displayName:"AsRouterLink"};var d,u,g;n.parameters={...n.parameters,docs:{...(d=n.parameters)==null?void 0:d.docs,source:{originalSource:"args => <TopBar {...args} />",...(g=(u=n.parameters)==null?void 0:u.docs)==null?void 0:g.source}}};var h,b,k;t.parameters={...t.parameters,docs:{...(h=t.parameters)==null?void 0:h.docs,source:{originalSource:"args => <TopBar {...args} />",...(k=(b=t.parameters)==null?void 0:b.docs)==null?void 0:k.source}}};var T,y,f;r.parameters={...r.parameters,docs:{...(T=r.parameters)==null?void 0:T.docs,source:{originalSource:"args => <TopBar {...args} />",...(f=(y=r.parameters)==null?void 0:y.docs)==null?void 0:f.source}}};var x,S,C;o.parameters={...o.parameters,docs:{...(x=o.parameters)==null?void 0:x.docs,source:{originalSource:"args => <TopBar {...args} />",...(C=(S=o.parameters)==null?void 0:S.docs)==null?void 0:C.source}}};var L,B,R;a.parameters={...a.parameters,docs:{...(L=a.parameters)==null?void 0:L.docs,source:{originalSource:`() => {
|
|
2
|
+
return <HashRouter>
|
|
3
|
+
<Page left={0}>
|
|
4
|
+
<TopBar content={[{
|
|
5
|
+
type: 'Link',
|
|
6
|
+
label: 'Dashboard',
|
|
7
|
+
component: Link,
|
|
8
|
+
url: '/dashboard'
|
|
9
|
+
}, {
|
|
10
|
+
type: 'Link',
|
|
11
|
+
label: 'Settings',
|
|
12
|
+
component: Link,
|
|
13
|
+
url: '/settings'
|
|
14
|
+
}]} />
|
|
15
|
+
<Switch>
|
|
16
|
+
<Route path="/dashboard">Dashboard</Route>
|
|
17
|
+
<Route path="/settings">Settings</Route>
|
|
18
|
+
</Switch>
|
|
19
|
+
</Page>
|
|
20
|
+
</HashRouter>;
|
|
21
|
+
}`,...(R=(B=a.parameters)==null?void 0:B.docs)==null?void 0:R.source}}};const le=["Default","WithWarning","TextBranding","AppSwitcher","AsRouterLink"];export{o as AppSwitcher,a as AsRouterLink,n as Default,r as TextBranding,t as WithWarning,le as __namedExportsOrder,ce as default};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-eps93zm2.js";import{I as n}from"./common-types-Sih75Sav.js";import{T as l}from"./top-bar-
|
|
1
|
+
import{j as e}from"./jsx-runtime-eps93zm2.js";import{I as n}from"./common-types-Sih75Sav.js";import{T as l}from"./top-bar-C_tn2Pc5.js";import{B as s}from"./button-VxhoNhrV.js";import{B as m}from"./badge-CLQ59MDF.js";import{L as p}from"./logo-BVP9045W.js";import"./index-DhsZuJvc.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-CHgr8eL8.js";import"./lodash-BHd_uQHh.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";import"./types-BmbYqTX_.js";import"./types-UmZ4Y_CR.js";import"./spinner-AWUe4xwQ.js";const h={title:"Navigation/TopBar/Test Cases",parameters:{layout:"fullscreen",docs:{story:{inline:!1,iframeHeight:400}}}},o=()=>e.jsx(l,{title:{logo:e.jsx("img",{src:p,alt:"logo"}),version:"V1.2.3",onClick:()=>{}},content:[{type:"Link",label:"Link",onClick:()=>{}},{type:"Link",label:"Lorem ipsum dolor est compendum lorem ipsum dolor est compendum lorem ipsum dolor est (cloned 2022-06-17 01:33:42)",active:!0,onClick:()=>{}},{type:"Link",label:"Disabled",disabled:!0,onClick:()=>{}},{type:"Button",label:"Save",colored:!0,onClick:()=>{},testId:"top-bar-button-save"}],contentRight:[{type:"Component",component:e.jsx(m,{title:"3",small:!0,margin:"5px",children:e.jsx(s,{icon:n.NOTIFICATION,round:!0,onClick:()=>{}})})}]});o.__docgenInfo={description:"",methods:[],displayName:"OverflowingLinks"};var t,r,i;o.parameters={...o.parameters,docs:{...(t=o.parameters)==null?void 0:t.docs,source:{originalSource:`() => <TopBar title={{
|
|
2
2
|
logo: <img src={LogoSVG} alt="logo" />,
|
|
3
3
|
version: 'V1.2.3',
|
|
4
4
|
onClick: () => {}
|