Skip to content

Commit

Permalink
Deploy Storybook to GitHub Pages
Browse files Browse the repository at this point in the history
  • Loading branch information
GH Pages Bot committed May 21, 2024
0 parents commit 615ace4
Show file tree
Hide file tree
Showing 210 changed files with 6,378 additions and 0 deletions.
1 change: 1 addition & 0 deletions assets/ActionButton-GkUtpqKQ.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions assets/ActionButton-kyN0h6zj.css

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

20 changes: 20 additions & 0 deletions assets/ActionButton.stories-CxzE4J1F.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
import{w as r,j as n}from"./util-C8bl_Tlr.js";import"./stateDeferredHook-CJyclKMp.js";import{r as e}from"./index-CDs2tPxN.js";import{A as o}from"./ActionButton-GkUtpqKQ.js";import"./index-7F8eXZrO.js";const A={title:"Components / ActionButton",component:o,args:{}},a=()=>{const t=e.useCallback(async()=>{await r(1e3)},[]);return n.jsxs(n.Fragment,{children:[n.jsx(o,{icon:"ic_add",name:"Add new row",inProgressName:"Adding...",onClick:t}),n.jsx("br",{}),n.jsx(o,{icon:"ic_add","aria-label":"Add new row",onClick:t,level:"primary"}),n.jsx("br",{}),n.jsx(o,{icon:"ic_add","aria-label":"Add new row",onClick:t,level:"primary",className:"ActionButton-tight"}),n.jsx("br",{}),n.jsx(o,{icon:"ic_arrow_forward_right",name:"Continue",onClick:t,iconPosition:"right",level:"secondary",className:"ActionButton-fill",style:{maxWidth:160}}),n.jsx("br",{}),n.jsx(o,{icon:"ic_arrow_forward_right",name:"Disabled",onClick:t,iconPosition:"right",level:"secondary",className:"ActionButton-fill",style:{maxWidth:160},disabled:!0})]})},i=a.bind({});i.parameters={...i.parameters,docs:{...i.parameters?.docs,source:{originalSource:`() => {
const performAction = useCallback(async () => {
await wait(1000);
}, []);
return <>
<ActionButton icon={"ic_add"} name={"Add new row"} inProgressName={"Adding..."} onClick={performAction} />
<br />
<ActionButton icon={"ic_add"} aria-label={"Add new row"} onClick={performAction} level={"primary"} />
<br />
<ActionButton icon={"ic_add"} aria-label={"Add new row"} onClick={performAction} level={"primary"} className={"ActionButton-tight"} />
<br />
<ActionButton icon={"ic_arrow_forward_right"} name={"Continue"} onClick={performAction} iconPosition={"right"} level={"secondary"} className={"ActionButton-fill"} style={{
maxWidth: 160
}} />
<br />
<ActionButton icon={"ic_arrow_forward_right"} name={"Disabled"} onClick={performAction} iconPosition={"right"} level={"secondary"} className={"ActionButton-fill"} style={{
maxWidth: 160
}} disabled={true} />
</>;
}`,...i.parameters?.docs?.source}}};const u=["ActionButtonSimple"];export{i as ActionButtonSimple,u as __namedExportsOrder,A as default};
1 change: 1 addition & 0 deletions assets/Color-PRSJMWNM-DPAC-4Xe.js

Large diffs are not rendered by default.

517 changes: 517 additions & 0 deletions assets/DocsRenderer-K4EAMTCU-Bt_IEHUJ.js

Large diffs are not rendered by default.

704 changes: 704 additions & 0 deletions assets/Grid-DBxVwkZv.js

Large diffs are not rendered by default.

70 changes: 70 additions & 0 deletions assets/GridDragRow.stories-BduMm9nM.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,70 @@
import{j as r}from"./util-C8bl_Tlr.js";/* empty css */import{G as m,a as g}from"./GridUpdatingContextProvider-DNtSqPwD.js";import"./stateDeferredHook-CJyclKMp.js";import{r as d}from"./index-CDs2tPxN.js";import{G as i,a as u}from"./GridWrapper-D6W7X3eV.js";import{G as l}from"./Grid-DBxVwkZv.js";import"./index-7F8eXZrO.js";import"./ActionButton-GkUtpqKQ.js";import{w as h}from"./storybookTestUtil-B-yy9e-S.js";import"./v4-CQkTLCs1.js";import"./index-5cqeCcJX.js";import"./index-CVRyq5ci.js";const I={title:"Components / Grids",component:l,args:{quickFilter:!0,quickFilterValue:"",quickFilterPlaceholder:"Quick filter...",selectable:!1,rowSelection:"single"},parameters:{docs:{source:{type:"code"}}},decorators:[a=>r.jsx("div",{style:{maxWidth:1024,height:400,display:"flex",flexDirection:"column"},children:r.jsx(m,{children:r.jsx(g,{children:r.jsx(a,{})})})})]},f=a=>{const p=d.useMemo(()=>[i({field:"id",headerName:"Id",lockVisible:!0}),i({field:"position",headerName:"Position",cellRendererParams:{warning:({value:e})=>e==="Tester"&&"Testers are testing",info:({value:e})=>e==="Developer"&&"Developers are awesome"}}),i({field:"age",headerName:"Age"}),i({field:"height",headerName:"Height"}),i({field:"desc",headerName:"Description",flex:1})],[]),[n,c]=d.useState([{id:1e3,position:"Tester",age:30,height:`6'4"`,desc:"Tests application",dd:"1"},{id:1001,position:"Developer",age:12,height:`5'3"`,desc:"Develops application",dd:"2"},{id:1002,position:"Manager",age:65,height:`5'9"`,desc:"Manages",dd:"3"},{id:1003,position:"BA",age:42,height:`5'7"`,desc:"BAs",dd:"4"}]);return r.jsx(u,{maxHeight:300,children:r.jsx(l,{"data-testid":"readonly",...a,selectable:!0,rowSelection:"multiple",animateRows:!0,columnDefs:p,defaultColDef:{sortable:!1},rowData:n,onRowDragEnd:async(e,s,w)=>{c(n.map(o=>o.id===e.id?s:o.id===s.id?e:o))},rowDragText:({rowNode:e})=>`${e?.data.id} - ${e?.data.position}`})})},t=f.bind({});t.play=h;t.parameters={...t.parameters,docs:{...t.parameters?.docs,source:{originalSource:`(props: GridProps) => {
const columnDefs: ColDefT<ITestRow>[] = useMemo(() => [GridCell({
field: "id",
headerName: "Id",
lockVisible: true
}), GridCell<ITestRow, ITestRow["position"]>({
field: "position",
headerName: "Position",
cellRendererParams: {
warning: ({
value
}) => value === "Tester" && "Testers are testing",
info: ({
value
}) => value === "Developer" && "Developers are awesome"
}
}), GridCell({
field: "age",
headerName: "Age"
}), GridCell({
field: "height",
headerName: "Height"
}), GridCell({
field: "desc",
headerName: "Description",
flex: 1
})], []);
const [rowData, setRowData] = useState([{
id: 1000,
position: "Tester",
age: 30,
height: \`6'4"\`,
desc: "Tests application",
dd: "1"
}, {
id: 1001,
position: "Developer",
age: 12,
height: \`5'3"\`,
desc: "Develops application",
dd: "2"
}, {
id: 1002,
position: "Manager",
age: 65,
height: \`5'9"\`,
desc: "Manages",
dd: "3"
}, {
id: 1003,
position: "BA",
age: 42,
height: \`5'7"\`,
desc: "BAs",
dd: "4"
}]);
return <GridWrapper maxHeight={300}>
<Grid data-testid={"readonly"} {...props} selectable={true} rowSelection="multiple" animateRows={true} columnDefs={columnDefs} defaultColDef={{
sortable: false
}} rowData={rowData} onRowDragEnd={async (movedRow, targetRow, _targetIndex) => {
setRowData(rowData.map(r => {
if (r.id === movedRow.id) return targetRow;
if (r.id === targetRow.id) return movedRow;
return r;
}));
}} rowDragText={({
rowNode
}) => \`\${rowNode?.data.id} - \${rowNode?.data.position}\`} />
</GridWrapper>;
}`,...t.parameters?.docs?.source}}};const k=["DragRowSingleSelection"];export{t as DragRowSingleSelection,k as __namedExportsOrder,I as default};
68 changes: 68 additions & 0 deletions assets/GridFilterButtons.stories-D_Vq9xpp.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,68 @@
import{j as e}from"./util-C8bl_Tlr.js";/* empty css */import{G as d,a as p}from"./GridUpdatingContextProvider-DNtSqPwD.js";import"./stateDeferredHook-CJyclKMp.js";import{r as n}from"./index-CDs2tPxN.js";import{G as o,a as c,b as u,c as m,d as g}from"./GridWrapper-D6W7X3eV.js";import{G as s}from"./Grid-DBxVwkZv.js";import"./index-7F8eXZrO.js";import"./ActionButton-GkUtpqKQ.js";import{w as f}from"./storybookTestUtil-B-yy9e-S.js";import"./v4-CQkTLCs1.js";import"./index-5cqeCcJX.js";import"./index-CVRyq5ci.js";const P={title:"Components / Grids",component:s,decorators:[r=>e.jsx("div",{style:{width:1024,height:400,display:"flex"},children:e.jsx(d,{children:e.jsx(p,{children:e.jsx(r,{})})})})]},h=r=>{const a=n.useMemo(()=>[o({field:"id",headerName:"Id"}),o({field:"position",headerName:"Position"}),o({field:"desc",headerName:"Description",flex:1})],[]),[l]=n.useState([{id:1e3,position:"Tester",age:30,desc:"Integration tester - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur a lectus neque. Nunc congue magna ut lorem pretium, vitae congue lorem malesuada. Etiam eget eleifend sapien, sed egestas felis. Aliquam ac augue sapien."},{id:1001,position:"Developer",age:12,desc:"Frontend developer"},{id:1002,position:"Manager",age:65,desc:"Technical Manager"},{id:1003,position:"Tester",age:30,desc:"E2E tester"},{id:1004,position:"Developer",age:12,desc:"Fullstack Developer"},{id:1005,position:"Developer",age:12,desc:"Backend Developer"},{id:1006,position:"Architect",age:30,desc:"Architect"}]);return e.jsxs(c,{children:[e.jsxs(u,{children:[e.jsx(m,{quickFilterPlaceholder:"Custom placeholder..."}),e.jsx(g,{luiButtonProps:{style:{whiteSpace:"nowrap"}},options:[{label:"All"},{label:"Developers",filter:t=>t.position==="Developer"},{label:"Testers",filter:t=>t.position==="Tester"}]})]}),e.jsx(s,{...r,columnDefs:a,rowData:l,sizeColumns:"auto-skip-headers"})]})},i=h.bind({});i.play=f;i.parameters={...i.parameters,docs:{...i.parameters?.docs,source:{originalSource:`(props: GridProps) => {
const columnDefs: ColDefT<ITestRow>[] = useMemo(() => [GridCell({
field: "id",
headerName: "Id"
}), GridCell({
field: "position",
headerName: "Position"
}), GridCell({
field: "desc",
headerName: "Description",
flex: 1
})], []);
const [rowData] = useState([{
id: 1000,
position: "Tester",
age: 30,
desc: "Integration tester - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur a lectus neque. Nunc congue magna ut lorem pretium, vitae congue lorem malesuada. Etiam eget eleifend sapien, sed egestas felis. Aliquam ac augue sapien."
}, {
id: 1001,
position: "Developer",
age: 12,
desc: "Frontend developer"
}, {
id: 1002,
position: "Manager",
age: 65,
desc: "Technical Manager"
}, {
id: 1003,
position: "Tester",
age: 30,
desc: "E2E tester"
}, {
id: 1004,
position: "Developer",
age: 12,
desc: "Fullstack Developer"
}, {
id: 1005,
position: "Developer",
age: 12,
desc: "Backend Developer"
}, {
id: 1006,
position: "Architect",
age: 30,
desc: "Architect"
}]);
return <GridWrapper>
<GridFilters>
<GridFilterQuick quickFilterPlaceholder={"Custom placeholder..."} />
<GridFilterButtons<ITestRow> luiButtonProps={{
style: {
whiteSpace: "nowrap"
}
}} options={[{
label: "All"
}, {
label: "Developers",
filter: row => row.position === "Developer"
}, {
label: "Testers",
filter: row => row.position === "Tester"
}]} />
</GridFilters>
<Grid {...props} columnDefs={columnDefs} rowData={rowData} sizeColumns={"auto-skip-headers"} />
</GridWrapper>;
}`,...i.parameters?.docs?.source}}};const A=["_FilterButtonsExample"];export{i as _FilterButtonsExample,A as __namedExportsOrder,P as default};
72 changes: 72 additions & 0 deletions assets/GridFormDropDown.stories-DBOz7rb0.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,72 @@
import{j as n}from"./util-C8bl_Tlr.js";/* empty css */import{a as d}from"./GridUpdatingContextProvider-DNtSqPwD.js";import"./stateDeferredHook-CJyclKMp.js";import{k as i,m as p,i as e}from"./GridWrapper-D6W7X3eV.js";import{r as u}from"./index-CDs2tPxN.js";import"./Grid-DBxVwkZv.js";import"./index-7F8eXZrO.js";import"./ActionButton-GkUtpqKQ.js";import"./v4-CQkTLCs1.js";const O={title:"GridForm / Static Tests",component:i,args:{}},m=s=>{const r=[["No options",{options:[]}],["Custom no options",{options:[],noOptionsMessage:"Custom no options"}],["Enabled and disabled",{options:[{label:"Enabled",value:1},{label:"Disabled",value:0,disabled:!0}]}],["Headers",{options:[e("Header 1"),{label:"Option 1",value:1},e("Header 2"),{label:"Option 2",value:2}]}],["Filter",{filtered:"local",options:[e("Header 1"),{label:"Option 1",value:1},e("Header 2"),{label:"Option 2",value:2}]}],["Filter custom placeholder",{filtered:"local",filterPlaceholder:"Custom placeholder",filterHelpText:"Filter help text",options:[e("Header 1"),{label:"Option 1",value:1}]}],["Filter help text and default filter text",{filtered:"local",filterHelpText:"Filter help text",filterDefaultValue:"filter",options:[e("Header 1"),{label:"Filter match",value:1},e("ERROR! this header should not be visible"),{label:"ERROR! this option should not be visible",value:2}]}]],a=r.map(()=>u.useRef(null));return n.jsx("div",{className:"react-menu-inline-test",children:n.jsx(d,{children:r.map((o,l)=>n.jsxs("div",{children:[n.jsx("h6",{ref:a[l],children:o[0]}),n.jsx(p.Provider,{value:{anchorRef:a[l],data:{value:o[2]},value:o[2],field:"value"},children:n.jsx(i,{...s,...o[1]})})]},`${l}`))})})},t=m.bind({});t.parameters={...t.parameters,docs:{...t.parameters?.docs,source:{originalSource:`(props: GridFormDropDownProps<any>) => {
const configs: [string, GridFormDropDownProps<GridBaseRow>, string?][] = [["No options", {
options: []
}], ["Custom no options", {
options: [],
noOptionsMessage: "Custom no options"
}], ["Enabled and disabled", {
options: [{
label: "Enabled",
value: 1
}, {
label: "Disabled",
value: 0,
disabled: true
}]
}], ["Headers", {
options: [MenuHeaderItem("Header 1"), {
label: "Option 1",
value: 1
}, MenuHeaderItem("Header 2"), {
label: "Option 2",
value: 2
}]
}], ["Filter", {
filtered: "local",
options: [MenuHeaderItem("Header 1"), {
label: "Option 1",
value: 1
}, MenuHeaderItem("Header 2"), {
label: "Option 2",
value: 2
}]
}], ["Filter custom placeholder", {
filtered: "local",
filterPlaceholder: "Custom placeholder",
filterHelpText: "Filter help text",
options: [MenuHeaderItem("Header 1"), {
label: "Option 1",
value: 1
}]
}], ["Filter help text and default filter text", {
filtered: "local",
filterHelpText: "Filter help text",
filterDefaultValue: "filter",
options: [MenuHeaderItem("Header 1"), {
label: "Filter match",
value: 1
}, MenuHeaderItem("ERROR! this header should not be visible"), {
label: "ERROR! this option should not be visible",
value: 2
}]
}]];
// eslint-disable-next-line react-hooks/rules-of-hooks
const anchorRefs = configs.map(() => useRef<HTMLHeadingElement>(null));
return <div className={"react-menu-inline-test"}>
<GridContextProvider>
{configs.map((config, index) => <div key={\`\${index}\`}>
<h6 ref={anchorRefs[index]}>{config[0]}</h6>
<GridPopoverContext.Provider value={(({
anchorRef: anchorRefs[index],
data: {
value: config[2]
},
value: config[2],
field: "value"
} as any) as GridPopoverContextType<any>)}>
<GridFormDropDown {...props} {...config[1]} />
</GridPopoverContext.Provider>
</div>)}
</GridContextProvider>
</div>;
}`,...t.parameters?.docs?.source}}};const G=["GridFormDropDown_"];export{t as GridFormDropDown_,G as __namedExportsOrder,O as default};
Loading

0 comments on commit 615ace4

Please sign in to comment.