@oliasoft-open-source/react-ui-library 4.0.0-beta-59 → 4.0.0-beta-61
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-541a35bd.css → index-815d3e96.css} +150 -136
- package/dist/assets/{index-425d14e0.js → index-bb4c3557.js} +78 -70
- package/dist/global.css +150 -136
- package/dist/index.html +1 -1
- package/dist/index.js +109 -92
- package/dist/index.js.map +1 -1
- package/dist/storybook/assets/{Color-6VNJS4EI-385fd07f.js → Color-6VNJS4EI-b198135c.js} +1 -1
- package/dist/storybook/assets/{DocsRenderer-NNNQARDV-81593ce6.js → DocsRenderer-NNNQARDV-19e71c0e.js} +1 -1
- package/dist/storybook/assets/{WithTooltip-4HIR6TLV-4193649c.js → WithTooltip-4HIR6TLV-2f83280b.js} +1 -1
- package/dist/storybook/assets/{accordion.stories-11c22ab5.js → accordion.stories-e1a1a1da.js} +1 -1
- package/dist/storybook/assets/{afe.stories-2bda4793.js → afe.stories-37c20b62.js} +1 -1
- package/dist/storybook/assets/{buttons-and-links-957e9470.js → buttons-and-links-82ee1d3d.js} +1 -1
- package/dist/storybook/assets/{casing-loads.stories-59db26a9.js → casing-loads.stories-07b8c5bf.js} +1 -1
- package/dist/storybook/assets/{cell.stories-7ebcbb82.js → cell.stories-0c3541a7.js} +1 -1
- package/dist/storybook/assets/check-box-73be452f.js +1 -0
- package/dist/storybook/assets/check-box-960c9b05.css +1 -0
- package/dist/storybook/assets/check-box.stories-73c79421.js +97 -0
- package/dist/storybook/assets/{chunk-HLWAVYOI-3d751d00.js → chunk-HLWAVYOI-3f2e7bdd.js} +1 -1
- package/dist/storybook/assets/{color-e6db64d0.js → color-338772bf.js} +1 -1
- package/dist/storybook/assets/{drawer.stories-fdef3d43.js → drawer.stories-4eeb77c2.js} +1 -1
- package/dist/storybook/assets/{footer.stories-c9d4f59e.js → footer.stories-8a474f57.js} +1 -1
- package/dist/storybook/assets/{form.stories-7b32c75b.js → form.stories-c6efa8b0.js} +1 -1
- package/dist/storybook/assets/{formation.stories-4536d334.js → formation.stories-b909ce02.js} +1 -1
- package/dist/storybook/assets/{formatter-SWP5E3XI-3726b490.js → formatter-SWP5E3XI-25bcba07.js} +1 -1
- package/dist/storybook/assets/grid-3b729f81.js +15 -0
- package/dist/storybook/assets/{grid.stories-9c914a43.js → grid.stories-bf68df4a.js} +1 -1
- package/dist/storybook/assets/{icon.stories-10514dcd.js → icon.stories-9a1cd92c.js} +1 -1
- package/dist/storybook/assets/{iframe-41774194.js → iframe-bc0fdebc.js} +1 -1
- package/dist/storybook/assets/{index-e4f0261d.js → index-c54905c0.js} +4 -4
- package/dist/storybook/assets/{input-validation-dffded55.js → input-validation-7db01452.js} +1 -1
- package/dist/storybook/assets/{inputs-f223f0e0.js → inputs-b9d1bfa6.js} +1 -1
- package/dist/storybook/assets/{layout-forms-d2ac437d.js → layout-forms-d1ce1a06.js} +1 -1
- package/dist/storybook/assets/{layout-general-9ec44b89.js → layout-general-97dba2ce.js} +1 -1
- package/dist/storybook/assets/{list-858d3a1f.js → list-5907161b.js} +1 -1
- package/dist/storybook/assets/list-heading-d81b63f6.css +1 -0
- package/dist/storybook/assets/list-heading-f1ceab8b.js +1 -0
- package/dist/storybook/assets/{list.stories-534b1266.js → list.stories-339e0e65.js} +1 -1
- package/dist/storybook/assets/{message.stories-50cd9843.js → message.stories-48adad88.js} +1 -1
- package/dist/storybook/assets/{number-input-863c4463.js → number-input-42f50494.js} +5 -5
- package/dist/storybook/assets/{number-input.stories-04f6469b.js → number-input.stories-b4db5a5c.js} +1 -1
- package/dist/storybook/assets/{option-dropdown.stories-b3566308.js → option-dropdown.stories-4d10db5b.js} +1 -1
- package/dist/storybook/assets/{padding-and-spacing-72fe80cd.js → padding-and-spacing-a3a5213e.js} +1 -1
- package/dist/storybook/assets/{preview-e1f45513.js → preview-074d29f8.js} +1 -1
- package/dist/storybook/assets/{preview-d4100e75.css → preview-4131d937.css} +1 -1
- package/dist/storybook/assets/preview-de19c997.js +1 -0
- package/dist/storybook/assets/{projects.stories-fb4cb900.js → projects.stories-a5ac5dbd.js} +1 -1
- package/dist/storybook/assets/radio-button-266c81ed.js +1 -0
- package/dist/storybook/assets/radio-button-52e2b7a7.css +1 -0
- package/dist/storybook/assets/radio-button.stories-d74ed901.js +61 -0
- package/dist/storybook/assets/{reservoirs.stories-134f21cc.js → reservoirs.stories-098985fb.js} +1 -1
- package/dist/storybook/assets/{row.stories-b0214b95.js → row.stories-566dbfdc.js} +1 -1
- package/dist/storybook/assets/{site.stories-3f58bf8f.js → site.stories-aa5eda50.js} +1 -1
- package/dist/storybook/assets/{syntaxhighlighter-NMPM6SWI-07fdd16e.js → syntaxhighlighter-NMPM6SWI-9c89c825.js} +1 -1
- package/dist/storybook/assets/{table-95ed9716.js → table-16e7479d.js} +1 -1
- package/dist/storybook/assets/{table.stories-3387ebf8.js → table.stories-af5f3080.js} +1 -1
- package/dist/storybook/assets/{title.stories-286cd48b.js → title.stories-c91929de.js} +1 -1
- package/dist/storybook/assets/{toggle-d9a0cd27.css → toggle-239108ba.css} +1 -1
- package/dist/storybook/assets/toggle-de8e437a.js +1 -0
- package/dist/storybook/assets/toggle.stories-05bf43ff.js +108 -0
- package/dist/storybook/assets/{tree.stories-304d9ff1.js → tree.stories-0521665b.js} +4 -4
- 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/check-box-421e08ab.js +0 -1
- package/dist/storybook/assets/check-box-805d6047.css +0 -1
- package/dist/storybook/assets/check-box.stories-3e23f07e.js +0 -85
- package/dist/storybook/assets/grid-78d1b29a.js +0 -15
- package/dist/storybook/assets/list-heading-8544b8e3.css +0 -1
- package/dist/storybook/assets/list-heading-d8175bfc.js +0 -1
- package/dist/storybook/assets/preview-b62a051c.js +0 -1
- package/dist/storybook/assets/radio-button-82505e3b.js +0 -1
- package/dist/storybook/assets/radio-button-bd9936b8.css +0 -1
- package/dist/storybook/assets/radio-button.stories-0cbfcabb.js +0 -51
- package/dist/storybook/assets/toggle-df90df5f.js +0 -1
- package/dist/storybook/assets/toggle.stories-107799ac.js +0 -96
package/package.json
CHANGED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{j as a}from"./jsx-runtime-f961835c.js";import{r as g}from"./index-f80c8c95.js";import{c as I}from"./index-a80ed1cf.js";import{I as v}from"./common-types-2c81813f.js";import{D as C}from"./disabled-context-d654f6ff.js";import{H as q}from"./help-icon-5be78589.js";import{I as V}from"./icon-c5e1f218.js";const T="_checkbox_k43wr_1",j="_noLabel_k43wr_17",w="_small_k43wr_20",M="_checkmark_k43wr_43",E="_disabled_k43wr_67",H="_noMargin_k43wr_81",L="_isInTable_k43wr_84",e={checkbox:T,noLabel:j,small:w,checkmark:M,disabled:E,noMargin:H,isInTable:L},m=({noMargin:s=!1,dataix:p=0,isInTable:f=!1,tabIndex:b=0,checked:l=!1,name:n,key:k="",label:r="",disabled:i=!1,small:x=!1,onChange:_,testId:y,value:N,helpText:o,onClickHelp:d})=>{const u=g.useContext(C),h=o||d;return a.jsxs("div",{className:I(e.checkbox,s&&e.noMargin,f&&e.isInTable,(i||u)&&e.disabled,x&&e.small,!r&&e.noLabel),"data-ix":p,onClick:c=>{const t=c.target;t.name=n,t.value=!l,t.checked=!l,_(c)},"data-testid":y,children:[a.jsx("input",{type:"checkbox",tabIndex:b,checked:l,name:n,onChange:()=>{},disabled:i||u},k),a.jsxs("label",{htmlFor:n,children:[a.jsx("span",{className:e.checkmark,children:a.jsx(V,{icon:v.CHECK})}),r]}),h&&a.jsx(q,{text:o,onClick:d})]})};try{m.displayName="CheckBox",m.__docgenInfo={description:"",displayName:"CheckBox",props:{checked:{defaultValue:{value:"false"},description:"",name:"checked",required:!1,type:{name:"boolean"}},isInTable:{defaultValue:{value:"false"},description:"",name:"isInTable",required:!1,type:{name:"boolean"}},label:{defaultValue:{value:""},description:"",name:"label",required:!1,type:{name:"string | null"}},name:{defaultValue:null,description:"",name:"name",required:!1,type:{name:"string"}},noMargin:{defaultValue:{value:"false"},description:"",name:"noMargin",required:!1,type:{name:"boolean"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(evt: ChangeEvent<HTMLInputElement>) => void"}},tabIndex:{defaultValue:{value:"0"},description:"",name:"tabIndex",required:!1,type:{name:"number"}},disabled:{defaultValue:{value:"false"},description:"",name:"disabled",required:!1,type:{name:"boolean"}},small:{defaultValue:{value:"false"},description:"",name:"small",required:!1,type:{name:"boolean"}},testId:{defaultValue:null,description:"",name:"testId",required:!1,type:{name:"string"}},key:{defaultValue:{value:""},description:"",name:"key",required:!1,type:{name:"string"}},dataix:{defaultValue:{value:"0"},description:"",name:"dataix",required:!1,type:{name:"number"}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"string"}},helpText:{defaultValue:null,description:"",name:"helpText",required:!1,type:{name:"string"}},onClickHelp:{defaultValue:null,description:"",name:"onClickHelp",required:!1,type:{name:"TEmpty"}}}}}catch{}export{m as C};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
._checkbox_k43wr_1{--size-checkbox: var(--size-xs);margin:calc((var(--size) - var(--size-checkbox)) / 2) 0;position:relative;display:flex;align-items:center;gap:var(--padding-xxs);backface-visibility:hidden;vertical-align:baseline;font-style:normal;min-height:var(--size-checkbox);font-size:inherit;line-height:var(--size-checkbox);min-width:var(--size-checkbox);outline:0px}._checkbox_k43wr_1._noLabel_k43wr_17{width:var(--size-checkbox)}._checkbox_k43wr_1._small_k43wr_20{--size-checkbox: calc(var(--size-xs) - 4px);margin:calc((var(--size-sm) - var(--size-checkbox)) / 2) 0;font-size:var(--font-size-sm)}._checkbox_k43wr_1 input{cursor:pointer;position:absolute;top:0;left:0;opacity:0!important;outline:0px;z-index:-1}._checkbox_k43wr_1 label{cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--color-text);transition:color .1s ease 0s;display:block;padding-left:calc(var(--size-checkbox) + var(--padding-xs));outline:0px}._checkbox_k43wr_1 label ._checkmark_k43wr_43{position:absolute;top:0;left:0;width:var(--size-checkbox);height:var(--size-checkbox);font-size:var(--size-checkbox);display:inline-flex;align-items:center;justify-content:center;background:var(--color-background-button-default);border-radius:var(--border-radius-sm);transition:border .1s ease 0s,opacity .1s ease 0s,transform .1s ease 0s,box-shadow .1s ease 0s;border:1px solid var(--color-border-checkbox);color:transparent}._checkbox_k43wr_1 label ._checkmark_k43wr_43:hover{border-color:var(--color-border-hover)}._checkbox_k43wr_1 input:checked~label ._checkmark_k43wr_43{background:var(--color-background-primary);border-color:transparent;color:#fff}._checkbox_k43wr_1._disabled_k43wr_67{cursor:default;pointer-events:none}._checkbox_k43wr_1._disabled_k43wr_67 label{color:var(--color-text-faint)}._checkbox_k43wr_1._disabled_k43wr_67 ._checkmark_k43wr_43{background:var(--color-background-disabled)!important;border-color:var(--color-border-checkbox)!important}._checkbox_k43wr_1._disabled_k43wr_67 input:checked~label ._checkmark_k43wr_43{color:var(--color-text-faint)}._noMargin_k43wr_81,._isInTable_k43wr_84{margin:0}
|
|
@@ -1,85 +0,0 @@
|
|
|
1
|
-
import{j as K}from"./jsx-runtime-f961835c.js";import{C as T}from"./check-box-421e08ab.js";import"./index-f80c8c95.js";import"./index-a80ed1cf.js";import"./common-types-2c81813f.js";import"./disabled-context-d654f6ff.js";import"./help-icon-5be78589.js";import"./tooltip-23e84186.js";import"./index-3d476d02.js";import"./icon-c5e1f218.js";import"./inheritsLoose-d4851ab8.js";import"./tslib.es6-dfef685f.js";import"./index-c89a1915.js";const{useArgs:M}=__STORYBOOK_MODULE_ADDONS__,V={title:"Forms/CheckBox",component:T,args:{disabled:!1,label:"Label"}},e=E=>{const[{checked:L},R]=M(),F=()=>{R({checked:!L})};return K.jsx(T,{...E,onChange:F})},t=e.bind({}),n=e.bind({});n.args={small:!0};const s=e.bind({});s.args={disabled:!0};const r=e.bind({});r.args={checked:!0,disabled:!0};const a=e.bind({});a.args={label:null};const c=e.bind({});c.args={helpText:"Help text"};const o=e.bind({});o.args={onClickHelp:()=>console.log("Help clicked")};var d,p,l;t.parameters={...t.parameters,docs:{...(d=t.parameters)==null?void 0:d.docs,source:{originalSource:`args => {
|
|
2
|
-
const [{
|
|
3
|
-
checked
|
|
4
|
-
}, updateArgs] = useArgs();
|
|
5
|
-
const handleChange = () => {
|
|
6
|
-
updateArgs({
|
|
7
|
-
checked: !checked
|
|
8
|
-
});
|
|
9
|
-
};
|
|
10
|
-
return <CheckBox
|
|
11
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
12
|
-
{...args} onChange={handleChange} />;
|
|
13
|
-
}`,...(l=(p=t.parameters)==null?void 0:p.docs)==null?void 0:l.source}}};var g,i,h;n.parameters={...n.parameters,docs:{...(g=n.parameters)==null?void 0:g.docs,source:{originalSource:`args => {
|
|
14
|
-
const [{
|
|
15
|
-
checked
|
|
16
|
-
}, updateArgs] = useArgs();
|
|
17
|
-
const handleChange = () => {
|
|
18
|
-
updateArgs({
|
|
19
|
-
checked: !checked
|
|
20
|
-
});
|
|
21
|
-
};
|
|
22
|
-
return <CheckBox
|
|
23
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
24
|
-
{...args} onChange={handleChange} />;
|
|
25
|
-
}`,...(h=(i=n.parameters)==null?void 0:i.docs)==null?void 0:h.source}}};var u,m,k;s.parameters={...s.parameters,docs:{...(u=s.parameters)==null?void 0:u.docs,source:{originalSource:`args => {
|
|
26
|
-
const [{
|
|
27
|
-
checked
|
|
28
|
-
}, updateArgs] = useArgs();
|
|
29
|
-
const handleChange = () => {
|
|
30
|
-
updateArgs({
|
|
31
|
-
checked: !checked
|
|
32
|
-
});
|
|
33
|
-
};
|
|
34
|
-
return <CheckBox
|
|
35
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
36
|
-
{...args} onChange={handleChange} />;
|
|
37
|
-
}`,...(k=(m=s.parameters)==null?void 0:m.docs)==null?void 0:k.source}}};var C,x,b;r.parameters={...r.parameters,docs:{...(C=r.parameters)==null?void 0:C.docs,source:{originalSource:`args => {
|
|
38
|
-
const [{
|
|
39
|
-
checked
|
|
40
|
-
}, updateArgs] = useArgs();
|
|
41
|
-
const handleChange = () => {
|
|
42
|
-
updateArgs({
|
|
43
|
-
checked: !checked
|
|
44
|
-
});
|
|
45
|
-
};
|
|
46
|
-
return <CheckBox
|
|
47
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
48
|
-
{...args} onChange={handleChange} />;
|
|
49
|
-
}`,...(b=(x=r.parameters)==null?void 0:x.docs)==null?void 0:b.source}}};var A,S,B;a.parameters={...a.parameters,docs:{...(A=a.parameters)==null?void 0:A.docs,source:{originalSource:`args => {
|
|
50
|
-
const [{
|
|
51
|
-
checked
|
|
52
|
-
}, updateArgs] = useArgs();
|
|
53
|
-
const handleChange = () => {
|
|
54
|
-
updateArgs({
|
|
55
|
-
checked: !checked
|
|
56
|
-
});
|
|
57
|
-
};
|
|
58
|
-
return <CheckBox
|
|
59
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
60
|
-
{...args} onChange={handleChange} />;
|
|
61
|
-
}`,...(B=(S=a.parameters)==null?void 0:S.docs)==null?void 0:B.source}}};var j,D,_;c.parameters={...c.parameters,docs:{...(j=c.parameters)==null?void 0:j.docs,source:{originalSource:`args => {
|
|
62
|
-
const [{
|
|
63
|
-
checked
|
|
64
|
-
}, updateArgs] = useArgs();
|
|
65
|
-
const handleChange = () => {
|
|
66
|
-
updateArgs({
|
|
67
|
-
checked: !checked
|
|
68
|
-
});
|
|
69
|
-
};
|
|
70
|
-
return <CheckBox
|
|
71
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
72
|
-
{...args} onChange={handleChange} />;
|
|
73
|
-
}`,...(_=(D=c.parameters)==null?void 0:D.docs)==null?void 0:_.source}}};var O,H,f;o.parameters={...o.parameters,docs:{...(O=o.parameters)==null?void 0:O.docs,source:{originalSource:`args => {
|
|
74
|
-
const [{
|
|
75
|
-
checked
|
|
76
|
-
}, updateArgs] = useArgs();
|
|
77
|
-
const handleChange = () => {
|
|
78
|
-
updateArgs({
|
|
79
|
-
checked: !checked
|
|
80
|
-
});
|
|
81
|
-
};
|
|
82
|
-
return <CheckBox
|
|
83
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
84
|
-
{...args} onChange={handleChange} />;
|
|
85
|
-
}`,...(f=(H=o.parameters)==null?void 0:H.docs)==null?void 0:f.source}}};const W=["Default","Small","Disabled","DisabledChecked","Standalone","HelpText","OnClickHelp"];export{t as Default,s as Disabled,r as DisabledChecked,c as HelpText,o as OnClickHelp,n as Small,a as Standalone,W as __namedExportsOrder,V as default};
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import{j as o}from"./jsx-runtime-f961835c.js";import{s as m}from"./styled-components.browser.esm-416d73e5.js";const d=e=>typeof e=="boolean"?e?"20px":"0px":typeof e=="number"?`${e}px`:e||"initial",l=e=>typeof e=="number"?`${e}px`:e||"initial",p=m.div`
|
|
2
|
-
display: grid;
|
|
3
|
-
gap: ${e=>d(e.gap)};
|
|
4
|
-
grid-template-rows: ${e=>l(e.rows)};
|
|
5
|
-
grid-template-columns: ${e=>l(e.columns)};
|
|
6
|
-
height: ${e=>l(e.height)};
|
|
7
|
-
|
|
8
|
-
@media (max-width: 992px) {
|
|
9
|
-
${e=>e.columnsTablet&&`grid-template-columns: ${l(e.columnsTablet)};`}
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
@media (max-width: 575px) {
|
|
13
|
-
${e=>e.columnsMobile&&`grid-template-columns: ${l(e.columnsMobile)};`}
|
|
14
|
-
}
|
|
15
|
-
`,a=({rows:e="initial",columns:n="initial",columnsTablet:r=null,columnsMobile:u=null,gap:i=!1,height:t="initial",children:s})=>o.jsx(p,{rows:e,columns:n,columnsTablet:r,columnsMobile:u,gap:i===!1?"0px":i===!0?"var(--padding)":i,height:typeof t=="number"?`${t}px`:t,children:s});try{a.displayName="Grid",a.__docgenInfo={description:"",displayName:"Grid",props:{rows:{defaultValue:{value:"initial"},description:"",name:"rows",required:!1,type:{name:"string"}},columns:{defaultValue:{value:"initial"},description:"",name:"columns",required:!1,type:{name:"string"}},columnsTablet:{defaultValue:{value:"null"},description:"",name:"columnsTablet",required:!1,type:{name:"string | null"}},columnsMobile:{defaultValue:{value:"null"},description:"",name:"columnsMobile",required:!1,type:{name:"string | null"}},gap:{defaultValue:{value:"false"},description:"",name:"gap",required:!1,type:{name:"boolean | TStringOrNumber"}},height:{defaultValue:{value:"initial"},description:"",name:"height",required:!1,type:{name:"TStringOrNumber"}}}}}catch{}export{a as G};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
._inputInTable_1g06t_1{background-color:transparent;border-radius:inherit!important;height:var(--size);min-height:100%}._inputInTable_1g06t_1:not(:hover){border-color:transparent}._inputInTable_1g06t_1:not(:focus){box-shadow:none}._inputHover_1g06t_13{position:relative;border-color:var(--color-border-hover);z-index:2}._inputFocus_1g06t_18{position:relative;outline:none!important;border-color:var(--color-border-focus)!important;box-shadow:var(--shadow-focus);z-index:3}._inputError_1g06t_25,._inputWarning_1g06t_26{position:relative}._inputError_1g06t_25{z-index:2;border-color:var(--color-border-error);color:var(--color-text-error)!important;background-color:var(--color-background-error-muted)}._inputError_1g06t_25:hover{border-color:var(--color-border-error-hover)!important}._inputError_1g06t_25:focus{position:relative;outline:none!important;border-color:var(--color-border-focus)!important;box-shadow:var(--shadow-focus);z-index:3}._inputWarning_1g06t_26{z-index:1;border-color:var(--color-border-warning);color:var(--color-text-warning)!important;background-color:var(--color-background-warning-muted)}._inputWarning_1g06t_26:hover{border-color:var(--color-border-warning-hover)!important}._inputWarning_1g06t_26:focus{position:relative;outline:none!important;border-color:var(--color-border-focus)!important;box-shadow:var(--shadow-focus);z-index:3}._inputDisabled_1g06t_61{pointer-events:none;background-color:var(--color-background-disabled);color:var(--color-text-muted);box-shadow:none}._hideScrollbars_1g06t_67{scrollbar-width:none;-ms-overflow-style:none}._hideScrollbars_1g06t_67::-webkit-scrollbar{display:none}._header_1g06t_77 ._headerTitle_1g06t_77,._heading_1g06t_78 ._itemHeader_1g06t_78{transition:opacity .3s}._narrow_1g06t_81 ._header_1g06t_77 ._headerTitle_1g06t_77,._narrow_1g06t_81 ._heading_1g06t_78 ._itemHeader_1g06t_78{opacity:0}._stickyHeader_1g06t_85{position:sticky;top:0;background-color:var(--color-background);z-index:10}._itemHeader_1g06t_78{padding:var(--padding-xs) var(--padding);display:flex;align-items:flex-start}._itemHeader_1g06t_78 ._title_1g06t_96{margin:0;padding:0;flex-grow:1;min-width:0}._itemHeader_1g06t_78 ._name_1g06t_102{font-weight:400}._itemHeader_1g06t_78 ._iconTooltipMargin_1g06t_105{margin-left:var(--padding-xs)}._itemHeader_1g06t_78 ._bold_1g06t_108{font-weight:700}._header_1g06t_77{padding:var(--padding);display:flex;align-items:center;border-bottom:1px solid var(--color-border)}._toggleNarrow_1g06t_117{margin-right:16px;margin-left:-5px;color:#c8c8c8;transition:all .4s;display:flex;width:22px;justify-content:center}._toggleNarrow_1g06t_117:hover{color:var(--color-text-primary-hover)}._toggleNarrow_1g06t_117:active{color:var(--color-text-primary-active)}._narrow_1g06t_81 ._toggleNarrow_1g06t_117{transform:scaleX(-1)}._drag_1g06t_135{color:var(--color-text-faint);display:flex;align-items:center;justify-content:center;margin-right:var(--padding-xs);margin-left:-6px;cursor:move;height:19px;width:19px}._drag_1g06t_135:hover{color:var(--color-text-primary-hover)}._drag_1g06t_135:active{color:var(--color-text-primary-active)}._list_1g06t_152{flex-shrink:0;background:var(--color-background)}._list_1g06t_152._bordered_1g06t_156:first-child,._list_1g06t_152._bordered_1g06t_156:first-child>:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}._list_1g06t_152._bordered_1g06t_156:last-child,._list_1g06t_152._bordered_1g06t_156:last-child>:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit;border-bottom:0}._item_1g06t_78{color:inherit;display:block;transition:background-color .2s;position:relative;border-bottom:1px solid var(--color-border);background-color:var(--color-background-raised);transition:background .3s;overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}._item_1g06t_78:not(._heading_1g06t_78):after{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;border-top-left-radius:inherit;border-bottom-left-radius:inherit;transition:background .3s}._item_1g06t_78._action_1g06t_189{cursor:pointer}._item_1g06t_78._action_1g06t_189:not(._active_1g06t_192):hover{background:var(--color-background-listitem-hover)}._item_1g06t_78._action_1g06t_189:not(._active_1g06t_192):hover:after{background:rgba(0,0,0,.1)}._item_1g06t_78._active_1g06t_192{cursor:default;position:relative;z-index:1;background:var(--color-background-listitem-active)}._item_1g06t_78._active_1g06t_192:after{background:var(--color-background-primary)!important}._item_1g06t_78._disabled_1g06t_207{color:var(--color-text-faint);pointer-events:none}._item_1g06t_78._heading_1g06t_78{color:var(--color-text-muted);background-color:var(--color-background-cardheader)}._item_1g06t_78._heading_1g06t_78._action_1g06t_189:hover{color:var(--color-text-primary-hover)}._item_1g06t_78 ._label_1g06t_218{display:flex;align-items:center;margin-right:var(--padding-xs);flex-shrink:0}._item_1g06t_78 ._details_1g06t_224,._item_1g06t_78 ._metadata_1g06t_225{display:block;width:100%;font-weight:400}._item_1g06t_78 ._metadata_1g06t_225{color:var(--color-text-muted)}._item_1g06t_78 ._itemContent_1g06t_233{padding:0 var(--padding) var(--padding-sm);cursor:auto}._item_1g06t_78 ._itemContent_1g06t_233:empty{padding:inherit}._indentIcon_1g06t_240{color:var(--color-text-faint);flex-shrink:0;margin-right:var(--padding-xxs)}._expandIcon_1g06t_245{flex-shrink:0;position:relative;display:flex;height:var(--line-height);margin-right:var(--padding-xs)}._expandIcon_1g06t_245._expanded_1g06t_252 svg{transform:rotate(90deg)}._right_1g06t_255{margin-left:auto;display:flex;align-items:center;margin-top:calc((var(--line-height) - var(--size-sm)) / 2);margin-bottom:calc((var(--line-height) - var(--size-sm)) / 2);margin-right:calc(var(--padding-xs) * -1);min-height:var(--size-sm)}._actions_1g06t_264{margin-left:var(--padding-xs);display:flex;align-items:center}._scrollableList_1g06t_269{height:100%;overflow-y:auto;scroll-behavior:smooth}._hideScrollbar_1g06t_67{scrollbar-width:none;-ms-overflow-style:none}._hideScrollbar_1g06t_67::-webkit-scrollbar{display:none}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-f961835c.js";import{B as N}from"./badge-3abf067b.js";import{c as g}from"./index-a80ed1cf.js";import{I as u}from"./icon-c5e1f218.js";import{T as f}from"./tooltip-23e84186.js";import{r as y}from"./index-f80c8c95.js";import{I as h}from"./common-types-2c81813f.js";import{H as x}from"./heading-61bdbf94.js";import{A as b}from"./actions-46447905.js";const I="_inputInTable_1g06t_1",T="_inputHover_1g06t_13",j="_inputFocus_1g06t_18",w="_inputError_1g06t_25",H="_inputWarning_1g06t_26",V="_inputDisabled_1g06t_61",q="_hideScrollbars_1g06t_67",v="_header_1g06t_77",C="_headerTitle_1g06t_77",R="_heading_1g06t_78",E="_itemHeader_1g06t_78",k="_narrow_1g06t_81",M="_stickyHeader_1g06t_85",L="_title_1g06t_96",S="_name_1g06t_102",F="_iconTooltipMargin_1g06t_105",W="_bold_1g06t_108",$="_toggleNarrow_1g06t_117",B="_drag_1g06t_135",D="_list_1g06t_152",A="_bordered_1g06t_156",J="_item_1g06t_78",O="_action_1g06t_189",P="_active_1g06t_192",X="_disabled_1g06t_207",z="_label_1g06t_218",G="_details_1g06t_224",K="_metadata_1g06t_225",Q="_itemContent_1g06t_233",U="_indentIcon_1g06t_240",Y="_expandIcon_1g06t_245",Z="_expanded_1g06t_252",ee="_right_1g06t_255",te="_actions_1g06t_264",ae="_scrollableList_1g06t_269",ne="_hideScrollbar_1g06t_67",n={inputInTable:I,inputHover:T,inputFocus:j,inputError:w,inputWarning:H,inputDisabled:V,hideScrollbars:q,header:v,headerTitle:C,heading:R,itemHeader:E,narrow:k,stickyHeader:M,title:L,name:S,iconTooltipMargin:F,bold:W,toggleNarrow:$,drag:B,list:D,bordered:A,item:J,action:O,active:P,disabled:X,label:z,details:G,metadata:K,itemContent:Q,indentIcon:U,expandIcon:Y,expanded:Z,right:ee,actions:te,scrollableList:ae,hideScrollbar:ne},c=({name:a,icon:t,testId:i})=>{const o=t&&e.jsx(u,{icon:t.icon,color:t.color||"#db2828"});return e.jsxs("span",{className:g(n.name,n.bold),"data-testid":i,children:[a,t&&t.tooltip&&t.tooltip.text?e.jsx("span",{className:n.iconTooltipMargin,children:e.jsx(f,{text:t.tooltip.text,maxWidth:"350px",children:o})}):t&&t.icon&&e.jsx("span",{className:n.iconTooltipMargin,children:o})]})};try{c.displayName="Name",c.__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 p=({item:a})=>{const{name:t,icon:i,details:o,metadata:s,invalid:l,testId:r}=a;let d=e.jsx(c,{name:t,icon:i,testId:r&&`${r}-name`});return l&&(d=e.jsx(N,{small:!0,margin:"-2px",title:"!",children:d})),e.jsxs("span",{className:n.title,children:[d,o&&e.jsx("span",{className:n.details,"data-testid":r&&`${r}-details`,children:o}),s&&e.jsx("span",{className:n.metadata,"data-testid":r&&`${r}-metadata`,children:s})]})};try{p.displayName="MetaContent",p.__docgenInfo={description:"",displayName:"MetaContent",props:{item:{defaultValue:null,description:"",name:"item",required:!0,type:{name:"IMetaContentItem"}}}}}catch{}const _=({toggleNarrow:a,onClickToggleNarrow:t})=>a?e.jsx("a",{className:n.toggleNarrow,onClick:t,children:e.jsx(u,{icon:h.CHEVRON_LEFT})}):null;try{_.displayName="ToggleNarrow",_.__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 m=y.forwardRef(({name:a,actions:t=[],toggleNarrow:i=!1,onToggleNarrow:o=()=>{},stickyHeader:s},l)=>e.jsxs("div",{ref:l,className:g(n.header,s?n.stickyHeader:""),children:[e.jsx(_,{toggleNarrow:i,onClickToggleNarrow:o}),a&&e.jsx("div",{className:n.headerTitle,children:e.jsx(x,{top:!0,marginBottom:0,children:a})}),e.jsx("div",{className:n.right,children:e.jsx("div",{className:n.actions,children:e.jsx(b,{actions:t})})})]}));try{m.displayName="ListHeading",m.__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{}export{m as L,p as M,c as N,n as s};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{_ as e}from"./iframe-41774194.js";import"../sb-preview/runtime.js";var a={docs:{renderer:async()=>{let{DocsRenderer:r}=await e(()=>import("./DocsRenderer-NNNQARDV-81593ce6.js"),["./DocsRenderer-NNNQARDV-81593ce6.js","./chunk-HLWAVYOI-3d751d00.js","./iframe-41774194.js","./index-f80c8c95.js","./react-16-147b12fd.js","./index-3d476d02.js","./index-e4f0261d.js","./inheritsLoose-d4851ab8.js","./assertThisInitialized-081f9914.js","./index-97a99495.js"],import.meta.url);return new r}}};export{a as parameters};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{j as l}from"./jsx-runtime-f961835c.js";import{r as N}from"./index-f80c8c95.js";import{c as _}from"./index-a80ed1cf.js";import{D as O}from"./disabled-context-d654f6ff.js";import{s as j}from"./select.input-88b6ebab.js";import{b as k}from"./common-types-2c81813f.js";import{H}from"./help-icon-5be78589.js";const E="_wrapper_chpf0_1",B="_inline_chpf0_1",D="_radio_chpf0_5",S="_labelMargin_chpf0_8",w="_small_chpf0_27",L="_noMargin_chpf0_32",F="_disabled_chpf0_90",z="_isInTable_chpf0_106",a={wrapper:E,inline:B,radio:D,labelMargin:S,small:w,noMargin:L,disabled:F,isInTable:z},y=({name:n,label:m,value:d,selected:c,disabled:t=!1,small:f=!1,onChange:b,noMargin:g=!1,testId:v,helpText:i,onClickHelp:r})=>{const u=i||r;return l.jsxs("div",{className:_(a.radio,t?a.disabled:null,f?a.small:null,g?a.noMargin:null),onClick:b,"data-testid":v,children:[l.jsx("input",{type:k.RADIO,value:d,checked:c,onChange:()=>{},disabled:t}),l.jsx("label",{"data-name":n,"data-value":d,children:m}),u&&l.jsx(H,{text:i,onClick:r})]})};try{y.displayName="RadioInput",y.__docgenInfo={description:"",displayName:"RadioInput",props:{name:{defaultValue:null,description:"",name:"name",required:!0,type:{name:"TStringOrNumber"}},label:{defaultValue:null,description:"",name:"label",required:!0,type:{name:"TStringOrNumber"}},value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"TStringOrNumber"}},selected:{defaultValue:null,description:"",name:"selected",required:!0,type:{name:"boolean"}},disabled:{defaultValue:{value:"false"},description:"",name:"disabled",required:!1,type:{name:"boolean"}},small:{defaultValue:{value:"false"},description:"",name:"small",required:!1,type:{name:"boolean"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"((evt: MouseEvent<HTMLDivElement, MouseEvent>) => void)"}},noMargin:{defaultValue:{value:"false"},description:"",name:"noMargin",required:!1,type:{name:"boolean"}},testId:{defaultValue:null,description:"",name:"testId",required:!1,type:{name:"string"}},helpText:{defaultValue:null,description:"",name:"helpText",required:!1,type:{name:"string"}},onClickHelp:{defaultValue:null,description:"",name:"onClickHelp",required:!1,type:{name:"((event?: any) => void)"}}}}}catch{}const h=({name:n,label:m,options:d,value:c,onChange:t,disabled:f=!1,small:b=!1,noMargin:g=!1,onClick:v=()=>{},inline:i=!1,mainLabel:r="",radioButtonsData:u,classForContainer:V="grouped fields"})=>{const q=N.useContext(O),o=u!==void 0,{simpleInputs:I,options:x,selectedOptions:p}=o?{simpleInputs:!1,options:u,selectedOptions:void 0}:j(d,c),C=o||p===void 0||p===null?void 0:I?p:p.value,M=o?r:m;return l.jsxs("div",{className:_(a.wrapper,i?a.inline:null,V==="inline fields"?a.inline:null),children:[r&&l.jsx("label",{className:_(i&&a.labelMargin),children:M}),x.map((e,T)=>{const R=e.checked||e.value===C||!1;return l.jsx(y,{name:e.name||e.value,label:e.label,value:e.value,selected:R,disabled:f||e.disabled||q,small:b,noMargin:g,onChange:e.disabled?void 0:s=>{o?v(s.target):(s.target.name=n,s.target.value=e.value.toString(),s.target.label=e.label.toString(),t&&t(s))},testId:e.testId,helpText:e.helpText,onClickHelp:e.onClickHelp},T)})]})};try{h.displayName="RadioButton",h.__docgenInfo={description:"",displayName:"RadioButton",props:{name:{defaultValue:null,description:"",name:"name",required:!1,type:{name:"string"}},label:{defaultValue:null,description:"",name:"label",required:!1,type:{name:"string | null"}},options:{defaultValue:null,description:"",name:"options",required:!0,type:{name:"IRadioButtonOption[]"}},value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"TStringOrNumber | IRadioButtonOption"}},inline:{defaultValue:{value:"false"},description:"",name:"inline",required:!1,type:{name:"boolean"}},disabled:{defaultValue:{value:"false"},description:"",name:"disabled",required:!1,type:{name:"boolean"}},small:{defaultValue:{value:"false"},description:"",name:"small",required:!1,type:{name:"boolean"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"((evt: ChangeEvent<HTMLInputElement>) => void)"}},noMargin:{defaultValue:{value:"false"},description:"",name:"noMargin",required:!1,type:{name:"boolean"}},mainLabel:{defaultValue:{value:""},description:"",name:"mainLabel",required:!1,type:{name:"string"}},onClick:{defaultValue:{value:"() => {}"},description:"",name:"onClick",required:!1,type:{name:"((target: HTMLInputElement) => void)"}},radioButtonsData:{defaultValue:null,description:"",name:"radioButtonsData",required:!1,type:{name:"IRadioButtonOption[]"}},classForContainer:{defaultValue:{value:"grouped fields"},description:"",name:"classForContainer",required:!1,type:{name:"enum",value:[{value:'"grouped fields"'},{value:'"inline fields"'}]}}}}}catch{}export{h as R};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
._wrapper_chpf0_1._inline_chpf0_1{display:flex;align-items:center}._wrapper_chpf0_1._inline_chpf0_1 ._radio_chpf0_5:not(:last-child){margin-right:var(--padding)}._wrapper_chpf0_1 ._labelMargin_chpf0_8{margin-right:var(--padding)}._radio_chpf0_5{--size-radio: var(--size-xs);margin:calc((var(--size) - var(--size-radio)) / 2) 0;position:relative;display:flex;align-items:center;gap:var(--padding-xxs);backface-visibility:hidden;vertical-align:baseline;font-style:normal;min-height:var(--size-radio);font-size:var(--font-size);line-height:var(--size-radio);min-width:var(--size-radio);outline:0px}._radio_chpf0_5._small_chpf0_27{--size-radio: calc(var(--size-xs) - 4px);margin:calc((var(--size-sm) - var(--size-radio)) / 2) 0;font-size:var(--font-size-sm)}._radio_chpf0_5._noMargin_chpf0_32{margin-top:0;margin-bottom:0}._radio_chpf0_5 input{cursor:pointer;position:absolute;top:0;left:0;opacity:0!important;outline:0;width:var(--size-radio);height:var(--size-radio);z-index:-1}._radio_chpf0_5 label{cursor:pointer;position:relative;display:block;padding-left:calc(var(--size-radio) + var(--padding-xs));outline:0;color:var(--color-text);transition:color .1s ease}._radio_chpf0_5 label:before,._radio_chpf0_5 label:after{content:"";position:absolute;top:0;left:0;width:var(--size-radio);height:var(--size-radio);line-height:var(--size-radio);border-radius:50%;transition:border .1s ease,opacity .1s ease,transform .1s ease,box-shadow .1s ease}._radio_chpf0_5 label:before{background:var(--color-background-button-default);border:1px solid var(--color-border-checkbox);transform:none}._radio_chpf0_5 label:hover:before{border-color:var(--color-border-hover)}._radio_chpf0_5 label:after{border:none;transform:scale(.46666667);background-color:#fff;box-shadow:var(--shadow-button);opacity:0}._radio_chpf0_5 input:checked~label:before{background-color:var(--color-background-primary);border-color:transparent}._radio_chpf0_5 input:checked~label:after{opacity:1}._radio_chpf0_5._disabled_chpf0_90{cursor:default;pointer-events:none}._radio_chpf0_5._disabled_chpf0_90 label{color:var(--color-text-faint)}._radio_chpf0_5._disabled_chpf0_90 label:before{background-color:var(--color-background-disabled)!important}._radio_chpf0_5._disabled_chpf0_90 input:checked~label:before{border-color:var(--color-border-checkbox)}._radio_chpf0_5._disabled_chpf0_90 input:checked~label:after{background-color:var(--color-border-checkbox)}._isInTable_chpf0_106{margin:0;position:relative;top:1px}
|
|
@@ -1,51 +0,0 @@
|
|
|
1
|
-
import{j as k}from"./jsx-runtime-f961835c.js";import{r as y}from"./index-f80c8c95.js";import{R as H}from"./radio-button-82505e3b.js";import"./index-a80ed1cf.js";import"./disabled-context-d654f6ff.js";import"./select.input-88b6ebab.js";import"./types-cc224262.js";import"./common-types-2c81813f.js";import"./help-icon-5be78589.js";import"./tooltip-23e84186.js";import"./index-3d476d02.js";import"./icon-c5e1f218.js";import"./inheritsLoose-d4851ab8.js";import"./tslib.es6-dfef685f.js";import"./index-c89a1915.js";const l=[{label:"Aardvarks",value:"termites"},{label:"Kangaroos",value:"grass"},{label:"Monkeys",value:"bananas",disabled:!0}],Q={title:"Forms/RadioButton",component:H,args:{options:l,inline:!1,noMargin:!1,disabled:!1,small:!1}},r=e=>{const[t,b]=y.useState(l[0]),x=B=>{const I=B.target.value,c=l.find(M=>M.value===I);c&&b(c)};return k.jsx(H,{...e,value:t,onChange:x})},p=r.bind({}),n=r.bind({});n.args={small:!0};const a=r.bind({});a.args={options:l.map((e,t)=>({...e,helpText:`Help text #${t}`}))};const o=r.bind({});o.args={options:l.map((e,t)=>({...e,onClickHelp:()=>console.log(`Help #${t} clicked`)}))};const s=r.bind({});s.args={inline:!0};var i,u,d;p.parameters={...p.parameters,docs:{...(i=p.parameters)==null?void 0:i.docs,source:{originalSource:`args => {
|
|
2
|
-
const [value, setValue] = useState<OptionType>(options[0]);
|
|
3
|
-
const handleChange = (evt: React.ChangeEvent<HTMLInputElement>) => {
|
|
4
|
-
const selectedValue = evt.target.value;
|
|
5
|
-
const selectedOption = options.find(opt => opt.value === selectedValue);
|
|
6
|
-
if (selectedOption) {
|
|
7
|
-
setValue(selectedOption);
|
|
8
|
-
}
|
|
9
|
-
};
|
|
10
|
-
return <RadioButton {...args} value={value} onChange={handleChange} />;
|
|
11
|
-
}`,...(d=(u=p.parameters)==null?void 0:u.docs)==null?void 0:d.source}}};var m,g,v;n.parameters={...n.parameters,docs:{...(m=n.parameters)==null?void 0:m.docs,source:{originalSource:`args => {
|
|
12
|
-
const [value, setValue] = useState<OptionType>(options[0]);
|
|
13
|
-
const handleChange = (evt: React.ChangeEvent<HTMLInputElement>) => {
|
|
14
|
-
const selectedValue = evt.target.value;
|
|
15
|
-
const selectedOption = options.find(opt => opt.value === selectedValue);
|
|
16
|
-
if (selectedOption) {
|
|
17
|
-
setValue(selectedOption);
|
|
18
|
-
}
|
|
19
|
-
};
|
|
20
|
-
return <RadioButton {...args} value={value} onChange={handleChange} />;
|
|
21
|
-
}`,...(v=(g=n.parameters)==null?void 0:g.docs)==null?void 0:v.source}}};var h,C,O;a.parameters={...a.parameters,docs:{...(h=a.parameters)==null?void 0:h.docs,source:{originalSource:`args => {
|
|
22
|
-
const [value, setValue] = useState<OptionType>(options[0]);
|
|
23
|
-
const handleChange = (evt: React.ChangeEvent<HTMLInputElement>) => {
|
|
24
|
-
const selectedValue = evt.target.value;
|
|
25
|
-
const selectedOption = options.find(opt => opt.value === selectedValue);
|
|
26
|
-
if (selectedOption) {
|
|
27
|
-
setValue(selectedOption);
|
|
28
|
-
}
|
|
29
|
-
};
|
|
30
|
-
return <RadioButton {...args} value={value} onChange={handleChange} />;
|
|
31
|
-
}`,...(O=(C=a.parameters)==null?void 0:C.docs)==null?void 0:O.source}}};var f,V,R;o.parameters={...o.parameters,docs:{...(f=o.parameters)==null?void 0:f.docs,source:{originalSource:`args => {
|
|
32
|
-
const [value, setValue] = useState<OptionType>(options[0]);
|
|
33
|
-
const handleChange = (evt: React.ChangeEvent<HTMLInputElement>) => {
|
|
34
|
-
const selectedValue = evt.target.value;
|
|
35
|
-
const selectedOption = options.find(opt => opt.value === selectedValue);
|
|
36
|
-
if (selectedOption) {
|
|
37
|
-
setValue(selectedOption);
|
|
38
|
-
}
|
|
39
|
-
};
|
|
40
|
-
return <RadioButton {...args} value={value} onChange={handleChange} />;
|
|
41
|
-
}`,...(R=(V=o.parameters)==null?void 0:V.docs)==null?void 0:R.source}}};var T,E,S;s.parameters={...s.parameters,docs:{...(T=s.parameters)==null?void 0:T.docs,source:{originalSource:`args => {
|
|
42
|
-
const [value, setValue] = useState<OptionType>(options[0]);
|
|
43
|
-
const handleChange = (evt: React.ChangeEvent<HTMLInputElement>) => {
|
|
44
|
-
const selectedValue = evt.target.value;
|
|
45
|
-
const selectedOption = options.find(opt => opt.value === selectedValue);
|
|
46
|
-
if (selectedOption) {
|
|
47
|
-
setValue(selectedOption);
|
|
48
|
-
}
|
|
49
|
-
};
|
|
50
|
-
return <RadioButton {...args} value={value} onChange={handleChange} />;
|
|
51
|
-
}`,...(S=(E=s.parameters)==null?void 0:E.docs)==null?void 0:S.source}}};const U=["Default","Small","HelpText","OnClickHelp","Inline"];export{p as Default,a as HelpText,s as Inline,o as OnClickHelp,n as Small,U as __namedExportsOrder,Q as default};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{j as l}from"./jsx-runtime-f961835c.js";import{r as y}from"./index-f80c8c95.js";import{c as _}from"./index-a80ed1cf.js";import{b as x}from"./common-types-2c81813f.js";import{D as b}from"./disabled-context-d654f6ff.js";import{H as C}from"./help-icon-5be78589.js";const q="_toggle_6nx51_9",V="_small_6nx51_25",v="_disabled_6nx51_101",E="_noMargin_6nx51_112",n={toggle:q,small:V,disabled:v,noMargin:E},d=({name:t,label:u,checked:e=!1,disabled:s,small:m=!1,onChange:p,noMargin:g=!1,testId:f,helpText:r,onClickHelp:o})=>{const i=y.useContext(b),c=r||o;return l.jsxs("div",{className:_(n.toggle,s||i?n.disabled:null,m?n.small:null,g?n.noMargin:null),onClick:a=>{a.target.name=t,a.target.checked=!e,a.target.value=!e,p(a)},"data-testid":f,children:[l.jsx("input",{type:x.CHECKBOX,name:t,value:e==null?void 0:e.toString(),disabled:s||i,checked:e,onChange:()=>{}}),l.jsx("label",{children:u}),c&&l.jsx(C,{text:r,onClick:o})]})};try{d.displayName="Toggle",d.__docgenInfo={description:"",displayName:"Toggle",props:{name:{defaultValue:null,description:"",name:"name",required:!1,type:{name:"string"}},label:{defaultValue:null,description:"",name:"label",required:!1,type:{name:"string | ReactElement<any, string | JSXElementConstructor<any>> | null"}},checked:{defaultValue:{value:"false"},description:"",name:"checked",required:!1,type:{name:"boolean"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},small:{defaultValue:{value:"false"},description:"",name:"small",required:!1,type:{name:"boolean"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(evt: ChangeEvent<HTMLInputElement>) => void"}},noMargin:{defaultValue:{value:"false"},description:"",name:"noMargin",required:!1,type:{name:"boolean"}},testId:{defaultValue:null,description:"",name:"testId",required:!1,type:{name:"string"}},helpText:{defaultValue:null,description:"",name:"helpText",required:!1,type:{name:"string"}},onClickHelp:{defaultValue:null,description:"",name:"onClickHelp",required:!1,type:{name:"((evt: any) => void)"}}}}}catch{}export{d as T};
|
|
@@ -1,96 +0,0 @@
|
|
|
1
|
-
import{j as Y}from"./jsx-runtime-f961835c.js";import{r as w}from"./index-f80c8c95.js";import{T as i}from"./toggle-df90df5f.js";import"./index-a80ed1cf.js";import"./common-types-2c81813f.js";import"./disabled-context-d654f6ff.js";import"./help-icon-5be78589.js";import"./tooltip-23e84186.js";import"./index-3d476d02.js";import"./icon-c5e1f218.js";import"./inheritsLoose-d4851ab8.js";import"./tslib.es6-dfef685f.js";import"./index-c89a1915.js";const{useArgs:y}=__STORYBOOK_MODULE_ADDONS__,se={title:"Forms/Toggle",component:i,args:{label:"Label"}},e=l=>{const[{checked:g},p]=y(),h=()=>{p({checked:!g})};return Y.jsx(i,{...l,onChange:h})},o=e.bind({}),n=e.bind({});n.args={disabled:!0};const s=e.bind({});s.args={checked:!0,disabled:!0};const a=e.bind({});a.args={small:!0};const r=e.bind({});r.args={label:null};const c=e.bind({});c.args={helpText:"Help text"};const t=e.bind({});t.args={onClickHelp:()=>console.log("Help clicked")};const d=()=>{const[l,g]=w.useState(!1);return Y.jsx(i,{name:"name",label:"Label",checked:l,onChange:p=>{const{name:h,value:q,checked:u}=p.target;g(u),console.log(h,q,u)}})};var m,k,C;o.parameters={...o.parameters,docs:{...(m=o.parameters)==null?void 0:m.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
|
-
}`,...(C=(k=o.parameters)==null?void 0:k.docs)==null?void 0:C.source}}};var b,x,A;n.parameters={...n.parameters,docs:{...(b=n.parameters)==null?void 0:b.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
|
-
}`,...(A=(x=n.parameters)==null?void 0:x.docs)==null?void 0:A.source}}};var T,S,j;s.parameters={...s.parameters,docs:{...(T=s.parameters)==null?void 0:T.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
|
-
}`,...(j=(S=s.parameters)==null?void 0:S.docs)==null?void 0:j.source}}};var D,_,f;a.parameters={...a.parameters,docs:{...(D=a.parameters)==null?void 0:D.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
|
-
}`,...(f=(_=a.parameters)==null?void 0:_.docs)==null?void 0:f.source}}};var O,v,H;r.parameters={...r.parameters,docs:{...(O=r.parameters)==null?void 0:O.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
|
-
}`,...(H=(v=r.parameters)==null?void 0:v.docs)==null?void 0:H.source}}};var E,L,R;c.parameters={...c.parameters,docs:{...(E=c.parameters)==null?void 0:E.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
|
-
}`,...(R=(L=c.parameters)==null?void 0:L.docs)==null?void 0:R.source}}};var B,F,K;t.parameters={...t.parameters,docs:{...(B=t.parameters)==null?void 0:B.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
|
-
}`,...(K=(F=t.parameters)==null?void 0:F.docs)==null?void 0:K.source}}};var M,N,U;d.parameters={...d.parameters,docs:{...(M=d.parameters)==null?void 0:M.docs,source:{originalSource:`() => {
|
|
86
|
-
const [checked, setChecked] = useState(false);
|
|
87
|
-
return <Toggle name="name" label="Label" checked={checked} onChange={evt => {
|
|
88
|
-
const {
|
|
89
|
-
name,
|
|
90
|
-
value,
|
|
91
|
-
checked
|
|
92
|
-
} = evt.target;
|
|
93
|
-
setChecked(checked);
|
|
94
|
-
console.log(name, value, checked);
|
|
95
|
-
}} />;
|
|
96
|
-
}`,...(U=(N=d.parameters)==null?void 0:N.docs)==null?void 0:U.source}}};const ae=["Default","Disabled","DisabledChecked","Small","Standalone","HelpText","OnClickHelp","TestClickevt"];export{o as Default,n as Disabled,s as DisabledChecked,c as HelpText,t as OnClickHelp,a as Small,r as Standalone,d as TestClickevt,ae as __namedExportsOrder,se as default};
|