@elliemae/pui-app-sdk 5.31.0 → 5.31.4

package/demo/docs/view-fields-check-box-set-value-stories.174d03c4.iframe.bundle.js

@@ -0,0 +1,237 @@
+"use strict";(globalThis.webpackChunk_elliemae_pui_app_sdk=globalThis.webpackChunk_elliemae_pui_app_sdk||[]).push([[5410],{"./lib/view/fields/check-box/index.tsx":(y,t,e)=>{e.d(t,{o:()=>u});var m=e("./node_modules/.pnpm/@babel+runtime@7.28.4/node_modules/@babel/runtime/helpers/jsx.js"),l=e.n(m),s=e("./node_modules/.pnpm/@babel+runtime@7.28.4/node_modules/@babel/runtime/helpers/objectWithoutProperties.js"),n=e.n(s),a=e("./node_modules/.pnpm/@elliemae+ds-form-checkbox@3.56.4_@elliemae+pui-theme@2.13.0/node_modules/@elliemae/ds-form-checkbox/dist/esm/index.js"),o=e("./node_modules/.pnpm/react-hook-form@7.63.0_react@18.3.1/node_modules/react-hook-form/dist/index.esm.mjs"),f=e("./node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js"),d=["name","defaultValue","rules"],i=["value"],u=function(r){var p=r.name,c=r.defaultValue,_=r.rules,B=_===void 0?{}:_,E=n()(r,d);return l()(o.xI,{name:p,rules:B,defaultValue:c,render:function(h){var x=h.field,C=x.value,S=n()(x,i);return(0,f.jsx)(a.$W,Object.assign({},E,S,{checked:Boolean(C)}))}})};u.displayName="CheckBox"},"./lib/view/fields/check-box/set-value.stories.tsx":(y,t,e)=>{e.r(t),e.d(t,{SetValue:()=>k,__namedExportsOrder:()=>V,default:()=>D});var m=e("./node_modules/.pnpm/@babel+runtime@7.28.4/node_modules/@babel/runtime/helpers/objectWithoutProperties.js"),l=e.n(m),s=e("./node_modules/.pnpm/@babel+runtime@7.28.4/node_modules/@babel/runtime/helpers/jsx.js"),n=e.n(s),a=e("./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.esm.js"),o=e("./node_modules/.pnpm/react-hook-form@7.63.0_react@18.3.1/node_modules/react-hook-form/dist/index.esm.mjs"),f=e("./node_modules/.pnpm/@elliemae+ds-grid@3.56.4_@elliemae+pui-theme@2.13.0/node_modules/@elliemae/ds-grid/dist/esm/Grid.js"),d=e("./node_modules/.pnpm/@elliemae+ds-legacy-button-v2@1.0.16_@elliemae+pui-theme@2.13.0/node_modules/@elliemae/ds-legacy-button-v2/dist/esm/DSButtonV2.js"),i=e("./lib/view/form/index.tsx"),u=e("./lib/view/fields/check-box/index.tsx"),r=e("./lib/view/fields/connect-form.tsx"),p=e("./node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js"),c,_=["name"],B=`
+    
+    // @ts-nocheck
+    // @ts-ignore
+    var __STORY__ = "import styled from 'styled-components';\\nimport { Story, Meta } from '@storybook/react';\\nimport { useFormContext, get, FieldError } from 'react-hook-form';\\nimport { Grid } from '@elliemae/ds-grid';\\nimport { DSButtonV2 } from '@elliemae/ds-button';\\nimport { Form } from '../../form/index.js';\\nimport { CheckBox, CheckBoxProps } from './index.js';\\nimport { ConnectForm } from '../connect-form.js';\\n\\nconst cbName = 'acknowledge';\\nconst StyledDSButton = styled(DSButtonV2)\`\\n  margin-top: 10px;\\n\`;\\n\\nconst ToggleValue = () => {\\n  const { setValue, watch } = useFormContext();\\n  const currentValue = watch(cbName) as boolean;\\n  return (\\n    <StyledDSButton\\n      onClick={() => setValue(cbName, !currentValue, { shouldDirty: true })}\\n    >\\n      Toggle\\n    </StyledDSButton>\\n  );\\n};\\n\\nconst Template: Story<CheckBoxProps> = ({ name, ...rest }) => (\\n  <Grid p=\\"m\\">\\n    <Form>\\n      <div>\\n        <ConnectForm>\\n          {({ formState: { errors } }) => {\\n            const errField = get(errors, name) as FieldError;\\n            const hasError = !!errField;\\n            return <CheckBox name={name} {...rest} hasError={hasError} />;\\n          }}\\n        </ConnectForm>\\n      </div>\\n      <ToggleValue />\\n    </Form>\\n  </Grid>\\n);\\n\\nexport default {\\n  title: 'Components/Form/Controls/CheckBox',\\n} as Meta;\\n\\nexport const SetValue = Template.bind({});\\n\\nSetValue.args = {\\n  id: cbName,\\n  name: cbName,\\n  label: 'Acknowledge Electronic delivery of documents',\\n  rules: { required: { value: true, message: 'Please acknowledge' } },\\n};\\n";
+    // @ts-ignore
+    var __LOCATIONS_MAP__ = {"SetValue":{"startLoc":{"col":39,"line":27},"endLoc":{"col":1,"line":42},"startBody":{"col":39,"line":27},"endBody":{"col":1,"line":42}}};
+    
+import styled from 'styled-components';
+import { Story, Meta } from '@storybook/react';
+import { useFormContext, get, FieldError } from 'react-hook-form';
+import { Grid } from '@elliemae/ds-grid';
+import { DSButtonV2 } from '@elliemae/ds-button';
+import { Form } from '../../form/index.js';
+import { CheckBox, CheckBoxProps } from './index.js';
+import { ConnectForm } from '../connect-form.js';
+
+const cbName = 'acknowledge';
+const StyledDSButton = styled(DSButtonV2)\`
+  margin-top: 10px;
+\`;
+
+const ToggleValue = () => {
+  const { setValue, watch } = useFormContext();
+  const currentValue = watch(cbName) as boolean;
+  return (
+    <StyledDSButton
+      onClick={() => setValue(cbName, !currentValue, { shouldDirty: true })}
+    >
+      Toggle
+    </StyledDSButton>
+  );
+};
+
+const Template: Story<CheckBoxProps> = ({ name, ...rest }) => (
+  <Grid p="m">
+    <Form>
+      <div>
+        <ConnectForm>
+          {({ formState: { errors } }) => {
+            const errField = get(errors, name) as FieldError;
+            const hasError = !!errField;
+            return <CheckBox name={name} {...rest} hasError={hasError} />;
+          }}
+        </ConnectForm>
+      </div>
+      <ToggleValue />
+    </Form>
+  </Grid>
+);
+
+export default {parameters: {"storySource":{"source":"import styled from 'styled-components';\\nimport { Story, Meta } from '@storybook/react';\\nimport { useFormContext, get, FieldError } from 'react-hook-form';\\nimport { Grid } from '@elliemae/ds-grid';\\nimport { DSButtonV2 } from '@elliemae/ds-button';\\nimport { Form } from '../../form/index.js';\\nimport { CheckBox, CheckBoxProps } from './index.js';\\nimport { ConnectForm } from '../connect-form.js';\\n\\nconst cbName = 'acknowledge';\\nconst StyledDSButton = styled(DSButtonV2)\`\\n  margin-top: 10px;\\n\`;\\n\\nconst ToggleValue = () => {\\n  const { setValue, watch } = useFormContext();\\n  const currentValue = watch(cbName) as boolean;\\n  return (\\n    <StyledDSButton\\n      onClick={() => setValue(cbName, !currentValue, { shouldDirty: true })}\\n    >\\n      Toggle\\n    </StyledDSButton>\\n  );\\n};\\n\\nconst Template: Story<CheckBoxProps> = ({ name, ...rest }) => (\\n  <Grid p=\\"m\\">\\n    <Form>\\n      <div>\\n        <ConnectForm>\\n          {({ formState: { errors } }) => {\\n            const errField = get(errors, name) as FieldError;\\n            const hasError = !!errField;\\n            return <CheckBox name={name} {...rest} hasError={hasError} />;\\n          }}\\n        </ConnectForm>\\n      </div>\\n      <ToggleValue />\\n    </Form>\\n  </Grid>\\n);\\n\\nexport default {\\n  title: 'Components/Form/Controls/CheckBox',\\n} as Meta;\\n\\nexport const SetValue = Template.bind({});\\n\\nSetValue.args = {\\n  id: cbName,\\n  name: cbName,\\n  label: 'Acknowledge Electronic delivery of documents',\\n  rules: { required: { value: true, message: 'Please acknowledge' } },\\n};\\n","locationsMap":{"set-value":{"startLoc":{"col":39,"line":27},"endLoc":{"col":1,"line":42},"startBody":{"col":39,"line":27},"endBody":{"col":1,"line":42}}}},},
+  title: 'Components/Form/Controls/CheckBox',
+} as Meta;
+
+export const SetValue = Template.bind({});
+
+SetValue.args = {
+  id: cbName,
+  name: cbName,
+  label: 'Acknowledge Electronic delivery of documents',
+  rules: { required: { value: true, message: 'Please acknowledge' } },
+};
+`,E={SetValue:{startLoc:{col:39,line:35},endLoc:{col:1,line:50},startBody:{col:39,line:35},endBody:{col:1,line:50}}},B=`import styled from 'styled-components';
+import { Story, Meta } from '@storybook/react';
+import { useFormContext, get, FieldError } from 'react-hook-form';
+import { Grid } from '@elliemae/ds-grid';
+import { DSButtonV2 } from '@elliemae/ds-button';
+import { Form } from '../../form/index.js';
+import { CheckBox, CheckBoxProps } from './index.js';
+import { ConnectForm } from '../connect-form.js';
+
+const cbName = 'acknowledge';
+const StyledDSButton = styled(DSButtonV2)\`
+  margin-top: 10px;
+\`;
+
+const ToggleValue = () => {
+  const { setValue, watch } = useFormContext();
+  const currentValue = watch(cbName) as boolean;
+  return (
+    <StyledDSButton
+      onClick={() => setValue(cbName, !currentValue, { shouldDirty: true })}
+    >
+      Toggle
+    </StyledDSButton>
+  );
+};
+
+const Template: Story<CheckBoxProps> = ({ name, ...rest }) => (
+  <Grid p="m">
+    <Form>
+      <div>
+        <ConnectForm>
+          {({ formState: { errors } }) => {
+            const errField = get(errors, name) as FieldError;
+            const hasError = !!errField;
+            return <CheckBox name={name} {...rest} hasError={hasError} />;
+          }}
+        </ConnectForm>
+      </div>
+      <ToggleValue />
+    </Form>
+  </Grid>
+);
+
+export default {
+  title: 'Components/Form/Controls/CheckBox',
+} as Meta;
+
+export const SetValue = Template.bind({});
+
+SetValue.args = {
+  id: cbName,
+  name: cbName,
+  label: 'Acknowledge Electronic delivery of documents',
+  rules: { required: { value: true, message: 'Please acknowledge' } },
+};
+`,E={SetValue:{startLoc:{col:39,line:27},endLoc:{col:1,line:42},startBody:{col:39,line:27},endBody:{col:1,line:42}}},h="acknowledge",x=(0,a.Ay)(d.e).withConfig({componentId:"sc-1lqqv9c-0"})(["margin-top:10px;"]),C=function(){var g=(0,o.xW)(),b=g.setValue,v=g.watch,F=v(h);return n()(x,{onClick:function(){return b(h,!F,{shouldDirty:!0})}},void 0,"Toggle")};C.displayName="ToggleValue";var S=function(g){var b=g.name,v=l()(g,_);return n()(f.Ay,{p:"m"},void 0,n()(i.l,{},void 0,n()("div",{},void 0,n()(r.$,{},void 0,function(F){var P=F.formState.errors,T=(0,o.Jt)(P,b),j=!!T;return(0,p.jsx)(u.o,Object.assign({name:b},v,{hasError:j}))})),c||(c=n()(C,{}))))};S.displayName="Template";const D={parameters:{storySource:{source:`
+    
+    // @ts-nocheck
+    // @ts-ignore
+    var __STORY__ = "import styled from 'styled-components';\\nimport { Story, Meta } from '@storybook/react';\\nimport { useFormContext, get, FieldError } from 'react-hook-form';\\nimport { Grid } from '@elliemae/ds-grid';\\nimport { DSButtonV2 } from '@elliemae/ds-button';\\nimport { Form } from '../../form/index.js';\\nimport { CheckBox, CheckBoxProps } from './index.js';\\nimport { ConnectForm } from '../connect-form.js';\\n\\nconst cbName = 'acknowledge';\\nconst StyledDSButton = styled(DSButtonV2)\`\\n  margin-top: 10px;\\n\`;\\n\\nconst ToggleValue = () => {\\n  const { setValue, watch } = useFormContext();\\n  const currentValue = watch(cbName) as boolean;\\n  return (\\n    <StyledDSButton\\n      onClick={() => setValue(cbName, !currentValue, { shouldDirty: true })}\\n    >\\n      Toggle\\n    </StyledDSButton>\\n  );\\n};\\n\\nconst Template: Story<CheckBoxProps> = ({ name, ...rest }) => (\\n  <Grid p=\\"m\\">\\n    <Form>\\n      <div>\\n        <ConnectForm>\\n          {({ formState: { errors } }) => {\\n            const errField = get(errors, name) as FieldError;\\n            const hasError = !!errField;\\n            return <CheckBox name={name} {...rest} hasError={hasError} />;\\n          }}\\n        </ConnectForm>\\n      </div>\\n      <ToggleValue />\\n    </Form>\\n  </Grid>\\n);\\n\\nexport default {\\n  title: 'Components/Form/Controls/CheckBox',\\n} as Meta;\\n\\nexport const SetValue = Template.bind({});\\n\\nSetValue.args = {\\n  id: cbName,\\n  name: cbName,\\n  label: 'Acknowledge Electronic delivery of documents',\\n  rules: { required: { value: true, message: 'Please acknowledge' } },\\n};\\n";
+    // @ts-ignore
+    var __LOCATIONS_MAP__ = {"SetValue":{"startLoc":{"col":39,"line":27},"endLoc":{"col":1,"line":42},"startBody":{"col":39,"line":27},"endBody":{"col":1,"line":42}}};
+    
+import styled from 'styled-components';
+import { Story, Meta } from '@storybook/react';
+import { useFormContext, get, FieldError } from 'react-hook-form';
+import { Grid } from '@elliemae/ds-grid';
+import { DSButtonV2 } from '@elliemae/ds-button';
+import { Form } from '../../form/index.js';
+import { CheckBox, CheckBoxProps } from './index.js';
+import { ConnectForm } from '../connect-form.js';
+
+const cbName = 'acknowledge';
+const StyledDSButton = styled(DSButtonV2)\`
+  margin-top: 10px;
+\`;
+
+const ToggleValue = () => {
+  const { setValue, watch } = useFormContext();
+  const currentValue = watch(cbName) as boolean;
+  return (
+    <StyledDSButton
+      onClick={() => setValue(cbName, !currentValue, { shouldDirty: true })}
+    >
+      Toggle
+    </StyledDSButton>
+  );
+};
+
+const Template: Story<CheckBoxProps> = ({ name, ...rest }) => (
+  <Grid p="m">
+    <Form>
+      <div>
+        <ConnectForm>
+          {({ formState: { errors } }) => {
+            const errField = get(errors, name) as FieldError;
+            const hasError = !!errField;
+            return <CheckBox name={name} {...rest} hasError={hasError} />;
+          }}
+        </ConnectForm>
+      </div>
+      <ToggleValue />
+    </Form>
+  </Grid>
+);
+
+export default {parameters: {"storySource":{"source":"import styled from 'styled-components';\\nimport { Story, Meta } from '@storybook/react';\\nimport { useFormContext, get, FieldError } from 'react-hook-form';\\nimport { Grid } from '@elliemae/ds-grid';\\nimport { DSButtonV2 } from '@elliemae/ds-button';\\nimport { Form } from '../../form/index.js';\\nimport { CheckBox, CheckBoxProps } from './index.js';\\nimport { ConnectForm } from '../connect-form.js';\\n\\nconst cbName = 'acknowledge';\\nconst StyledDSButton = styled(DSButtonV2)\`\\n  margin-top: 10px;\\n\`;\\n\\nconst ToggleValue = () => {\\n  const { setValue, watch } = useFormContext();\\n  const currentValue = watch(cbName) as boolean;\\n  return (\\n    <StyledDSButton\\n      onClick={() => setValue(cbName, !currentValue, { shouldDirty: true })}\\n    >\\n      Toggle\\n    </StyledDSButton>\\n  );\\n};\\n\\nconst Template: Story<CheckBoxProps> = ({ name, ...rest }) => (\\n  <Grid p=\\"m\\">\\n    <Form>\\n      <div>\\n        <ConnectForm>\\n          {({ formState: { errors } }) => {\\n            const errField = get(errors, name) as FieldError;\\n            const hasError = !!errField;\\n            return <CheckBox name={name} {...rest} hasError={hasError} />;\\n          }}\\n        </ConnectForm>\\n      </div>\\n      <ToggleValue />\\n    </Form>\\n  </Grid>\\n);\\n\\nexport default {\\n  title: 'Components/Form/Controls/CheckBox',\\n} as Meta;\\n\\nexport const SetValue = Template.bind({});\\n\\nSetValue.args = {\\n  id: cbName,\\n  name: cbName,\\n  label: 'Acknowledge Electronic delivery of documents',\\n  rules: { required: { value: true, message: 'Please acknowledge' } },\\n};\\n","locationsMap":{"set-value":{"startLoc":{"col":39,"line":27},"endLoc":{"col":1,"line":42},"startBody":{"col":39,"line":27},"endBody":{"col":1,"line":42}}}},},
+  title: 'Components/Form/Controls/CheckBox',
+} as Meta;
+
+export const SetValue = Template.bind({});
+
+SetValue.args = {
+  id: cbName,
+  name: cbName,
+  label: 'Acknowledge Electronic delivery of documents',
+  rules: { required: { value: true, message: 'Please acknowledge' } },
+};
+`,locationsMap:{"set-value":{startLoc:{col:39,line:35},endLoc:{col:1,line:50},startBody:{col:39,line:35},endBody:{col:1,line:50}}}},storySource:{source:`import styled from 'styled-components';
+import { Story, Meta } from '@storybook/react';
+import { useFormContext, get, FieldError } from 'react-hook-form';
+import { Grid } from '@elliemae/ds-grid';
+import { DSButtonV2 } from '@elliemae/ds-button';
+import { Form } from '../../form/index.js';
+import { CheckBox, CheckBoxProps } from './index.js';
+import { ConnectForm } from '../connect-form.js';
+
+const cbName = 'acknowledge';
+const StyledDSButton = styled(DSButtonV2)\`
+  margin-top: 10px;
+\`;
+
+const ToggleValue = () => {
+  const { setValue, watch } = useFormContext();
+  const currentValue = watch(cbName) as boolean;
+  return (
+    <StyledDSButton
+      onClick={() => setValue(cbName, !currentValue, { shouldDirty: true })}
+    >
+      Toggle
+    </StyledDSButton>
+  );
+};
+
+const Template: Story<CheckBoxProps> = ({ name, ...rest }) => (
+  <Grid p="m">
+    <Form>
+      <div>
+        <ConnectForm>
+          {({ formState: { errors } }) => {
+            const errField = get(errors, name) as FieldError;
+            const hasError = !!errField;
+            return <CheckBox name={name} {...rest} hasError={hasError} />;
+          }}
+        </ConnectForm>
+      </div>
+      <ToggleValue />
+    </Form>
+  </Grid>
+);
+
+export default {
+  title: 'Components/Form/Controls/CheckBox',
+} as Meta;
+
+export const SetValue = Template.bind({});
+
+SetValue.args = {
+  id: cbName,
+  name: cbName,
+  label: 'Acknowledge Electronic delivery of documents',
+  rules: { required: { value: true, message: 'Please acknowledge' } },
+};
+`,locationsMap:{"set-value":{startLoc:{col:39,line:27},endLoc:{col:1,line:42},startBody:{col:39,line:27},endBody:{col:1,line:42}}}}},title:"Components/Form/Controls/CheckBox"};var k=S.bind({});k.args={id:h,name:h,label:"Acknowledge Electronic delivery of documents",rules:{required:{value:!0,message:"Please acknowledge"}}};var V=["SetValue"]},"./lib/view/fields/connect-form.tsx":(y,t,e)=>{e.d(t,{$:()=>l});var m=e("./node_modules/.pnpm/react-hook-form@7.63.0_react@18.3.1/node_modules/react-hook-form/dist/index.esm.mjs"),l=function(s){var n=s.children,a=(0,m.xW)();return n(Object.assign({},a))}},"./lib/view/form/index.tsx":(y,t,e)=>{e.d(t,{l:()=>a});var m=e("./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.esm.js"),l=e("./node_modules/.pnpm/react-hook-form@7.63.0_react@18.3.1/node_modules/react-hook-form/dist/index.esm.mjs"),s=e("./node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js"),n=m.Ay.form.withConfig({componentId:"sc-1pyjvv3-0"})(["width:100%;"]),a=function(o){var f=o.classname,d=o.reactHookFormProps,i=d===void 0?{mode:"onBlur"}:d,u=o.children,r=o.onSubmit,p=(0,l.mN)(i),c={};r&&(c.onSubmit=p.handleSubmit(r));var _=Object.assign(p,{formProps:i});return(0,s.jsx)(l.Op,Object.assign({},_,{children:(0,s.jsx)(n,Object.assign({className:f},c,{children:u}))}))};a.displayName="Form"}}]);

package/demo/docs/view-fields-combo-box-index-stories.d12d33ea.iframe.bundle.js

@@ -0,0 +1,209 @@
+"use strict";(globalThis.webpackChunk_elliemae_pui_app_sdk=globalThis.webpackChunk_elliemae_pui_app_sdk||[]).push([[6184],{"./lib/view/fields/combo-box/index.stories.tsx":(x,i,e)=>{e.r(i),e.d(i,{Basic:()=>y,__namedExportsOrder:()=>I,default:()=>P});var B=e("./node_modules/.pnpm/@babel+runtime@7.28.4/node_modules/@babel/runtime/helpers/jsx.js"),o=e.n(B),s=e("./node_modules/.pnpm/@elliemae+ds-grid@3.56.4_@elliemae+pui-theme@2.13.0/node_modules/@elliemae/ds-grid/dist/esm/Grid.js"),d=e("./node_modules/.pnpm/@elliemae+ds-legacy-button-v2@1.0.16_@elliemae+pui-theme@2.13.0/node_modules/@elliemae/ds-legacy-button-v2/dist/esm/DSButtonV2.js"),u=e("./lib/view/form/index.tsx"),a=e("./lib/view/fields/form-layout-block-item/index.tsx"),c=e("./node_modules/.pnpm/@babel+runtime@7.28.4/node_modules/@babel/runtime/helpers/objectWithoutProperties.js"),n=e.n(c),l=e("./node_modules/.pnpm/@elliemae+ds-legacy-common@1.0.16_@elliemae+pui-theme@2.13.0/node_modules/@elliemae/ds-legacy-common/dist/esm/ComboBox/v2/Combobox.js"),p=e("./node_modules/.pnpm/react-hook-form@7.63.0_react@18.3.1/node_modules/react-hook-form/dist/index.esm.mjs"),r=e("./node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js"),b=["name","defaultValue","rules"],v=["onChange"],t=function(m){var L=m.name,C=m.defaultValue,V=C===void 0?"":C,g=m.rules,k=g===void 0?{}:g,O=n()(m,b);return o()(p.xI,{name:L,rules:k,defaultValue:V,render:function(E){var M=E.field,T=M.onChange,W=n()(M,v);return(0,r.jsx)(l.vw,Object.assign({},O,W,{onChange:function(h){var G=h||{},j=G.value,A=j===void 0?h:j;T(A)}}))}})};t.displayName="ComboBox";var f=e("./lib/view/fields/watch-value.tsx"),_,F=`
+    
+    // @ts-nocheck
+    // @ts-ignore
+    var __STORY__ = "import { Story, Meta } from '@storybook/react';\\nimport { Grid } from '@elliemae/ds-grid';\\nimport { DSButtonV2 } from '@elliemae/ds-button';\\nimport { Form } from '../../form/index.js';\\nimport { FormLayoutBlockItem } from '../form-layout-block-item/index.js';\\nimport { ComboBox, ComboBoxProps } from './index.js';\\nimport { WatchValue } from '../watch-value.js';\\n\\nexport default {\\n  title: 'Components/Form/Controls/ComboBox',\\n  component: ComboBox,\\n} as Meta;\\n\\nconst Template: Story<ComboBoxProps> = (args) => (\\n  <Grid p=\\"m\\">\\n    <Form>\\n      <FormLayoutBlockItem\\n        inputID=\\"marital_status\\"\\n        label=\\"Marital Status\\"\\n        required\\n      >\\n        <ComboBox {...args} />\\n      </FormLayoutBlockItem>\\n      <DSButtonV2>Submit</DSButtonV2>\\n      <WatchValue label=\\"Marital Status\\" {...args} />\\n    </Form>\\n  </Grid>\\n);\\n\\nexport const Basic = Template.bind({});\\n\\nBasic.args = {\\n  id: 'marital_status',\\n  name: 'marital_status',\\n  defaultValue: '--select--',\\n  options: [\\n    { value: '--select--', label: '--Select--' },\\n    { value: 'married', label: 'Married' },\\n    { value: 'unmarried', label: 'Unmarried' },\\n    { value: 'separated', label: 'Separated' },\\n  ],\\n  clearable: false,\\n  rules: {\\n    required: { value: true, message: 'Marital Status required' },\\n    validate: (value: string) =>\\n      value !== '--select--' || 'Please select valid value',\\n  },\\n};\\n";
+    // @ts-ignore
+    var __LOCATIONS_MAP__ = {"Basic":{"startLoc":{"col":39,"line":14},"endLoc":{"col":1,"line":28},"startBody":{"col":39,"line":14},"endBody":{"col":1,"line":28}}};
+    
+import { Story, Meta } from '@storybook/react';
+import { Grid } from '@elliemae/ds-grid';
+import { DSButtonV2 } from '@elliemae/ds-button';
+import { Form } from '../../form/index.js';
+import { FormLayoutBlockItem } from '../form-layout-block-item/index.js';
+import { ComboBox, ComboBoxProps } from './index.js';
+import { WatchValue } from '../watch-value.js';
+
+export default {parameters: {"storySource":{"source":"import { Story, Meta } from '@storybook/react';\\nimport { Grid } from '@elliemae/ds-grid';\\nimport { DSButtonV2 } from '@elliemae/ds-button';\\nimport { Form } from '../../form/index.js';\\nimport { FormLayoutBlockItem } from '../form-layout-block-item/index.js';\\nimport { ComboBox, ComboBoxProps } from './index.js';\\nimport { WatchValue } from '../watch-value.js';\\n\\nexport default {\\n  title: 'Components/Form/Controls/ComboBox',\\n  component: ComboBox,\\n} as Meta;\\n\\nconst Template: Story<ComboBoxProps> = (args) => (\\n  <Grid p=\\"m\\">\\n    <Form>\\n      <FormLayoutBlockItem\\n        inputID=\\"marital_status\\"\\n        label=\\"Marital Status\\"\\n        required\\n      >\\n        <ComboBox {...args} />\\n      </FormLayoutBlockItem>\\n      <DSButtonV2>Submit</DSButtonV2>\\n      <WatchValue label=\\"Marital Status\\" {...args} />\\n    </Form>\\n  </Grid>\\n);\\n\\nexport const Basic = Template.bind({});\\n\\nBasic.args = {\\n  id: 'marital_status',\\n  name: 'marital_status',\\n  defaultValue: '--select--',\\n  options: [\\n    { value: '--select--', label: '--Select--' },\\n    { value: 'married', label: 'Married' },\\n    { value: 'unmarried', label: 'Unmarried' },\\n    { value: 'separated', label: 'Separated' },\\n  ],\\n  clearable: false,\\n  rules: {\\n    required: { value: true, message: 'Marital Status required' },\\n    validate: (value: string) =>\\n      value !== '--select--' || 'Please select valid value',\\n  },\\n};\\n","locationsMap":{"basic":{"startLoc":{"col":39,"line":14},"endLoc":{"col":1,"line":28},"startBody":{"col":39,"line":14},"endBody":{"col":1,"line":28}}}},},
+  title: 'Components/Form/Controls/ComboBox',
+  component: ComboBox,
+} as Meta;
+
+const Template: Story<ComboBoxProps> = (args) => (
+  <Grid p="m">
+    <Form>
+      <FormLayoutBlockItem
+        inputID="marital_status"
+        label="Marital Status"
+        required
+      >
+        <ComboBox {...args} />
+      </FormLayoutBlockItem>
+      <DSButtonV2>Submit</DSButtonV2>
+      <WatchValue label="Marital Status" {...args} />
+    </Form>
+  </Grid>
+);
+
+export const Basic = Template.bind({});
+
+Basic.args = {
+  id: 'marital_status',
+  name: 'marital_status',
+  defaultValue: '--select--',
+  options: [
+    { value: '--select--', label: '--Select--' },
+    { value: 'married', label: 'Married' },
+    { value: 'unmarried', label: 'Unmarried' },
+    { value: 'separated', label: 'Separated' },
+  ],
+  clearable: false,
+  rules: {
+    required: { value: true, message: 'Marital Status required' },
+    validate: (value: string) =>
+      value !== '--select--' || 'Please select valid value',
+  },
+};
+`,D={Basic:{startLoc:{col:39,line:22},endLoc:{col:1,line:36},startBody:{col:39,line:22},endBody:{col:1,line:36}}},F=`import { Story, Meta } from '@storybook/react';
+import { Grid } from '@elliemae/ds-grid';
+import { DSButtonV2 } from '@elliemae/ds-button';
+import { Form } from '../../form/index.js';
+import { FormLayoutBlockItem } from '../form-layout-block-item/index.js';
+import { ComboBox, ComboBoxProps } from './index.js';
+import { WatchValue } from '../watch-value.js';
+
+export default {
+  title: 'Components/Form/Controls/ComboBox',
+  component: ComboBox,
+} as Meta;
+
+const Template: Story<ComboBoxProps> = (args) => (
+  <Grid p="m">
+    <Form>
+      <FormLayoutBlockItem
+        inputID="marital_status"
+        label="Marital Status"
+        required
+      >
+        <ComboBox {...args} />
+      </FormLayoutBlockItem>
+      <DSButtonV2>Submit</DSButtonV2>
+      <WatchValue label="Marital Status" {...args} />
+    </Form>
+  </Grid>
+);
+
+export const Basic = Template.bind({});
+
+Basic.args = {
+  id: 'marital_status',
+  name: 'marital_status',
+  defaultValue: '--select--',
+  options: [
+    { value: '--select--', label: '--Select--' },
+    { value: 'married', label: 'Married' },
+    { value: 'unmarried', label: 'Unmarried' },
+    { value: 'separated', label: 'Separated' },
+  ],
+  clearable: false,
+  rules: {
+    required: { value: true, message: 'Marital Status required' },
+    validate: (value: string) =>
+      value !== '--select--' || 'Please select valid value',
+  },
+};
+`,D={Basic:{startLoc:{col:39,line:14},endLoc:{col:1,line:28},startBody:{col:39,line:14},endBody:{col:1,line:28}}};const P={parameters:{storySource:{source:`
+    
+    // @ts-nocheck
+    // @ts-ignore
+    var __STORY__ = "import { Story, Meta } from '@storybook/react';\\nimport { Grid } from '@elliemae/ds-grid';\\nimport { DSButtonV2 } from '@elliemae/ds-button';\\nimport { Form } from '../../form/index.js';\\nimport { FormLayoutBlockItem } from '../form-layout-block-item/index.js';\\nimport { ComboBox, ComboBoxProps } from './index.js';\\nimport { WatchValue } from '../watch-value.js';\\n\\nexport default {\\n  title: 'Components/Form/Controls/ComboBox',\\n  component: ComboBox,\\n} as Meta;\\n\\nconst Template: Story<ComboBoxProps> = (args) => (\\n  <Grid p=\\"m\\">\\n    <Form>\\n      <FormLayoutBlockItem\\n        inputID=\\"marital_status\\"\\n        label=\\"Marital Status\\"\\n        required\\n      >\\n        <ComboBox {...args} />\\n      </FormLayoutBlockItem>\\n      <DSButtonV2>Submit</DSButtonV2>\\n      <WatchValue label=\\"Marital Status\\" {...args} />\\n    </Form>\\n  </Grid>\\n);\\n\\nexport const Basic = Template.bind({});\\n\\nBasic.args = {\\n  id: 'marital_status',\\n  name: 'marital_status',\\n  defaultValue: '--select--',\\n  options: [\\n    { value: '--select--', label: '--Select--' },\\n    { value: 'married', label: 'Married' },\\n    { value: 'unmarried', label: 'Unmarried' },\\n    { value: 'separated', label: 'Separated' },\\n  ],\\n  clearable: false,\\n  rules: {\\n    required: { value: true, message: 'Marital Status required' },\\n    validate: (value: string) =>\\n      value !== '--select--' || 'Please select valid value',\\n  },\\n};\\n";
+    // @ts-ignore
+    var __LOCATIONS_MAP__ = {"Basic":{"startLoc":{"col":39,"line":14},"endLoc":{"col":1,"line":28},"startBody":{"col":39,"line":14},"endBody":{"col":1,"line":28}}};
+    
+import { Story, Meta } from '@storybook/react';
+import { Grid } from '@elliemae/ds-grid';
+import { DSButtonV2 } from '@elliemae/ds-button';
+import { Form } from '../../form/index.js';
+import { FormLayoutBlockItem } from '../form-layout-block-item/index.js';
+import { ComboBox, ComboBoxProps } from './index.js';
+import { WatchValue } from '../watch-value.js';
+
+export default {parameters: {"storySource":{"source":"import { Story, Meta } from '@storybook/react';\\nimport { Grid } from '@elliemae/ds-grid';\\nimport { DSButtonV2 } from '@elliemae/ds-button';\\nimport { Form } from '../../form/index.js';\\nimport { FormLayoutBlockItem } from '../form-layout-block-item/index.js';\\nimport { ComboBox, ComboBoxProps } from './index.js';\\nimport { WatchValue } from '../watch-value.js';\\n\\nexport default {\\n  title: 'Components/Form/Controls/ComboBox',\\n  component: ComboBox,\\n} as Meta;\\n\\nconst Template: Story<ComboBoxProps> = (args) => (\\n  <Grid p=\\"m\\">\\n    <Form>\\n      <FormLayoutBlockItem\\n        inputID=\\"marital_status\\"\\n        label=\\"Marital Status\\"\\n        required\\n      >\\n        <ComboBox {...args} />\\n      </FormLayoutBlockItem>\\n      <DSButtonV2>Submit</DSButtonV2>\\n      <WatchValue label=\\"Marital Status\\" {...args} />\\n    </Form>\\n  </Grid>\\n);\\n\\nexport const Basic = Template.bind({});\\n\\nBasic.args = {\\n  id: 'marital_status',\\n  name: 'marital_status',\\n  defaultValue: '--select--',\\n  options: [\\n    { value: '--select--', label: '--Select--' },\\n    { value: 'married', label: 'Married' },\\n    { value: 'unmarried', label: 'Unmarried' },\\n    { value: 'separated', label: 'Separated' },\\n  ],\\n  clearable: false,\\n  rules: {\\n    required: { value: true, message: 'Marital Status required' },\\n    validate: (value: string) =>\\n      value !== '--select--' || 'Please select valid value',\\n  },\\n};\\n","locationsMap":{"basic":{"startLoc":{"col":39,"line":14},"endLoc":{"col":1,"line":28},"startBody":{"col":39,"line":14},"endBody":{"col":1,"line":28}}}},},
+  title: 'Components/Form/Controls/ComboBox',
+  component: ComboBox,
+} as Meta;
+
+const Template: Story<ComboBoxProps> = (args) => (
+  <Grid p="m">
+    <Form>
+      <FormLayoutBlockItem
+        inputID="marital_status"
+        label="Marital Status"
+        required
+      >
+        <ComboBox {...args} />
+      </FormLayoutBlockItem>
+      <DSButtonV2>Submit</DSButtonV2>
+      <WatchValue label="Marital Status" {...args} />
+    </Form>
+  </Grid>
+);
+
+export const Basic = Template.bind({});
+
+Basic.args = {
+  id: 'marital_status',
+  name: 'marital_status',
+  defaultValue: '--select--',
+  options: [
+    { value: '--select--', label: '--Select--' },
+    { value: 'married', label: 'Married' },
+    { value: 'unmarried', label: 'Unmarried' },
+    { value: 'separated', label: 'Separated' },
+  ],
+  clearable: false,
+  rules: {
+    required: { value: true, message: 'Marital Status required' },
+    validate: (value: string) =>
+      value !== '--select--' || 'Please select valid value',
+  },
+};
+`,locationsMap:{basic:{startLoc:{col:39,line:22},endLoc:{col:1,line:36},startBody:{col:39,line:22},endBody:{col:1,line:36}}}},storySource:{source:`import { Story, Meta } from '@storybook/react';
+import { Grid } from '@elliemae/ds-grid';
+import { DSButtonV2 } from '@elliemae/ds-button';
+import { Form } from '../../form/index.js';
+import { FormLayoutBlockItem } from '../form-layout-block-item/index.js';
+import { ComboBox, ComboBoxProps } from './index.js';
+import { WatchValue } from '../watch-value.js';
+
+export default {
+  title: 'Components/Form/Controls/ComboBox',
+  component: ComboBox,
+} as Meta;
+
+const Template: Story<ComboBoxProps> = (args) => (
+  <Grid p="m">
+    <Form>
+      <FormLayoutBlockItem
+        inputID="marital_status"
+        label="Marital Status"
+        required
+      >
+        <ComboBox {...args} />
+      </FormLayoutBlockItem>
+      <DSButtonV2>Submit</DSButtonV2>
+      <WatchValue label="Marital Status" {...args} />
+    </Form>
+  </Grid>
+);
+
+export const Basic = Template.bind({});
+
+Basic.args = {
+  id: 'marital_status',
+  name: 'marital_status',
+  defaultValue: '--select--',
+  options: [
+    { value: '--select--', label: '--Select--' },
+    { value: 'married', label: 'Married' },
+    { value: 'unmarried', label: 'Unmarried' },
+    { value: 'separated', label: 'Separated' },
+  ],
+  clearable: false,
+  rules: {
+    required: { value: true, message: 'Marital Status required' },
+    validate: (value: string) =>
+      value !== '--select--' || 'Please select valid value',
+  },
+};
+`,locationsMap:{basic:{startLoc:{col:39,line:14},endLoc:{col:1,line:28},startBody:{col:39,line:14},endBody:{col:1,line:28}}}}},title:"Components/Form/Controls/ComboBox",component:t};var S=function(m){return o()(s.Ay,{p:"m"},void 0,o()(u.l,{},void 0,o()(a.B,{inputID:"marital_status",label:"Marital Status",required:!0},void 0,(0,r.jsx)(t,Object.assign({},m))),_||(_=o()(d.e,{},void 0,"Submit")),(0,r.jsx)(f.n,Object.assign({label:"Marital Status"},m))))};S.displayName="Template";var y=S.bind({});y.args={id:"marital_status",name:"marital_status",defaultValue:"--select--",options:[{value:"--select--",label:"--Select--"},{value:"married",label:"Married"},{value:"unmarried",label:"Unmarried"},{value:"separated",label:"Separated"}],clearable:!1,rules:{required:{value:!0,message:"Marital Status required"},validate:function(m){return m!=="--select--"||"Please select valid value"}}};var I=["Basic"]},"./lib/view/fields/form-layout-block-item/index.tsx":(x,i,e)=>{e.d(i,{B:()=>c});var B=e("./node_modules/.pnpm/@babel+runtime@7.28.4/node_modules/@babel/runtime/helpers/objectWithoutProperties.js"),o=e.n(B),s=e("./node_modules/.pnpm/@elliemae+ds-form-layout-blocks@3.56.4_@elliemae+pui-theme@2.13.0/node_modules/@elliemae/ds-form-layout-blocks/dist/esm/form-layout-block-item/DSFormLayoutBlockItem.js"),d=e("./node_modules/.pnpm/react-hook-form@7.63.0_react@18.3.1/node_modules/react-hook-form/dist/index.esm.mjs"),u=e("./node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js"),a=["inputID","label"],c=function(n){var l=n.inputID,p=n.label,r=o()(n,a),b=(0,d.lN)({name:l}),v=b.errors,t=(0,d.Jt)(v,l),f=!!t,_=t?.message;return(0,u.jsx)(s.U,Object.assign({inputID:l,label:p,hasError:f,validationMessage:_},r))};c.displayName="FormLayoutBlockItem"},"./lib/view/fields/watch-value.tsx":(x,i,e)=>{e.d(i,{n:()=>l});var B=e("./node_modules/.pnpm/@babel+runtime@7.28.4/node_modules/@babel/runtime/helpers/jsx.js"),o=e.n(B),s=e("./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.esm.js"),d=e("./node_modules/.pnpm/@elliemae+ds-grid@3.56.4_@elliemae+pui-theme@2.13.0/node_modules/@elliemae/ds-grid/dist/esm/Grid.js"),u=e("./node_modules/.pnpm/react-hook-form@7.63.0_react@18.3.1/node_modules/react-hook-form/dist/index.esm.mjs"),a,c=s.Ay.section.withConfig({componentId:"sc-1va6d9p-0"})(["margin-top:10px;border-top:2px blue dotted;width:100%;"]),n=s.Ay.div.withConfig({componentId:"sc-1va6d9p-1"})(["display:flex;flex-direction:column;padding-left:10px;align-items:flex-start;"]),l=function(p){var r=p.name,b=p.label,v=(0,u.xW)(),t=v.watch,f=t(r,!1)||"";return o()(d.Ay,{},void 0,o()(c,{},void 0,a||(a=o()("h4",{},void 0,"Form Data:")),o()(n,{},void 0,o()("div",{},void 0,b," : ",o()("strong",{},void 0,JSON.stringify(f))))))};l.displayName="WatchValue"},"./lib/view/form/index.tsx":(x,i,e)=>{e.d(i,{l:()=>u});var B=e("./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.esm.js"),o=e("./node_modules/.pnpm/react-hook-form@7.63.0_react@18.3.1/node_modules/react-hook-form/dist/index.esm.mjs"),s=e("./node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js"),d=B.Ay.form.withConfig({componentId:"sc-1pyjvv3-0"})(["width:100%;"]),u=function(a){var c=a.classname,n=a.reactHookFormProps,l=n===void 0?{mode:"onBlur"}:n,p=a.children,r=a.onSubmit,b=(0,o.mN)(l),v={};r&&(v.onSubmit=b.handleSubmit(r));var t=Object.assign(b,{formProps:l});return(0,s.jsx)(o.Op,Object.assign({},t,{children:(0,s.jsx)(d,Object.assign({className:c},v,{children:p}))}))};u.displayName="Form"}}]);