@oliasoft-open-source/react-ui-library 4.1.5 → 4.1.6-beta-1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (44) hide show
  1. package/dist/assets/{index-b17ea451.js → index-0fee18b2.js} +10 -10
  2. package/dist/assets/{index-4e076e2d.css → index-f2b208e6.css} +15 -14
  3. package/dist/index.d.ts +3 -1
  4. package/dist/index.html +1 -1
  5. package/dist/index.js +79 -32
  6. package/dist/index.js.map +1 -1
  7. package/dist/storybook/assets/{Color-6VNJS4EI-9a2985b2.js → Color-6VNJS4EI-189762fa.js} +1 -1
  8. package/dist/storybook/assets/{DocsRenderer-NNNQARDV-7d390284.js → DocsRenderer-NNNQARDV-12f4661f.js} +1 -1
  9. package/dist/storybook/assets/{WithTooltip-4HIR6TLV-935a2b47.js → WithTooltip-4HIR6TLV-f2f8ab3e.js} +1 -1
  10. package/dist/storybook/assets/{afe.stories-86276073.js → afe.stories-cc38aff9.js} +1 -1
  11. package/dist/storybook/assets/{buttons-and-links-f8588ace.js → buttons-and-links-059bfed6.js} +1 -1
  12. package/dist/storybook/assets/{casing-loads.stories-e5e1eaa9.js → casing-loads.stories-e65ed11b.js} +1 -1
  13. package/dist/storybook/assets/{chunk-HLWAVYOI-ec25be11.js → chunk-HLWAVYOI-f01f3de0.js} +1 -1
  14. package/dist/storybook/assets/{color-9efc2f2e.js → color-cd3ec4c3.js} +1 -1
  15. package/dist/storybook/assets/dialog-d1746c46.js +1 -0
  16. package/dist/storybook/assets/{formation.stories-262bd728.js → formation.stories-e444112c.js} +1 -1
  17. package/dist/storybook/assets/{formatter-SWP5E3XI-6ab3c3a9.js → formatter-SWP5E3XI-d242f07b.js} +1 -1
  18. package/dist/storybook/assets/{iframe-697f8aaf.js → iframe-095d8394.js} +1 -1
  19. package/dist/storybook/assets/{index-a7512f2e.js → index-56205b57.js} +4 -4
  20. package/dist/storybook/assets/{input-validation-3ded498c.js → input-validation-229633ba.js} +1 -1
  21. package/dist/storybook/assets/{inputs-7d113dd0.js → inputs-b61c86fb.js} +1 -1
  22. package/dist/storybook/assets/{layout-forms-b74a30ba.js → layout-forms-d14c6084.js} +1 -1
  23. package/dist/storybook/assets/{layout-general-7e3b0be7.js → layout-general-7da3e8a7.js} +1 -1
  24. package/dist/storybook/assets/modal.stories-926201c3.js +173 -0
  25. package/dist/storybook/assets/{padding-and-spacing-d47007e6.js → padding-and-spacing-84f38432.js} +1 -1
  26. package/dist/storybook/assets/preview-87482613.js +1 -0
  27. package/dist/storybook/assets/{preview-c85f9156.js → preview-c3814db0.js} +1 -1
  28. package/dist/storybook/assets/{projects.stories-9d6e0a4c.js → projects.stories-3884a80c.js} +1 -1
  29. package/dist/storybook/assets/{site.stories-46091c50.js → site.stories-f06d77af.js} +1 -1
  30. package/dist/storybook/assets/{syntaxhighlighter-NMPM6SWI-90fd0fb6.js → syntaxhighlighter-NMPM6SWI-da38ba14.js} +1 -1
  31. package/dist/storybook/assets/tabs-be40d085.css +1 -0
  32. package/dist/storybook/assets/{tabs-cdfc5225.js → tabs-cf5ccede.js} +1 -1
  33. package/dist/storybook/assets/tabs.stories-5b0ca9e1.js +30 -0
  34. package/dist/storybook/iframe.html +1 -1
  35. package/dist/storybook/index.json +1 -1
  36. package/dist/storybook/project.json +1 -1
  37. package/dist/storybook/stories.json +1 -1
  38. package/package.json +1 -1
  39. package/dist/404.html +0 -1
  40. package/dist/storybook/assets/dialog-795008dd.js +0 -1
  41. package/dist/storybook/assets/modal.stories-b5414377.js +0 -141
  42. package/dist/storybook/assets/preview-20eb7184.js +0 -1
  43. package/dist/storybook/assets/tabs-c2db5f41.css +0 -1
  44. package/dist/storybook/assets/tabs.stories-c962aeea.js +0 -30
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@oliasoft-open-source/react-ui-library",
3
- "version": "4.1.5",
3
+ "version": "4.1.6-beta-1",
4
4
  "description": "Reusable UI components for React projects",
5
5
  "homepage": "https://oliasoft-open-source.gitlab.io/react-ui-library",
6
6
  "bugs": {
package/dist/404.html DELETED
@@ -1 +0,0 @@
1
- <!doctype html><head><title>React UI Library</title><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1" user-scalable="no"><meta name="apple-mobile-web-app-capable" content="yes"><script type="module" crossorigin src="/react-ui-library/assets/index-b17ea451.js"></script><link rel="stylesheet" href="/react-ui-library/assets/index-4e076e2d.css"></head><body><div id="content"></div></body>
@@ -1 +0,0 @@
1
- import{j as e}from"./jsx-runtime-f961835c.js";import{c as l}from"./index-a80ed1cf.js";import{P as f}from"./portal-03fe4689.js";import{r as h}from"./index-f80c8c95.js";import{l as x}from"./lodash-75c70a11.js";import{I as y}from"./common-types-2c81813f.js";import{H as j}from"./heading-d29eb744.js";import{B as v}from"./button-74c97e4a.js";const N="_wrapper_sb0hc_1",b="_contentContainer_sb0hc_15",w="_centered_sb0hc_24",C="_newLine_sb0hc_28",i={wrapper:N,contentContainer:b,centered:w,newLine:C},k=({children:t})=>e.jsx("div",{className:l(i.wrapper),children:t}),I=({children:t,width:n,centered:s})=>e.jsx("div",{className:l(i.contentContainer,s?i.centered:""),style:{maxWidth:n},children:t}),p=({children:t,visible:n=!1,centered:s=!1,width:a="100%"})=>e.jsxs(e.Fragment,{children:[e.jsx(f,{id:"modalContainer",children:n?e.jsx(k,{children:e.jsx(I,{width:a,centered:s,children:t})}):null}),e.jsx("div",{id:"modalContainer"})]});try{p.displayName="Modal",p.__docgenInfo={description:"",displayName:"Modal",props:{visible:{defaultValue:{value:"false"},description:"",name:"visible",required:!1,type:{name:"boolean"}},centered:{defaultValue:{value:"false"},description:"",name:"centered",required:!1,type:{name:"boolean"}},width:{defaultValue:{value:"100%"},description:"",name:"width",required:!1,type:{name:"TStringOrNumber"}}}}}catch{}const D="_dialog_18g0k_1",q="_inline_18g0k_18",E="_scroll_18g0k_21",L="_header_18g0k_24",M="_dismiss_18g0k_33",V="_content_18g0k_38",$="_footer_18g0k_47",r={dialog:D,inline:q,scroll:E,header:L,dismiss:M,content:V,footer:$},B=t=>x.isArray(t)?t.map((n,s)=>e.jsxs(h.Fragment,{children:[n," ",e.jsx("br",{})]},s)):t,_=({dialog:t})=>{const{heading:n,content:s,contentPadding:a="var(--padding)",footer:d,scroll:u,width:c,height:g,onClose:m,testId:o}=t;return e.jsxs("div",{className:l(r.dialog,c?r.inline:null,u?r.scroll:null),style:{width:c,height:g},"data-testid":o??null,children:[e.jsxs("div",{className:r.header,children:[e.jsx(j,{testId:o&&`${o}-heading`,top:!0,marginBottom:0,children:n}),m?e.jsx("div",{className:r.dismiss,children:e.jsx(v,{icon:y.CLOSE,round:!0,basic:!0,small:!0,colored:"muted",onClick:m})}):null]}),e.jsx("div",{"data-testid":o&&`${o}-content`,className:r.content,style:{padding:a},children:B(s)}),d&&e.jsx("div",{"data-testid":o&&`${o}-footer`,className:r.footer,children:d})]})};try{_.displayName="Dialog",_.__docgenInfo={description:"",displayName:"Dialog",props:{dialog:{defaultValue:null,description:"",name:"dialog",required:!0,type:{name:"IDialog"}}}}}catch{}export{_ as D,p as M};
@@ -1,141 +0,0 @@
1
- import{j as e}from"./jsx-runtime-f961835c.js";import{T as W}from"./common-types-2c81813f.js";import{M as E,D as R}from"./dialog-795008dd.js";import{B as n}from"./button-74c97e4a.js";import{P as H}from"./popover-06e375a5.js";import{I as K}from"./input-d68625a5.js";import{I as U}from"./input-group-20c3add3.js";import{F as p}from"./field-a094cd72.js";import{M as G}from"./actions-2d4e1c8e.js";import{S as V}from"./select-62aa86c5.js";import{S as Y}from"./spacer-54db0620.js";import{T as q}from"./tooltip-23e84186.js";import{M as m}from"./types-cc224262.js";import"./index-f80c8c95.js";import"./index-a80ed1cf.js";import"./portal-03fe4689.js";import"./index-3d476d02.js";import"./lodash-75c70a11.js";import"./heading-d29eb744.js";import"./help-icon-d4189b1b.js";import"./icon-e9cbb4d7.js";import"./inheritsLoose-d4851ab8.js";import"./tslib.es6-dfef685f.js";import"./index-c89a1915.js";import"./disabled-context-d654f6ff.js";import"./spinner-a81ebe38.js";import"./types-332ceaf3.js";import"./label-13d490a3.js";import"./badge-20e7ee0b.js";import"./assertThisInitialized-081f9914.js";import"./memoize-one.esm-52518564.js";import"./text-ad1f5f1d.js";import"./select.input-88b6ebab.js";const{useArgs:z}=__STORYBOOK_MODULE_ADDONS__,Te={title:"Modals/Modal",component:E,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(n,{label:"Okay",colored:!0,onClick:()=>{}}),e.jsx(n,{label:"Cancel",onClick:()=>{}})]}),onClose:()=>{}},parameters:{docs:{story:{inline:!1,iframeHeight:400}}}},o=()=>{const[{visible:c,centered:I,...w},L]=z(),g=()=>{L({visible:!c})};return e.jsxs(e.Fragment,{children:[e.jsx(E,{visible:c,centered:I,children:e.jsx(R,{dialog:{...w,onClose:g}})}),e.jsx(n,{label:"Open Modal",onClick:g})]})},d=o.bind({}),r=o.bind({});r.args={centered:!0};const a=o.bind({});a.args={content:["This is a","new line!"]};const l=o.bind({});l.args={scroll:!0,content:e.jsx("div",{children:"Example modal content goes here lorem ipsum. ".repeat(100)})};const s=o.bind({});s.args={width:"100%",content:e.jsx("div",{children:"Example modal content goes here lorem ipsum. ".repeat(100)})};const t=o.bind({});t.args={contentPadding:0};const i=o.bind({});i.args={content:e.jsxs(e.Fragment,{children:[e.jsx(q,{text:"Tooltip text",children:"Hover for tooltip"}),e.jsx(Y,{}),e.jsx(p,{label:"Custom Select",helpText:"Select an animal",children:e.jsx(V,{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(p,{label:"Nested Menu",children:e.jsx(G,{maxHeight:"240px",menu:{label:"Menu",trigger:W.DROP_DOWN_BUTTON,sections:[{type:m.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:m.OPTION,label:Math.random().toString(36).substring(7),onClick:()=>{}}))]}})}),e.jsx(H,{content:e.jsxs(U,{small:!0,children:[e.jsx(K,{value:"Value",width:"150px",error:"Bad value"}),e.jsx(n,{colored:!0,label:"Save",onClick:()=>{}}),e.jsx(n,{label:"Cancel",onClick:()=>{}})]}),children:e.jsx(n,{colored:!0,label:"Toggle me",onClick:()=>{}})})]})};var u,b,M;d.parameters={...d.parameters,docs:{...(u=d.parameters)==null?void 0:u.docs,source:{originalSource:`() => {
2
- const [{
3
- visible,
4
- centered,
5
- ...dialogProps
6
- }, updateArgs] = useArgs();
7
- const toggleModal = () => {
8
- updateArgs({
9
- visible: !visible
10
- });
11
- };
12
- return <>
13
- <Modal visible={visible} centered={centered}>
14
- <Dialog dialog={{
15
- ...dialogProps,
16
- onClose: toggleModal
17
- }} />
18
- </Modal>
19
- <Button label="Open Modal" onClick={toggleModal} />
20
- </>;
21
- }`,...(M=(b=d.parameters)==null?void 0:b.docs)==null?void 0:M.source}}};var v,x,C;r.parameters={...r.parameters,docs:{...(v=r.parameters)==null?void 0:v.docs,source:{originalSource:`() => {
22
- const [{
23
- visible,
24
- centered,
25
- ...dialogProps
26
- }, updateArgs] = useArgs();
27
- const toggleModal = () => {
28
- updateArgs({
29
- visible: !visible
30
- });
31
- };
32
- return <>
33
- <Modal visible={visible} centered={centered}>
34
- <Dialog dialog={{
35
- ...dialogProps,
36
- onClose: toggleModal
37
- }} />
38
- </Modal>
39
- <Button label="Open Modal" onClick={toggleModal} />
40
- </>;
41
- }`,...(C=(x=r.parameters)==null?void 0:x.docs)==null?void 0:C.source}}};var h,P,A;a.parameters={...a.parameters,docs:{...(h=a.parameters)==null?void 0:h.docs,source:{originalSource:`() => {
42
- const [{
43
- visible,
44
- centered,
45
- ...dialogProps
46
- }, updateArgs] = useArgs();
47
- const toggleModal = () => {
48
- updateArgs({
49
- visible: !visible
50
- });
51
- };
52
- return <>
53
- <Modal visible={visible} centered={centered}>
54
- <Dialog dialog={{
55
- ...dialogProps,
56
- onClose: toggleModal
57
- }} />
58
- </Modal>
59
- <Button label="Open Modal" onClick={toggleModal} />
60
- </>;
61
- }`,...(A=(P=a.parameters)==null?void 0:P.docs)==null?void 0:A.source}}};var j,k,O;l.parameters={...l.parameters,docs:{...(j=l.parameters)==null?void 0:j.docs,source:{originalSource:`() => {
62
- const [{
63
- visible,
64
- centered,
65
- ...dialogProps
66
- }, updateArgs] = useArgs();
67
- const toggleModal = () => {
68
- updateArgs({
69
- visible: !visible
70
- });
71
- };
72
- return <>
73
- <Modal visible={visible} centered={centered}>
74
- <Dialog dialog={{
75
- ...dialogProps,
76
- onClose: toggleModal
77
- }} />
78
- </Modal>
79
- <Button label="Open Modal" onClick={toggleModal} />
80
- </>;
81
- }`,...(O=(k=l.parameters)==null?void 0:k.docs)==null?void 0:O.source}}};var f,S,T;s.parameters={...s.parameters,docs:{...(f=s.parameters)==null?void 0:f.docs,source:{originalSource:`() => {
82
- const [{
83
- visible,
84
- centered,
85
- ...dialogProps
86
- }, updateArgs] = useArgs();
87
- const toggleModal = () => {
88
- updateArgs({
89
- visible: !visible
90
- });
91
- };
92
- return <>
93
- <Modal visible={visible} centered={centered}>
94
- <Dialog dialog={{
95
- ...dialogProps,
96
- onClose: toggleModal
97
- }} />
98
- </Modal>
99
- <Button label="Open Modal" onClick={toggleModal} />
100
- </>;
101
- }`,...(T=(S=s.parameters)==null?void 0:S.docs)==null?void 0:T.source}}};var y,B,D;t.parameters={...t.parameters,docs:{...(y=t.parameters)==null?void 0:y.docs,source:{originalSource:`() => {
102
- const [{
103
- visible,
104
- centered,
105
- ...dialogProps
106
- }, updateArgs] = useArgs();
107
- const toggleModal = () => {
108
- updateArgs({
109
- visible: !visible
110
- });
111
- };
112
- return <>
113
- <Modal visible={visible} centered={centered}>
114
- <Dialog dialog={{
115
- ...dialogProps,
116
- onClose: toggleModal
117
- }} />
118
- </Modal>
119
- <Button label="Open Modal" onClick={toggleModal} />
120
- </>;
121
- }`,...(D=(B=t.parameters)==null?void 0:B.docs)==null?void 0:D.source}}};var _,F,N;i.parameters={...i.parameters,docs:{...(_=i.parameters)==null?void 0:_.docs,source:{originalSource:`() => {
122
- const [{
123
- visible,
124
- centered,
125
- ...dialogProps
126
- }, updateArgs] = useArgs();
127
- const toggleModal = () => {
128
- updateArgs({
129
- visible: !visible
130
- });
131
- };
132
- return <>
133
- <Modal visible={visible} centered={centered}>
134
- <Dialog dialog={{
135
- ...dialogProps,
136
- onClose: toggleModal
137
- }} />
138
- </Modal>
139
- <Button label="Open Modal" onClick={toggleModal} />
140
- </>;
141
- }`,...(N=(F=i.parameters)==null?void 0:F.docs)==null?void 0:N.source}}};const ye=["Default","Centered","LineBreak","Scroll","FullWidth","NoContentPadding","WithPopoverLayers"];export{r as Centered,d as Default,s as FullWidth,a as LineBreak,t as NoContentPadding,l as Scroll,i as WithPopoverLayers,ye as __namedExportsOrder,Te as default};
@@ -1 +0,0 @@
1
- import{_ as e}from"./iframe-697f8aaf.js";import"../sb-preview/runtime.js";var a={docs:{renderer:async()=>{let{DocsRenderer:r}=await e(()=>import("./DocsRenderer-NNNQARDV-7d390284.js"),["./DocsRenderer-NNNQARDV-7d390284.js","./chunk-HLWAVYOI-ec25be11.js","./iframe-697f8aaf.js","./index-f80c8c95.js","./react-16-147b12fd.js","./index-3d476d02.js","./index-a7512f2e.js","./inheritsLoose-d4851ab8.js","./assertThisInitialized-081f9914.js","./index-cf68f115.js"],import.meta.url);return new r}}};export{a as parameters};
@@ -1 +0,0 @@
1
- ._tabs_twdtr_1{display:flex;flex-wrap:wrap;border-bottom:1px solid var(--color-border);flex-shrink:0}._tabs_twdtr_1._padding_twdtr_7{padding-left:var(--padding);padding-right:var(--padding)}._tabs_twdtr_1._margin_twdtr_11{margin:var(--padding) 0}._contentPadding_twdtr_14{padding-top:var(--padding)}._item_twdtr_17{align-self:flex-end;display:flex;align-items:center;position:relative;vertical-align:middle;line-height:1;text-decoration:none;flex:0 0 auto;-webkit-user-select:none;user-select:none;padding:var(--padding-xs) 0;transition:border .1s ease,color .1s ease;margin-bottom:-1px;border-bottom:1px solid transparent;font-size:var(--font-size-lg);color:var(--color-text-primary);cursor:pointer}._item_twdtr_17:not(:last-child){margin-right:var(--padding)}._item_twdtr_17:hover:not(._active_twdtr_38){color:var(--color-text-primary-hover);background:rgba(0,0,0,.025)}[data-theme=dark] ._item_twdtr_17:hover:not(._active_twdtr_38){background:rgba(255,255,255,.1)}._item_twdtr_17:active:not(._active_twdtr_38){color:var(--color-text-primary-active);background:rgba(0,0,0,.05)}[data-theme=dark] ._item_twdtr_17:active:not(._active_twdtr_38){background:rgba(255,255,255,.2)}._item_twdtr_17._active_twdtr_38{border-color:var(--color-text);color:var(--color-text);cursor:default}._item_twdtr_17._hidden_twdtr_57{display:none!important}._item_twdtr_17._disabled_twdtr_60{color:var(--color-text-faint);pointer-events:none}._item_twdtr_17._left_twdtr_64+._item_twdtr_17._right_twdtr_64{margin-left:auto}
@@ -1,30 +0,0 @@
1
- import{j as e}from"./jsx-runtime-f961835c.js";import{r as H}from"./index-f80c8c95.js";import{T as d}from"./tabs-cdfc5225.js";import"./index-a80ed1cf.js";import"./disabled-context-d654f6ff.js";import"./badge-20e7ee0b.js";import"./select.input-88b6ebab.js";import"./types-cc224262.js";const q={title:"Navigation/Tabs",component:d,args:{name:"example",options:[{label:"Tab",value:0},{label:"Tab",value:1},{label:"With Badge",value:2,badge:"3"},{label:"Invalid",value:3,invalid:!0},{label:"Disabled",value:4,disabled:!0},{label:"Hidden tab",value:5,hidden:!0}],value:0}},l=n=>e.jsx(d,{...n}),o=l.bind({}),r=l.bind({});r.args={children:[e.jsx("div",{label:"Tab 0",children:e.jsx("h3",{children:"Tab 0 Content"})}),e.jsx("div",{label:"Tab 1",hidden:!0,children:e.jsx("h3",{children:"Tab 1 Content"})}),e.jsx("div",{label:"Tab 2",disabled:!0,children:e.jsx("h3",{children:"Tab 2 Content"})}),e.jsx("div",{label:"Tab 3",children:e.jsx("h3",{children:"Tab 3 Content"})}),e.jsx("div",{label:"Tab 4",children:e.jsx("h3",{children:"Tab 4 Content"})})]};const s=l.bind({});s.args={margin:!1};const a=l.bind({});a.parameters={layout:"fullscreen",docs:{description:{story:"When you want the divider to fill the edges of its container."}}};a.args={padding:!0};const t=l.bind({});t.args={options:[{label:"Tab 0",value:0},{label:"Tab 1",value:1},{label:"Tab 2",value:2},{label:"Tab 3",value:3,right:!0},{label:"Tab 4",value:4,right:!0}]};const i=()=>{const n=[{label:"Strawberries",value:"strawberries"},{label:"Bananas",value:"bananas"},{label:"Apples",value:"apples",disabled:!0},{label:"Pomegranates",value:"pomegranates"}],[b,W]=H.useState(n[0]);return e.jsxs(e.Fragment,{children:[e.jsx(d,{name:"example",value:b,options:n,onChange:y=>{const{value:B,label:D}=y.target;W({value:B,label:D})}}),e.jsxs("span",{children:["Eating ",b.value,"..."]})]})};var c,u,p;o.parameters={...o.parameters,docs:{...(c=o.parameters)==null?void 0:c.docs,source:{originalSource:"args => <Tabs {...args} />",...(p=(u=o.parameters)==null?void 0:u.docs)==null?void 0:p.source}}};var m,g,v;r.parameters={...r.parameters,docs:{...(m=r.parameters)==null?void 0:m.docs,source:{originalSource:"args => <Tabs {...args} />",...(v=(g=r.parameters)==null?void 0:g.docs)==null?void 0:v.source}}};var T,h,x;s.parameters={...s.parameters,docs:{...(T=s.parameters)==null?void 0:T.docs,source:{originalSource:"args => <Tabs {...args} />",...(x=(h=s.parameters)==null?void 0:h.docs)==null?void 0:x.source}}};var j,S,f;a.parameters={...a.parameters,docs:{...(j=a.parameters)==null?void 0:j.docs,source:{originalSource:"args => <Tabs {...args} />",...(f=(S=a.parameters)==null?void 0:S.docs)==null?void 0:f.source}}};var C,w,E;t.parameters={...t.parameters,docs:{...(C=t.parameters)==null?void 0:C.docs,source:{originalSource:"args => <Tabs {...args} />",...(E=(w=t.parameters)==null?void 0:w.docs)==null?void 0:E.source}}};var A,M,P;i.parameters={...i.parameters,docs:{...(A=i.parameters)==null?void 0:A.docs,source:{originalSource:`() => {
2
- const options = [{
3
- label: 'Strawberries',
4
- value: 'strawberries'
5
- }, {
6
- label: 'Bananas',
7
- value: 'bananas'
8
- }, {
9
- label: 'Apples',
10
- value: 'apples',
11
- disabled: true
12
- }, {
13
- label: 'Pomegranates',
14
- value: 'pomegranates'
15
- }];
16
- const [selectedTab, setSelectedTab] = useState(options[0]);
17
- return <>
18
- <Tabs name="example" value={selectedTab} options={options} onChange={evt => {
19
- const {
20
- value,
21
- label
22
- } = evt.target;
23
- setSelectedTab({
24
- value,
25
- label
26
- });
27
- }} />
28
- <span>Eating {selectedTab.value}...</span>
29
- </>;
30
- }`,...(P=(M=i.parameters)==null?void 0:M.docs)==null?void 0:P.source}}};const G=["Default","WithChildren","NoMargin","HorizontalPadding","Alignment","Managed"];export{t as Alignment,o as Default,a as HorizontalPadding,i as Managed,s as NoMargin,r as WithChildren,G as __namedExportsOrder,q as default};