@elliemae/pui-app-sdk 6.0.0-alpha.2 → 6.0.0-alpha.4

package/demo/docs/view-form-usecases-stories.c30ac9ae.iframe.bundle.js

@@ -0,0 +1,305 @@
+(globalThis.webpackChunk_elliemae_pui_app_sdk=globalThis.webpackChunk_elliemae_pui_app_sdk||[]).push([[4580],{"./lib/view/fields/combo-box-v3/index.tsx"(f,u,n){"use strict";n.d(u,{N:()=>m});var b=n("./node_modules/.pnpm/@babel+runtime@7.29.2/node_modules/@babel/runtime/helpers/jsx.js"),e=n.n(b),_=n("./node_modules/.pnpm/@babel+runtime@7.29.2/node_modules/@babel/runtime/helpers/objectWithoutProperties.js"),d=n.n(_),c=n("./node_modules/.pnpm/@elliemae+ds-form-combobox@3.57.10_@elliemae+pui-theme@2.13.0/node_modules/@elliemae/ds-form-combobox/dist/esm/ComboBox.js"),i=n("./node_modules/.pnpm/react-hook-form@7.70.0_react@18.3.1/node_modules/react-hook-form/dist/index.esm.mjs"),l=n("./node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js"),s=["name","defaultValue","rules","clearable","filteredOptions"],a=["onChange","value"],m=function(r){var t=r.name,o=r.defaultValue,p=o===void 0?null:o,B=r.rules,S=B===void 0?{}:B,h=r.clearable,O=h===void 0?!0:h,g=r.filteredOptions,x=g===void 0?null:g,y=d()(r,s);return e()(i.xI,{name:t,rules:S,defaultValue:p,render:function(P){var F=P.field,E=F.onChange,v=F.value,D=d()(F,a),M=P.fieldState.error;return(0,l.jsx)(c.NB,Object.assign({},D,y,{hasError:!!M,filteredOptions:x,selectedValues:v,onChange:E,isNonClearable:!O}))}})};m.displayName="ComboBoxV3"},"./lib/view/fields/date-time-picker/index.tsx"(f,u,n){"use strict";n.d(u,{K:()=>r});var b=n("./node_modules/.pnpm/@babel+runtime@7.29.2/node_modules/@babel/runtime/helpers/jsx.js"),e=n.n(b),_=n("./node_modules/.pnpm/@babel+runtime@7.29.2/node_modules/@babel/runtime/helpers/objectWithoutProperties.js"),d=n.n(_),c=n("./node_modules/.pnpm/@elliemae+ds-form-date-time-picker@3.57.10_@elliemae+pui-theme@2.13.0/node_modules/@elliemae/ds-form-date-time-picker/dist/esm/ControlledDateTimePicker.js"),i=n("./node_modules/.pnpm/react-hook-form@7.70.0_react@18.3.1/node_modules/react-hook-form/dist/index.esm.mjs"),l=n("./node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js"),s=["name","defaultValue","rules","type"],a=["value","onChange"],m=function(t,o){return{"full-date-time":{dateTime:t,onDateTimeChange:o},"date-time-inputs":{dateTime:t,onDateTimeChange:o},"date-time-picker":{dateTime:t,onDateTimeChange:o},"date-time-picker-controller-only":{dateTime:t,onDateTimeChange:o},"date-inputs":{date:t,onDateChange:o},"date-picker":{date:t,onDateChange:o},"date-picker-controller-only":{date:t,onDateChange:o},"full-date":{date:t,onDateChange:o},"full-time":{time:t,onTimeChange:o},"time-inputs":{time:t,onTimeChange:o},"time-picker-controller-only":{time:t,onTimeChange:o},"time-picker":{time:t,onTimeChange:o}}},r=function(t){var o=t.name,p=t.defaultValue,B=p===void 0?"":p,S=t.rules,h=S===void 0?{}:S,O=t.type,g=O===void 0?"full-date-time":O,x=d()(t,s);return e()(i.xI,{name:o,defaultValue:B,rules:h,render:function(y){var P=y.field,F=P.value,E=P.onChange,v=d()(P,a),D=y.fieldState.error;return(0,l.jsx)(c.l,Object.assign({hasError:!!D},v,{type:g},m(F,E)[g],x))}})};r.displayName="DateTimePicker"},"./lib/view/fields/form-layout-block-item/index.tsx"(f,u,n){"use strict";n.d(u,{B:()=>l});var b=n("./node_modules/.pnpm/@babel+runtime@7.29.2/node_modules/@babel/runtime/helpers/objectWithoutProperties.js"),e=n.n(b),_=n("./node_modules/.pnpm/@elliemae+ds-form-layout-blocks@3.57.10_@elliemae+pui-theme@2.13.0/node_modules/@elliemae/ds-form-layout-blocks/dist/esm/form-layout-block-item/DSFormLayoutBlockItem.js"),d=n("./node_modules/.pnpm/react-hook-form@7.70.0_react@18.3.1/node_modules/react-hook-form/dist/index.esm.mjs"),c=n("./node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js"),i=["inputID","label"],l=function(s){var a=s.inputID,m=s.label,r=e()(s,i),t=(0,d.lN)({name:a}),o=t.errors,p=(0,d.Jt)(o,a),B=!!p,S=p?.message;return(0,c.jsx)(_.U,Object.assign({inputID:a,label:m,hasError:B,validationMessage:S},r))};l.displayName="FormLayoutBlockItem"},"./lib/view/fields/input-text/index.tsx"(f,u,n){"use strict";n.d(u,{S:()=>a});var b=n("./node_modules/.pnpm/@babel+runtime@7.29.2/node_modules/@babel/runtime/helpers/jsx.js"),e=n.n(b),_=n("./node_modules/.pnpm/@babel+runtime@7.29.2/node_modules/@babel/runtime/helpers/objectWithoutProperties.js"),d=n.n(_),c=n("./node_modules/.pnpm/@elliemae+ds-form-input-text@3.57.10_@elliemae+pui-theme@2.13.0/node_modules/@elliemae/ds-form-input-text/dist/esm/DSInputText.js"),i=n("./node_modules/.pnpm/react-hook-form@7.70.0_react@18.3.1/node_modules/react-hook-form/dist/index.esm.mjs"),l=n("./node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js"),s=["name","defaultValue","rules"],a=function(m){var r=m.name,t=m.defaultValue,o=t===void 0?"":t,p=m.rules,B=p===void 0?{}:p,S=d()(m,s);return e()(i.xI,{name:r,defaultValue:o,rules:B,render:function(h){var O=h.field,g=h.fieldState.error;return(0,l.jsx)(c.B,Object.assign({hasError:!!g},O,S))}})};a.displayName="InputText"},"./lib/view/form/index.tsx"(f,u,n){"use strict";n.d(u,{l:()=>c});var b=n("./node_modules/.pnpm/styled-components@5.3.11_react-dom@18.3.1_react@18.3.1/node_modules/styled-components/dist/styled-components.browser.cjs.js"),e=n("./node_modules/.pnpm/react-hook-form@7.70.0_react@18.3.1/node_modules/react-hook-form/dist/index.esm.mjs"),_=n("./node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js"),d=b.default.form.withConfig({componentId:"sc-1pyjvv3-0"})(["width:100%;"]),c=function(i){var l=i.classname,s=i.reactHookFormProps,a=s===void 0?{mode:"onBlur"}:s,m=i.children,r=i.onSubmit,t=(0,e.mN)(a),o={};r&&(o.onSubmit=t.handleSubmit(r));var p=Object.assign(t,{formProps:a});return(0,_.jsx)(e.Op,Object.assign({},p,{children:(0,_.jsx)(d,Object.assign({className:l},o,{children:m}))}))};c.displayName="Form"},"./lib/view/form/personal-info-section.tsx"(f,u,n){"use strict";n.d(u,{MK:()=>l,Uw:()=>a,j9:()=>m,ks:()=>s});var b=n("./node_modules/.pnpm/@babel+runtime@7.29.2/node_modules/@babel/runtime/helpers/jsx.js"),e=n.n(b),_=n("./lib/view/fields/input-text/index.tsx"),d=n("./lib/view/fields/combo-box-v3/index.tsx"),c=n("./lib/view/fields/date-time-picker/index.tsx"),i=n("./lib/view/fields/form-layout-block-item/index.tsx"),l=function(){return e()(i.B,{label:"First Name",inputID:"firstname",required:!0},void 0,e()(_.S,{id:"firstname",name:"firstname",rules:{required:{value:!0,message:"First Name is required"},minLength:{value:2,message:"Minimum 2 characters"},maxLength:{value:50,message:"Maximum 50 characters"}}}))};l.displayName="FirstName";var s=function(){return e()(i.B,{label:"Date of Birth",inputID:"dob",required:!0},void 0,e()(c.K,{id:"dob",name:"dob",type:"date-inputs",rules:{required:{value:!0,message:"Date of Birth is required"},validate:function(r){return r!=="12/25/1990"||"Date of Birth can not be 12/25/1990"}}}))};s.displayName="DOB";var a=function(){return e()(i.B,{label:"State",inputID:"state",required:!0},void 0,e()(d.N,{id:"state",name:"state",rules:{required:{value:!0,message:"State is required"}},allOptions:[{dsId:"1",type:"option",value:"--select--",label:"--Select--"},{dsId:"2",type:"option",value:"ca",label:"California"},{dsId:"3",type:"option",value:"nj",label:"New Jersey"}]}))};a.displayName="State";var m=function(){return e()(i.B,{label:"Marital Status",inputID:"marital_status",required:!0},void 0,e()(d.N,{id:"marital_status",name:"marital_status",rules:{required:{value:!0,message:"Marital Status is required"}},allOptions:[{dsId:"1",type:"option",value:"--select--",label:"--Select--"},{dsId:"2",type:"option",value:"married",label:"Married"},{dsId:"3",type:"option",value:"unmarried",label:"Unmarried"},{dsId:"4",type:"option",value:"separated",label:"Separated"}]}))};m.displayName="MaritalStatus"},"./lib/view/form/submit-button/index.tsx"(f,u,n){"use strict";n.d(u,{J:()=>s});var b=n("./node_modules/.pnpm/@babel+runtime@7.29.2/node_modules/@babel/runtime/helpers/objectDestructuringEmpty.js"),e=n.n(b),_=n("./node_modules/.pnpm/@babel+runtime@7.29.2/node_modules/@babel/runtime/helpers/extends.js"),d=n.n(_),c=n("./node_modules/.pnpm/react-hook-form@7.70.0_react@18.3.1/node_modules/react-hook-form/dist/index.esm.mjs"),i=n("./node_modules/.pnpm/@elliemae+ds-button-v2@3.57.10_@elliemae+pui-theme@2.13.0_lodash-es@4.18.1/node_modules/@elliemae/ds-button-v2/dist/esm/parts/DSButtonV2/DSButtonV2.js"),l=n("./node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js"),s=function(a){var m=d()({},(e()(a),a)),r=(0,c.xW)(),t=r.formState,o=r.formProps.mode;return(0,l.jsx)(i.e,Object.assign({},m,{type:"submit",disabled:o!=="onSubmit"&&(!t.isDirty||t.isDirty&&!t.isValid)}))};s.displayName="FormSubmitButton"},"./lib/view/form/usecases.stories.tsx"(f,u,n){"use strict";n.r(u),n.d(u,{FormValidationOnBlur:()=>g,FormValidationOnChange:()=>y,FormValidationOnSubmit:()=>x,__namedExportsOrder:()=>P,default:()=>S});var b=n("./node_modules/.pnpm/@babel+runtime@7.29.2/node_modules/@babel/runtime/helpers/jsx.js"),e=n.n(b),_=n("./node_modules/.pnpm/styled-components@5.3.11_react-dom@18.3.1_react@18.3.1/node_modules/styled-components/dist/styled-components.browser.cjs.js"),d=n("./node_modules/.pnpm/@elliemae+ds-grid@3.57.10_@elliemae+pui-theme@2.13.0/node_modules/@elliemae/ds-grid/dist/esm/Grid.js"),c=n("./lib/view/form/submit-button/index.tsx"),i=n("./lib/view/form/index.tsx"),l=n("./lib/view/form/personal-info-section.tsx"),s=n("./node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js"),a,m,r,t,o=`
+    
+    // @ts-nocheck
+    // @ts-ignore
+    var __STORY__ = "import styled from 'styled-components';\\nimport { Story, Meta } from '@storybook/react';\\nimport { Grid } from '@elliemae/ds-grid';\\nimport { FormSubmitButton } from './submit-button/index.js';\\nimport { Form, FormProps } from './index.js';\\n\\nimport {\\n  FirstName,\\n  DOB,\\n  State,\\n  MaritalStatus,\\n} from './personal-info-section.js';\\n\\nconst btnProps = {\\n  children: 'Submit Application',\\n  size: 'l',\\n};\\n\\nexport default {\\n  title: 'Components/Form',\\n  component: FormSubmitButton,\\n} as Meta;\\n\\nconst StyledButton = styled(FormSubmitButton)\`\\n  margin-top: \${({ theme }) => theme.space.xs};\\n\`;\\n\\ntype FormFields = {\\n  firstname: string;\\n  dob: string;\\n  state: string;\\n  marital_status: string;\\n};\\n\\nconst Template: Story<FormProps<FormFields>> = (args) => (\\n  <Grid p=\\"m\\">\\n    <Form {...args}>\\n      <FirstName />\\n      <DOB />\\n      <State />\\n      <MaritalStatus />\\n      <StyledButton {...btnProps} />\\n    </Form>\\n  </Grid>\\n);\\n\\nexport const FormValidationOnBlur = Template.bind({});\\nFormValidationOnBlur.args = {\\n  onSubmit: (data) => {\\n    \\n    console.log('form submitted with', data);\\n  },\\n  reactHookFormProps: { mode: 'onBlur' },\\n};\\n\\nexport const FormValidationOnSubmit = Template.bind({});\\nFormValidationOnSubmit.args = {\\n  onSubmit: (data) => {\\n    \\n    console.log('form submitted with', data);\\n  },\\n  reactHookFormProps: { mode: 'onSubmit' },\\n};\\n\\nexport const FormValidationOnChange = Template.bind({});\\nFormValidationOnChange.args = {\\n  onSubmit: (data) => {\\n    \\n    console.log('form submitted with', data);\\n  },\\n  reactHookFormProps: { mode: 'onChange' },\\n};\\n";
+    // @ts-ignore
+    var __LOCATIONS_MAP__ = {"FormValidationOnBlur":{"startLoc":{"col":47,"line":35},"endLoc":{"col":1,"line":45},"startBody":{"col":47,"line":35},"endBody":{"col":1,"line":45}},"FormValidationOnSubmit":{"startLoc":{"col":47,"line":35},"endLoc":{"col":1,"line":45},"startBody":{"col":47,"line":35},"endBody":{"col":1,"line":45}},"FormValidationOnChange":{"startLoc":{"col":47,"line":35},"endLoc":{"col":1,"line":45},"startBody":{"col":47,"line":35},"endBody":{"col":1,"line":45}}};
+    
+import styled from 'styled-components';
+import { Story, Meta } from '@storybook/react';
+import { Grid } from '@elliemae/ds-grid';
+import { FormSubmitButton } from './submit-button/index.js';
+import { Form, FormProps } from './index.js';
+
+import {
+  FirstName,
+  DOB,
+  State,
+  MaritalStatus,
+} from './personal-info-section.js';
+
+const btnProps = {
+  children: 'Submit Application',
+  size: 'l',
+};
+
+export default {parameters: {"storySource":{"source":"import styled from 'styled-components';\\nimport { Story, Meta } from '@storybook/react';\\nimport { Grid } from '@elliemae/ds-grid';\\nimport { FormSubmitButton } from './submit-button/index.js';\\nimport { Form, FormProps } from './index.js';\\n\\nimport {\\n  FirstName,\\n  DOB,\\n  State,\\n  MaritalStatus,\\n} from './personal-info-section.js';\\n\\nconst btnProps = {\\n  children: 'Submit Application',\\n  size: 'l',\\n};\\n\\nexport default {\\n  title: 'Components/Form',\\n  component: FormSubmitButton,\\n} as Meta;\\n\\nconst StyledButton = styled(FormSubmitButton)\`\\n  margin-top: \${({ theme }) => theme.space.xs};\\n\`;\\n\\ntype FormFields = {\\n  firstname: string;\\n  dob: string;\\n  state: string;\\n  marital_status: string;\\n};\\n\\nconst Template: Story<FormProps<FormFields>> = (args) => (\\n  <Grid p=\\"m\\">\\n    <Form {...args}>\\n      <FirstName />\\n      <DOB />\\n      <State />\\n      <MaritalStatus />\\n      <StyledButton {...btnProps} />\\n    </Form>\\n  </Grid>\\n);\\n\\nexport const FormValidationOnBlur = Template.bind({});\\nFormValidationOnBlur.args = {\\n  onSubmit: (data) => {\\n    \\n    console.log('form submitted with', data);\\n  },\\n  reactHookFormProps: { mode: 'onBlur' },\\n};\\n\\nexport const FormValidationOnSubmit = Template.bind({});\\nFormValidationOnSubmit.args = {\\n  onSubmit: (data) => {\\n    \\n    console.log('form submitted with', data);\\n  },\\n  reactHookFormProps: { mode: 'onSubmit' },\\n};\\n\\nexport const FormValidationOnChange = Template.bind({});\\nFormValidationOnChange.args = {\\n  onSubmit: (data) => {\\n    \\n    console.log('form submitted with', data);\\n  },\\n  reactHookFormProps: { mode: 'onChange' },\\n};\\n","locationsMap":{"form-validation-on-blur":{"startLoc":{"col":47,"line":35},"endLoc":{"col":1,"line":45},"startBody":{"col":47,"line":35},"endBody":{"col":1,"line":45}},"form-validation-on-submit":{"startLoc":{"col":47,"line":35},"endLoc":{"col":1,"line":45},"startBody":{"col":47,"line":35},"endBody":{"col":1,"line":45}},"form-validation-on-change":{"startLoc":{"col":47,"line":35},"endLoc":{"col":1,"line":45},"startBody":{"col":47,"line":35},"endBody":{"col":1,"line":45}}}},},
+  title: 'Components/Form',
+  component: FormSubmitButton,
+} as Meta;
+
+const StyledButton = styled(FormSubmitButton)\`
+  margin-top: \${({ theme }) => theme.space.xs};
+\`;
+
+type FormFields = {
+  firstname: string;
+  dob: string;
+  state: string;
+  marital_status: string;
+};
+
+const Template: Story<FormProps<FormFields>> = (args) => (
+  <Grid p="m">
+    <Form {...args}>
+      <FirstName />
+      <DOB />
+      <State />
+      <MaritalStatus />
+      <StyledButton {...btnProps} />
+    </Form>
+  </Grid>
+);
+
+export const FormValidationOnBlur = Template.bind({});;
+FormValidationOnBlur.args = {
+  onSubmit: (data) => {
+    
+    console.log('form submitted with', data);
+  },
+  reactHookFormProps: { mode: 'onBlur' },
+};
+
+export const FormValidationOnSubmit = Template.bind({});;
+FormValidationOnSubmit.args = {
+  onSubmit: (data) => {
+    
+    console.log('form submitted with', data);
+  },
+  reactHookFormProps: { mode: 'onSubmit' },
+};
+
+export const FormValidationOnChange = Template.bind({});
+FormValidationOnChange.args = {
+  onSubmit: (data) => {
+    
+    console.log('form submitted with', data);
+  },
+  reactHookFormProps: { mode: 'onChange' },
+};
+`,p={FormValidationOnBlur:{startLoc:{col:47,line:43},endLoc:{col:1,line:53},startBody:{col:47,line:43},endBody:{col:1,line:53}},FormValidationOnSubmit:{startLoc:{col:47,line:43},endLoc:{col:1,line:53},startBody:{col:47,line:43},endBody:{col:1,line:53}},FormValidationOnChange:{startLoc:{col:47,line:43},endLoc:{col:1,line:53},startBody:{col:47,line:43},endBody:{col:1,line:53}}},o=`import styled from 'styled-components';
+import { Story, Meta } from '@storybook/react';
+import { Grid } from '@elliemae/ds-grid';
+import { FormSubmitButton } from './submit-button/index.js';
+import { Form, FormProps } from './index.js';
+
+import {
+  FirstName,
+  DOB,
+  State,
+  MaritalStatus,
+} from './personal-info-section.js';
+
+const btnProps = {
+  children: 'Submit Application',
+  size: 'l',
+};
+
+export default {
+  title: 'Components/Form',
+  component: FormSubmitButton,
+} as Meta;
+
+const StyledButton = styled(FormSubmitButton)\`
+  margin-top: \${({ theme }) => theme.space.xs};
+\`;
+
+type FormFields = {
+  firstname: string;
+  dob: string;
+  state: string;
+  marital_status: string;
+};
+
+const Template: Story<FormProps<FormFields>> = (args) => (
+  <Grid p="m">
+    <Form {...args}>
+      <FirstName />
+      <DOB />
+      <State />
+      <MaritalStatus />
+      <StyledButton {...btnProps} />
+    </Form>
+  </Grid>
+);
+
+export const FormValidationOnBlur = Template.bind({});
+FormValidationOnBlur.args = {
+  onSubmit: (data) => {
+    
+    console.log('form submitted with', data);
+  },
+  reactHookFormProps: { mode: 'onBlur' },
+};
+
+export const FormValidationOnSubmit = Template.bind({});
+FormValidationOnSubmit.args = {
+  onSubmit: (data) => {
+    
+    console.log('form submitted with', data);
+  },
+  reactHookFormProps: { mode: 'onSubmit' },
+};
+
+export const FormValidationOnChange = Template.bind({});
+FormValidationOnChange.args = {
+  onSubmit: (data) => {
+    
+    console.log('form submitted with', data);
+  },
+  reactHookFormProps: { mode: 'onChange' },
+};
+`,p={FormValidationOnBlur:{startLoc:{col:47,line:35},endLoc:{col:1,line:45},startBody:{col:47,line:35},endBody:{col:1,line:45}},FormValidationOnSubmit:{startLoc:{col:47,line:35},endLoc:{col:1,line:45},startBody:{col:47,line:35},endBody:{col:1,line:45}},FormValidationOnChange:{startLoc:{col:47,line:35},endLoc:{col:1,line:45},startBody:{col:47,line:35},endBody:{col:1,line:45}}},B={children:"Submit Application",size:"l"};const S={parameters:{storySource:{source:`
+    
+    // @ts-nocheck
+    // @ts-ignore
+    var __STORY__ = "import styled from 'styled-components';\\nimport { Story, Meta } from '@storybook/react';\\nimport { Grid } from '@elliemae/ds-grid';\\nimport { FormSubmitButton } from './submit-button/index.js';\\nimport { Form, FormProps } from './index.js';\\n\\nimport {\\n  FirstName,\\n  DOB,\\n  State,\\n  MaritalStatus,\\n} from './personal-info-section.js';\\n\\nconst btnProps = {\\n  children: 'Submit Application',\\n  size: 'l',\\n};\\n\\nexport default {\\n  title: 'Components/Form',\\n  component: FormSubmitButton,\\n} as Meta;\\n\\nconst StyledButton = styled(FormSubmitButton)\`\\n  margin-top: \${({ theme }) => theme.space.xs};\\n\`;\\n\\ntype FormFields = {\\n  firstname: string;\\n  dob: string;\\n  state: string;\\n  marital_status: string;\\n};\\n\\nconst Template: Story<FormProps<FormFields>> = (args) => (\\n  <Grid p=\\"m\\">\\n    <Form {...args}>\\n      <FirstName />\\n      <DOB />\\n      <State />\\n      <MaritalStatus />\\n      <StyledButton {...btnProps} />\\n    </Form>\\n  </Grid>\\n);\\n\\nexport const FormValidationOnBlur = Template.bind({});\\nFormValidationOnBlur.args = {\\n  onSubmit: (data) => {\\n    \\n    console.log('form submitted with', data);\\n  },\\n  reactHookFormProps: { mode: 'onBlur' },\\n};\\n\\nexport const FormValidationOnSubmit = Template.bind({});\\nFormValidationOnSubmit.args = {\\n  onSubmit: (data) => {\\n    \\n    console.log('form submitted with', data);\\n  },\\n  reactHookFormProps: { mode: 'onSubmit' },\\n};\\n\\nexport const FormValidationOnChange = Template.bind({});\\nFormValidationOnChange.args = {\\n  onSubmit: (data) => {\\n    \\n    console.log('form submitted with', data);\\n  },\\n  reactHookFormProps: { mode: 'onChange' },\\n};\\n";
+    // @ts-ignore
+    var __LOCATIONS_MAP__ = {"FormValidationOnBlur":{"startLoc":{"col":47,"line":35},"endLoc":{"col":1,"line":45},"startBody":{"col":47,"line":35},"endBody":{"col":1,"line":45}},"FormValidationOnSubmit":{"startLoc":{"col":47,"line":35},"endLoc":{"col":1,"line":45},"startBody":{"col":47,"line":35},"endBody":{"col":1,"line":45}},"FormValidationOnChange":{"startLoc":{"col":47,"line":35},"endLoc":{"col":1,"line":45},"startBody":{"col":47,"line":35},"endBody":{"col":1,"line":45}}};
+    
+import styled from 'styled-components';
+import { Story, Meta } from '@storybook/react';
+import { Grid } from '@elliemae/ds-grid';
+import { FormSubmitButton } from './submit-button/index.js';
+import { Form, FormProps } from './index.js';
+
+import {
+  FirstName,
+  DOB,
+  State,
+  MaritalStatus,
+} from './personal-info-section.js';
+
+const btnProps = {
+  children: 'Submit Application',
+  size: 'l',
+};
+
+export default {parameters: {"storySource":{"source":"import styled from 'styled-components';\\nimport { Story, Meta } from '@storybook/react';\\nimport { Grid } from '@elliemae/ds-grid';\\nimport { FormSubmitButton } from './submit-button/index.js';\\nimport { Form, FormProps } from './index.js';\\n\\nimport {\\n  FirstName,\\n  DOB,\\n  State,\\n  MaritalStatus,\\n} from './personal-info-section.js';\\n\\nconst btnProps = {\\n  children: 'Submit Application',\\n  size: 'l',\\n};\\n\\nexport default {\\n  title: 'Components/Form',\\n  component: FormSubmitButton,\\n} as Meta;\\n\\nconst StyledButton = styled(FormSubmitButton)\`\\n  margin-top: \${({ theme }) => theme.space.xs};\\n\`;\\n\\ntype FormFields = {\\n  firstname: string;\\n  dob: string;\\n  state: string;\\n  marital_status: string;\\n};\\n\\nconst Template: Story<FormProps<FormFields>> = (args) => (\\n  <Grid p=\\"m\\">\\n    <Form {...args}>\\n      <FirstName />\\n      <DOB />\\n      <State />\\n      <MaritalStatus />\\n      <StyledButton {...btnProps} />\\n    </Form>\\n  </Grid>\\n);\\n\\nexport const FormValidationOnBlur = Template.bind({});\\nFormValidationOnBlur.args = {\\n  onSubmit: (data) => {\\n    \\n    console.log('form submitted with', data);\\n  },\\n  reactHookFormProps: { mode: 'onBlur' },\\n};\\n\\nexport const FormValidationOnSubmit = Template.bind({});\\nFormValidationOnSubmit.args = {\\n  onSubmit: (data) => {\\n    \\n    console.log('form submitted with', data);\\n  },\\n  reactHookFormProps: { mode: 'onSubmit' },\\n};\\n\\nexport const FormValidationOnChange = Template.bind({});\\nFormValidationOnChange.args = {\\n  onSubmit: (data) => {\\n    \\n    console.log('form submitted with', data);\\n  },\\n  reactHookFormProps: { mode: 'onChange' },\\n};\\n","locationsMap":{"form-validation-on-blur":{"startLoc":{"col":47,"line":35},"endLoc":{"col":1,"line":45},"startBody":{"col":47,"line":35},"endBody":{"col":1,"line":45}},"form-validation-on-submit":{"startLoc":{"col":47,"line":35},"endLoc":{"col":1,"line":45},"startBody":{"col":47,"line":35},"endBody":{"col":1,"line":45}},"form-validation-on-change":{"startLoc":{"col":47,"line":35},"endLoc":{"col":1,"line":45},"startBody":{"col":47,"line":35},"endBody":{"col":1,"line":45}}}},},
+  title: 'Components/Form',
+  component: FormSubmitButton,
+} as Meta;
+
+const StyledButton = styled(FormSubmitButton)\`
+  margin-top: \${({ theme }) => theme.space.xs};
+\`;
+
+type FormFields = {
+  firstname: string;
+  dob: string;
+  state: string;
+  marital_status: string;
+};
+
+const Template: Story<FormProps<FormFields>> = (args) => (
+  <Grid p="m">
+    <Form {...args}>
+      <FirstName />
+      <DOB />
+      <State />
+      <MaritalStatus />
+      <StyledButton {...btnProps} />
+    </Form>
+  </Grid>
+);
+
+export const FormValidationOnBlur = Template.bind({});;
+FormValidationOnBlur.args = {
+  onSubmit: (data) => {
+    
+    console.log('form submitted with', data);
+  },
+  reactHookFormProps: { mode: 'onBlur' },
+};
+
+export const FormValidationOnSubmit = Template.bind({});;
+FormValidationOnSubmit.args = {
+  onSubmit: (data) => {
+    
+    console.log('form submitted with', data);
+  },
+  reactHookFormProps: { mode: 'onSubmit' },
+};
+
+export const FormValidationOnChange = Template.bind({});
+FormValidationOnChange.args = {
+  onSubmit: (data) => {
+    
+    console.log('form submitted with', data);
+  },
+  reactHookFormProps: { mode: 'onChange' },
+};
+`,locationsMap:{"form-validation-on-blur":{startLoc:{col:47,line:43},endLoc:{col:1,line:53},startBody:{col:47,line:43},endBody:{col:1,line:53}},"form-validation-on-submit":{startLoc:{col:47,line:43},endLoc:{col:1,line:53},startBody:{col:47,line:43},endBody:{col:1,line:53}},"form-validation-on-change":{startLoc:{col:47,line:43},endLoc:{col:1,line:53},startBody:{col:47,line:43},endBody:{col:1,line:53}}}},storySource:{source:`import styled from 'styled-components';
+import { Story, Meta } from '@storybook/react';
+import { Grid } from '@elliemae/ds-grid';
+import { FormSubmitButton } from './submit-button/index.js';
+import { Form, FormProps } from './index.js';
+
+import {
+  FirstName,
+  DOB,
+  State,
+  MaritalStatus,
+} from './personal-info-section.js';
+
+const btnProps = {
+  children: 'Submit Application',
+  size: 'l',
+};
+
+export default {
+  title: 'Components/Form',
+  component: FormSubmitButton,
+} as Meta;
+
+const StyledButton = styled(FormSubmitButton)\`
+  margin-top: \${({ theme }) => theme.space.xs};
+\`;
+
+type FormFields = {
+  firstname: string;
+  dob: string;
+  state: string;
+  marital_status: string;
+};
+
+const Template: Story<FormProps<FormFields>> = (args) => (
+  <Grid p="m">
+    <Form {...args}>
+      <FirstName />
+      <DOB />
+      <State />
+      <MaritalStatus />
+      <StyledButton {...btnProps} />
+    </Form>
+  </Grid>
+);
+
+export const FormValidationOnBlur = Template.bind({});
+FormValidationOnBlur.args = {
+  onSubmit: (data) => {
+    
+    console.log('form submitted with', data);
+  },
+  reactHookFormProps: { mode: 'onBlur' },
+};
+
+export const FormValidationOnSubmit = Template.bind({});
+FormValidationOnSubmit.args = {
+  onSubmit: (data) => {
+    
+    console.log('form submitted with', data);
+  },
+  reactHookFormProps: { mode: 'onSubmit' },
+};
+
+export const FormValidationOnChange = Template.bind({});
+FormValidationOnChange.args = {
+  onSubmit: (data) => {
+    
+    console.log('form submitted with', data);
+  },
+  reactHookFormProps: { mode: 'onChange' },
+};
+`,locationsMap:{"form-validation-on-blur":{startLoc:{col:47,line:35},endLoc:{col:1,line:45},startBody:{col:47,line:35},endBody:{col:1,line:45}},"form-validation-on-submit":{startLoc:{col:47,line:35},endLoc:{col:1,line:45},startBody:{col:47,line:35},endBody:{col:1,line:45}},"form-validation-on-change":{startLoc:{col:47,line:35},endLoc:{col:1,line:45},startBody:{col:47,line:35},endBody:{col:1,line:45}}}}},title:"Components/Form",component:c.J};var h=(0,_.default)(c.J).withConfig({componentId:"sc-1wwguuk-0"})(["margin-top:",";"],function(F){var E=F.theme;return E.space.xs}),O=function(F){return e()(d.Ay,{p:"m"},void 0,(0,s.jsxs)(i.l,Object.assign({},F,{children:[a||(a=e()(l.MK,{})),m||(m=e()(l.ks,{})),r||(r=e()(l.Uw,{})),t||(t=e()(l.j9,{})),(0,s.jsx)(h,Object.assign({},B))]})))};O.displayName="Template";var g=O.bind({});g.args={onSubmit:function(F){},reactHookFormProps:{mode:"onBlur"}};var x=O.bind({});x.args={onSubmit:function(F){},reactHookFormProps:{mode:"onSubmit"}};var y=O.bind({});y.args={onSubmit:function(F){},reactHookFormProps:{mode:"onChange"}};var P=["FormValidationOnBlur","FormValidationOnSubmit","FormValidationOnChange"]},"./node_modules/.pnpm/@babel+runtime@7.29.2/node_modules/@babel/runtime/helpers/objectDestructuringEmpty.js"(f){function u(n){if(n==null)throw new TypeError("Cannot destructure "+n)}f.exports=u,f.exports.__esModule=!0,f.exports.default=f.exports}}]);

package/demo/docs/view-intro-stories-mdx.1e4b9514.iframe.bundle.js

@@ -0,0 +1,6 @@
+"use strict";(globalThis.webpackChunk_elliemae_pui_app_sdk=globalThis.webpackChunk_elliemae_pui_app_sdk||[]).push([[5711],{"./lib/view/intro.stories.mdx"(E,m,r){r.r(m),r.d(m,{__namedExportsOrder:()=>f,__page:()=>p,default:()=>b});var P=r("./node_modules/.pnpm/react@18.3.1/node_modules/react/index.js"),e=r("./node_modules/.pnpm/@mdx-js+react@1.6.22/node_modules/@mdx-js/react/dist/cjs.js"),d=r("./node_modules/.pnpm/@storybook+addon-docs@6.5.16_@babel+core@7.29.0_eslint@8.57.1_typescript@5.9.3_webpack-cli@5.1.4_webpack@5.105.4/node_modules/@storybook/addon-docs/dist/cjs/index.js"),h=r.n(d),_=["components"];function l(){return l=Object.assign?Object.assign.bind():function(t){for(var a=1;a<arguments.length;a++){var n=arguments[a];for(var o in n)({}).hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},l.apply(null,arguments)}function x(t,a){if(t==null)return{};var n,o,u=y(t,a);if(Object.getOwnPropertySymbols){var c=Object.getOwnPropertySymbols(t);for(o=0;o<c.length;o++)n=c[o],a.indexOf(n)===-1&&{}.propertyIsEnumerable.call(t,n)&&(u[n]=t[n])}return u}function y(t,a){if(t==null)return{};var n={};for(var o in t)if({}.hasOwnProperty.call(t,o)){if(a.indexOf(o)!==-1)continue;n[o]=t[o]}return n}var g={},v="wrapper";function i(t){var a=t.components,n=x(t,_);return(0,e.mdx)(v,l({},g,n,{components:a,mdxType:"MDXLayout"}),(0,e.mdx)(d.Meta,{title:"Intro",mdxType:"Meta"}),(0,e.mdx)("h1",{id:"get-started"},"Get Started"),(0,e.mdx)("p",null,"Software Development Kit / API for developing React Web applications. Implements cross cutting concerns as reusable APIs"),(0,e.mdx)("h2",{id:"install"},"Install"),(0,e.mdx)("p",null,(0,e.mdx)("inlineCode",{parentName:"p"},"npm install --save @elliemae/app-react-dependencies @elliemae/pui-user-monitoring @elliemae/pui-theme @elliemae/ds-basic @elliemae/ds-modal @elliemae/pui-app-sdk")),(0,e.mdx)("h3",{id:"use"},(0,e.mdx)("strong",{parentName:"h3"},"Use")),(0,e.mdx)("p",null,"Import react components you want into your UI"),(0,e.mdx)("p",null,(0,e.mdx)("inlineCode",{parentName:"p"},"import { WaitMessage } from \u2018@elliemae/pui-app-sdk\u2019;")),(0,e.mdx)("p",null,"and use them like so"),(0,e.mdx)("pre",null,(0,e.mdx)("code",{parentName:"pre"},`  const LoadingIndicator = () => (
+    <div>
+      <WaitMessage size='m' isOpen />
+    </div>
+  )
+`)))}i.displayName="MDXContent",i.isMDXComponent=!0;var p=function(){throw new Error("Docs-only story")};p.parameters={docsOnly:!0};var s={title:"Intro",includeStories:["__page"]},O={};s.parameters=s.parameters||{},s.parameters.docs=Object.assign({},s.parameters.docs||{},{page:function(){return(0,e.mdx)(d.AddContext,{mdxStoryNameToKey:O,mdxComponentAnnotations:s},(0,e.mdx)(i,null))}});const b=s;var f=["__page"]}}]);

package/demo/docs/view-live-message-index-stories.8971291c.iframe.bundle.js

@@ -0,0 +1,169 @@
+"use strict";(globalThis.webpackChunk_elliemae_pui_app_sdk=globalThis.webpackChunk_elliemae_pui_app_sdk||[]).push([[214],{"./lib/view/live-message/index.stories.tsx"(S,s,e){e.r(s),e.d(s,{Basic:()=>M,__namedExportsOrder:()=>h,default:()=>g});var u=e("./node_modules/.pnpm/@babel+runtime@7.29.2/node_modules/@babel/runtime/helpers/slicedToArray.js"),p=e.n(u),m=e("./node_modules/.pnpm/@babel+runtime@7.29.2/node_modules/@babel/runtime/helpers/jsx.js"),n=e.n(m),o=e("./node_modules/.pnpm/react@18.3.1/node_modules/react/index.js"),d=e("./node_modules/.pnpm/react-aria-live@2.0.5_react@18.3.1/node_modules/react-aria-live/lib/index.js"),v=e("./lib/data/useAppDispatch.ts"),L=e("./lib/data/live-message/index.ts"),a=e("./lib/view/live-message/index.tsx"),i,r,_=`
+    
+    // @ts-nocheck
+    // @ts-ignore
+    var __STORY__ = "import { Meta } from '@storybook/react';\\nimport React, { useState, useEffect } from 'react';\\nimport { LiveAnnouncer } from 'react-aria-live';\\nimport { useAppDispatch } from '../../data/react.js';\\nimport { actions } from '../../data/live-message/index.js';\\nimport { LiveMessage } from './index.js';\\n\\nexport default {\\n  title: 'A11y/LiveMessage',\\n  component: LiveMessage,\\n} as Meta;\\n\\nconst LiveMessageStory = () => {\\n  const dispatch = useAppDispatch();\\n  return (\\n    <LiveAnnouncer>\\n      <LiveMessage />\\n      <button\\n        type=\\"button\\"\\n        onClick={() =>\\n          dispatch(\\n            actions.announce({ message: 'Page changed', ariaLive: 'polite' }),\\n          )\\n        }\\n      >\\n        Announce\\n      </button>\\n    </LiveAnnouncer>\\n  );\\n};\\n\\nexport const Basic = () => {\\n  const [show, setShow] = useState(false);\\n  useEffect(() => {\\n    setShow(true);\\n  }, []);\\n  return show ? <LiveMessageStory /> : null;\\n};\\n";
+    // @ts-ignore
+    var __LOCATIONS_MAP__ = {"Basic":{"startLoc":{"col":21,"line":32},"endLoc":{"col":1,"line":38},"startBody":{"col":21,"line":32},"endBody":{"col":1,"line":38}}};
+    
+import { Meta } from '@storybook/react';
+import React, { useState, useEffect } from 'react';
+import { LiveAnnouncer } from 'react-aria-live';
+import { useAppDispatch } from '../../data/react.js';
+import { actions } from '../../data/live-message/index.js';
+import { LiveMessage } from './index.js';
+
+export default {parameters: {"storySource":{"source":"import { Meta } from '@storybook/react';\\nimport React, { useState, useEffect } from 'react';\\nimport { LiveAnnouncer } from 'react-aria-live';\\nimport { useAppDispatch } from '../../data/react.js';\\nimport { actions } from '../../data/live-message/index.js';\\nimport { LiveMessage } from './index.js';\\n\\nexport default {\\n  title: 'A11y/LiveMessage',\\n  component: LiveMessage,\\n} as Meta;\\n\\nconst LiveMessageStory = () => {\\n  const dispatch = useAppDispatch();\\n  return (\\n    <LiveAnnouncer>\\n      <LiveMessage />\\n      <button\\n        type=\\"button\\"\\n        onClick={() =>\\n          dispatch(\\n            actions.announce({ message: 'Page changed', ariaLive: 'polite' }),\\n          )\\n        }\\n      >\\n        Announce\\n      </button>\\n    </LiveAnnouncer>\\n  );\\n};\\n\\nexport const Basic = () => {\\n  const [show, setShow] = useState(false);\\n  useEffect(() => {\\n    setShow(true);\\n  }, []);\\n  return show ? <LiveMessageStory /> : null;\\n};\\n","locationsMap":{"basic":{"startLoc":{"col":21,"line":32},"endLoc":{"col":1,"line":38},"startBody":{"col":21,"line":32},"endBody":{"col":1,"line":38}}}},},
+  title: 'A11y/LiveMessage',
+  component: LiveMessage,
+} as Meta;
+
+const LiveMessageStory = () => {
+  const dispatch = useAppDispatch();
+  return (
+    <LiveAnnouncer>
+      <LiveMessage />
+      <button
+        type="button"
+        onClick={() =>
+          dispatch(
+            actions.announce({ message: 'Page changed', ariaLive: 'polite' }),
+          )
+        }
+      >
+        Announce
+      </button>
+    </LiveAnnouncer>
+  );
+};
+
+export const Basic = () => {
+  const [show, setShow] = useState(false);
+  useEffect(() => {
+    setShow(true);
+  }, []);
+  return show ? <LiveMessageStory /> : null;
+};
+`,f={Basic:{startLoc:{col:21,line:40},endLoc:{col:1,line:46},startBody:{col:21,line:40},endBody:{col:1,line:46}}},_=`import { Meta } from '@storybook/react';
+import React, { useState, useEffect } from 'react';
+import { LiveAnnouncer } from 'react-aria-live';
+import { useAppDispatch } from '../../data/react.js';
+import { actions } from '../../data/live-message/index.js';
+import { LiveMessage } from './index.js';
+
+export default {
+  title: 'A11y/LiveMessage',
+  component: LiveMessage,
+} as Meta;
+
+const LiveMessageStory = () => {
+  const dispatch = useAppDispatch();
+  return (
+    <LiveAnnouncer>
+      <LiveMessage />
+      <button
+        type="button"
+        onClick={() =>
+          dispatch(
+            actions.announce({ message: 'Page changed', ariaLive: 'polite' }),
+          )
+        }
+      >
+        Announce
+      </button>
+    </LiveAnnouncer>
+  );
+};
+
+export const Basic = () => {
+  const [show, setShow] = useState(false);
+  useEffect(() => {
+    setShow(true);
+  }, []);
+  return show ? <LiveMessageStory /> : null;
+};
+`,f={Basic:{startLoc:{col:21,line:32},endLoc:{col:1,line:38},startBody:{col:21,line:32},endBody:{col:1,line:38}}};const g={parameters:{storySource:{source:`
+    
+    // @ts-nocheck
+    // @ts-ignore
+    var __STORY__ = "import { Meta } from '@storybook/react';\\nimport React, { useState, useEffect } from 'react';\\nimport { LiveAnnouncer } from 'react-aria-live';\\nimport { useAppDispatch } from '../../data/react.js';\\nimport { actions } from '../../data/live-message/index.js';\\nimport { LiveMessage } from './index.js';\\n\\nexport default {\\n  title: 'A11y/LiveMessage',\\n  component: LiveMessage,\\n} as Meta;\\n\\nconst LiveMessageStory = () => {\\n  const dispatch = useAppDispatch();\\n  return (\\n    <LiveAnnouncer>\\n      <LiveMessage />\\n      <button\\n        type=\\"button\\"\\n        onClick={() =>\\n          dispatch(\\n            actions.announce({ message: 'Page changed', ariaLive: 'polite' }),\\n          )\\n        }\\n      >\\n        Announce\\n      </button>\\n    </LiveAnnouncer>\\n  );\\n};\\n\\nexport const Basic = () => {\\n  const [show, setShow] = useState(false);\\n  useEffect(() => {\\n    setShow(true);\\n  }, []);\\n  return show ? <LiveMessageStory /> : null;\\n};\\n";
+    // @ts-ignore
+    var __LOCATIONS_MAP__ = {"Basic":{"startLoc":{"col":21,"line":32},"endLoc":{"col":1,"line":38},"startBody":{"col":21,"line":32},"endBody":{"col":1,"line":38}}};
+    
+import { Meta } from '@storybook/react';
+import React, { useState, useEffect } from 'react';
+import { LiveAnnouncer } from 'react-aria-live';
+import { useAppDispatch } from '../../data/react.js';
+import { actions } from '../../data/live-message/index.js';
+import { LiveMessage } from './index.js';
+
+export default {parameters: {"storySource":{"source":"import { Meta } from '@storybook/react';\\nimport React, { useState, useEffect } from 'react';\\nimport { LiveAnnouncer } from 'react-aria-live';\\nimport { useAppDispatch } from '../../data/react.js';\\nimport { actions } from '../../data/live-message/index.js';\\nimport { LiveMessage } from './index.js';\\n\\nexport default {\\n  title: 'A11y/LiveMessage',\\n  component: LiveMessage,\\n} as Meta;\\n\\nconst LiveMessageStory = () => {\\n  const dispatch = useAppDispatch();\\n  return (\\n    <LiveAnnouncer>\\n      <LiveMessage />\\n      <button\\n        type=\\"button\\"\\n        onClick={() =>\\n          dispatch(\\n            actions.announce({ message: 'Page changed', ariaLive: 'polite' }),\\n          )\\n        }\\n      >\\n        Announce\\n      </button>\\n    </LiveAnnouncer>\\n  );\\n};\\n\\nexport const Basic = () => {\\n  const [show, setShow] = useState(false);\\n  useEffect(() => {\\n    setShow(true);\\n  }, []);\\n  return show ? <LiveMessageStory /> : null;\\n};\\n","locationsMap":{"basic":{"startLoc":{"col":21,"line":32},"endLoc":{"col":1,"line":38},"startBody":{"col":21,"line":32},"endBody":{"col":1,"line":38}}}},},
+  title: 'A11y/LiveMessage',
+  component: LiveMessage,
+} as Meta;
+
+const LiveMessageStory = () => {
+  const dispatch = useAppDispatch();
+  return (
+    <LiveAnnouncer>
+      <LiveMessage />
+      <button
+        type="button"
+        onClick={() =>
+          dispatch(
+            actions.announce({ message: 'Page changed', ariaLive: 'polite' }),
+          )
+        }
+      >
+        Announce
+      </button>
+    </LiveAnnouncer>
+  );
+};
+
+export const Basic = () => {
+  const [show, setShow] = useState(false);
+  useEffect(() => {
+    setShow(true);
+  }, []);
+  return show ? <LiveMessageStory /> : null;
+};
+`,locationsMap:{basic:{startLoc:{col:21,line:40},endLoc:{col:1,line:46},startBody:{col:21,line:40},endBody:{col:1,line:46}}}},storySource:{source:`import { Meta } from '@storybook/react';
+import React, { useState, useEffect } from 'react';
+import { LiveAnnouncer } from 'react-aria-live';
+import { useAppDispatch } from '../../data/react.js';
+import { actions } from '../../data/live-message/index.js';
+import { LiveMessage } from './index.js';
+
+export default {
+  title: 'A11y/LiveMessage',
+  component: LiveMessage,
+} as Meta;
+
+const LiveMessageStory = () => {
+  const dispatch = useAppDispatch();
+  return (
+    <LiveAnnouncer>
+      <LiveMessage />
+      <button
+        type="button"
+        onClick={() =>
+          dispatch(
+            actions.announce({ message: 'Page changed', ariaLive: 'polite' }),
+          )
+        }
+      >
+        Announce
+      </button>
+    </LiveAnnouncer>
+  );
+};
+
+export const Basic = () => {
+  const [show, setShow] = useState(false);
+  useEffect(() => {
+    setShow(true);
+  }, []);
+  return show ? <LiveMessageStory /> : null;
+};
+`,locationsMap:{basic:{startLoc:{col:21,line:32},endLoc:{col:1,line:38},startBody:{col:21,line:32},endBody:{col:1,line:38}}}}},title:"A11y/LiveMessage",component:a.I};var c=function(){var t=(0,v.j)();return n()(d.Ai,{},void 0,i||(i=n()(a.I,{})),n()("button",{type:"button",onClick:function(){return t(L.o.announce({message:"Page changed",ariaLive:"polite"}))}},void 0,"Announce"))};c.displayName="LiveMessageStory";var M=function(){var t=(0,o.useState)(!1),l=p()(t,2),A=l[0],y=l[1];return(0,o.useEffect)(function(){y(!0)},[]),A?r||(r=n()(c,{})):null},h=["Basic"]}}]);

package/demo/docs/view-modals-error-index-stories.ec19ae67.iframe.bundle.js

@@ -0,0 +1,93 @@
+"use strict";(globalThis.webpackChunk_elliemae_pui_app_sdk=globalThis.webpackChunk_elliemae_pui_app_sdk||[]).push([[5541],{"./lib/view/modals/error/index.stories.tsx"(P,t,e){e.r(t),e.d(t,{Basic:()=>l,CloseModal:()=>d,__namedExportsOrder:()=>C,default:()=>L});var p=e("./node_modules/.pnpm/@babel+runtime@7.29.2/node_modules/@babel/runtime/helpers/jsx.js"),o=e.n(p),y=e("./node_modules/.pnpm/@babel+runtime@7.29.2/node_modules/@babel/runtime/helpers/slicedToArray.js"),g=e.n(y),i=e("./node_modules/.pnpm/react@18.3.1/node_modules/react/index.js"),M=e("./node_modules/.pnpm/@elliemae+ds-dialog@3.57.10_@elliemae+pui-theme@2.13.0/node_modules/@elliemae/ds-dialog/dist/esm/DSDialog.js"),r=e("./node_modules/.pnpm/@elliemae+ds-dialog@3.57.10_@elliemae+pui-theme@2.13.0/node_modules/@elliemae/ds-dialog/dist/esm/styles.js"),u=e("./node_modules/.pnpm/@elliemae+ds-icons@3.57.10_@elliemae+pui-theme@2.13.0_lodash-es@4.18.1/node_modules/@elliemae/ds-icons/dist/esm/utils/createIcon.js"),B=(0,u.w)({paths:["M13 17c0 .6-.4 1-1 1s-1-.4-1-1 .4-1 1-1 1 .4 1 1zM11 6.5l.5 7.5h1l.5-7.5c0-.3-.2-.5-.5-.5h-.9c-.4 0-.6.2-.6.5zM15.7 3H8.3L3 8.3v7.5L8.3 21h7.5l5.3-5.3V8.3L15.7 3m.4-1L22 7.9v8.3L16.1 22H7.9L2 16.1V7.9L7.9 2h8.2z"],height:24,width:24}),s=function(n){var T=n.open,b=n.primaryMessage,c=n.secondaryMessage,v=(0,i.useState)(T),m=g()(v,2),S=m[0],j=m[1],h=(0,i.useCallback)(function(){j(function(O){return!O})},[]);return o()(M.O,{isOpen:S,onClickOutside:h,size:"small"},void 0,o()(r.uy,{p:"s"},void 0,o()(r.Dm,{},void 0,o()(B,{size:"xxl",color:["danger","900"]}),o()(r.TF,{},void 0,b),c&&o()(r.zR,{},void 0,c))))};s.displayName="Error";var x=e("./node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js"),E=`
+    
+    // @ts-nocheck
+    // @ts-ignore
+    var __STORY__ = "import { Story, Meta } from '@storybook/react';\\nimport { Error, ErrorProps } from './index.js';\\n\\nexport default {\\n  title: 'Modals/Error',\\n  component: Error,\\n} as Meta;\\n\\nconst Template: Story<ErrorProps> = (args) => <Error {...args} />;\\n\\nexport const Basic = Template.bind({});\\nBasic.args = {\\n  open: true,\\n  primaryMessage: 'Can not rename file',\\n  secondaryMessage: 'File name already exists',\\n};\\n\\nexport const CloseModal = Template.bind({});\\nCloseModal.args = { ...Basic.args, open: false };\\n";
+    // @ts-ignore
+    var __LOCATIONS_MAP__ = {"Basic":{"startLoc":{"col":36,"line":9},"endLoc":{"col":65,"line":9},"startBody":{"col":36,"line":9},"endBody":{"col":65,"line":9}},"CloseModal":{"startLoc":{"col":36,"line":9},"endLoc":{"col":65,"line":9},"startBody":{"col":36,"line":9},"endBody":{"col":65,"line":9}}};
+    
+import { Story, Meta } from '@storybook/react';
+import { Error, ErrorProps } from './index.js';
+
+export default {parameters: {"storySource":{"source":"import { Story, Meta } from '@storybook/react';\\nimport { Error, ErrorProps } from './index.js';\\n\\nexport default {\\n  title: 'Modals/Error',\\n  component: Error,\\n} as Meta;\\n\\nconst Template: Story<ErrorProps> = (args) => <Error {...args} />;\\n\\nexport const Basic = Template.bind({});\\nBasic.args = {\\n  open: true,\\n  primaryMessage: 'Can not rename file',\\n  secondaryMessage: 'File name already exists',\\n};\\n\\nexport const CloseModal = Template.bind({});\\nCloseModal.args = { ...Basic.args, open: false };\\n","locationsMap":{"basic":{"startLoc":{"col":36,"line":9},"endLoc":{"col":65,"line":9},"startBody":{"col":36,"line":9},"endBody":{"col":65,"line":9}},"close-modal":{"startLoc":{"col":36,"line":9},"endLoc":{"col":65,"line":9},"startBody":{"col":36,"line":9},"endBody":{"col":65,"line":9}}}},},
+  title: 'Modals/Error',
+  component: Error,
+} as Meta;
+
+const Template: Story<ErrorProps> = (args) => <Error {...args} />;
+
+export const Basic = Template.bind({});;
+Basic.args = {
+  open: true,
+  primaryMessage: 'Can not rename file',
+  secondaryMessage: 'File name already exists',
+};
+
+export const CloseModal = Template.bind({});
+CloseModal.args = { ...Basic.args, open: false };
+`,f={Basic:{startLoc:{col:36,line:17},endLoc:{col:65,line:17},startBody:{col:36,line:17},endBody:{col:65,line:17}},CloseModal:{startLoc:{col:36,line:17},endLoc:{col:65,line:17},startBody:{col:36,line:17},endBody:{col:65,line:17}}},E=`import { Story, Meta } from '@storybook/react';
+import { Error, ErrorProps } from './index.js';
+
+export default {
+  title: 'Modals/Error',
+  component: Error,
+} as Meta;
+
+const Template: Story<ErrorProps> = (args) => <Error {...args} />;
+
+export const Basic = Template.bind({});
+Basic.args = {
+  open: true,
+  primaryMessage: 'Can not rename file',
+  secondaryMessage: 'File name already exists',
+};
+
+export const CloseModal = Template.bind({});
+CloseModal.args = { ...Basic.args, open: false };
+`,f={Basic:{startLoc:{col:36,line:9},endLoc:{col:65,line:9},startBody:{col:36,line:9},endBody:{col:65,line:9}},CloseModal:{startLoc:{col:36,line:9},endLoc:{col:65,line:9},startBody:{col:36,line:9},endBody:{col:65,line:9}}};const L={parameters:{storySource:{source:`
+    
+    // @ts-nocheck
+    // @ts-ignore
+    var __STORY__ = "import { Story, Meta } from '@storybook/react';\\nimport { Error, ErrorProps } from './index.js';\\n\\nexport default {\\n  title: 'Modals/Error',\\n  component: Error,\\n} as Meta;\\n\\nconst Template: Story<ErrorProps> = (args) => <Error {...args} />;\\n\\nexport const Basic = Template.bind({});\\nBasic.args = {\\n  open: true,\\n  primaryMessage: 'Can not rename file',\\n  secondaryMessage: 'File name already exists',\\n};\\n\\nexport const CloseModal = Template.bind({});\\nCloseModal.args = { ...Basic.args, open: false };\\n";
+    // @ts-ignore
+    var __LOCATIONS_MAP__ = {"Basic":{"startLoc":{"col":36,"line":9},"endLoc":{"col":65,"line":9},"startBody":{"col":36,"line":9},"endBody":{"col":65,"line":9}},"CloseModal":{"startLoc":{"col":36,"line":9},"endLoc":{"col":65,"line":9},"startBody":{"col":36,"line":9},"endBody":{"col":65,"line":9}}};
+    
+import { Story, Meta } from '@storybook/react';
+import { Error, ErrorProps } from './index.js';
+
+export default {parameters: {"storySource":{"source":"import { Story, Meta } from '@storybook/react';\\nimport { Error, ErrorProps } from './index.js';\\n\\nexport default {\\n  title: 'Modals/Error',\\n  component: Error,\\n} as Meta;\\n\\nconst Template: Story<ErrorProps> = (args) => <Error {...args} />;\\n\\nexport const Basic = Template.bind({});\\nBasic.args = {\\n  open: true,\\n  primaryMessage: 'Can not rename file',\\n  secondaryMessage: 'File name already exists',\\n};\\n\\nexport const CloseModal = Template.bind({});\\nCloseModal.args = { ...Basic.args, open: false };\\n","locationsMap":{"basic":{"startLoc":{"col":36,"line":9},"endLoc":{"col":65,"line":9},"startBody":{"col":36,"line":9},"endBody":{"col":65,"line":9}},"close-modal":{"startLoc":{"col":36,"line":9},"endLoc":{"col":65,"line":9},"startBody":{"col":36,"line":9},"endBody":{"col":65,"line":9}}}},},
+  title: 'Modals/Error',
+  component: Error,
+} as Meta;
+
+const Template: Story<ErrorProps> = (args) => <Error {...args} />;
+
+export const Basic = Template.bind({});;
+Basic.args = {
+  open: true,
+  primaryMessage: 'Can not rename file',
+  secondaryMessage: 'File name already exists',
+};
+
+export const CloseModal = Template.bind({});
+CloseModal.args = { ...Basic.args, open: false };
+`,locationsMap:{basic:{startLoc:{col:36,line:17},endLoc:{col:65,line:17},startBody:{col:36,line:17},endBody:{col:65,line:17}},"close-modal":{startLoc:{col:36,line:17},endLoc:{col:65,line:17},startBody:{col:36,line:17},endBody:{col:65,line:17}}}},storySource:{source:`import { Story, Meta } from '@storybook/react';
+import { Error, ErrorProps } from './index.js';
+
+export default {
+  title: 'Modals/Error',
+  component: Error,
+} as Meta;
+
+const Template: Story<ErrorProps> = (args) => <Error {...args} />;
+
+export const Basic = Template.bind({});
+Basic.args = {
+  open: true,
+  primaryMessage: 'Can not rename file',
+  secondaryMessage: 'File name already exists',
+};
+
+export const CloseModal = Template.bind({});
+CloseModal.args = { ...Basic.args, open: false };
+`,locationsMap:{basic:{startLoc:{col:36,line:9},endLoc:{col:65,line:9},startBody:{col:36,line:9},endBody:{col:65,line:9}},"close-modal":{startLoc:{col:36,line:9},endLoc:{col:65,line:9},startBody:{col:36,line:9},endBody:{col:65,line:9}}}}},title:"Modals/Error",component:s};var a=function(n){return(0,x.jsx)(s,Object.assign({},n))};a.displayName="Template";var l=a.bind({});l.args={open:!0,primaryMessage:"Can not rename file",secondaryMessage:"File name already exists"};var d=a.bind({});d.args=Object.assign({},l.args,{open:!1});var C=["Basic","CloseModal"]}}]);