@preply/ds-docs 3.4.0 → 3.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/assets/{00.LayoutFlex.stories-L63JniCW.js → 00.LayoutFlex.stories-VFXWuwpO.js} +1 -1
- package/dist/assets/{00.applications-CZNgCxBr.js → 00.applications-DJvx0k5e.js} +1 -1
- package/dist/assets/{00.favicons.guide-C8wcurqA.js → 00.favicons.guide-C2RnoAYF.js} +1 -1
- package/dist/assets/{00.token-explorer-BTCw9K7w.js → 00.token-explorer-CIpc712L.js} +1 -1
- package/dist/assets/{00.using-responsive-props-CpeF4wyg.js → 00.using-responsive-props-Y0FJyksx.js} +1 -1
- package/dist/assets/{01.semantic-tokens-zxbjTqot.js → 01.semantic-tokens-YNMdeVZ4.js} +1 -1
- package/dist/assets/{01.using-shorthand-props-DL8DGU_h.js → 01.using-shorthand-props-D8C82Ryu.js} +1 -1
- package/dist/assets/{10.Combinations.stories-1_8u8WW3.js → 10.Combinations.stories-TuIVGMPp.js} +1 -1
- package/dist/assets/{10.fonts.guide-ozrfPbrb.js → 10.fonts.guide-BK8SPAB4.js} +1 -1
- package/dist/assets/{10.ssr-DuJ7V1zU.js → 10.ssr-Cn5ozKrT.js} +1 -1
- package/dist/assets/{11.languageFont.explorer-D4g8INUF.js → 11.languageFont.explorer-Dgp7vCsc.js} +1 -1
- package/dist/assets/{11.ssr.app-router-LkbMDkui.js → 11.ssr.app-router-Ce4D-wDq.js} +1 -1
- package/dist/assets/{20.libraries-OxbX53Rm.js → 20.libraries-B4FUgB6M.js} +1 -1
- package/dist/assets/{30.icons.explorer-CxFu80o-.js → 30.icons.explorer-pAVyuYWo.js} +1 -1
- package/dist/assets/{30.storybook-D4IX1PTk.js → 30.storybook-Cn6Bqenb.js} +1 -1
- package/dist/assets/{40.illustrations.explorer-CCmi1XRF.js → 40.illustrations.explorer-DuruGf8M.js} +3 -3
- package/dist/assets/{90.advanced-BsWTpQOC.js → 90.advanced-BJmxitUv.js} +1 -1
- package/dist/assets/{Accordion-BMkC4Xny.js → Accordion-C6JcVnAY.js} +1 -1
- package/dist/assets/{Accordion.stories-CDdxqEYy.js → Accordion.stories-BXKov_mh.js} +1 -1
- package/dist/assets/{Accordion.tests.stories-mB00BMOi.js → Accordion.tests.stories-BQZ2mqSD.js} +1 -1
- package/dist/assets/{AlertDialog.stories-HjngO85F.js → AlertDialog.stories-Dz2XLZcQ.js} +1 -1
- package/dist/assets/{Avatar-B2H0W8KL.js → Avatar-GW6_sGqG.js} +1 -1
- package/dist/assets/{Avatar.stories-QILX30d4.js → Avatar.stories-CttBLXpQ.js} +1 -1
- package/dist/assets/{AvatarWithStatus.stories-B86Dnj1_.js → AvatarWithStatus.stories-CfiaM_d9.js} +2 -2
- package/dist/assets/{Badge.stories-DCRd8y_l.js → Badge.stories-BVl0BEvu.js} +2 -2
- package/dist/assets/{Box.stories-CIp48tBY.js → Box.stories-CWVndvJn.js} +1 -1
- package/dist/assets/{Button-ByGPH5mV.js → Button-w2cr0Ds_.js} +3 -3
- package/dist/assets/{Button.stories-CZi-nQnw.js → Button.stories-Br4H_Yuc.js} +1 -1
- package/dist/assets/{ButtonBase-B0KE_9xS.js → ButtonBase-BagNt7Ga.js} +2 -2
- package/dist/assets/{Checkbox-BJCC-N-r.js → Checkbox-CCxh0QYX.js} +2 -2
- package/dist/assets/Checkbox.stories-BzMhrN0i.js +187 -0
- package/dist/assets/Checkbox.tests.stories-BWl34t1s.js +64 -0
- package/dist/assets/{Chips.stories-FqjAsoAI.js → Chips.stories-CqKaWr-o.js} +1 -1
- package/dist/assets/{Color-YHDXOIA2-B18N3AaJ.js → Color-YHDXOIA2-HzCcHNXW.js} +1 -1
- package/dist/assets/CountryFlag-BSsWsMSZ.js +49 -0
- package/dist/assets/Dialog-7LK-NRfd.css +1 -0
- package/dist/assets/{Dialog.stories-CksnrXI6.js → Dialog.stories-Bcwvngxm.js} +53 -21
- package/dist/assets/{DocsRenderer-CFRXHY34-CjREP_h0.js → DocsRenderer-CFRXHY34-BjJn6IOv.js} +1 -1
- package/dist/assets/{Flag.stories-B36Er6pv.js → Flag.stories-DG0Ba94P.js} +1 -1
- package/dist/assets/{Flag.test.stories-OdiZtONW.js → Flag.test.stories-znx57oSY.js} +1 -1
- package/dist/assets/{FormControl.stories-DekxQG9a.js → FormControl.stories-BG7LCJDj.js} +1 -1
- package/dist/assets/{Heading-kRKueEJE.js → Heading-DLWgmTU5.js} +2 -2
- package/dist/assets/{Heading.stories-C_OIIyB_.js → Heading.stories-BpdvL4Rd.js} +1 -1
- package/dist/assets/{Icon-RSC-DPP_Mp56.js → Icon-RSC-Df7EwZUV.js} +1 -1
- package/dist/assets/{Icon-ZIxauYsE.js → Icon-w2ilcPHL.js} +1 -1
- package/dist/assets/{Icon.stories-Cv6aq9BI.js → Icon.stories-BRh_hPKp.js} +1 -1
- package/dist/assets/IconButton-05fPCnaC.js +8 -0
- package/dist/assets/{Input-CfUiWyvo.js → Input-nsKLdjO3.js} +4 -4
- package/dist/assets/{IntegrationWithReactHookForm.stories-DsRQlqVO.js → IntegrationWithReactHookForm.stories-DWoCnPAi.js} +1 -1
- package/dist/assets/{LayoutFlex-BK2I--nP.js → LayoutFlex-8uO9g6rd.js} +1 -1
- package/dist/assets/{LayoutGrid.stories-DHo-MCEe.js → LayoutGrid.stories-Ck1Ysspo.js} +1 -1
- package/dist/assets/{LayoutGridItem-BHeOt4_j.js → LayoutGridItem-DPLTfQDr.js} +1 -1
- package/dist/assets/{Link.stories-OhrveYjE.js → Link.stories-B1fXJUXm.js} +1 -1
- package/dist/assets/{NumberField-DJpVBd26.js → NumberField-DTaNQrnr.js} +4 -4
- package/dist/assets/{NumberField.stories-wRiy_2B7.js → NumberField.stories-BBhAsZar.js} +1 -1
- package/dist/assets/{OnboardingTooltip-CEvIpDDq.js → OnboardingTooltip-DL0b2snx.js} +1 -1
- package/dist/assets/{OnboardingTooltip.stories-DgJn7s-p.js → OnboardingTooltip.stories-BL04HmvH.js} +1 -1
- package/dist/assets/{OnboardingTooltip.tests.stories-B7CnkQ4h.js → OnboardingTooltip.tests.stories-qaJ7R0VB.js} +1 -1
- package/dist/assets/{OnboardingTour-QILw0ytx.js → OnboardingTour-BEArI5YV.js} +1 -1
- package/dist/assets/{OnboardingTour.stories-4OcWs7Qa.js → OnboardingTour.stories-BZLufj9V.js} +2 -2
- package/dist/assets/{OnboardingTour.tests.stories-CGE13ZSS.js → OnboardingTour.tests.stories-CxlMyj8d.js} +1 -1
- package/dist/assets/{PasswordField-BKpD4wgB.js → PasswordField-DaMmlpIr.js} +4 -4
- package/dist/assets/{PasswordField.stories-DyAbV-Cp.js → PasswordField.stories-tM9nknm7.js} +1 -1
- package/dist/assets/{PreplyLogo.stories-DHxwd_E-.js → PreplyLogo.stories-CrTgCgF0.js} +1 -1
- package/dist/assets/{ProgressBar.stories-C6DbVF9f.js → ProgressBar.stories-CL5ifoDb.js} +1 -1
- package/dist/assets/{ProgressSteps.stories-D-MqaEU5.js → ProgressSteps.stories-DbZpoKtc.js} +1 -1
- package/dist/assets/{SelectField-Txzefw7x.js → SelectField-CNhQrH2n.js} +8 -8
- package/dist/assets/{SelectField.stories-hwymT4A1.js → SelectField.stories-B4CMJsMc.js} +1 -1
- package/dist/assets/{Steps-CSR6mb1x.js → Steps-BdyOSLSR.js} +1 -1
- package/dist/assets/{Steps.stories-BBj-1qLb.js → Steps.stories-Dz8bq-Yg.js} +1 -1
- package/dist/assets/{Text-BmdJVr9v.js → Text-BO29RJXG.js} +1 -1
- package/dist/assets/{Text.stories-CkC6dvyE.js → Text.stories-12_yxx51.js} +1 -1
- package/dist/assets/{TextField-C8z2d_Sb.js → TextField-BQEExuz1.js} +4 -4
- package/dist/assets/{TextField.stories-D5qydpY4.js → TextField.stories-BCz_05Q2.js} +1 -1
- package/dist/assets/{TextHighlighted.stories-BJsM40kL.js → TextHighlighted.stories-GseXqtvA.js} +1 -1
- package/dist/assets/{TextInline.stories-CL1L2t2-.js → TextInline.stories--nFiCnzF.js} +1 -1
- package/dist/assets/{TextareaField-ADPg-loW.js → TextareaField-DctmivNT.js} +7 -7
- package/dist/assets/{TextareaField.stories-B2FTFC82.js → TextareaField.stories-D9w5_Y9J.js} +1 -1
- package/dist/assets/{Toast.stories-BzEpckjh.js → Toast.stories-C8g_vmi4.js} +1 -1
- package/dist/assets/{Tooltip.stories-v2Tx_wX7.js → Tooltip.stories-CmbG2cCW.js} +1 -1
- package/dist/assets/{Tooltip.tests.stories-B83vosot.js → Tooltip.tests.stories-Dy7PYnuY.js} +1 -1
- package/dist/assets/{ar-CG-qdOH4.js → ar-D2CGVUsk.js} +1 -1
- package/dist/assets/{breakpoints-BNiagSE_.js → breakpoints-CgHpWGUd.js} +1 -1
- package/dist/assets/{breakpoints-DCs4guiN.js → breakpoints-DobBRp7q.js} +1 -1
- package/dist/assets/{breakpoints-CLD12Wfq.js → breakpoints-DpTqvyvp.js} +1 -1
- package/dist/assets/{changelog-oRixcAwg.js → changelog-D0S8jEky.js} +229 -210
- package/dist/assets/{cs-D0ekH3jh.js → cs-DNQ_gory.js} +1 -1
- package/dist/assets/{de-DDl6d-LQ.js → de-IizQVe_p.js} +1 -1
- package/dist/assets/{tw-D0ekH3jh.js → en-DNQ_gory.js} +1 -1
- package/dist/assets/{entry-preview-CHVQj5ba.js → entry-preview-DFRn2mBg.js} +1 -1
- package/dist/assets/es-DrKJGR3r.js +1 -0
- package/dist/assets/{es-D_Dg7IYg.js → es-MX-BmGXYFtZ.js} +1 -1
- package/dist/assets/{fr-DiEqNmmL.js → fr-CuYGLyh5.js} +1 -1
- package/dist/assets/{getTokenVar-DTbqJ3zU.js → getTokenVar-C5oirQpA.js} +1 -1
- package/dist/assets/{en-D0ekH3jh.js → hk-DNQ_gory.js} +1 -1
- package/dist/assets/{hover-Dz_802dC.js → hover-Cvnde29j.js} +1 -1
- package/dist/assets/{hover-CspVUDk-.js → hover-IWMMjFXu.js} +1 -1
- package/dist/assets/{hover-CZ5FiAHG.js → hover-xyA4MvI5.js} +1 -1
- package/dist/assets/{id-Cw3Lqa5l.js → id-vAi6E-Cg.js} +1 -1
- package/dist/assets/{iframe-ZI8HwEVB.js → iframe-CaFg3nAw.js} +2 -2
- package/dist/assets/{index-CRsQDyyQ.js → index-COQ9un1y.js} +3 -3
- package/dist/assets/{index-vng7oWUW.js → index-jR0YS9dx.js} +1 -1
- package/dist/assets/{intro-Dpljg1S_.js → intro-C7f6V7yC.js} +1 -1
- package/dist/assets/{it-Dq8FKPUr.js → it-DEIoatj5.js} +1 -1
- package/dist/assets/{ja-D8Abv__S.js → ja-Dpp6cU6C.js} +1 -1
- package/dist/assets/{ko-CUTyJyvD.js → ko-DhReIk0A.js} +1 -1
- package/dist/assets/{migrating-from-less-3oapsuYW.js → migrating-from-less-DyfhpvAY.js} +1 -1
- package/dist/assets/{nl-B7Sg7-1Y.js → nl-IhgF6vYc.js} +1 -1
- package/dist/assets/{pl-Bl7TVIR5.js → pl-B1TOS1cI.js} +1 -1
- package/dist/assets/{playground-DMLi4ken.css → playground-DJ3kGgB-.css} +1 -1
- package/dist/assets/{playground.stories-CUEZbHDL.js → playground.stories-BW9_5bcY.js} +89 -89
- package/dist/assets/{preview-6wzjiHPa.js → preview-BEIzUzZL.js} +1 -1
- package/dist/assets/{preview-C4y1hVIk.js → preview-Ces97bfw.js} +5 -5
- package/dist/assets/{preview-B_NJAZWU.js → preview-DcpNo3Ub.js} +2 -2
- package/dist/assets/{pt-BIIbtZBo.js → pt-BUtqIjfH.js} +1 -1
- package/dist/assets/{ro-BIcMj3_Z.js → ro-vhcu55fI.js} +1 -1
- package/dist/assets/{ru-ezAn7RjV.js → ru-4lmtaOOR.js} +1 -1
- package/dist/assets/{sv-Bgbnfxbw.js → sv-7bR56HT_.js} +1 -1
- package/dist/assets/{th-C6kYYAJ6.js → th-Dc1sd-05.js} +1 -1
- package/dist/assets/{tokens-nXjxe-VS.js → tokens-BYaYQ2wS.js} +1 -1
- package/dist/assets/{tokens-_XWt9j4-.js → tokens-DKSLWP2O.js} +1 -1
- package/dist/assets/{tokens-DhquBbEn.js → tokens-nPSL-fkF.js} +1 -1
- package/dist/assets/{tr-JsYfIVuj.js → tr-CrURmSeV.js} +1 -1
- package/dist/assets/{hk-D0ekH3jh.js → tw-DNQ_gory.js} +1 -1
- package/dist/assets/{ua-BpmD-_E_.js → ua-CYC094JX.js} +1 -1
- package/dist/assets/{usePortalElement-D4Sq4izv.js → usePortalElement-DH3j5qah.js} +1 -1
- package/dist/assets/{welcome-DjWS5LnW.js → welcome-Plgou2W7.js} +1 -1
- package/dist/assets/{zeroheight-P9Lxc_Zd.js → zeroheight-D18qypro.js} +1 -1
- package/dist/assets/{zh-CHm3cvlC.js → zh-B4XtX53T.js} +1 -1
- package/dist/iframe.html +1 -1
- package/dist/index.json +1 -1
- package/dist/preview-stats.json +1214 -1205
- package/dist/project.json +1 -1
- package/package.json +3 -3
- package/dist/assets/Checkbox.stories-C08mQFV2.js +0 -99
- package/dist/assets/Checkbox.tests.stories-D_kpL3wq.js +0 -100
- package/dist/assets/CountryFlag-CAFTp6o8.js +0 -49
- package/dist/assets/Dialog-C41Mvr8T.css +0 -1
- package/dist/assets/IconButton-D2EvZJff.js +0 -8
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as w}from"./jsx-runtime-BYouaCF_.js";import{e as A}from"./index-B3evPFBL.js";import{f as qt,w as Nt,u as U,a as Qe,e as $}from"./index-DDyIDR-R.js";import{L as Xe}from"./LayoutFlex-BK2I--nP.js";import{H as Ut}from"./Heading-kRKueEJE.js";import{T as et}from"./TextField-C8z2d_Sb.js";import{N as Ht}from"./NumberField-DJpVBd26.js";import{S as It,a as Z}from"./SelectField-Txzefw7x.js";import{P as tt}from"./PasswordField-BKpD4wgB.js";import{T as Wt}from"./TextareaField-ADPg-loW.js";import{F as ke}from"./FormControl-CeIJk4_Z.js";import{S as $t}from"./Slider-6E9fmd7P.js";import{R as Jt}from"./RangeSlider-dSZs_gtw.js";import{C as zt}from"./Checkbox-BJCC-N-r.js";import{B as rt}from"./Button-ByGPH5mV.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./layout-relative.module-ed9bC4H4.js";import"./classNames-BUL1Zq7e.js";import"./defaults-B1rzzf6M.js";import"./index-DdzHuZ-Y.js";import"./componentNames-CpCJzpB9.js";import"./text-accent-DZDDtpIt.js";import"./text-centered-CznToR0o.js";import"./Input-CfUiWyvo.js";import"./InputContainer-Bk0tgFnW.js";import"./TokyoUIExpand-DThzqohx.js";import"./Icon-ZIxauYsE.js";import"./render-icon-CVTdrNe-.js";import"./TokyoUIEye-BsOt8ZdC.js";import"./FieldButton-Bsa9_rJB.js";import"./index-BfBdt3zW.js";import"./tslib.es6-BntfKcQG.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./useMergeRefs-BKVZOB6R.js";import"./index-DRKYGVyc.js";import"./message-BraTJ16C.js";import"./index--DZ0VX4g.js";import"./index-jEDObK_5.js";import"./index-C66nt8TK.js";import"./useMergeRefs-CeyIhNgY.js";import"./ButtonBase-B0KE_9xS.js";import"./Spinner-BCTJunNM.js";import"./useHostname-CH18gHFj.js";import"./index-CC6DAVyL.js";var be=e=>e.type==="checkbox",oe=e=>e instanceof Date,N=e=>e==null;const bt=e=>typeof e=="object";var B=e=>!N(e)&&!Array.isArray(e)&&bt(e)&&!oe(e),pt=e=>B(e)&&e.target?be(e.target)?e.target.checked:e.target.value:e,Yt=e=>e.substring(0,e.search(/\.\d+(\.|$)/))||e,xt=(e,s)=>e.has(Yt(s)),Gt=e=>{const s=e.constructor&&e.constructor.prototype;return B(s)&&s.hasOwnProperty("isPrototypeOf")},Oe=typeof window<"u"&&typeof window.HTMLElement<"u"&&typeof document<"u";function H(e){let s;const t=Array.isArray(e),a=typeof FileList<"u"?e instanceof FileList:!1;if(e instanceof Date)s=new Date(e);else if(e instanceof Set)s=new Set(e);else if(!(Oe&&(e instanceof Blob||a))&&(t||B(e)))if(s=t?[]:{},!t&&!Gt(e))s=e;else for(const o in e)e.hasOwnProperty(o)&&(s[o]=H(e[o]));else return e;return s}var Se=e=>Array.isArray(e)?e.filter(Boolean):[],P=e=>e===void 0,f=(e,s,t)=>{if(!s||!B(e))return t;const a=Se(s.split(/[,[\].]+?/)).reduce((o,n)=>N(o)?o:o[n],e);return P(a)||a===e?P(e[s])?t:e[s]:a},Y=e=>typeof e=="boolean",je=e=>/^\w*$/.test(e),wt=e=>Se(e.replace(/["|']|\]/g,"").split(/\.|\[/)),S=(e,s,t)=>{let a=-1;const o=je(s)?[s]:wt(s),n=o.length,c=n-1;for(;++a<n;){const y=o[a];let p=t;if(a!==c){const R=e[y];p=B(R)||Array.isArray(R)?R:isNaN(+o[a+1])?{}:[]}if(y==="__proto__"||y==="constructor"||y==="prototype")return;e[y]=p,e=e[y]}return e};const Fe={BLUR:"blur",FOCUS_OUT:"focusout",CHANGE:"change"},K={onBlur:"onBlur",onChange:"onChange",onSubmit:"onSubmit",onTouched:"onTouched",all:"all"},re={max:"max",min:"min",maxLength:"maxLength",minLength:"minLength",pattern:"pattern",required:"required",validate:"validate"},Kt=A.createContext(null),Me=()=>A.useContext(Kt);var Ft=(e,s,t,a=!0)=>{const o={defaultValues:s._defaultValues};for(const n in e)Object.defineProperty(o,n,{get:()=>{const c=n;return s._proxyFormState[c]!==K.all&&(s._proxyFormState[c]=!a||K.all),t&&(t[c]=!0),e[c]}});return o},I=e=>B(e)&&!Object.keys(e).length,_t=(e,s,t,a)=>{t(e);const{name:o,...n}=e;return I(n)||Object.keys(n).length>=Object.keys(s).length||Object.keys(n).find(c=>s[c]===(!a||K.all))},ve=e=>Array.isArray(e)?e:[e],At=(e,s,t)=>!e||!s||e===s||ve(e).some(a=>a&&(t?a===s:a.startsWith(s)||s.startsWith(a)));function qe(e){const s=A.useRef(e);s.current=e,A.useEffect(()=>{const t=!e.disabled&&s.current.subject&&s.current.subject.subscribe({next:s.current.next});return()=>{t&&t.unsubscribe()}},[e.disabled])}function Zt(e){const s=Me(),{control:t=s.control,disabled:a,name:o,exact:n}=e||{},[c,y]=A.useState(t._formState),p=A.useRef(!0),R=A.useRef({isDirty:!1,isLoading:!1,dirtyFields:!1,touchedFields:!1,validatingFields:!1,isValidating:!1,isValid:!1,errors:!1}),x=A.useRef(o);return x.current=o,qe({disabled:a,next:v=>p.current&&At(x.current,v.name,n)&&_t(v,R.current,t._updateFormState)&&y({...t._formState,...v}),subject:t._subjects.state}),A.useEffect(()=>(p.current=!0,R.current.isValid&&t._updateValid(!0),()=>{p.current=!1}),[t]),A.useMemo(()=>Ft(c,t,R.current,!1),[c,t])}var X=e=>typeof e=="string",Vt=(e,s,t,a,o)=>X(e)?(a&&s.watch.add(e),f(t,e,o)):Array.isArray(e)?e.map(n=>(a&&s.watch.add(n),f(t,n))):(a&&(s.watchAll=!0),t);function Qt(e){const s=Me(),{control:t=s.control,name:a,defaultValue:o,disabled:n,exact:c}=e||{},y=A.useRef(a);y.current=a,qe({disabled:n,subject:t._subjects.values,next:x=>{At(y.current,x.name,c)&&R(H(Vt(y.current,t._names,x.values||t._formValues,!1,o)))}});const[p,R]=A.useState(t._getWatch(a,o));return A.useEffect(()=>t._removeUnmounted()),p}function Xt(e){const s=Me(),{name:t,disabled:a,control:o=s.control,shouldUnregister:n}=e,c=xt(o._names.array,t),y=Qt({control:o,name:t,defaultValue:f(o._formValues,t,f(o._defaultValues,t,e.defaultValue)),exact:!0}),p=Zt({control:o,name:t,exact:!0}),R=A.useRef(o.register(t,{...e.rules,value:y,...Y(e.disabled)?{disabled:e.disabled}:{}})),x=A.useMemo(()=>Object.defineProperties({},{invalid:{enumerable:!0,get:()=>!!f(p.errors,t)},isDirty:{enumerable:!0,get:()=>!!f(p.dirtyFields,t)},isTouched:{enumerable:!0,get:()=>!!f(p.touchedFields,t)},isValidating:{enumerable:!0,get:()=>!!f(p.validatingFields,t)},error:{enumerable:!0,get:()=>f(p.errors,t)}}),[p,t]),v=A.useMemo(()=>({name:t,value:y,...Y(a)||p.disabled?{disabled:p.disabled||a}:{},onChange:E=>R.current.onChange({target:{value:pt(E),name:t},type:Fe.CHANGE}),onBlur:()=>R.current.onBlur({target:{value:f(o._formValues,t),name:t},type:Fe.BLUR}),ref:E=>{const W=f(o._fields,t);W&&E&&(W._f.ref={focus:()=>E.focus(),select:()=>E.select(),setCustomValidity:k=>E.setCustomValidity(k),reportValidity:()=>E.reportValidity()})}}),[t,o._formValues,a,p.disabled,y,o._fields]);return A.useEffect(()=>{const E=o._options.shouldUnregister||n,W=(k,T)=>{const V=f(o._fields,k);V&&V._f&&(V._f.mount=T)};if(W(t,!0),E){const k=H(f(o._options.defaultValues,t));S(o._defaultValues,t,k),P(f(o._formValues,t))&&S(o._formValues,t,k)}return!c&&o.register(t),()=>{(c?E&&!o._state.action:E)?o.unregister(t):W(t,!1)}},[t,o,c,n]),A.useEffect(()=>{o._updateDisabledField({disabled:a,fields:o._fields,name:t})},[a,t,o]),A.useMemo(()=>({field:v,formState:p,fieldState:x}),[v,p,x])}const st=e=>e.render(Xt(e));var er=(e,s,t,a,o)=>s?{...t[e],types:{...t[e]&&t[e].types?t[e].types:{},[a]:o||!0}}:{},at=e=>({isOnSubmit:!e||e===K.onSubmit,isOnBlur:e===K.onBlur,isOnChange:e===K.onChange,isOnAll:e===K.all,isOnTouch:e===K.onTouched}),it=(e,s,t)=>!t&&(s.watchAll||s.watch.has(e)||[...s.watch].some(a=>e.startsWith(a)&&/^\.\w+/.test(e.slice(a.length))));const he=(e,s,t,a)=>{for(const o of t||Object.keys(e)){const n=f(e,o);if(n){const{_f:c,...y}=n;if(c){if(c.refs&&c.refs[0]&&s(c.refs[0],o)&&!a)return!0;if(c.ref&&s(c.ref,c.name)&&!a)return!0;if(he(y,s))break}else if(B(y)&&he(y,s))break}}};var tr=(e,s,t)=>{const a=ve(f(e,t));return S(a,"root",s[t]),S(e,t,a),e},Ne=e=>e.type==="file",Q=e=>typeof e=="function",_e=e=>{if(!Oe)return!1;const s=e?e.ownerDocument:0;return e instanceof(s&&s.defaultView?s.defaultView.HTMLElement:HTMLElement)},we=e=>X(e),Ue=e=>e.type==="radio",Ae=e=>e instanceof RegExp;const ot={value:!1,isValid:!1},nt={value:!0,isValid:!0};var St=e=>{if(Array.isArray(e)){if(e.length>1){const s=e.filter(t=>t&&t.checked&&!t.disabled).map(t=>t.value);return{value:s,isValid:!!s.length}}return e[0].checked&&!e[0].disabled?e[0].attributes&&!P(e[0].attributes.value)?P(e[0].value)||e[0].value===""?nt:{value:e[0].value,isValid:!0}:nt:ot}return ot};const lt={isValid:!1,value:null};var Rt=e=>Array.isArray(e)?e.reduce((s,t)=>t&&t.checked&&!t.disabled?{isValid:!0,value:t.value}:s,lt):lt;function ut(e,s,t="validate"){if(we(e)||Array.isArray(e)&&e.every(we)||Y(e)&&!e)return{type:t,message:we(e)?e:"",ref:s}}var ue=e=>B(e)&&!Ae(e)?e:{value:e,message:""},ct=async(e,s,t,a,o,n)=>{const{ref:c,refs:y,required:p,maxLength:R,minLength:x,min:v,max:E,pattern:W,validate:k,name:T,valueAsNumber:V,mount:M}=e._f,F=f(t,T);if(!M||s.has(T))return{};const ee=y?y[0]:c,te=b=>{o&&ee.reportValidity&&(ee.setCustomValidity(Y(b)?"":b||""),ee.reportValidity())},C={},ne=Ue(c),pe=be(c),ie=ne||pe,le=(V||Ne(c))&&P(c.value)&&P(F)||_e(c)&&c.value===""||F===""||Array.isArray(F)&&!F.length,J=er.bind(null,T,a,C),xe=(b,_,L,q=re.maxLength,G=re.minLength)=>{const z=b?_:L;C[T]={type:b?q:G,message:z,ref:c,...J(b?q:G,z)}};if(n?!Array.isArray(F)||!F.length:p&&(!ie&&(le||N(F))||Y(F)&&!F||pe&&!St(y).isValid||ne&&!Rt(y).isValid)){const{value:b,message:_}=we(p)?{value:!!p,message:p}:ue(p);if(b&&(C[T]={type:re.required,message:_,ref:ee,...J(re.required,_)},!a))return te(_),C}if(!le&&(!N(v)||!N(E))){let b,_;const L=ue(E),q=ue(v);if(!N(F)&&!isNaN(F)){const G=c.valueAsNumber||F&&+F;N(L.value)||(b=G>L.value),N(q.value)||(_=G<q.value)}else{const G=c.valueAsDate||new Date(F),z=fe=>new Date(new Date().toDateString()+" "+fe),ce=c.type=="time",de=c.type=="week";X(L.value)&&F&&(b=ce?z(F)>z(L.value):de?F>L.value:G>new Date(L.value)),X(q.value)&&F&&(_=ce?z(F)<z(q.value):de?F<q.value:G<new Date(q.value))}if((b||_)&&(xe(!!b,L.message,q.message,re.max,re.min),!a))return te(C[T].message),C}if((R||x)&&!le&&(X(F)||n&&Array.isArray(F))){const b=ue(R),_=ue(x),L=!N(b.value)&&F.length>+b.value,q=!N(_.value)&&F.length<+_.value;if((L||q)&&(xe(L,b.message,_.message),!a))return te(C[T].message),C}if(W&&!le&&X(F)){const{value:b,message:_}=ue(W);if(Ae(b)&&!F.match(b)&&(C[T]={type:re.pattern,message:_,ref:c,...J(re.pattern,_)},!a))return te(_),C}if(k){if(Q(k)){const b=await k(F,t),_=ut(b,ee);if(_&&(C[T]={..._,...J(re.validate,_.message)},!a))return te(_.message),C}else if(B(k)){let b={};for(const _ in k){if(!I(b)&&!a)break;const L=ut(await k[_](F,t),ee,_);L&&(b={...L,...J(_,L.message)},te(L.message),a&&(C[T]=b))}if(!I(b)&&(C[T]={ref:ee,...b},!a))return C}}return te(!0),C};function rr(e,s){const t=s.slice(0,-1).length;let a=0;for(;a<t;)e=P(e)?a++:e[s[a++]];return e}function sr(e){for(const s in e)if(e.hasOwnProperty(s)&&!P(e[s]))return!1;return!0}function D(e,s){const t=Array.isArray(s)?s:je(s)?[s]:wt(s),a=t.length===1?e:rr(e,t),o=t.length-1,n=t[o];return a&&delete a[n],o!==0&&(B(a)&&I(a)||Array.isArray(a)&&sr(a))&&D(e,t.slice(0,-1)),e}var Ce=()=>{let e=[];return{get observers(){return e},next:o=>{for(const n of e)n.next&&n.next(o)},subscribe:o=>(e.push(o),{unsubscribe:()=>{e=e.filter(n=>n!==o)}}),unsubscribe:()=>{e=[]}}},Te=e=>N(e)||!bt(e);function ae(e,s){if(Te(e)||Te(s))return e===s;if(oe(e)&&oe(s))return e.getTime()===s.getTime();const t=Object.keys(e),a=Object.keys(s);if(t.length!==a.length)return!1;for(const o of t){const n=e[o];if(!a.includes(o))return!1;if(o!=="ref"){const c=s[o];if(oe(n)&&oe(c)||B(n)&&B(c)||Array.isArray(n)&&Array.isArray(c)?!ae(n,c):n!==c)return!1}}return!0}var Pt=e=>e.type==="select-multiple",ar=e=>Ue(e)||be(e),Le=e=>_e(e)&&e.isConnected,Bt=e=>{for(const s in e)if(Q(e[s]))return!0;return!1};function Ve(e,s={}){const t=Array.isArray(e);if(B(e)||t)for(const a in e)Array.isArray(e[a])||B(e[a])&&!Bt(e[a])?(s[a]=Array.isArray(e[a])?[]:{},Ve(e[a],s[a])):N(e[a])||(s[a]=!0);return s}function Et(e,s,t){const a=Array.isArray(e);if(B(e)||a)for(const o in e)Array.isArray(e[o])||B(e[o])&&!Bt(e[o])?P(s)||Te(t[o])?t[o]=Array.isArray(e[o])?Ve(e[o],[]):{...Ve(e[o])}:Et(e[o],N(s)?{}:s[o],t[o]):t[o]=!ae(e[o],s[o]);return t}var me=(e,s)=>Et(e,s,Ve(s)),kt=(e,{valueAsNumber:s,valueAsDate:t,setValueAs:a})=>P(e)?e:s?e===""?NaN:e&&+e:t&&X(e)?new Date(e):a?a(e):e;function De(e){const s=e.ref;return Ne(s)?s.files:Ue(s)?Rt(e.refs).value:Pt(s)?[...s.selectedOptions].map(({value:t})=>t):be(s)?St(e.refs).value:kt(P(s.value)?e.ref.value:s.value,e)}var ir=(e,s,t,a)=>{const o={};for(const n of e){const c=f(s,n);c&&S(o,n,c._f)}return{criteriaMode:t,names:[...e],fields:o,shouldUseNativeValidation:a}},ye=e=>P(e)?e:Ae(e)?e.source:B(e)?Ae(e.value)?e.value.source:e.value:e;const dt="AsyncFunction";var or=e=>!!e&&!!e.validate&&!!(Q(e.validate)&&e.validate.constructor.name===dt||B(e.validate)&&Object.values(e.validate).find(s=>s.constructor.name===dt)),nr=e=>e.mount&&(e.required||e.min||e.max||e.maxLength||e.minLength||e.pattern||e.validate);function ft(e,s,t){const a=f(e,t);if(a||je(t))return{error:a,name:t};const o=t.split(".");for(;o.length;){const n=o.join("."),c=f(s,n),y=f(e,n);if(c&&!Array.isArray(c)&&t!==n)return{name:t};if(y&&y.type)return{name:n,error:y};o.pop()}return{name:t}}var lr=(e,s,t,a,o)=>o.isOnAll?!1:!t&&o.isOnTouch?!(s||e):(t?a.isOnBlur:o.isOnBlur)?!e:(t?a.isOnChange:o.isOnChange)?e:!0,ur=(e,s)=>!Se(f(e,s)).length&&D(e,s);const cr={mode:K.onSubmit,reValidateMode:K.onChange,shouldFocusError:!0};function dr(e={}){let s={...cr,...e},t={submitCount:0,isDirty:!1,isLoading:Q(s.defaultValues),isValidating:!1,isSubmitted:!1,isSubmitting:!1,isSubmitSuccessful:!1,isValid:!1,touchedFields:{},dirtyFields:{},validatingFields:{},errors:s.errors||{},disabled:s.disabled||!1},a={},o=B(s.defaultValues)||B(s.values)?H(s.defaultValues||s.values)||{}:{},n=s.shouldUnregister?{}:H(o),c={action:!1,mount:!1,watch:!1},y={mount:new Set,disabled:new Set,unMount:new Set,array:new Set,watch:new Set},p,R=0;const x={isDirty:!1,dirtyFields:!1,validatingFields:!1,touchedFields:!1,isValidating:!1,isValid:!1,errors:!1},v={values:Ce(),array:Ce(),state:Ce()},E=at(s.mode),W=at(s.reValidateMode),k=s.criteriaMode===K.all,T=r=>i=>{clearTimeout(R),R=setTimeout(r,i)},V=async r=>{if(!s.disabled&&(x.isValid||r)){const i=s.resolver?I((await ie()).errors):await J(a,!0);i!==t.isValid&&v.state.next({isValid:i})}},M=(r,i)=>{!s.disabled&&(x.isValidating||x.validatingFields)&&((r||Array.from(y.mount)).forEach(l=>{l&&(i?S(t.validatingFields,l,i):D(t.validatingFields,l))}),v.state.next({validatingFields:t.validatingFields,isValidating:!I(t.validatingFields)}))},F=(r,i=[],l,m,d=!0,u=!0)=>{if(m&&l&&!s.disabled){if(c.action=!0,u&&Array.isArray(f(a,r))){const g=l(f(a,r),m.argA,m.argB);d&&S(a,r,g)}if(u&&Array.isArray(f(t.errors,r))){const g=l(f(t.errors,r),m.argA,m.argB);d&&S(t.errors,r,g),ur(t.errors,r)}if(x.touchedFields&&u&&Array.isArray(f(t.touchedFields,r))){const g=l(f(t.touchedFields,r),m.argA,m.argB);d&&S(t.touchedFields,r,g)}x.dirtyFields&&(t.dirtyFields=me(o,n)),v.state.next({name:r,isDirty:b(r,i),dirtyFields:t.dirtyFields,errors:t.errors,isValid:t.isValid})}else S(n,r,i)},ee=(r,i)=>{S(t.errors,r,i),v.state.next({errors:t.errors})},te=r=>{t.errors=r,v.state.next({errors:t.errors,isValid:!1})},C=(r,i,l,m)=>{const d=f(a,r);if(d){const u=f(n,r,P(l)?f(o,r):l);P(u)||m&&m.defaultChecked||i?S(n,r,i?u:De(d._f)):q(r,u),c.mount&&V()}},ne=(r,i,l,m,d)=>{let u=!1,g=!1;const h={name:r};if(!s.disabled){const O=!!(f(a,r)&&f(a,r)._f&&f(a,r)._f.disabled);if(!l||m){x.isDirty&&(g=t.isDirty,t.isDirty=h.isDirty=b(),u=g!==h.isDirty);const j=O||ae(f(o,r),i);g=!!(!O&&f(t.dirtyFields,r)),j||O?D(t.dirtyFields,r):S(t.dirtyFields,r,!0),h.dirtyFields=t.dirtyFields,u=u||x.dirtyFields&&g!==!j}if(l){const j=f(t.touchedFields,r);j||(S(t.touchedFields,r,l),h.touchedFields=t.touchedFields,u=u||x.touchedFields&&j!==l)}u&&d&&v.state.next(h)}return u?h:{}},pe=(r,i,l,m)=>{const d=f(t.errors,r),u=x.isValid&&Y(i)&&t.isValid!==i;if(s.delayError&&l?(p=T(()=>ee(r,l)),p(s.delayError)):(clearTimeout(R),p=null,l?S(t.errors,r,l):D(t.errors,r)),(l?!ae(d,l):d)||!I(m)||u){const g={...m,...u&&Y(i)?{isValid:i}:{},errors:t.errors,name:r};t={...t,...g},v.state.next(g)}},ie=async r=>{M(r,!0);const i=await s.resolver(n,s.context,ir(r||y.mount,a,s.criteriaMode,s.shouldUseNativeValidation));return M(r),i},le=async r=>{const{errors:i}=await ie(r);if(r)for(const l of r){const m=f(i,l);m?S(t.errors,l,m):D(t.errors,l)}else t.errors=i;return i},J=async(r,i,l={valid:!0})=>{for(const m in r){const d=r[m];if(d){const{_f:u,...g}=d;if(u){const h=y.array.has(u.name),O=d._f&&or(d._f);O&&x.validatingFields&&M([m],!0);const j=await ct(d,y.disabled,n,k,s.shouldUseNativeValidation&&!i,h);if(O&&x.validatingFields&&M([m]),j[u.name]&&(l.valid=!1,i))break;!i&&(f(j,u.name)?h?tr(t.errors,j,u.name):S(t.errors,u.name,j[u.name]):D(t.errors,u.name))}!I(g)&&await J(g,i,l)}}return l.valid},xe=()=>{for(const r of y.unMount){const i=f(a,r);i&&(i._f.refs?i._f.refs.every(l=>!Le(l)):!Le(i._f.ref))&&Re(r)}y.unMount=new Set},b=(r,i)=>!s.disabled&&(r&&i&&S(n,r,i),!ae(He(),o)),_=(r,i,l)=>Vt(r,y,{...c.mount?n:P(i)?o:X(r)?{[r]:i}:i},l,i),L=r=>Se(f(c.mount?n:o,r,s.shouldUnregister?f(o,r,[]):[])),q=(r,i,l={})=>{const m=f(a,r);let d=i;if(m){const u=m._f;u&&(!u.disabled&&S(n,r,kt(i,u)),d=_e(u.ref)&&N(i)?"":i,Pt(u.ref)?[...u.ref.options].forEach(g=>g.selected=d.includes(g.value)):u.refs?be(u.ref)?u.refs.length>1?u.refs.forEach(g=>(!g.defaultChecked||!g.disabled)&&(g.checked=Array.isArray(d)?!!d.find(h=>h===g.value):d===g.value)):u.refs[0]&&(u.refs[0].checked=!!d):u.refs.forEach(g=>g.checked=g.value===d):Ne(u.ref)?u.ref.value="":(u.ref.value=d,u.ref.type||v.values.next({name:r,values:{...n}})))}(l.shouldDirty||l.shouldTouch)&&ne(r,d,l.shouldTouch,l.shouldDirty,!0),l.shouldValidate&&fe(r)},G=(r,i,l)=>{for(const m in i){const d=i[m],u=`${r}.${m}`,g=f(a,u);(y.array.has(r)||B(d)||g&&!g._f)&&!oe(d)?G(u,d,l):q(u,d,l)}},z=(r,i,l={})=>{const m=f(a,r),d=y.array.has(r),u=H(i);S(n,r,u),d?(v.array.next({name:r,values:{...n}}),(x.isDirty||x.dirtyFields)&&l.shouldDirty&&v.state.next({name:r,dirtyFields:me(o,n),isDirty:b(r,u)})):m&&!m._f&&!N(u)?G(r,u,l):q(r,u,l),it(r,y)&&v.state.next({...t}),v.values.next({name:c.mount?r:void 0,values:{...n}})},ce=async r=>{c.mount=!0;const i=r.target;let l=i.name,m=!0;const d=f(a,l),u=()=>i.type?De(d._f):pt(r),g=h=>{m=Number.isNaN(h)||oe(h)&&isNaN(h.getTime())||ae(h,f(n,l,h))};if(d){let h,O;const j=u(),se=r.type===Fe.BLUR||r.type===Fe.FOCUS_OUT,Ot=!nr(d._f)&&!s.resolver&&!f(t.errors,l)&&!d._f.deps||lr(se,f(t.touchedFields,l),t.isSubmitted,W,E),Be=it(l,y,se);S(n,l,j),se?(d._f.onBlur&&d._f.onBlur(r),p&&p(0)):d._f.onChange&&d._f.onChange(r);const Ee=ne(l,j,se,!1),jt=!I(Ee)||Be;if(!se&&v.values.next({name:l,type:r.type,values:{...n}}),Ot)return x.isValid&&(s.mode==="onBlur"&&se?V():se||V()),jt&&v.state.next({name:l,...Be?{}:Ee});if(!se&&Be&&v.state.next({...t}),s.resolver){const{errors:Ke}=await ie([l]);if(g(j),m){const Mt=ft(t.errors,a,l),Ze=ft(Ke,a,Mt.name||l);h=Ze.error,l=Ze.name,O=I(Ke)}}else M([l],!0),h=(await ct(d,y.disabled,n,k,s.shouldUseNativeValidation))[l],M([l]),g(j),m&&(h?O=!1:x.isValid&&(O=await J(a,!0)));m&&(d._f.deps&&fe(d._f.deps),pe(l,O,h,Ee))}},de=(r,i)=>{if(f(t.errors,i)&&r.focus)return r.focus(),1},fe=async(r,i={})=>{let l,m;const d=ve(r);if(s.resolver){const u=await le(P(r)?r:d);l=I(u),m=r?!d.some(g=>f(u,g)):l}else r?(m=(await Promise.all(d.map(async u=>{const g=f(a,u);return await J(g&&g._f?{[u]:g}:g)}))).every(Boolean),!(!m&&!t.isValid)&&V()):m=l=await J(a);return v.state.next({...!X(r)||x.isValid&&l!==t.isValid?{}:{name:r},...s.resolver||!r?{isValid:l}:{},errors:t.errors}),i.shouldFocus&&!m&&he(a,de,r?d:y.mount),m},He=r=>{const i={...c.mount?n:o};return P(r)?i:X(r)?f(i,r):r.map(l=>f(i,l))},Ie=(r,i)=>({invalid:!!f((i||t).errors,r),isDirty:!!f((i||t).dirtyFields,r),error:f((i||t).errors,r),isValidating:!!f(t.validatingFields,r),isTouched:!!f((i||t).touchedFields,r)}),Ct=r=>{r&&ve(r).forEach(i=>D(t.errors,i)),v.state.next({errors:r?t.errors:{}})},We=(r,i,l)=>{const m=(f(a,r,{_f:{}})._f||{}).ref,d=f(t.errors,r)||{},{ref:u,message:g,type:h,...O}=d;S(t.errors,r,{...O,...i,ref:m}),v.state.next({name:r,errors:t.errors,isValid:!1}),l&&l.shouldFocus&&m&&m.focus&&m.focus()},Lt=(r,i)=>Q(r)?v.values.subscribe({next:l=>r(_(void 0,i),l)}):_(r,i,!0),Re=(r,i={})=>{for(const l of r?ve(r):y.mount)y.mount.delete(l),y.array.delete(l),i.keepValue||(D(a,l),D(n,l)),!i.keepError&&D(t.errors,l),!i.keepDirty&&D(t.dirtyFields,l),!i.keepTouched&&D(t.touchedFields,l),!i.keepIsValidating&&D(t.validatingFields,l),!s.shouldUnregister&&!i.keepDefaultValue&&D(o,l);v.values.next({values:{...n}}),v.state.next({...t,...i.keepDirty?{isDirty:b()}:{}}),!i.keepIsValid&&V()},$e=({disabled:r,name:i,field:l,fields:m})=>{(Y(r)&&c.mount||r||y.disabled.has(i))&&(r?y.disabled.add(i):y.disabled.delete(i),ne(i,De(l?l._f:f(m,i)._f),!1,!1,!0))},Pe=(r,i={})=>{let l=f(a,r);const m=Y(i.disabled)||Y(s.disabled);return S(a,r,{...l||{},_f:{...l&&l._f?l._f:{ref:{name:r}},name:r,mount:!0,...i}}),y.mount.add(r),l?$e({field:l,disabled:Y(i.disabled)?i.disabled:s.disabled,name:r}):C(r,!0,i.value),{...m?{disabled:i.disabled||s.disabled}:{},...s.progressive?{required:!!i.required,min:ye(i.min),max:ye(i.max),minLength:ye(i.minLength),maxLength:ye(i.maxLength),pattern:ye(i.pattern)}:{},name:r,onChange:ce,onBlur:ce,ref:d=>{if(d){Pe(r,i),l=f(a,r);const u=P(d.value)&&d.querySelectorAll&&d.querySelectorAll("input,select,textarea")[0]||d,g=ar(u),h=l._f.refs||[];if(g?h.find(O=>O===u):u===l._f.ref)return;S(a,r,{_f:{...l._f,...g?{refs:[...h.filter(Le),u,...Array.isArray(f(o,r))?[{}]:[]],ref:{type:u.type,name:r}}:{ref:u}}}),C(r,!1,void 0,u)}else l=f(a,r,{}),l._f&&(l._f.mount=!1),(s.shouldUnregister||i.shouldUnregister)&&!(xt(y.array,r)&&c.action)&&y.unMount.add(r)}}},Je=()=>s.shouldFocusError&&he(a,de,y.mount),Dt=r=>{Y(r)&&(v.state.next({disabled:r}),he(a,(i,l)=>{const m=f(a,l);m&&(i.disabled=m._f.disabled||r,Array.isArray(m._f.refs)&&m._f.refs.forEach(d=>{d.disabled=m._f.disabled||r}))},0,!1))},ze=(r,i)=>async l=>{let m;l&&(l.preventDefault&&l.preventDefault(),l.persist&&l.persist());let d=H(n);if(y.disabled.size)for(const u of y.disabled)S(d,u,void 0);if(v.state.next({isSubmitting:!0}),s.resolver){const{errors:u,values:g}=await ie();t.errors=u,d=g}else await J(a);if(D(t.errors,"root"),I(t.errors)){v.state.next({errors:{}});try{await r(d,l)}catch(u){m=u}}else i&&await i({...t.errors},l),Je(),setTimeout(Je);if(v.state.next({isSubmitted:!0,isSubmitting:!1,isSubmitSuccessful:I(t.errors)&&!m,submitCount:t.submitCount+1,errors:t.errors}),m)throw m},Tt=(r,i={})=>{f(a,r)&&(P(i.defaultValue)?z(r,H(f(o,r))):(z(r,i.defaultValue),S(o,r,H(i.defaultValue))),i.keepTouched||D(t.touchedFields,r),i.keepDirty||(D(t.dirtyFields,r),t.isDirty=i.defaultValue?b(r,H(f(o,r))):b()),i.keepError||(D(t.errors,r),x.isValid&&V()),v.state.next({...t}))},Ye=(r,i={})=>{const l=r?H(r):o,m=H(l),d=I(r),u=d?o:m;if(i.keepDefaultValues||(o=l),!i.keepValues){if(i.keepDirtyValues){const g=new Set([...y.mount,...Object.keys(me(o,n))]);for(const h of Array.from(g))f(t.dirtyFields,h)?S(u,h,f(n,h)):z(h,f(u,h))}else{if(Oe&&P(r))for(const g of y.mount){const h=f(a,g);if(h&&h._f){const O=Array.isArray(h._f.refs)?h._f.refs[0]:h._f.ref;if(_e(O)){const j=O.closest("form");if(j){j.reset();break}}}}a={}}n=s.shouldUnregister?i.keepDefaultValues?H(o):{}:H(u),v.array.next({values:{...u}}),v.values.next({values:{...u}})}y={mount:i.keepDirtyValues?y.mount:new Set,unMount:new Set,array:new Set,disabled:new Set,watch:new Set,watchAll:!1,focus:""},c.mount=!x.isValid||!!i.keepIsValid||!!i.keepDirtyValues,c.watch=!!s.shouldUnregister,v.state.next({submitCount:i.keepSubmitCount?t.submitCount:0,isDirty:d?!1:i.keepDirty?t.isDirty:!!(i.keepDefaultValues&&!ae(r,o)),isSubmitted:i.keepIsSubmitted?t.isSubmitted:!1,dirtyFields:d?{}:i.keepDirtyValues?i.keepDefaultValues&&n?me(o,n):t.dirtyFields:i.keepDefaultValues&&r?me(o,r):i.keepDirty?t.dirtyFields:{},touchedFields:i.keepTouched?t.touchedFields:{},errors:i.keepErrors?t.errors:{},isSubmitSuccessful:i.keepIsSubmitSuccessful?t.isSubmitSuccessful:!1,isSubmitting:!1})},Ge=(r,i)=>Ye(Q(r)?r(n):r,i);return{control:{register:Pe,unregister:Re,getFieldState:Ie,handleSubmit:ze,setError:We,_executeSchema:ie,_getWatch:_,_getDirty:b,_updateValid:V,_removeUnmounted:xe,_updateFieldArray:F,_updateDisabledField:$e,_getFieldArray:L,_reset:Ye,_resetDefaultValues:()=>Q(s.defaultValues)&&s.defaultValues().then(r=>{Ge(r,s.resetOptions),v.state.next({isLoading:!1})}),_updateFormState:r=>{t={...t,...r}},_disableForm:Dt,_subjects:v,_proxyFormState:x,_setErrors:te,get _fields(){return a},get _formValues(){return n},get _state(){return c},set _state(r){c=r},get _defaultValues(){return o},get _names(){return y},set _names(r){y=r},get _formState(){return t},set _formState(r){t=r},get _options(){return s},set _options(r){s={...s,...r}}},trigger:fe,register:Pe,handleSubmit:ze,watch:Lt,setValue:z,getValues:He,reset:Ge,resetField:Tt,clearErrors:Ct,unregister:Re,setError:We,setFocus:(r,i={})=>{const l=f(a,r),m=l&&l._f;if(m){const d=m.refs?m.refs[0]:m.ref;d.focus&&(d.focus(),i.shouldSelect&&Q(d.select)&&d.select())}},getFieldState:Ie}}function fr(e={}){const s=A.useRef(void 0),t=A.useRef(void 0),[a,o]=A.useState({isDirty:!1,isValidating:!1,isLoading:Q(e.defaultValues),isSubmitted:!1,isSubmitting:!1,isSubmitSuccessful:!1,isValid:!1,submitCount:0,dirtyFields:{},touchedFields:{},validatingFields:{},errors:e.errors||{},disabled:e.disabled||!1,defaultValues:Q(e.defaultValues)?void 0:e.defaultValues});s.current||(s.current={...dr(e),formState:a});const n=s.current.control;return n._options=e,qe({subject:n._subjects.state,next:c=>{_t(c,n._proxyFormState,n._updateFormState,!0)&&o({...n._formState})}}),A.useEffect(()=>n._disableForm(e.disabled),[n,e.disabled]),A.useEffect(()=>{if(n._proxyFormState.isDirty){const c=n._getDirty();c!==a.isDirty&&n._subjects.state.next({isDirty:c})}},[n,a.isDirty]),A.useEffect(()=>{e.values&&!ae(e.values,t.current)?(n._reset(e.values,n._options.resetOptions),t.current=e.values,o(c=>({...c}))):n._resetDefaultValues()},[e.values,n]),A.useEffect(()=>{e.errors&&n._setErrors(e.errors)},[e.errors,n]),A.useEffect(()=>{n._state.mount||(n._updateValid(),n._state.mount=!0),n._state.watch&&(n._state.watch=!1,n._subjects.state.next({...n._formState})),n._removeUnmounted()}),A.useEffect(()=>{e.shouldUnregister&&n._subjects.values.next({values:n._getWatch()})},[e.shouldUnregister,n]),s.current.formState=Ft(a,n),s.current}const ns={title:"Guides/Integration with React Hook Form",args:{onSubmit:qt(e=>{console.log("Form submitted:",e)})}},ge={render:function(s){const t=()=>{var p,R,x,v,E,W,k,T;const{register:a,handleSubmit:o,formState:{errors:n},reset:c,control:y}=fr({defaultValues:{fullName:"",email:"",age:void 0,country:"",password:"",confirmPassword:"",bio:"",privacyPolicyAccepted:!1,experienceLevel:50,priceRange:[25,75]}});return w.jsx("div",{style:{maxWidth:"600px",margin:"0 auto",padding:"20px"},children:w.jsxs(Xe,{direction:"column",gap:"16",children:[w.jsx(Ut,{variant:"extraLarge",tag:"h1",children:"User Registration Form"}),w.jsxs("form",{onSubmit:o(s.onSubmit),style:{display:"contents"},noValidate:!0,children:[w.jsx(et,{label:"Full Name",...a("fullName",{required:"Full name is required"}),error:(p=n.fullName)==null?void 0:p.message,required:!0}),w.jsx(et,{label:"Email",type:"email",...a("email",{required:"Email is required"}),error:(R=n.email)==null?void 0:R.message,required:!0}),w.jsx(Ht,{label:"Age",...a("age",{valueAsNumber:!0,required:"Age is required",min:{value:18,message:"You must be at least 18 years old"}}),min:18,max:120,error:(x=n.age)==null?void 0:x.message,required:!0}),w.jsxs(It,{label:"Country",placeholder:"",...a("country",{required:"Country is required"}),error:(v=n.country)==null?void 0:v.message,required:!0,children:[w.jsx(Z,{value:"us",children:"United States"}),w.jsx(Z,{value:"ca",children:"Canada"}),w.jsx(Z,{value:"uk",children:"United Kingdom"}),w.jsx(Z,{value:"de",children:"Germany"}),w.jsx(Z,{value:"fr",children:"France"}),w.jsx(Z,{value:"it",children:"Italy"}),w.jsx(Z,{value:"es",children:"Spain"}),w.jsx(Z,{value:"au",children:"Australia"}),w.jsx(Z,{value:"jp",children:"Japan"}),w.jsx(Z,{value:"other",children:"Other"})]}),w.jsx(tt,{label:"Password",...a("password",{required:"Password is required",minLength:{value:8,message:"Password must be at least 8 characters"},pattern:{value:/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]/,message:"Password must contain at least one uppercase letter, one lowercase letter, one number, and one special character"}}),error:(E=n.password)==null?void 0:E.message,required:!0}),w.jsx(tt,{label:"Confirm Password",...a("confirmPassword",{required:"Please confirm your password",validate:(V,M)=>V===M.password||"Passwords do not match"}),error:(W=n.confirmPassword)==null?void 0:W.message,required:!0}),w.jsx(Wt,{label:"Bio",...a("bio",{maxLength:{value:500,message:"Bio must be less than 500 characters"}}),error:(k=n.bio)==null?void 0:k.message}),w.jsx(st,{name:"experienceLevel",control:y,rules:{validate:{minValue:V=>V<50?"Must be above 50":!0}},render:({field:V})=>{var M;return w.jsx(ke,{label:"Experience Level",error:(M=n.experienceLevel)==null?void 0:M.message,children:w.jsx($t,{value:V.value,onValueChange:V.onChange,min:0,max:100,"aria-label":"Experience Level"})})}}),w.jsx(st,{name:"priceRange",control:y,rules:{validate:{minValue:([V])=>V<=25?"Minimum must be above 25":!0,maxValue:([,V])=>V>=75?"Maximum must be below 75":!0}},render:({field:V})=>{var M;return w.jsx(ke,{label:"Price",error:(M=n.priceRange)==null?void 0:M.message,children:w.jsx(Jt,{value:V.value,onValueChange:V.onChange,min:0,max:100,"aria-label":"Price Range"})})}}),w.jsx(ke,{label:"Accept Privacy Policy",description:"I accept the Privacy Policy",error:(T=n.privacyPolicyAccepted)==null?void 0:T.message,hideLabel:!0,children:w.jsx(zt,{...a("privacyPolicyAccepted",{required:"You must accept the Privacy Policy"})})}),w.jsxs(Xe,{gap:"12",padding:["20","0","0"],justifyContent:"end",children:[w.jsx(rt,{onClick:()=>c(),variant:"secondary",children:"Reset"}),w.jsx(rt,{submitsForm:!0,children:"Submit"})]})]})]})})};return w.jsx(t,{})},play:async({args:e,canvasElement:s,step:t})=>{const a=Nt(s);await t("Fill all form fields",async()=>{console.log(await a.findAllByRole("textbox")),await U.type(a.getByRole("textbox",{name:"Full Name"}),"John Doe"),await U.type(a.getByRole("textbox",{name:"Email"}),"john.doe@example.com"),await U.clear(a.getByRole("spinbutton",{name:"Age"})),await U.type(a.getByRole("spinbutton",{name:"Age"}),"25"),await U.selectOptions(a.getByRole("combobox",{name:"Country"}),"us"),await U.type(a.getByLabelText(/^Password/),"TestPassword123!"),await U.type(a.getByLabelText(/^Confirm Password/),"TestPassword123!"),await U.type(a.getByRole("textbox",{name:"Bio"}),"I am a software engineer with 5 years of experience."),a.getByRole("slider",{name:"Experience Level"}).focus(),await U.keyboard("{ArrowRight}".repeat(5));const n=a.getByRole("slider",{name:"Minimum Price Range"}),c=a.getByRole("slider",{name:"Maximum Price Range"});n.focus(),await U.keyboard("{ArrowRight}".repeat(2)),c.focus(),await U.keyboard("{ArrowLeft}".repeat(2)),await U.click(a.getByRole("checkbox",{name:"Accept Privacy Policy"}))}),await t("Submit the form",async()=>{await U.click(a.getByRole("button",{name:"Submit"}))}),await t("Assert that onSubmit was called with correct data",async()=>{await Qe(()=>{$(e.onSubmit).toHaveBeenCalledWith({fullName:"John Doe",email:"john.doe@example.com",age:25,country:"us",password:"TestPassword123!",confirmPassword:"TestPassword123!",bio:"I am a software engineer with 5 years of experience.",privacyPolicyAccepted:!0,experienceLevel:55,priceRange:[27,73]},$.anything())})}),await t("Reset the form",async()=>{await U.click(a.getByRole("button",{name:"Reset"}))}),await t("Assert all fields are cleared",async()=>{await Qe(()=>{$(a.getByRole("textbox",{name:"Full Name"})).not.toHaveValue(),$(a.getByRole("textbox",{name:"Email"})).not.toHaveValue(),$(a.getByRole("spinbutton",{name:"Age"})).not.toHaveValue(),$(a.getByRole("combobox",{name:"Country"})).not.toHaveValue(),$(a.getByLabelText(/^Password/)).not.toHaveValue(),$(a.getByLabelText(/^Confirm Password/)).not.toHaveValue(),$(a.getByRole("textbox",{name:"Bio"})).not.toHaveValue(),$(a.getByRole("checkbox",{name:"Accept Privacy Policy"})).not.toBeChecked(),$(a.getByRole("slider",{name:"Experience Level"})).toHaveAttribute("aria-valuenow","50"),$(a.getByRole("slider",{name:"Minimum Price Range"})).toHaveAttribute("aria-valuenow","25"),$(a.getByRole("slider",{name:"Maximum Price Range"})).toHaveAttribute("aria-valuenow","75")})})}};var mt,yt,gt,vt,ht;ge.parameters={...ge.parameters,docs:{...(mt=ge.parameters)==null?void 0:mt.docs,source:{originalSource:`{
|
|
1
|
+
import{j as w}from"./jsx-runtime-BYouaCF_.js";import{e as A}from"./index-B3evPFBL.js";import{f as qt,w as Nt,u as U,a as Qe,e as $}from"./index-DDyIDR-R.js";import{L as Xe}from"./LayoutFlex-8uO9g6rd.js";import{H as Ut}from"./Heading-DLWgmTU5.js";import{T as et}from"./TextField-BQEExuz1.js";import{N as Ht}from"./NumberField-DTaNQrnr.js";import{S as It,a as Z}from"./SelectField-CNhQrH2n.js";import{P as tt}from"./PasswordField-DaMmlpIr.js";import{T as Wt}from"./TextareaField-DctmivNT.js";import{F as ke}from"./FormControl-CeIJk4_Z.js";import{S as $t}from"./Slider-6E9fmd7P.js";import{R as Jt}from"./RangeSlider-dSZs_gtw.js";import{C as zt}from"./Checkbox-CCxh0QYX.js";import{B as rt}from"./Button-w2cr0Ds_.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./layout-relative.module-ed9bC4H4.js";import"./classNames-BUL1Zq7e.js";import"./defaults-B1rzzf6M.js";import"./index-DdzHuZ-Y.js";import"./componentNames-CpCJzpB9.js";import"./text-accent-DZDDtpIt.js";import"./text-centered-CznToR0o.js";import"./Input-nsKLdjO3.js";import"./InputContainer-Bk0tgFnW.js";import"./TokyoUIExpand-DThzqohx.js";import"./Icon-w2ilcPHL.js";import"./render-icon-CVTdrNe-.js";import"./TokyoUIEye-BsOt8ZdC.js";import"./FieldButton-Bsa9_rJB.js";import"./index-BfBdt3zW.js";import"./tslib.es6-BntfKcQG.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./useMergeRefs-BKVZOB6R.js";import"./index-DRKYGVyc.js";import"./message-BraTJ16C.js";import"./index--DZ0VX4g.js";import"./index-jEDObK_5.js";import"./index-C66nt8TK.js";import"./useMergeRefs-CeyIhNgY.js";import"./ButtonBase-BagNt7Ga.js";import"./Spinner-BCTJunNM.js";import"./useHostname-CH18gHFj.js";import"./index-CC6DAVyL.js";var be=e=>e.type==="checkbox",oe=e=>e instanceof Date,N=e=>e==null;const bt=e=>typeof e=="object";var B=e=>!N(e)&&!Array.isArray(e)&&bt(e)&&!oe(e),pt=e=>B(e)&&e.target?be(e.target)?e.target.checked:e.target.value:e,Yt=e=>e.substring(0,e.search(/\.\d+(\.|$)/))||e,xt=(e,s)=>e.has(Yt(s)),Gt=e=>{const s=e.constructor&&e.constructor.prototype;return B(s)&&s.hasOwnProperty("isPrototypeOf")},Oe=typeof window<"u"&&typeof window.HTMLElement<"u"&&typeof document<"u";function H(e){let s;const t=Array.isArray(e),a=typeof FileList<"u"?e instanceof FileList:!1;if(e instanceof Date)s=new Date(e);else if(e instanceof Set)s=new Set(e);else if(!(Oe&&(e instanceof Blob||a))&&(t||B(e)))if(s=t?[]:{},!t&&!Gt(e))s=e;else for(const o in e)e.hasOwnProperty(o)&&(s[o]=H(e[o]));else return e;return s}var Se=e=>Array.isArray(e)?e.filter(Boolean):[],P=e=>e===void 0,f=(e,s,t)=>{if(!s||!B(e))return t;const a=Se(s.split(/[,[\].]+?/)).reduce((o,n)=>N(o)?o:o[n],e);return P(a)||a===e?P(e[s])?t:e[s]:a},Y=e=>typeof e=="boolean",je=e=>/^\w*$/.test(e),wt=e=>Se(e.replace(/["|']|\]/g,"").split(/\.|\[/)),S=(e,s,t)=>{let a=-1;const o=je(s)?[s]:wt(s),n=o.length,c=n-1;for(;++a<n;){const y=o[a];let p=t;if(a!==c){const R=e[y];p=B(R)||Array.isArray(R)?R:isNaN(+o[a+1])?{}:[]}if(y==="__proto__"||y==="constructor"||y==="prototype")return;e[y]=p,e=e[y]}return e};const Fe={BLUR:"blur",FOCUS_OUT:"focusout",CHANGE:"change"},K={onBlur:"onBlur",onChange:"onChange",onSubmit:"onSubmit",onTouched:"onTouched",all:"all"},re={max:"max",min:"min",maxLength:"maxLength",minLength:"minLength",pattern:"pattern",required:"required",validate:"validate"},Kt=A.createContext(null),Me=()=>A.useContext(Kt);var Ft=(e,s,t,a=!0)=>{const o={defaultValues:s._defaultValues};for(const n in e)Object.defineProperty(o,n,{get:()=>{const c=n;return s._proxyFormState[c]!==K.all&&(s._proxyFormState[c]=!a||K.all),t&&(t[c]=!0),e[c]}});return o},I=e=>B(e)&&!Object.keys(e).length,_t=(e,s,t,a)=>{t(e);const{name:o,...n}=e;return I(n)||Object.keys(n).length>=Object.keys(s).length||Object.keys(n).find(c=>s[c]===(!a||K.all))},ve=e=>Array.isArray(e)?e:[e],At=(e,s,t)=>!e||!s||e===s||ve(e).some(a=>a&&(t?a===s:a.startsWith(s)||s.startsWith(a)));function qe(e){const s=A.useRef(e);s.current=e,A.useEffect(()=>{const t=!e.disabled&&s.current.subject&&s.current.subject.subscribe({next:s.current.next});return()=>{t&&t.unsubscribe()}},[e.disabled])}function Zt(e){const s=Me(),{control:t=s.control,disabled:a,name:o,exact:n}=e||{},[c,y]=A.useState(t._formState),p=A.useRef(!0),R=A.useRef({isDirty:!1,isLoading:!1,dirtyFields:!1,touchedFields:!1,validatingFields:!1,isValidating:!1,isValid:!1,errors:!1}),x=A.useRef(o);return x.current=o,qe({disabled:a,next:v=>p.current&&At(x.current,v.name,n)&&_t(v,R.current,t._updateFormState)&&y({...t._formState,...v}),subject:t._subjects.state}),A.useEffect(()=>(p.current=!0,R.current.isValid&&t._updateValid(!0),()=>{p.current=!1}),[t]),A.useMemo(()=>Ft(c,t,R.current,!1),[c,t])}var X=e=>typeof e=="string",Vt=(e,s,t,a,o)=>X(e)?(a&&s.watch.add(e),f(t,e,o)):Array.isArray(e)?e.map(n=>(a&&s.watch.add(n),f(t,n))):(a&&(s.watchAll=!0),t);function Qt(e){const s=Me(),{control:t=s.control,name:a,defaultValue:o,disabled:n,exact:c}=e||{},y=A.useRef(a);y.current=a,qe({disabled:n,subject:t._subjects.values,next:x=>{At(y.current,x.name,c)&&R(H(Vt(y.current,t._names,x.values||t._formValues,!1,o)))}});const[p,R]=A.useState(t._getWatch(a,o));return A.useEffect(()=>t._removeUnmounted()),p}function Xt(e){const s=Me(),{name:t,disabled:a,control:o=s.control,shouldUnregister:n}=e,c=xt(o._names.array,t),y=Qt({control:o,name:t,defaultValue:f(o._formValues,t,f(o._defaultValues,t,e.defaultValue)),exact:!0}),p=Zt({control:o,name:t,exact:!0}),R=A.useRef(o.register(t,{...e.rules,value:y,...Y(e.disabled)?{disabled:e.disabled}:{}})),x=A.useMemo(()=>Object.defineProperties({},{invalid:{enumerable:!0,get:()=>!!f(p.errors,t)},isDirty:{enumerable:!0,get:()=>!!f(p.dirtyFields,t)},isTouched:{enumerable:!0,get:()=>!!f(p.touchedFields,t)},isValidating:{enumerable:!0,get:()=>!!f(p.validatingFields,t)},error:{enumerable:!0,get:()=>f(p.errors,t)}}),[p,t]),v=A.useMemo(()=>({name:t,value:y,...Y(a)||p.disabled?{disabled:p.disabled||a}:{},onChange:E=>R.current.onChange({target:{value:pt(E),name:t},type:Fe.CHANGE}),onBlur:()=>R.current.onBlur({target:{value:f(o._formValues,t),name:t},type:Fe.BLUR}),ref:E=>{const W=f(o._fields,t);W&&E&&(W._f.ref={focus:()=>E.focus(),select:()=>E.select(),setCustomValidity:k=>E.setCustomValidity(k),reportValidity:()=>E.reportValidity()})}}),[t,o._formValues,a,p.disabled,y,o._fields]);return A.useEffect(()=>{const E=o._options.shouldUnregister||n,W=(k,T)=>{const V=f(o._fields,k);V&&V._f&&(V._f.mount=T)};if(W(t,!0),E){const k=H(f(o._options.defaultValues,t));S(o._defaultValues,t,k),P(f(o._formValues,t))&&S(o._formValues,t,k)}return!c&&o.register(t),()=>{(c?E&&!o._state.action:E)?o.unregister(t):W(t,!1)}},[t,o,c,n]),A.useEffect(()=>{o._updateDisabledField({disabled:a,fields:o._fields,name:t})},[a,t,o]),A.useMemo(()=>({field:v,formState:p,fieldState:x}),[v,p,x])}const st=e=>e.render(Xt(e));var er=(e,s,t,a,o)=>s?{...t[e],types:{...t[e]&&t[e].types?t[e].types:{},[a]:o||!0}}:{},at=e=>({isOnSubmit:!e||e===K.onSubmit,isOnBlur:e===K.onBlur,isOnChange:e===K.onChange,isOnAll:e===K.all,isOnTouch:e===K.onTouched}),it=(e,s,t)=>!t&&(s.watchAll||s.watch.has(e)||[...s.watch].some(a=>e.startsWith(a)&&/^\.\w+/.test(e.slice(a.length))));const he=(e,s,t,a)=>{for(const o of t||Object.keys(e)){const n=f(e,o);if(n){const{_f:c,...y}=n;if(c){if(c.refs&&c.refs[0]&&s(c.refs[0],o)&&!a)return!0;if(c.ref&&s(c.ref,c.name)&&!a)return!0;if(he(y,s))break}else if(B(y)&&he(y,s))break}}};var tr=(e,s,t)=>{const a=ve(f(e,t));return S(a,"root",s[t]),S(e,t,a),e},Ne=e=>e.type==="file",Q=e=>typeof e=="function",_e=e=>{if(!Oe)return!1;const s=e?e.ownerDocument:0;return e instanceof(s&&s.defaultView?s.defaultView.HTMLElement:HTMLElement)},we=e=>X(e),Ue=e=>e.type==="radio",Ae=e=>e instanceof RegExp;const ot={value:!1,isValid:!1},nt={value:!0,isValid:!0};var St=e=>{if(Array.isArray(e)){if(e.length>1){const s=e.filter(t=>t&&t.checked&&!t.disabled).map(t=>t.value);return{value:s,isValid:!!s.length}}return e[0].checked&&!e[0].disabled?e[0].attributes&&!P(e[0].attributes.value)?P(e[0].value)||e[0].value===""?nt:{value:e[0].value,isValid:!0}:nt:ot}return ot};const lt={isValid:!1,value:null};var Rt=e=>Array.isArray(e)?e.reduce((s,t)=>t&&t.checked&&!t.disabled?{isValid:!0,value:t.value}:s,lt):lt;function ut(e,s,t="validate"){if(we(e)||Array.isArray(e)&&e.every(we)||Y(e)&&!e)return{type:t,message:we(e)?e:"",ref:s}}var ue=e=>B(e)&&!Ae(e)?e:{value:e,message:""},ct=async(e,s,t,a,o,n)=>{const{ref:c,refs:y,required:p,maxLength:R,minLength:x,min:v,max:E,pattern:W,validate:k,name:T,valueAsNumber:V,mount:M}=e._f,F=f(t,T);if(!M||s.has(T))return{};const ee=y?y[0]:c,te=b=>{o&&ee.reportValidity&&(ee.setCustomValidity(Y(b)?"":b||""),ee.reportValidity())},C={},ne=Ue(c),pe=be(c),ie=ne||pe,le=(V||Ne(c))&&P(c.value)&&P(F)||_e(c)&&c.value===""||F===""||Array.isArray(F)&&!F.length,J=er.bind(null,T,a,C),xe=(b,_,L,q=re.maxLength,G=re.minLength)=>{const z=b?_:L;C[T]={type:b?q:G,message:z,ref:c,...J(b?q:G,z)}};if(n?!Array.isArray(F)||!F.length:p&&(!ie&&(le||N(F))||Y(F)&&!F||pe&&!St(y).isValid||ne&&!Rt(y).isValid)){const{value:b,message:_}=we(p)?{value:!!p,message:p}:ue(p);if(b&&(C[T]={type:re.required,message:_,ref:ee,...J(re.required,_)},!a))return te(_),C}if(!le&&(!N(v)||!N(E))){let b,_;const L=ue(E),q=ue(v);if(!N(F)&&!isNaN(F)){const G=c.valueAsNumber||F&&+F;N(L.value)||(b=G>L.value),N(q.value)||(_=G<q.value)}else{const G=c.valueAsDate||new Date(F),z=fe=>new Date(new Date().toDateString()+" "+fe),ce=c.type=="time",de=c.type=="week";X(L.value)&&F&&(b=ce?z(F)>z(L.value):de?F>L.value:G>new Date(L.value)),X(q.value)&&F&&(_=ce?z(F)<z(q.value):de?F<q.value:G<new Date(q.value))}if((b||_)&&(xe(!!b,L.message,q.message,re.max,re.min),!a))return te(C[T].message),C}if((R||x)&&!le&&(X(F)||n&&Array.isArray(F))){const b=ue(R),_=ue(x),L=!N(b.value)&&F.length>+b.value,q=!N(_.value)&&F.length<+_.value;if((L||q)&&(xe(L,b.message,_.message),!a))return te(C[T].message),C}if(W&&!le&&X(F)){const{value:b,message:_}=ue(W);if(Ae(b)&&!F.match(b)&&(C[T]={type:re.pattern,message:_,ref:c,...J(re.pattern,_)},!a))return te(_),C}if(k){if(Q(k)){const b=await k(F,t),_=ut(b,ee);if(_&&(C[T]={..._,...J(re.validate,_.message)},!a))return te(_.message),C}else if(B(k)){let b={};for(const _ in k){if(!I(b)&&!a)break;const L=ut(await k[_](F,t),ee,_);L&&(b={...L,...J(_,L.message)},te(L.message),a&&(C[T]=b))}if(!I(b)&&(C[T]={ref:ee,...b},!a))return C}}return te(!0),C};function rr(e,s){const t=s.slice(0,-1).length;let a=0;for(;a<t;)e=P(e)?a++:e[s[a++]];return e}function sr(e){for(const s in e)if(e.hasOwnProperty(s)&&!P(e[s]))return!1;return!0}function D(e,s){const t=Array.isArray(s)?s:je(s)?[s]:wt(s),a=t.length===1?e:rr(e,t),o=t.length-1,n=t[o];return a&&delete a[n],o!==0&&(B(a)&&I(a)||Array.isArray(a)&&sr(a))&&D(e,t.slice(0,-1)),e}var Ce=()=>{let e=[];return{get observers(){return e},next:o=>{for(const n of e)n.next&&n.next(o)},subscribe:o=>(e.push(o),{unsubscribe:()=>{e=e.filter(n=>n!==o)}}),unsubscribe:()=>{e=[]}}},Te=e=>N(e)||!bt(e);function ae(e,s){if(Te(e)||Te(s))return e===s;if(oe(e)&&oe(s))return e.getTime()===s.getTime();const t=Object.keys(e),a=Object.keys(s);if(t.length!==a.length)return!1;for(const o of t){const n=e[o];if(!a.includes(o))return!1;if(o!=="ref"){const c=s[o];if(oe(n)&&oe(c)||B(n)&&B(c)||Array.isArray(n)&&Array.isArray(c)?!ae(n,c):n!==c)return!1}}return!0}var Pt=e=>e.type==="select-multiple",ar=e=>Ue(e)||be(e),Le=e=>_e(e)&&e.isConnected,Bt=e=>{for(const s in e)if(Q(e[s]))return!0;return!1};function Ve(e,s={}){const t=Array.isArray(e);if(B(e)||t)for(const a in e)Array.isArray(e[a])||B(e[a])&&!Bt(e[a])?(s[a]=Array.isArray(e[a])?[]:{},Ve(e[a],s[a])):N(e[a])||(s[a]=!0);return s}function Et(e,s,t){const a=Array.isArray(e);if(B(e)||a)for(const o in e)Array.isArray(e[o])||B(e[o])&&!Bt(e[o])?P(s)||Te(t[o])?t[o]=Array.isArray(e[o])?Ve(e[o],[]):{...Ve(e[o])}:Et(e[o],N(s)?{}:s[o],t[o]):t[o]=!ae(e[o],s[o]);return t}var me=(e,s)=>Et(e,s,Ve(s)),kt=(e,{valueAsNumber:s,valueAsDate:t,setValueAs:a})=>P(e)?e:s?e===""?NaN:e&&+e:t&&X(e)?new Date(e):a?a(e):e;function De(e){const s=e.ref;return Ne(s)?s.files:Ue(s)?Rt(e.refs).value:Pt(s)?[...s.selectedOptions].map(({value:t})=>t):be(s)?St(e.refs).value:kt(P(s.value)?e.ref.value:s.value,e)}var ir=(e,s,t,a)=>{const o={};for(const n of e){const c=f(s,n);c&&S(o,n,c._f)}return{criteriaMode:t,names:[...e],fields:o,shouldUseNativeValidation:a}},ye=e=>P(e)?e:Ae(e)?e.source:B(e)?Ae(e.value)?e.value.source:e.value:e;const dt="AsyncFunction";var or=e=>!!e&&!!e.validate&&!!(Q(e.validate)&&e.validate.constructor.name===dt||B(e.validate)&&Object.values(e.validate).find(s=>s.constructor.name===dt)),nr=e=>e.mount&&(e.required||e.min||e.max||e.maxLength||e.minLength||e.pattern||e.validate);function ft(e,s,t){const a=f(e,t);if(a||je(t))return{error:a,name:t};const o=t.split(".");for(;o.length;){const n=o.join("."),c=f(s,n),y=f(e,n);if(c&&!Array.isArray(c)&&t!==n)return{name:t};if(y&&y.type)return{name:n,error:y};o.pop()}return{name:t}}var lr=(e,s,t,a,o)=>o.isOnAll?!1:!t&&o.isOnTouch?!(s||e):(t?a.isOnBlur:o.isOnBlur)?!e:(t?a.isOnChange:o.isOnChange)?e:!0,ur=(e,s)=>!Se(f(e,s)).length&&D(e,s);const cr={mode:K.onSubmit,reValidateMode:K.onChange,shouldFocusError:!0};function dr(e={}){let s={...cr,...e},t={submitCount:0,isDirty:!1,isLoading:Q(s.defaultValues),isValidating:!1,isSubmitted:!1,isSubmitting:!1,isSubmitSuccessful:!1,isValid:!1,touchedFields:{},dirtyFields:{},validatingFields:{},errors:s.errors||{},disabled:s.disabled||!1},a={},o=B(s.defaultValues)||B(s.values)?H(s.defaultValues||s.values)||{}:{},n=s.shouldUnregister?{}:H(o),c={action:!1,mount:!1,watch:!1},y={mount:new Set,disabled:new Set,unMount:new Set,array:new Set,watch:new Set},p,R=0;const x={isDirty:!1,dirtyFields:!1,validatingFields:!1,touchedFields:!1,isValidating:!1,isValid:!1,errors:!1},v={values:Ce(),array:Ce(),state:Ce()},E=at(s.mode),W=at(s.reValidateMode),k=s.criteriaMode===K.all,T=r=>i=>{clearTimeout(R),R=setTimeout(r,i)},V=async r=>{if(!s.disabled&&(x.isValid||r)){const i=s.resolver?I((await ie()).errors):await J(a,!0);i!==t.isValid&&v.state.next({isValid:i})}},M=(r,i)=>{!s.disabled&&(x.isValidating||x.validatingFields)&&((r||Array.from(y.mount)).forEach(l=>{l&&(i?S(t.validatingFields,l,i):D(t.validatingFields,l))}),v.state.next({validatingFields:t.validatingFields,isValidating:!I(t.validatingFields)}))},F=(r,i=[],l,m,d=!0,u=!0)=>{if(m&&l&&!s.disabled){if(c.action=!0,u&&Array.isArray(f(a,r))){const g=l(f(a,r),m.argA,m.argB);d&&S(a,r,g)}if(u&&Array.isArray(f(t.errors,r))){const g=l(f(t.errors,r),m.argA,m.argB);d&&S(t.errors,r,g),ur(t.errors,r)}if(x.touchedFields&&u&&Array.isArray(f(t.touchedFields,r))){const g=l(f(t.touchedFields,r),m.argA,m.argB);d&&S(t.touchedFields,r,g)}x.dirtyFields&&(t.dirtyFields=me(o,n)),v.state.next({name:r,isDirty:b(r,i),dirtyFields:t.dirtyFields,errors:t.errors,isValid:t.isValid})}else S(n,r,i)},ee=(r,i)=>{S(t.errors,r,i),v.state.next({errors:t.errors})},te=r=>{t.errors=r,v.state.next({errors:t.errors,isValid:!1})},C=(r,i,l,m)=>{const d=f(a,r);if(d){const u=f(n,r,P(l)?f(o,r):l);P(u)||m&&m.defaultChecked||i?S(n,r,i?u:De(d._f)):q(r,u),c.mount&&V()}},ne=(r,i,l,m,d)=>{let u=!1,g=!1;const h={name:r};if(!s.disabled){const O=!!(f(a,r)&&f(a,r)._f&&f(a,r)._f.disabled);if(!l||m){x.isDirty&&(g=t.isDirty,t.isDirty=h.isDirty=b(),u=g!==h.isDirty);const j=O||ae(f(o,r),i);g=!!(!O&&f(t.dirtyFields,r)),j||O?D(t.dirtyFields,r):S(t.dirtyFields,r,!0),h.dirtyFields=t.dirtyFields,u=u||x.dirtyFields&&g!==!j}if(l){const j=f(t.touchedFields,r);j||(S(t.touchedFields,r,l),h.touchedFields=t.touchedFields,u=u||x.touchedFields&&j!==l)}u&&d&&v.state.next(h)}return u?h:{}},pe=(r,i,l,m)=>{const d=f(t.errors,r),u=x.isValid&&Y(i)&&t.isValid!==i;if(s.delayError&&l?(p=T(()=>ee(r,l)),p(s.delayError)):(clearTimeout(R),p=null,l?S(t.errors,r,l):D(t.errors,r)),(l?!ae(d,l):d)||!I(m)||u){const g={...m,...u&&Y(i)?{isValid:i}:{},errors:t.errors,name:r};t={...t,...g},v.state.next(g)}},ie=async r=>{M(r,!0);const i=await s.resolver(n,s.context,ir(r||y.mount,a,s.criteriaMode,s.shouldUseNativeValidation));return M(r),i},le=async r=>{const{errors:i}=await ie(r);if(r)for(const l of r){const m=f(i,l);m?S(t.errors,l,m):D(t.errors,l)}else t.errors=i;return i},J=async(r,i,l={valid:!0})=>{for(const m in r){const d=r[m];if(d){const{_f:u,...g}=d;if(u){const h=y.array.has(u.name),O=d._f&&or(d._f);O&&x.validatingFields&&M([m],!0);const j=await ct(d,y.disabled,n,k,s.shouldUseNativeValidation&&!i,h);if(O&&x.validatingFields&&M([m]),j[u.name]&&(l.valid=!1,i))break;!i&&(f(j,u.name)?h?tr(t.errors,j,u.name):S(t.errors,u.name,j[u.name]):D(t.errors,u.name))}!I(g)&&await J(g,i,l)}}return l.valid},xe=()=>{for(const r of y.unMount){const i=f(a,r);i&&(i._f.refs?i._f.refs.every(l=>!Le(l)):!Le(i._f.ref))&&Re(r)}y.unMount=new Set},b=(r,i)=>!s.disabled&&(r&&i&&S(n,r,i),!ae(He(),o)),_=(r,i,l)=>Vt(r,y,{...c.mount?n:P(i)?o:X(r)?{[r]:i}:i},l,i),L=r=>Se(f(c.mount?n:o,r,s.shouldUnregister?f(o,r,[]):[])),q=(r,i,l={})=>{const m=f(a,r);let d=i;if(m){const u=m._f;u&&(!u.disabled&&S(n,r,kt(i,u)),d=_e(u.ref)&&N(i)?"":i,Pt(u.ref)?[...u.ref.options].forEach(g=>g.selected=d.includes(g.value)):u.refs?be(u.ref)?u.refs.length>1?u.refs.forEach(g=>(!g.defaultChecked||!g.disabled)&&(g.checked=Array.isArray(d)?!!d.find(h=>h===g.value):d===g.value)):u.refs[0]&&(u.refs[0].checked=!!d):u.refs.forEach(g=>g.checked=g.value===d):Ne(u.ref)?u.ref.value="":(u.ref.value=d,u.ref.type||v.values.next({name:r,values:{...n}})))}(l.shouldDirty||l.shouldTouch)&&ne(r,d,l.shouldTouch,l.shouldDirty,!0),l.shouldValidate&&fe(r)},G=(r,i,l)=>{for(const m in i){const d=i[m],u=`${r}.${m}`,g=f(a,u);(y.array.has(r)||B(d)||g&&!g._f)&&!oe(d)?G(u,d,l):q(u,d,l)}},z=(r,i,l={})=>{const m=f(a,r),d=y.array.has(r),u=H(i);S(n,r,u),d?(v.array.next({name:r,values:{...n}}),(x.isDirty||x.dirtyFields)&&l.shouldDirty&&v.state.next({name:r,dirtyFields:me(o,n),isDirty:b(r,u)})):m&&!m._f&&!N(u)?G(r,u,l):q(r,u,l),it(r,y)&&v.state.next({...t}),v.values.next({name:c.mount?r:void 0,values:{...n}})},ce=async r=>{c.mount=!0;const i=r.target;let l=i.name,m=!0;const d=f(a,l),u=()=>i.type?De(d._f):pt(r),g=h=>{m=Number.isNaN(h)||oe(h)&&isNaN(h.getTime())||ae(h,f(n,l,h))};if(d){let h,O;const j=u(),se=r.type===Fe.BLUR||r.type===Fe.FOCUS_OUT,Ot=!nr(d._f)&&!s.resolver&&!f(t.errors,l)&&!d._f.deps||lr(se,f(t.touchedFields,l),t.isSubmitted,W,E),Be=it(l,y,se);S(n,l,j),se?(d._f.onBlur&&d._f.onBlur(r),p&&p(0)):d._f.onChange&&d._f.onChange(r);const Ee=ne(l,j,se,!1),jt=!I(Ee)||Be;if(!se&&v.values.next({name:l,type:r.type,values:{...n}}),Ot)return x.isValid&&(s.mode==="onBlur"&&se?V():se||V()),jt&&v.state.next({name:l,...Be?{}:Ee});if(!se&&Be&&v.state.next({...t}),s.resolver){const{errors:Ke}=await ie([l]);if(g(j),m){const Mt=ft(t.errors,a,l),Ze=ft(Ke,a,Mt.name||l);h=Ze.error,l=Ze.name,O=I(Ke)}}else M([l],!0),h=(await ct(d,y.disabled,n,k,s.shouldUseNativeValidation))[l],M([l]),g(j),m&&(h?O=!1:x.isValid&&(O=await J(a,!0)));m&&(d._f.deps&&fe(d._f.deps),pe(l,O,h,Ee))}},de=(r,i)=>{if(f(t.errors,i)&&r.focus)return r.focus(),1},fe=async(r,i={})=>{let l,m;const d=ve(r);if(s.resolver){const u=await le(P(r)?r:d);l=I(u),m=r?!d.some(g=>f(u,g)):l}else r?(m=(await Promise.all(d.map(async u=>{const g=f(a,u);return await J(g&&g._f?{[u]:g}:g)}))).every(Boolean),!(!m&&!t.isValid)&&V()):m=l=await J(a);return v.state.next({...!X(r)||x.isValid&&l!==t.isValid?{}:{name:r},...s.resolver||!r?{isValid:l}:{},errors:t.errors}),i.shouldFocus&&!m&&he(a,de,r?d:y.mount),m},He=r=>{const i={...c.mount?n:o};return P(r)?i:X(r)?f(i,r):r.map(l=>f(i,l))},Ie=(r,i)=>({invalid:!!f((i||t).errors,r),isDirty:!!f((i||t).dirtyFields,r),error:f((i||t).errors,r),isValidating:!!f(t.validatingFields,r),isTouched:!!f((i||t).touchedFields,r)}),Ct=r=>{r&&ve(r).forEach(i=>D(t.errors,i)),v.state.next({errors:r?t.errors:{}})},We=(r,i,l)=>{const m=(f(a,r,{_f:{}})._f||{}).ref,d=f(t.errors,r)||{},{ref:u,message:g,type:h,...O}=d;S(t.errors,r,{...O,...i,ref:m}),v.state.next({name:r,errors:t.errors,isValid:!1}),l&&l.shouldFocus&&m&&m.focus&&m.focus()},Lt=(r,i)=>Q(r)?v.values.subscribe({next:l=>r(_(void 0,i),l)}):_(r,i,!0),Re=(r,i={})=>{for(const l of r?ve(r):y.mount)y.mount.delete(l),y.array.delete(l),i.keepValue||(D(a,l),D(n,l)),!i.keepError&&D(t.errors,l),!i.keepDirty&&D(t.dirtyFields,l),!i.keepTouched&&D(t.touchedFields,l),!i.keepIsValidating&&D(t.validatingFields,l),!s.shouldUnregister&&!i.keepDefaultValue&&D(o,l);v.values.next({values:{...n}}),v.state.next({...t,...i.keepDirty?{isDirty:b()}:{}}),!i.keepIsValid&&V()},$e=({disabled:r,name:i,field:l,fields:m})=>{(Y(r)&&c.mount||r||y.disabled.has(i))&&(r?y.disabled.add(i):y.disabled.delete(i),ne(i,De(l?l._f:f(m,i)._f),!1,!1,!0))},Pe=(r,i={})=>{let l=f(a,r);const m=Y(i.disabled)||Y(s.disabled);return S(a,r,{...l||{},_f:{...l&&l._f?l._f:{ref:{name:r}},name:r,mount:!0,...i}}),y.mount.add(r),l?$e({field:l,disabled:Y(i.disabled)?i.disabled:s.disabled,name:r}):C(r,!0,i.value),{...m?{disabled:i.disabled||s.disabled}:{},...s.progressive?{required:!!i.required,min:ye(i.min),max:ye(i.max),minLength:ye(i.minLength),maxLength:ye(i.maxLength),pattern:ye(i.pattern)}:{},name:r,onChange:ce,onBlur:ce,ref:d=>{if(d){Pe(r,i),l=f(a,r);const u=P(d.value)&&d.querySelectorAll&&d.querySelectorAll("input,select,textarea")[0]||d,g=ar(u),h=l._f.refs||[];if(g?h.find(O=>O===u):u===l._f.ref)return;S(a,r,{_f:{...l._f,...g?{refs:[...h.filter(Le),u,...Array.isArray(f(o,r))?[{}]:[]],ref:{type:u.type,name:r}}:{ref:u}}}),C(r,!1,void 0,u)}else l=f(a,r,{}),l._f&&(l._f.mount=!1),(s.shouldUnregister||i.shouldUnregister)&&!(xt(y.array,r)&&c.action)&&y.unMount.add(r)}}},Je=()=>s.shouldFocusError&&he(a,de,y.mount),Dt=r=>{Y(r)&&(v.state.next({disabled:r}),he(a,(i,l)=>{const m=f(a,l);m&&(i.disabled=m._f.disabled||r,Array.isArray(m._f.refs)&&m._f.refs.forEach(d=>{d.disabled=m._f.disabled||r}))},0,!1))},ze=(r,i)=>async l=>{let m;l&&(l.preventDefault&&l.preventDefault(),l.persist&&l.persist());let d=H(n);if(y.disabled.size)for(const u of y.disabled)S(d,u,void 0);if(v.state.next({isSubmitting:!0}),s.resolver){const{errors:u,values:g}=await ie();t.errors=u,d=g}else await J(a);if(D(t.errors,"root"),I(t.errors)){v.state.next({errors:{}});try{await r(d,l)}catch(u){m=u}}else i&&await i({...t.errors},l),Je(),setTimeout(Je);if(v.state.next({isSubmitted:!0,isSubmitting:!1,isSubmitSuccessful:I(t.errors)&&!m,submitCount:t.submitCount+1,errors:t.errors}),m)throw m},Tt=(r,i={})=>{f(a,r)&&(P(i.defaultValue)?z(r,H(f(o,r))):(z(r,i.defaultValue),S(o,r,H(i.defaultValue))),i.keepTouched||D(t.touchedFields,r),i.keepDirty||(D(t.dirtyFields,r),t.isDirty=i.defaultValue?b(r,H(f(o,r))):b()),i.keepError||(D(t.errors,r),x.isValid&&V()),v.state.next({...t}))},Ye=(r,i={})=>{const l=r?H(r):o,m=H(l),d=I(r),u=d?o:m;if(i.keepDefaultValues||(o=l),!i.keepValues){if(i.keepDirtyValues){const g=new Set([...y.mount,...Object.keys(me(o,n))]);for(const h of Array.from(g))f(t.dirtyFields,h)?S(u,h,f(n,h)):z(h,f(u,h))}else{if(Oe&&P(r))for(const g of y.mount){const h=f(a,g);if(h&&h._f){const O=Array.isArray(h._f.refs)?h._f.refs[0]:h._f.ref;if(_e(O)){const j=O.closest("form");if(j){j.reset();break}}}}a={}}n=s.shouldUnregister?i.keepDefaultValues?H(o):{}:H(u),v.array.next({values:{...u}}),v.values.next({values:{...u}})}y={mount:i.keepDirtyValues?y.mount:new Set,unMount:new Set,array:new Set,disabled:new Set,watch:new Set,watchAll:!1,focus:""},c.mount=!x.isValid||!!i.keepIsValid||!!i.keepDirtyValues,c.watch=!!s.shouldUnregister,v.state.next({submitCount:i.keepSubmitCount?t.submitCount:0,isDirty:d?!1:i.keepDirty?t.isDirty:!!(i.keepDefaultValues&&!ae(r,o)),isSubmitted:i.keepIsSubmitted?t.isSubmitted:!1,dirtyFields:d?{}:i.keepDirtyValues?i.keepDefaultValues&&n?me(o,n):t.dirtyFields:i.keepDefaultValues&&r?me(o,r):i.keepDirty?t.dirtyFields:{},touchedFields:i.keepTouched?t.touchedFields:{},errors:i.keepErrors?t.errors:{},isSubmitSuccessful:i.keepIsSubmitSuccessful?t.isSubmitSuccessful:!1,isSubmitting:!1})},Ge=(r,i)=>Ye(Q(r)?r(n):r,i);return{control:{register:Pe,unregister:Re,getFieldState:Ie,handleSubmit:ze,setError:We,_executeSchema:ie,_getWatch:_,_getDirty:b,_updateValid:V,_removeUnmounted:xe,_updateFieldArray:F,_updateDisabledField:$e,_getFieldArray:L,_reset:Ye,_resetDefaultValues:()=>Q(s.defaultValues)&&s.defaultValues().then(r=>{Ge(r,s.resetOptions),v.state.next({isLoading:!1})}),_updateFormState:r=>{t={...t,...r}},_disableForm:Dt,_subjects:v,_proxyFormState:x,_setErrors:te,get _fields(){return a},get _formValues(){return n},get _state(){return c},set _state(r){c=r},get _defaultValues(){return o},get _names(){return y},set _names(r){y=r},get _formState(){return t},set _formState(r){t=r},get _options(){return s},set _options(r){s={...s,...r}}},trigger:fe,register:Pe,handleSubmit:ze,watch:Lt,setValue:z,getValues:He,reset:Ge,resetField:Tt,clearErrors:Ct,unregister:Re,setError:We,setFocus:(r,i={})=>{const l=f(a,r),m=l&&l._f;if(m){const d=m.refs?m.refs[0]:m.ref;d.focus&&(d.focus(),i.shouldSelect&&Q(d.select)&&d.select())}},getFieldState:Ie}}function fr(e={}){const s=A.useRef(void 0),t=A.useRef(void 0),[a,o]=A.useState({isDirty:!1,isValidating:!1,isLoading:Q(e.defaultValues),isSubmitted:!1,isSubmitting:!1,isSubmitSuccessful:!1,isValid:!1,submitCount:0,dirtyFields:{},touchedFields:{},validatingFields:{},errors:e.errors||{},disabled:e.disabled||!1,defaultValues:Q(e.defaultValues)?void 0:e.defaultValues});s.current||(s.current={...dr(e),formState:a});const n=s.current.control;return n._options=e,qe({subject:n._subjects.state,next:c=>{_t(c,n._proxyFormState,n._updateFormState,!0)&&o({...n._formState})}}),A.useEffect(()=>n._disableForm(e.disabled),[n,e.disabled]),A.useEffect(()=>{if(n._proxyFormState.isDirty){const c=n._getDirty();c!==a.isDirty&&n._subjects.state.next({isDirty:c})}},[n,a.isDirty]),A.useEffect(()=>{e.values&&!ae(e.values,t.current)?(n._reset(e.values,n._options.resetOptions),t.current=e.values,o(c=>({...c}))):n._resetDefaultValues()},[e.values,n]),A.useEffect(()=>{e.errors&&n._setErrors(e.errors)},[e.errors,n]),A.useEffect(()=>{n._state.mount||(n._updateValid(),n._state.mount=!0),n._state.watch&&(n._state.watch=!1,n._subjects.state.next({...n._formState})),n._removeUnmounted()}),A.useEffect(()=>{e.shouldUnregister&&n._subjects.values.next({values:n._getWatch()})},[e.shouldUnregister,n]),s.current.formState=Ft(a,n),s.current}const ns={title:"Guides/Integration with React Hook Form",args:{onSubmit:qt(e=>{console.log("Form submitted:",e)})}},ge={render:function(s){const t=()=>{var p,R,x,v,E,W,k,T;const{register:a,handleSubmit:o,formState:{errors:n},reset:c,control:y}=fr({defaultValues:{fullName:"",email:"",age:void 0,country:"",password:"",confirmPassword:"",bio:"",privacyPolicyAccepted:!1,experienceLevel:50,priceRange:[25,75]}});return w.jsx("div",{style:{maxWidth:"600px",margin:"0 auto",padding:"20px"},children:w.jsxs(Xe,{direction:"column",gap:"16",children:[w.jsx(Ut,{variant:"extraLarge",tag:"h1",children:"User Registration Form"}),w.jsxs("form",{onSubmit:o(s.onSubmit),style:{display:"contents"},noValidate:!0,children:[w.jsx(et,{label:"Full Name",...a("fullName",{required:"Full name is required"}),error:(p=n.fullName)==null?void 0:p.message,required:!0}),w.jsx(et,{label:"Email",type:"email",...a("email",{required:"Email is required"}),error:(R=n.email)==null?void 0:R.message,required:!0}),w.jsx(Ht,{label:"Age",...a("age",{valueAsNumber:!0,required:"Age is required",min:{value:18,message:"You must be at least 18 years old"}}),min:18,max:120,error:(x=n.age)==null?void 0:x.message,required:!0}),w.jsxs(It,{label:"Country",placeholder:"",...a("country",{required:"Country is required"}),error:(v=n.country)==null?void 0:v.message,required:!0,children:[w.jsx(Z,{value:"us",children:"United States"}),w.jsx(Z,{value:"ca",children:"Canada"}),w.jsx(Z,{value:"uk",children:"United Kingdom"}),w.jsx(Z,{value:"de",children:"Germany"}),w.jsx(Z,{value:"fr",children:"France"}),w.jsx(Z,{value:"it",children:"Italy"}),w.jsx(Z,{value:"es",children:"Spain"}),w.jsx(Z,{value:"au",children:"Australia"}),w.jsx(Z,{value:"jp",children:"Japan"}),w.jsx(Z,{value:"other",children:"Other"})]}),w.jsx(tt,{label:"Password",...a("password",{required:"Password is required",minLength:{value:8,message:"Password must be at least 8 characters"},pattern:{value:/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]/,message:"Password must contain at least one uppercase letter, one lowercase letter, one number, and one special character"}}),error:(E=n.password)==null?void 0:E.message,required:!0}),w.jsx(tt,{label:"Confirm Password",...a("confirmPassword",{required:"Please confirm your password",validate:(V,M)=>V===M.password||"Passwords do not match"}),error:(W=n.confirmPassword)==null?void 0:W.message,required:!0}),w.jsx(Wt,{label:"Bio",...a("bio",{maxLength:{value:500,message:"Bio must be less than 500 characters"}}),error:(k=n.bio)==null?void 0:k.message}),w.jsx(st,{name:"experienceLevel",control:y,rules:{validate:{minValue:V=>V<50?"Must be above 50":!0}},render:({field:V})=>{var M;return w.jsx(ke,{label:"Experience Level",error:(M=n.experienceLevel)==null?void 0:M.message,children:w.jsx($t,{value:V.value,onValueChange:V.onChange,min:0,max:100,"aria-label":"Experience Level"})})}}),w.jsx(st,{name:"priceRange",control:y,rules:{validate:{minValue:([V])=>V<=25?"Minimum must be above 25":!0,maxValue:([,V])=>V>=75?"Maximum must be below 75":!0}},render:({field:V})=>{var M;return w.jsx(ke,{label:"Price",error:(M=n.priceRange)==null?void 0:M.message,children:w.jsx(Jt,{value:V.value,onValueChange:V.onChange,min:0,max:100,"aria-label":"Price Range"})})}}),w.jsx(ke,{label:"Accept Privacy Policy",description:"I accept the Privacy Policy",error:(T=n.privacyPolicyAccepted)==null?void 0:T.message,hideLabel:!0,children:w.jsx(zt,{...a("privacyPolicyAccepted",{required:"You must accept the Privacy Policy"})})}),w.jsxs(Xe,{gap:"12",padding:["20","0","0"],justifyContent:"end",children:[w.jsx(rt,{onClick:()=>c(),variant:"secondary",children:"Reset"}),w.jsx(rt,{submitsForm:!0,children:"Submit"})]})]})]})})};return w.jsx(t,{})},play:async({args:e,canvasElement:s,step:t})=>{const a=Nt(s);await t("Fill all form fields",async()=>{console.log(await a.findAllByRole("textbox")),await U.type(a.getByRole("textbox",{name:"Full Name"}),"John Doe"),await U.type(a.getByRole("textbox",{name:"Email"}),"john.doe@example.com"),await U.clear(a.getByRole("spinbutton",{name:"Age"})),await U.type(a.getByRole("spinbutton",{name:"Age"}),"25"),await U.selectOptions(a.getByRole("combobox",{name:"Country"}),"us"),await U.type(a.getByLabelText(/^Password/),"TestPassword123!"),await U.type(a.getByLabelText(/^Confirm Password/),"TestPassword123!"),await U.type(a.getByRole("textbox",{name:"Bio"}),"I am a software engineer with 5 years of experience."),a.getByRole("slider",{name:"Experience Level"}).focus(),await U.keyboard("{ArrowRight}".repeat(5));const n=a.getByRole("slider",{name:"Minimum Price Range"}),c=a.getByRole("slider",{name:"Maximum Price Range"});n.focus(),await U.keyboard("{ArrowRight}".repeat(2)),c.focus(),await U.keyboard("{ArrowLeft}".repeat(2)),await U.click(a.getByRole("checkbox",{name:"Accept Privacy Policy"}))}),await t("Submit the form",async()=>{await U.click(a.getByRole("button",{name:"Submit"}))}),await t("Assert that onSubmit was called with correct data",async()=>{await Qe(()=>{$(e.onSubmit).toHaveBeenCalledWith({fullName:"John Doe",email:"john.doe@example.com",age:25,country:"us",password:"TestPassword123!",confirmPassword:"TestPassword123!",bio:"I am a software engineer with 5 years of experience.",privacyPolicyAccepted:!0,experienceLevel:55,priceRange:[27,73]},$.anything())})}),await t("Reset the form",async()=>{await U.click(a.getByRole("button",{name:"Reset"}))}),await t("Assert all fields are cleared",async()=>{await Qe(()=>{$(a.getByRole("textbox",{name:"Full Name"})).not.toHaveValue(),$(a.getByRole("textbox",{name:"Email"})).not.toHaveValue(),$(a.getByRole("spinbutton",{name:"Age"})).not.toHaveValue(),$(a.getByRole("combobox",{name:"Country"})).not.toHaveValue(),$(a.getByLabelText(/^Password/)).not.toHaveValue(),$(a.getByLabelText(/^Confirm Password/)).not.toHaveValue(),$(a.getByRole("textbox",{name:"Bio"})).not.toHaveValue(),$(a.getByRole("checkbox",{name:"Accept Privacy Policy"})).not.toBeChecked(),$(a.getByRole("slider",{name:"Experience Level"})).toHaveAttribute("aria-valuenow","50"),$(a.getByRole("slider",{name:"Minimum Price Range"})).toHaveAttribute("aria-valuenow","25"),$(a.getByRole("slider",{name:"Maximum Price Range"})).toHaveAttribute("aria-valuenow","75")})})}};var mt,yt,gt,vt,ht;ge.parameters={...ge.parameters,docs:{...(mt=ge.parameters)==null?void 0:mt.docs,source:{originalSource:`{
|
|
2
2
|
render: function Story(args) {
|
|
3
3
|
/**
|
|
4
4
|
* This \`Story\` component is a hacky workaround; without it, the
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{j as F}from"./jsx-runtime-BYouaCF_.js";import{r as N}from"./index-B3evPFBL.js";import{f as U}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{g as f,s as j,a as E,b as H}from"./layout-relative.module-ed9bC4H4.js";import{e as $,f as G,L as k}from"./defaults-B1rzzf6M.js";import{g as J}from"./index-DdzHuZ-Y.js";import{w as B}from"./componentNames-CpCJzpB9.js";const t=void 0;function Y(a){const{nowrap:e}=a;return e?!0:t}function r(a){return JSON.stringify(a)}function M(a){const{direction:e,column:u,reverse:n}=a;return e===void 0?!n&&!u?{applyThrough:"direction",directionAttr:$}:{applyThrough:"columnReverse",columnReverseAttr:`${u?"column":"row"}-${n?"rev":"fwd"}`}:typeof e=="string"?{applyThrough:"direction",directionAttr:e}:{applyThrough:"direction",directionAttr:r(e)}}function W(a){const{justifyContent:e}=a;return e===void 0?t:typeof e=="string"?e:r(e)}function X(a){const{alignItems:e}=a;return e===void 0?t:typeof e=="string"?e:r(e)}function z(a){const{gap:e}=a;return e===void 0?t:typeof e=="string"?e:r(e)}function K(a){const{padding:e}=a;return e===void 0?{applyThrough:"attr",attr:G}:typeof e=="string"||typeof e=="number"?{applyThrough:"attr",attr:e}:Array.isArray(e)?{applyThrough:"classnames",classNames:f(e)}:r(e).includes("[")?{applyThrough:"classnames",classNames:f(e)}:{applyThrough:"attr",attr:JSON.stringify(e)}}function Q(a){const{hide:e,inline:u}=a;if(e===void 0)return t;const n=u?"inline-flex":"flex";if(typeof e=="boolean")return e?"hide":n;let l=r(e);return l=l.replace(/true/g,'"hide"'),l=l.replace(/false/g,`"${n}"`),l}function Z(a){const{relative:e}=a;return e===void 0?t:e===!0?!0:e===!1?t:r(e)}const ee={},m=N.forwardRef(function(e,u){const{gap:n,hide:l,column:o,nowrap:g,inline:y,dataset:h,reverse:A,padding:L,children:R,relative:x,direction:P,alignItems:T,justifyContent:w,tag:S=k,..._}=e,d=[ee.LayoutFlex,j.LayoutGap,E.LayoutHide,H.LayoutRelative],D=z({gap:n}),b=Y({nowrap:g}),q=Z({relative:x}),V=Q({hide:l,inline:y}),I=X({alignItems:T}),O=W({justifyContent:w});let v=t,p=t;const i=M({direction:P,column:o,reverse:A});i.applyThrough==="columnReverse"?p=i.columnReverseAttr:v=i.directionAttr;let c=t;const s=K({padding:L});s.applyThrough==="classnames"?d.push(...s.classNames):c=s.attr;const C={...U(_),ref:u,className:d.join(" "),"data-ds-gap":D,"data-ds-nowrap":b,"data-ds-padding":c,"data-ds-display":V,"data-ds-relative":q,"data-ds-direction":v,"data-ds-alignitems":I,"data-ds-columnreverse":p,"data-ds-justifycontent":O,...J(h,{preplyDsComponent:B.LayoutFlex})};return F.jsx(S,{...C,children:R})});try{m.displayName="LayoutFlex",m.__docgenInfo={description:"A CSS `flex` wrapper.",displayName:"LayoutFlex",props:{gap:{defaultValue:null,description:"",name:"gap",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"s"'},{value:'"m"'},{value:'"l"'},{value:'"xl"'},{value:'"
|
|
1
|
+
import{j as F}from"./jsx-runtime-BYouaCF_.js";import{r as N}from"./index-B3evPFBL.js";import{f as U}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{g as f,s as j,a as E,b as H}from"./layout-relative.module-ed9bC4H4.js";import{e as $,f as G,L as k}from"./defaults-B1rzzf6M.js";import{g as J}from"./index-DdzHuZ-Y.js";import{w as B}from"./componentNames-CpCJzpB9.js";const t=void 0;function Y(a){const{nowrap:e}=a;return e?!0:t}function r(a){return JSON.stringify(a)}function M(a){const{direction:e,column:u,reverse:n}=a;return e===void 0?!n&&!u?{applyThrough:"direction",directionAttr:$}:{applyThrough:"columnReverse",columnReverseAttr:`${u?"column":"row"}-${n?"rev":"fwd"}`}:typeof e=="string"?{applyThrough:"direction",directionAttr:e}:{applyThrough:"direction",directionAttr:r(e)}}function W(a){const{justifyContent:e}=a;return e===void 0?t:typeof e=="string"?e:r(e)}function X(a){const{alignItems:e}=a;return e===void 0?t:typeof e=="string"?e:r(e)}function z(a){const{gap:e}=a;return e===void 0?t:typeof e=="string"?e:r(e)}function K(a){const{padding:e}=a;return e===void 0?{applyThrough:"attr",attr:G}:typeof e=="string"||typeof e=="number"?{applyThrough:"attr",attr:e}:Array.isArray(e)?{applyThrough:"classnames",classNames:f(e)}:r(e).includes("[")?{applyThrough:"classnames",classNames:f(e)}:{applyThrough:"attr",attr:JSON.stringify(e)}}function Q(a){const{hide:e,inline:u}=a;if(e===void 0)return t;const n=u?"inline-flex":"flex";if(typeof e=="boolean")return e?"hide":n;let l=r(e);return l=l.replace(/true/g,'"hide"'),l=l.replace(/false/g,`"${n}"`),l}function Z(a){const{relative:e}=a;return e===void 0?t:e===!0?!0:e===!1?t:r(e)}const ee={},m=N.forwardRef(function(e,u){const{gap:n,hide:l,column:o,nowrap:g,inline:y,dataset:h,reverse:A,padding:L,children:R,relative:x,direction:P,alignItems:T,justifyContent:w,tag:S=k,..._}=e,d=[ee.LayoutFlex,j.LayoutGap,E.LayoutHide,H.LayoutRelative],D=z({gap:n}),b=Y({nowrap:g}),q=Z({relative:x}),V=Q({hide:l,inline:y}),I=X({alignItems:T}),O=W({justifyContent:w});let v=t,p=t;const i=M({direction:P,column:o,reverse:A});i.applyThrough==="columnReverse"?p=i.columnReverseAttr:v=i.directionAttr;let c=t;const s=K({padding:L});s.applyThrough==="classnames"?d.push(...s.classNames):c=s.attr;const C={...U(_),ref:u,className:d.join(" "),"data-ds-gap":D,"data-ds-nowrap":b,"data-ds-padding":c,"data-ds-display":V,"data-ds-relative":q,"data-ds-direction":v,"data-ds-alignitems":I,"data-ds-columnreverse":p,"data-ds-justifycontent":O,...J(h,{preplyDsComponent:B.LayoutFlex})};return F.jsx(S,{...C,children:R})});try{m.displayName="LayoutFlex",m.__docgenInfo={description:"A CSS `flex` wrapper.",displayName:"LayoutFlex",props:{gap:{defaultValue:null,description:"",name:"gap",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"s"'},{value:'"m"'},{value:'"l"'},{value:'"xl"'},{value:'"none"'},{value:'"2"'},{value:'"4"'},{value:'"8"'},{value:'"0"'},{value:'"12"'},{value:'"16"'},{value:'"24"'},{value:'"32"'},{value:'"48"'},{value:'"64"'},{value:'"96"'},{value:'"160"'},{value:'"3xs"'},{value:'"2xs"'},{value:'"1"'},{value:'"20"'},{value:"ResponsiveProp<LayoutGap>"},{value:"ResponsiveProp<Spacing>"}]}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"s"'},{value:'"m"'},{value:'"l"'},{value:'"xl"'},{value:'"none"'},{value:'"2"'},{value:'"4"'},{value:'"8"'},{value:'"0"'},{value:'"12"'},{value:'"16"'},{value:'"24"'},{value:'"32"'},{value:'"48"'},{value:'"64"'},{value:'"96"'},{value:'"160"'},{value:'"3xs"'},{value:'"2xs"'},{value:'"1"'},{value:'"20"'},{value:"[Spacing, Spacing]"},{value:"[Spacing, Spacing, Spacing]"},{value:"[Spacing, Spacing, Spacing, Spacing]"},{value:"[LayoutPadding, LayoutPadding]"},{value:"[LayoutPadding, LayoutPadding, LayoutPadding]"},{value:"[LayoutPadding, LayoutPadding, LayoutPadding, LayoutPadding]"},{value:"ResponsiveProp<ShortHand<Spacing> | ShortHand<LayoutPadding>>"}]}},nowrap:{defaultValue:null,description:"",name:"nowrap",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},column:{defaultValue:null,description:"@deprecated Use `direction` instead.",name:"column",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},reverse:{defaultValue:null,description:"@deprecated Use `direction` instead.",name:"reverse",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},direction:{defaultValue:null,description:"",name:"direction",required:!1,type:{name:"enum",value:[{value:'"column"'},{value:'"row"'},{value:'"row-reverse"'},{value:'"column-reverse"'},{value:"ResponsiveProp<LayoutFlexDirection>"}]}},justifyContent:{defaultValue:null,description:"",name:"justifyContent",required:!1,type:{name:"enum",value:[{value:'"center"'},{value:'"start"'},{value:'"end"'},{value:'"space-between"'},{value:'"space-around"'},{value:'"space-evenly"'},{value:"ResponsiveProp<LayoutJustifyContent>"}]}},alignItems:{defaultValue:null,description:"",name:"alignItems",required:!1,type:{name:"enum",value:[{value:'"center"'},{value:'"start"'},{value:'"end"'},{value:'"stretch"'},{value:'"baseline"'},{value:"ResponsiveProp<LayoutAlignItems>"}]}},tag:{defaultValue:null,description:"",name:"tag",required:!1,type:{name:"enum",value:[{value:'"p"'},{value:'"div"'},{value:'"span"'},{value:'"main"'},{value:'"header"'},{value:'"footer"'},{value:'"article"'},{value:'"section"'},{value:'"ul"'},{value:'"ol"'},{value:'"li"'},{value:'"fieldset"'},{value:'"table"'},{value:'"th"'},{value:'"tr"'},{value:'"td"'},{value:'"thead"'},{value:'"tfoot"'},{value:'"tbody"'},{value:'"caption"'},{value:'"figure"'},{value:'"figcaption"'}]}},hide:{defaultValue:null,description:"",name:"hide",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:"ResponsiveProp<boolean>"}]}},relative:{defaultValue:null,description:"",name:"relative",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:"ResponsiveProp<boolean>"}]}},inline:{defaultValue:null,description:"",name:"inline",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"(instance: HTMLElement | null) => void"},{value:"RefObject<HTMLElement>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}export{m as L};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as t}from"./jsx-runtime-BYouaCF_.js";import{a as e,L as h}from"./LayoutGridItem-
|
|
1
|
+
import{j as t}from"./jsx-runtime-BYouaCF_.js";import{a as e,L as h}from"./LayoutGridItem-DPLTfQDr.js";import{S as n,a as m}from"./consts-KAYct7Gj.js";import"./index-B3evPFBL.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./classNames-BUL1Zq7e.js";import"./breakpoints-BfMlrtxE.js";import"./layout-relative.module-ed9bC4H4.js";import"./align-self-BM6l9H5Z.js";import"./constants-DYYVurUY.js";import"./defaults-B1rzzf6M.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./index-DdzHuZ-Y.js";import"./componentNames-CpCJzpB9.js";const G={title:"components/LayoutGrid",component:h,subcomponents:{LayoutGridItem:e},argTypes:{gap:{description:n},padding:{description:m},columns:{description:n},justifyContent:{description:n},alignItems:{description:n},justifyItems:{description:n},hide:{description:n},relative:{description:n}}},o=()=>t.jsxs(h,{columns:4,alignItems:"start",gap:"xs",children:[t.jsx(e,{children:t.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"0.25rem"},children:[t.jsx("div",{style:{height:"2ch",backgroundColor:"hotpink"}}),t.jsx("div",{style:{height:"2ch",backgroundColor:"hotpink"}})]})}),t.jsx(e,{alignSelf:"end",children:t.jsx("div",{style:{height:"2ch",backgroundColor:"hotpink"}})}),t.jsx("div",{style:{height:"2ch",backgroundColor:"hotpink"}}),t.jsx("div",{style:{height:"2ch",backgroundColor:"hotpink"}})]});o.storyName="LayoutGrid";const i={parameters:{chromatic:{disableSnapshot:!0}},args:{gap:"16",columns:3,alignItems:"start",children:t.jsxs(t.Fragment,{children:[t.jsx("div",{style:{minWidth:"100px",minHeight:50,backgroundColor:"hotpink"},children:" "}),t.jsx("div",{style:{minWidth:"100px",minHeight:75,backgroundColor:"hotpink"},children:" "}),t.jsx("div",{style:{minWidth:"100px",minHeight:100,backgroundColor:"hotpink",textAlign:"center"}})]}),dataset:{qaid:"layout-grid"}},argTypes:{dataset:{control:"object"},columns:{control:"number"},justifyItems:{control:"select"},hide:{control:"boolean"},relative:{control:"boolean"},children:{control:!1}}};var r,s,a;o.parameters={...o.parameters,docs:{...(r=o.parameters)==null?void 0:r.docs,source:{originalSource:`() => <LayoutGrid columns={4} alignItems="start" gap="xs">
|
|
2
2
|
<LayoutGridItem>
|
|
3
3
|
<div style={{
|
|
4
4
|
display: 'flex',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{j as g}from"./jsx-runtime-BYouaCF_.js";import{r as j}from"./index-B3evPFBL.js";import{a as I,m as _,s as y}from"./classNames-BUL1Zq7e.js";import{B as P}from"./breakpoints-BfMlrtxE.js";import{s as V,g as S}from"./layout-relative.module-ed9bC4H4.js";import{a as w,b as h,g as q}from"./align-self-BM6l9H5Z.js";import{k as O,f as D,L as b}from"./defaults-B1rzzf6M.js";import{f as C}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{g as N}from"./index-DdzHuZ-Y.js";import{w as G}from"./componentNames-CpCJzpB9.js";const U="LayoutGrid__SRDdo",R={LayoutGrid:U,"LayoutGrid--justify-content-center":"LayoutGrid--justify-content-center__vI9m1","LayoutGrid--justify-content-start":"LayoutGrid--justify-content-start__oyqGC","LayoutGrid--justify-content-end":"LayoutGrid--justify-content-end__RMTO2","LayoutGrid--justify-content-space-between":"LayoutGrid--justify-content-space-between__lvZnD","LayoutGrid--justify-content-space-around":"LayoutGrid--justify-content-space-around__Tl4FE","LayoutGrid--justify-content-space-evenly":"LayoutGrid--justify-content-space-evenly__KzBOQ","LayoutGrid--narrow-l--justify-content-center":"LayoutGrid--narrow-l--justify-content-center__nQPPi","LayoutGrid--narrow-l--justify-content-start":"LayoutGrid--narrow-l--justify-content-start__K7PbL","LayoutGrid--narrow-l--justify-content-end":"LayoutGrid--narrow-l--justify-content-end__UHZNO","LayoutGrid--narrow-l--justify-content-space-between":"LayoutGrid--narrow-l--justify-content-space-between__hgFor","LayoutGrid--narrow-l--justify-content-space-around":"LayoutGrid--narrow-l--justify-content-space-around__Ec1Tu","LayoutGrid--narrow-l--justify-content-space-evenly":"LayoutGrid--narrow-l--justify-content-space-evenly__TjQzB","LayoutGrid--medium-s--justify-content-center":"LayoutGrid--medium-s--justify-content-center__2xRJU","LayoutGrid--medium-s--justify-content-start":"LayoutGrid--medium-s--justify-content-start__5YYfG","LayoutGrid--medium-s--justify-content-end":"LayoutGrid--medium-s--justify-content-end__tNaVV","LayoutGrid--medium-s--justify-content-space-between":"LayoutGrid--medium-s--justify-content-space-between__Yw2DU","LayoutGrid--medium-s--justify-content-space-around":"LayoutGrid--medium-s--justify-content-space-around__GzjIX","LayoutGrid--medium-s--justify-content-space-evenly":"LayoutGrid--medium-s--justify-content-space-evenly__wtV7Y","LayoutGrid--medium-l--justify-content-center":"LayoutGrid--medium-l--justify-content-center__6Z3HK","LayoutGrid--medium-l--justify-content-start":"LayoutGrid--medium-l--justify-content-start__eCE0H","LayoutGrid--medium-l--justify-content-end":"LayoutGrid--medium-l--justify-content-end__WUHhq","LayoutGrid--medium-l--justify-content-space-between":"LayoutGrid--medium-l--justify-content-space-between__dzn5s","LayoutGrid--medium-l--justify-content-space-around":"LayoutGrid--medium-l--justify-content-space-around__1jJy-","LayoutGrid--medium-l--justify-content-space-evenly":"LayoutGrid--medium-l--justify-content-space-evenly__SALxb","LayoutGrid--wide-s--justify-content-center":"LayoutGrid--wide-s--justify-content-center__O2AmA","LayoutGrid--wide-s--justify-content-start":"LayoutGrid--wide-s--justify-content-start__M128c","LayoutGrid--wide-s--justify-content-end":"LayoutGrid--wide-s--justify-content-end__Edf7b","LayoutGrid--wide-s--justify-content-space-between":"LayoutGrid--wide-s--justify-content-space-between__sCWUj","LayoutGrid--wide-s--justify-content-space-around":"LayoutGrid--wide-s--justify-content-space-around__OqKb-","LayoutGrid--wide-s--justify-content-space-evenly":"LayoutGrid--wide-s--justify-content-space-evenly__BqAco","LayoutGrid--wide-l--justify-content-center":"LayoutGrid--wide-l--justify-content-center__WT24m","LayoutGrid--wide-l--justify-content-start":"LayoutGrid--wide-l--justify-content-start__pavdA","LayoutGrid--wide-l--justify-content-end":"LayoutGrid--wide-l--justify-content-end__US-V2","LayoutGrid--wide-l--justify-content-space-between":"LayoutGrid--wide-l--justify-content-space-between__31Ivo","LayoutGrid--wide-l--justify-content-space-around":"LayoutGrid--wide-l--justify-content-space-around__sbmBA","LayoutGrid--wide-l--justify-content-space-evenly":"LayoutGrid--wide-l--justify-content-space-evenly__VBy-1","LayoutGrid--align-items-center":"LayoutGrid--align-items-center__cAn-E","LayoutGrid--align-items-start":"LayoutGrid--align-items-start__iIBPs","LayoutGrid--align-items-end":"LayoutGrid--align-items-end__bi0Vt","LayoutGrid--align-items-stretch":"LayoutGrid--align-items-stretch__vyo1N","LayoutGrid--align-items-baseline":"LayoutGrid--align-items-baseline__iWU1b","LayoutGrid--narrow-l--align-items-center":"LayoutGrid--narrow-l--align-items-center__L5fan","LayoutGrid--narrow-l--align-items-start":"LayoutGrid--narrow-l--align-items-start__EZBkc","LayoutGrid--narrow-l--align-items-end":"LayoutGrid--narrow-l--align-items-end__igLCn","LayoutGrid--narrow-l--align-items-stretch":"LayoutGrid--narrow-l--align-items-stretch__jsoOx","LayoutGrid--narrow-l--align-items-baseline":"LayoutGrid--narrow-l--align-items-baseline__HJvGK","LayoutGrid--medium-s--align-items-center":"LayoutGrid--medium-s--align-items-center__YHCsG","LayoutGrid--medium-s--align-items-start":"LayoutGrid--medium-s--align-items-start__-x5jL","LayoutGrid--medium-s--align-items-end":"LayoutGrid--medium-s--align-items-end__5vxaA","LayoutGrid--medium-s--align-items-stretch":"LayoutGrid--medium-s--align-items-stretch__Oo3Jn","LayoutGrid--medium-s--align-items-baseline":"LayoutGrid--medium-s--align-items-baseline__N5jnU","LayoutGrid--medium-l--align-items-center":"LayoutGrid--medium-l--align-items-center__sOLNh","LayoutGrid--medium-l--align-items-start":"LayoutGrid--medium-l--align-items-start__LlPIM","LayoutGrid--medium-l--align-items-end":"LayoutGrid--medium-l--align-items-end__kMMCT","LayoutGrid--medium-l--align-items-stretch":"LayoutGrid--medium-l--align-items-stretch__R0zx-","LayoutGrid--medium-l--align-items-baseline":"LayoutGrid--medium-l--align-items-baseline__EaOdU","LayoutGrid--wide-s--align-items-center":"LayoutGrid--wide-s--align-items-center__Ve-ZD","LayoutGrid--wide-s--align-items-start":"LayoutGrid--wide-s--align-items-start__28Z74","LayoutGrid--wide-s--align-items-end":"LayoutGrid--wide-s--align-items-end__TDXOu","LayoutGrid--wide-s--align-items-stretch":"LayoutGrid--wide-s--align-items-stretch__nHuLT","LayoutGrid--wide-s--align-items-baseline":"LayoutGrid--wide-s--align-items-baseline__pnhzS","LayoutGrid--wide-l--align-items-center":"LayoutGrid--wide-l--align-items-center__JTXQd","LayoutGrid--wide-l--align-items-start":"LayoutGrid--wide-l--align-items-start__Ghu5o","LayoutGrid--wide-l--align-items-end":"LayoutGrid--wide-l--align-items-end__6ReFW","LayoutGrid--wide-l--align-items-stretch":"LayoutGrid--wide-l--align-items-stretch__O0QQv","LayoutGrid--wide-l--align-items-baseline":"LayoutGrid--wide-l--align-items-baseline__sQjwX","LayoutGrid--justify-items-stretch":"LayoutGrid--justify-items-stretch__M9QcQ","LayoutGrid--justify-items-center":"LayoutGrid--justify-items-center__oTKUc","LayoutGrid--justify-items-start":"LayoutGrid--justify-items-start__VYPnF","LayoutGrid--justify-items-end":"LayoutGrid--justify-items-end__8CwwZ","LayoutGrid--narrow-l--justify-items-stretch":"LayoutGrid--narrow-l--justify-items-stretch__kvCGG","LayoutGrid--narrow-l--justify-items-center":"LayoutGrid--narrow-l--justify-items-center__3ItXk","LayoutGrid--narrow-l--justify-items-start":"LayoutGrid--narrow-l--justify-items-start__Bhi3s","LayoutGrid--narrow-l--justify-items-end":"LayoutGrid--narrow-l--justify-items-end__gc2Ku","LayoutGrid--medium-s--justify-items-stretch":"LayoutGrid--medium-s--justify-items-stretch__tuwxD","LayoutGrid--medium-s--justify-items-center":"LayoutGrid--medium-s--justify-items-center__atoXy","LayoutGrid--medium-s--justify-items-start":"LayoutGrid--medium-s--justify-items-start__TmFN1","LayoutGrid--medium-s--justify-items-end":"LayoutGrid--medium-s--justify-items-end__jfl4-","LayoutGrid--medium-l--justify-items-stretch":"LayoutGrid--medium-l--justify-items-stretch__H23wm","LayoutGrid--medium-l--justify-items-center":"LayoutGrid--medium-l--justify-items-center__U-RzH","LayoutGrid--medium-l--justify-items-start":"LayoutGrid--medium-l--justify-items-start__0UVBd","LayoutGrid--medium-l--justify-items-end":"LayoutGrid--medium-l--justify-items-end__GDL0T","LayoutGrid--wide-s--justify-items-stretch":"LayoutGrid--wide-s--justify-items-stretch__3eMVC","LayoutGrid--wide-s--justify-items-center":"LayoutGrid--wide-s--justify-items-center__i7AtD","LayoutGrid--wide-s--justify-items-start":"LayoutGrid--wide-s--justify-items-start__O80gc","LayoutGrid--wide-s--justify-items-end":"LayoutGrid--wide-s--justify-items-end__IleZr","LayoutGrid--wide-l--justify-items-stretch":"LayoutGrid--wide-l--justify-items-stretch__P8KTm","LayoutGrid--wide-l--justify-items-center":"LayoutGrid--wide-l--justify-items-center__sXqXH","LayoutGrid--wide-l--justify-items-start":"LayoutGrid--wide-l--justify-items-start__QngDX","LayoutGrid--wide-l--justify-items-end":"LayoutGrid--wide-l--justify-items-end__wa8k8","LayoutGrid--columns":"LayoutGrid--columns__rVisq","LayoutGrid--columns-narrow-l":"LayoutGrid--columns-narrow-l__UBDfA","LayoutGrid--columns-medium-s":"LayoutGrid--columns-medium-s__lzA5l","LayoutGrid--columns-medium-l":"LayoutGrid--columns-medium-l__CM0CJ","LayoutGrid--columns-wide-s":"LayoutGrid--columns-wide-s__RUz4B","LayoutGrid--columns-wide-l":"LayoutGrid--columns-wide-l__qXJC-"},x="LayoutGrid",E=Object.keys(P),f=e=>typeof e=="number"?`repeat(${e}, 1fr)`:e.join(" "),H=e=>typeof e=="object"&&!Array.isArray(e)?Object.entries(e).reduce((a,[u,t])=>({...a,...t?{[u]:f(t)}:{}}),{_:f(e._)}):{_:f(e)},k=e=>{if(!e)return{classNames:[],style:{}};const a=H(e),u=E.filter(i=>a[i]),t=I(R,x,["columns",...u.map(i=>`columns-${i}`)]),n=u.reduce((i,s)=>({...i,[`--columns-${s}`]:a[s]}),{"--columns":a._});return{classNames:t,style:n}},z="LayoutGap",M=e=>_(V,z,[y("gap",e)]),Y="LayoutGrid",B=(e,a)=>{const{gap:u=O,padding:t=D,justifyContent:n,alignItems:i,justifyItems:s,hide:l,relative:r}=a||{},o=_(R,Y,[y("justify-content",n),y("align-items",i),y("justify-items",s)]),d=M(u),m=S(t),c=w(l,"grid"),L=h(r);return[...o,...d,...m,...c,...L]},v=j.forwardRef(function({dataset:a,children:u,...t},n){const{tag:i=b,columns:s}=t,l=B("grid",t),{style:r,classNames:o}=k(s),d=[...l,...o],m={...C(t),ref:n,className:d.join(" "),style:r,...N(a,{preplyDsComponent:G.LayoutGrid})};return g.jsx(i,{...m,children:u})});try{v.displayName="LayoutGrid",v.__docgenInfo={description:"A CSS `grid` wrapper.",displayName:"LayoutGrid",props:{gap:{defaultValue:null,description:"",name:"gap",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"s"'},{value:'"m"'},{value:'"l"'},{value:'"xl"'},{value:'"2xs"'},{value:'"none"'},{value:'"3xs"'},{value:"ResponsiveProp<LayoutGap>"},{value:'"0"'},{value:'"1"'},{value:'"2"'},{value:'"4"'},{value:'"8"'},{value:'"12"'},{value:'"16"'},{value:'"20"'},{value:'"24"'},{value:'"32"'},{value:'"48"'},{value:'"64"'},{value:'"96"'},{value:'"160"'},{value:"ResponsiveProp<Spacing>"}]}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"s"'},{value:'"m"'},{value:'"l"'},{value:'"xl"'},{value:'"2xs"'},{value:'"none"'},{value:'"3xs"'},{value:'"0"'},{value:'"1"'},{value:'"2"'},{value:'"4"'},{value:'"8"'},{value:'"12"'},{value:'"16"'},{value:'"20"'},{value:'"24"'},{value:'"32"'},{value:'"48"'},{value:'"64"'},{value:'"96"'},{value:'"160"'},{value:"[LayoutPadding, LayoutPadding]"},{value:"[LayoutPadding, LayoutPadding, LayoutPadding]"},{value:"[LayoutPadding, LayoutPadding, LayoutPadding, LayoutPadding]"},{value:"[Spacing, Spacing]"},{value:"[Spacing, Spacing, Spacing]"},{value:"[Spacing, Spacing, Spacing, Spacing]"},{value:"ResponsiveProp<ShortHand<LayoutPadding> | ShortHand<Spacing>>"}]}},columns:{defaultValue:null,description:"The `number` of columns, or a `string[]` of `grid-template-columns`.\n@see {@link https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-columns}",name:"columns",required:!1,type:{name:"enum",value:[{value:"number"},{value:"string[]"},{value:"ResponsiveProp<number | string[]>"}]}},justifyContent:{defaultValue:null,description:"",name:"justifyContent",required:!1,type:{name:"enum",value:[{value:'"center"'},{value:'"start"'},{value:'"end"'},{value:'"space-between"'},{value:'"space-around"'},{value:'"space-evenly"'},{value:"ResponsiveProp<LayoutJustifyContent>"}]}},alignItems:{defaultValue:null,description:"",name:"alignItems",required:!1,type:{name:"enum",value:[{value:'"center"'},{value:'"start"'},{value:'"end"'},{value:'"stretch"'},{value:'"baseline"'},{value:"ResponsiveProp<LayoutAlignItems>"}]}},justifyItems:{defaultValue:null,description:"",name:"justifyItems",required:!1,type:{name:"enum",value:[{value:'"center"'},{value:'"start"'},{value:'"end"'},{value:'"stretch"'},{value:"ResponsiveProp<LayoutJustifyItems>"}]}},tag:{defaultValue:null,description:"",name:"tag",required:!1,type:{name:"enum",value:[{value:'"p"'},{value:'"div"'},{value:'"span"'},{value:'"main"'},{value:'"header"'},{value:'"footer"'},{value:'"article"'},{value:'"section"'},{value:'"ul"'},{value:'"ol"'},{value:'"li"'},{value:'"fieldset"'},{value:'"table"'},{value:'"th"'},{value:'"tr"'},{value:'"td"'},{value:'"thead"'},{value:'"tfoot"'},{value:'"tbody"'},{value:'"caption"'},{value:'"figure"'},{value:'"figcaption"'}]}},hide:{defaultValue:null,description:"",name:"hide",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:"ResponsiveProp<boolean>"}]}},relative:{defaultValue:null,description:"",name:"relative",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:"ResponsiveProp<boolean>"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"(instance: HTMLElement | null) => void"},{value:"RefObject<HTMLElement>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}const K="LayoutGridItem__GF0yx",Q={LayoutGridItem:K},p=j.forwardRef(function({children:a,alignSelf:u,tag:t,hide:n,relative:i,dataset:s,...l},r){const o=_(Q,G.LayoutGridItem,[]),d=q(u),m=w(n),c=h(i),L=[...o,...d,...m,...c],A=t??b,T={...C(l),ref:r,className:L.join(" "),...N(s,{preplyDsComponent:G.LayoutGridItem})};return g.jsx(A,{...T,children:a})});try{p.displayName="LayoutGridItem",p.__docgenInfo={description:"",displayName:"LayoutGridItem",props:{alignSelf:{defaultValue:null,description:"",name:"alignSelf",required:!1,type:{name:"enum",value:[{value:'"center"'},{value:'"start"'},{value:'"end"'},{value:'"stretch"'},{value:"ResponsiveProp<LayoutAlignSelf>"}]}},tag:{defaultValue:null,description:"",name:"tag",required:!1,type:{name:"enum",value:[{value:'"p"'},{value:'"div"'},{value:'"span"'},{value:'"main"'},{value:'"header"'},{value:'"footer"'},{value:'"article"'},{value:'"section"'},{value:'"ul"'},{value:'"ol"'},{value:'"li"'},{value:'"fieldset"'},{value:'"table"'},{value:'"th"'},{value:'"tr"'},{value:'"td"'},{value:'"thead"'},{value:'"tfoot"'},{value:'"tbody"'},{value:'"caption"'},{value:'"figure"'},{value:'"figcaption"'}]}},hide:{defaultValue:null,description:"",name:"hide",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:"ResponsiveProp<boolean>"}]}},relative:{defaultValue:null,description:"",name:"relative",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:"ResponsiveProp<boolean>"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"(instance: HTMLElement | null) => void"},{value:"RefObject<HTMLElement>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}export{v as L,p as a};
|
|
1
|
+
import{j as g}from"./jsx-runtime-BYouaCF_.js";import{r as j}from"./index-B3evPFBL.js";import{a as I,m as _,s as y}from"./classNames-BUL1Zq7e.js";import{B as P}from"./breakpoints-BfMlrtxE.js";import{s as V,g as S}from"./layout-relative.module-ed9bC4H4.js";import{a as w,b as h,g as q}from"./align-self-BM6l9H5Z.js";import{k as O,f as D,L as b}from"./defaults-B1rzzf6M.js";import{f as C}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{g as N}from"./index-DdzHuZ-Y.js";import{w as G}from"./componentNames-CpCJzpB9.js";const U="LayoutGrid__SRDdo",R={LayoutGrid:U,"LayoutGrid--justify-content-center":"LayoutGrid--justify-content-center__vI9m1","LayoutGrid--justify-content-start":"LayoutGrid--justify-content-start__oyqGC","LayoutGrid--justify-content-end":"LayoutGrid--justify-content-end__RMTO2","LayoutGrid--justify-content-space-between":"LayoutGrid--justify-content-space-between__lvZnD","LayoutGrid--justify-content-space-around":"LayoutGrid--justify-content-space-around__Tl4FE","LayoutGrid--justify-content-space-evenly":"LayoutGrid--justify-content-space-evenly__KzBOQ","LayoutGrid--narrow-l--justify-content-center":"LayoutGrid--narrow-l--justify-content-center__nQPPi","LayoutGrid--narrow-l--justify-content-start":"LayoutGrid--narrow-l--justify-content-start__K7PbL","LayoutGrid--narrow-l--justify-content-end":"LayoutGrid--narrow-l--justify-content-end__UHZNO","LayoutGrid--narrow-l--justify-content-space-between":"LayoutGrid--narrow-l--justify-content-space-between__hgFor","LayoutGrid--narrow-l--justify-content-space-around":"LayoutGrid--narrow-l--justify-content-space-around__Ec1Tu","LayoutGrid--narrow-l--justify-content-space-evenly":"LayoutGrid--narrow-l--justify-content-space-evenly__TjQzB","LayoutGrid--medium-s--justify-content-center":"LayoutGrid--medium-s--justify-content-center__2xRJU","LayoutGrid--medium-s--justify-content-start":"LayoutGrid--medium-s--justify-content-start__5YYfG","LayoutGrid--medium-s--justify-content-end":"LayoutGrid--medium-s--justify-content-end__tNaVV","LayoutGrid--medium-s--justify-content-space-between":"LayoutGrid--medium-s--justify-content-space-between__Yw2DU","LayoutGrid--medium-s--justify-content-space-around":"LayoutGrid--medium-s--justify-content-space-around__GzjIX","LayoutGrid--medium-s--justify-content-space-evenly":"LayoutGrid--medium-s--justify-content-space-evenly__wtV7Y","LayoutGrid--medium-l--justify-content-center":"LayoutGrid--medium-l--justify-content-center__6Z3HK","LayoutGrid--medium-l--justify-content-start":"LayoutGrid--medium-l--justify-content-start__eCE0H","LayoutGrid--medium-l--justify-content-end":"LayoutGrid--medium-l--justify-content-end__WUHhq","LayoutGrid--medium-l--justify-content-space-between":"LayoutGrid--medium-l--justify-content-space-between__dzn5s","LayoutGrid--medium-l--justify-content-space-around":"LayoutGrid--medium-l--justify-content-space-around__1jJy-","LayoutGrid--medium-l--justify-content-space-evenly":"LayoutGrid--medium-l--justify-content-space-evenly__SALxb","LayoutGrid--wide-s--justify-content-center":"LayoutGrid--wide-s--justify-content-center__O2AmA","LayoutGrid--wide-s--justify-content-start":"LayoutGrid--wide-s--justify-content-start__M128c","LayoutGrid--wide-s--justify-content-end":"LayoutGrid--wide-s--justify-content-end__Edf7b","LayoutGrid--wide-s--justify-content-space-between":"LayoutGrid--wide-s--justify-content-space-between__sCWUj","LayoutGrid--wide-s--justify-content-space-around":"LayoutGrid--wide-s--justify-content-space-around__OqKb-","LayoutGrid--wide-s--justify-content-space-evenly":"LayoutGrid--wide-s--justify-content-space-evenly__BqAco","LayoutGrid--wide-l--justify-content-center":"LayoutGrid--wide-l--justify-content-center__WT24m","LayoutGrid--wide-l--justify-content-start":"LayoutGrid--wide-l--justify-content-start__pavdA","LayoutGrid--wide-l--justify-content-end":"LayoutGrid--wide-l--justify-content-end__US-V2","LayoutGrid--wide-l--justify-content-space-between":"LayoutGrid--wide-l--justify-content-space-between__31Ivo","LayoutGrid--wide-l--justify-content-space-around":"LayoutGrid--wide-l--justify-content-space-around__sbmBA","LayoutGrid--wide-l--justify-content-space-evenly":"LayoutGrid--wide-l--justify-content-space-evenly__VBy-1","LayoutGrid--align-items-center":"LayoutGrid--align-items-center__cAn-E","LayoutGrid--align-items-start":"LayoutGrid--align-items-start__iIBPs","LayoutGrid--align-items-end":"LayoutGrid--align-items-end__bi0Vt","LayoutGrid--align-items-stretch":"LayoutGrid--align-items-stretch__vyo1N","LayoutGrid--align-items-baseline":"LayoutGrid--align-items-baseline__iWU1b","LayoutGrid--narrow-l--align-items-center":"LayoutGrid--narrow-l--align-items-center__L5fan","LayoutGrid--narrow-l--align-items-start":"LayoutGrid--narrow-l--align-items-start__EZBkc","LayoutGrid--narrow-l--align-items-end":"LayoutGrid--narrow-l--align-items-end__igLCn","LayoutGrid--narrow-l--align-items-stretch":"LayoutGrid--narrow-l--align-items-stretch__jsoOx","LayoutGrid--narrow-l--align-items-baseline":"LayoutGrid--narrow-l--align-items-baseline__HJvGK","LayoutGrid--medium-s--align-items-center":"LayoutGrid--medium-s--align-items-center__YHCsG","LayoutGrid--medium-s--align-items-start":"LayoutGrid--medium-s--align-items-start__-x5jL","LayoutGrid--medium-s--align-items-end":"LayoutGrid--medium-s--align-items-end__5vxaA","LayoutGrid--medium-s--align-items-stretch":"LayoutGrid--medium-s--align-items-stretch__Oo3Jn","LayoutGrid--medium-s--align-items-baseline":"LayoutGrid--medium-s--align-items-baseline__N5jnU","LayoutGrid--medium-l--align-items-center":"LayoutGrid--medium-l--align-items-center__sOLNh","LayoutGrid--medium-l--align-items-start":"LayoutGrid--medium-l--align-items-start__LlPIM","LayoutGrid--medium-l--align-items-end":"LayoutGrid--medium-l--align-items-end__kMMCT","LayoutGrid--medium-l--align-items-stretch":"LayoutGrid--medium-l--align-items-stretch__R0zx-","LayoutGrid--medium-l--align-items-baseline":"LayoutGrid--medium-l--align-items-baseline__EaOdU","LayoutGrid--wide-s--align-items-center":"LayoutGrid--wide-s--align-items-center__Ve-ZD","LayoutGrid--wide-s--align-items-start":"LayoutGrid--wide-s--align-items-start__28Z74","LayoutGrid--wide-s--align-items-end":"LayoutGrid--wide-s--align-items-end__TDXOu","LayoutGrid--wide-s--align-items-stretch":"LayoutGrid--wide-s--align-items-stretch__nHuLT","LayoutGrid--wide-s--align-items-baseline":"LayoutGrid--wide-s--align-items-baseline__pnhzS","LayoutGrid--wide-l--align-items-center":"LayoutGrid--wide-l--align-items-center__JTXQd","LayoutGrid--wide-l--align-items-start":"LayoutGrid--wide-l--align-items-start__Ghu5o","LayoutGrid--wide-l--align-items-end":"LayoutGrid--wide-l--align-items-end__6ReFW","LayoutGrid--wide-l--align-items-stretch":"LayoutGrid--wide-l--align-items-stretch__O0QQv","LayoutGrid--wide-l--align-items-baseline":"LayoutGrid--wide-l--align-items-baseline__sQjwX","LayoutGrid--justify-items-stretch":"LayoutGrid--justify-items-stretch__M9QcQ","LayoutGrid--justify-items-center":"LayoutGrid--justify-items-center__oTKUc","LayoutGrid--justify-items-start":"LayoutGrid--justify-items-start__VYPnF","LayoutGrid--justify-items-end":"LayoutGrid--justify-items-end__8CwwZ","LayoutGrid--narrow-l--justify-items-stretch":"LayoutGrid--narrow-l--justify-items-stretch__kvCGG","LayoutGrid--narrow-l--justify-items-center":"LayoutGrid--narrow-l--justify-items-center__3ItXk","LayoutGrid--narrow-l--justify-items-start":"LayoutGrid--narrow-l--justify-items-start__Bhi3s","LayoutGrid--narrow-l--justify-items-end":"LayoutGrid--narrow-l--justify-items-end__gc2Ku","LayoutGrid--medium-s--justify-items-stretch":"LayoutGrid--medium-s--justify-items-stretch__tuwxD","LayoutGrid--medium-s--justify-items-center":"LayoutGrid--medium-s--justify-items-center__atoXy","LayoutGrid--medium-s--justify-items-start":"LayoutGrid--medium-s--justify-items-start__TmFN1","LayoutGrid--medium-s--justify-items-end":"LayoutGrid--medium-s--justify-items-end__jfl4-","LayoutGrid--medium-l--justify-items-stretch":"LayoutGrid--medium-l--justify-items-stretch__H23wm","LayoutGrid--medium-l--justify-items-center":"LayoutGrid--medium-l--justify-items-center__U-RzH","LayoutGrid--medium-l--justify-items-start":"LayoutGrid--medium-l--justify-items-start__0UVBd","LayoutGrid--medium-l--justify-items-end":"LayoutGrid--medium-l--justify-items-end__GDL0T","LayoutGrid--wide-s--justify-items-stretch":"LayoutGrid--wide-s--justify-items-stretch__3eMVC","LayoutGrid--wide-s--justify-items-center":"LayoutGrid--wide-s--justify-items-center__i7AtD","LayoutGrid--wide-s--justify-items-start":"LayoutGrid--wide-s--justify-items-start__O80gc","LayoutGrid--wide-s--justify-items-end":"LayoutGrid--wide-s--justify-items-end__IleZr","LayoutGrid--wide-l--justify-items-stretch":"LayoutGrid--wide-l--justify-items-stretch__P8KTm","LayoutGrid--wide-l--justify-items-center":"LayoutGrid--wide-l--justify-items-center__sXqXH","LayoutGrid--wide-l--justify-items-start":"LayoutGrid--wide-l--justify-items-start__QngDX","LayoutGrid--wide-l--justify-items-end":"LayoutGrid--wide-l--justify-items-end__wa8k8","LayoutGrid--columns":"LayoutGrid--columns__rVisq","LayoutGrid--columns-narrow-l":"LayoutGrid--columns-narrow-l__UBDfA","LayoutGrid--columns-medium-s":"LayoutGrid--columns-medium-s__lzA5l","LayoutGrid--columns-medium-l":"LayoutGrid--columns-medium-l__CM0CJ","LayoutGrid--columns-wide-s":"LayoutGrid--columns-wide-s__RUz4B","LayoutGrid--columns-wide-l":"LayoutGrid--columns-wide-l__qXJC-"},x="LayoutGrid",E=Object.keys(P),f=e=>typeof e=="number"?`repeat(${e}, 1fr)`:e.join(" "),H=e=>typeof e=="object"&&!Array.isArray(e)?Object.entries(e).reduce((a,[u,t])=>({...a,...t?{[u]:f(t)}:{}}),{_:f(e._)}):{_:f(e)},k=e=>{if(!e)return{classNames:[],style:{}};const a=H(e),u=E.filter(i=>a[i]),t=I(R,x,["columns",...u.map(i=>`columns-${i}`)]),n=u.reduce((i,s)=>({...i,[`--columns-${s}`]:a[s]}),{"--columns":a._});return{classNames:t,style:n}},z="LayoutGap",M=e=>_(V,z,[y("gap",e)]),Y="LayoutGrid",B=(e,a)=>{const{gap:u=O,padding:t=D,justifyContent:n,alignItems:i,justifyItems:s,hide:l,relative:r}=a||{},o=_(R,Y,[y("justify-content",n),y("align-items",i),y("justify-items",s)]),d=M(u),m=S(t),c=w(l,"grid"),L=h(r);return[...o,...d,...m,...c,...L]},v=j.forwardRef(function({dataset:a,children:u,...t},n){const{tag:i=b,columns:s}=t,l=B("grid",t),{style:r,classNames:o}=k(s),d=[...l,...o],m={...C(t),ref:n,className:d.join(" "),style:r,...N(a,{preplyDsComponent:G.LayoutGrid})};return g.jsx(i,{...m,children:u})});try{v.displayName="LayoutGrid",v.__docgenInfo={description:"A CSS `grid` wrapper.",displayName:"LayoutGrid",props:{gap:{defaultValue:null,description:"",name:"gap",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"s"'},{value:'"m"'},{value:'"l"'},{value:'"xl"'},{value:'"none"'},{value:'"2"'},{value:'"4"'},{value:'"8"'},{value:'"0"'},{value:'"12"'},{value:'"16"'},{value:'"24"'},{value:'"32"'},{value:'"48"'},{value:'"64"'},{value:'"96"'},{value:'"160"'},{value:'"3xs"'},{value:'"2xs"'},{value:'"1"'},{value:'"20"'},{value:"ResponsiveProp<LayoutGap>"},{value:"ResponsiveProp<Spacing>"}]}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"s"'},{value:'"m"'},{value:'"l"'},{value:'"xl"'},{value:'"none"'},{value:'"2"'},{value:'"4"'},{value:'"8"'},{value:'"0"'},{value:'"12"'},{value:'"16"'},{value:'"24"'},{value:'"32"'},{value:'"48"'},{value:'"64"'},{value:'"96"'},{value:'"160"'},{value:'"3xs"'},{value:'"2xs"'},{value:'"1"'},{value:'"20"'},{value:"[Spacing, Spacing]"},{value:"[Spacing, Spacing, Spacing]"},{value:"[Spacing, Spacing, Spacing, Spacing]"},{value:"[LayoutPadding, LayoutPadding]"},{value:"[LayoutPadding, LayoutPadding, LayoutPadding]"},{value:"[LayoutPadding, LayoutPadding, LayoutPadding, LayoutPadding]"},{value:"ResponsiveProp<ShortHand<Spacing> | ShortHand<LayoutPadding>>"}]}},columns:{defaultValue:null,description:"The `number` of columns, or a `string[]` of `grid-template-columns`.\n@see {@link https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-columns}",name:"columns",required:!1,type:{name:"enum",value:[{value:"number"},{value:"string[]"},{value:"ResponsiveProp<number | string[]>"}]}},justifyContent:{defaultValue:null,description:"",name:"justifyContent",required:!1,type:{name:"enum",value:[{value:'"center"'},{value:'"start"'},{value:'"end"'},{value:'"space-between"'},{value:'"space-around"'},{value:'"space-evenly"'},{value:"ResponsiveProp<LayoutJustifyContent>"}]}},alignItems:{defaultValue:null,description:"",name:"alignItems",required:!1,type:{name:"enum",value:[{value:'"center"'},{value:'"start"'},{value:'"end"'},{value:'"stretch"'},{value:'"baseline"'},{value:"ResponsiveProp<LayoutAlignItems>"}]}},justifyItems:{defaultValue:null,description:"",name:"justifyItems",required:!1,type:{name:"enum",value:[{value:'"center"'},{value:'"start"'},{value:'"end"'},{value:'"stretch"'},{value:"ResponsiveProp<LayoutJustifyItems>"}]}},tag:{defaultValue:null,description:"",name:"tag",required:!1,type:{name:"enum",value:[{value:'"p"'},{value:'"div"'},{value:'"span"'},{value:'"main"'},{value:'"header"'},{value:'"footer"'},{value:'"article"'},{value:'"section"'},{value:'"ul"'},{value:'"ol"'},{value:'"li"'},{value:'"fieldset"'},{value:'"table"'},{value:'"th"'},{value:'"tr"'},{value:'"td"'},{value:'"thead"'},{value:'"tfoot"'},{value:'"tbody"'},{value:'"caption"'},{value:'"figure"'},{value:'"figcaption"'}]}},hide:{defaultValue:null,description:"",name:"hide",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:"ResponsiveProp<boolean>"}]}},relative:{defaultValue:null,description:"",name:"relative",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:"ResponsiveProp<boolean>"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"(instance: HTMLElement | null) => void"},{value:"RefObject<HTMLElement>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}const K="LayoutGridItem__GF0yx",Q={LayoutGridItem:K},p=j.forwardRef(function({children:a,alignSelf:u,tag:t,hide:n,relative:i,dataset:s,...l},r){const o=_(Q,G.LayoutGridItem,[]),d=q(u),m=w(n),c=h(i),L=[...o,...d,...m,...c],A=t??b,T={...C(l),ref:r,className:L.join(" "),...N(s,{preplyDsComponent:G.LayoutGridItem})};return g.jsx(A,{...T,children:a})});try{p.displayName="LayoutGridItem",p.__docgenInfo={description:"",displayName:"LayoutGridItem",props:{alignSelf:{defaultValue:null,description:"",name:"alignSelf",required:!1,type:{name:"enum",value:[{value:'"center"'},{value:'"start"'},{value:'"end"'},{value:'"stretch"'},{value:"ResponsiveProp<LayoutAlignSelf>"}]}},tag:{defaultValue:null,description:"",name:"tag",required:!1,type:{name:"enum",value:[{value:'"p"'},{value:'"div"'},{value:'"span"'},{value:'"main"'},{value:'"header"'},{value:'"footer"'},{value:'"article"'},{value:'"section"'},{value:'"ul"'},{value:'"ol"'},{value:'"li"'},{value:'"fieldset"'},{value:'"table"'},{value:'"th"'},{value:'"tr"'},{value:'"td"'},{value:'"thead"'},{value:'"tfoot"'},{value:'"tbody"'},{value:'"caption"'},{value:'"figure"'},{value:'"figcaption"'}]}},hide:{defaultValue:null,description:"",name:"hide",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:"ResponsiveProp<boolean>"}]}},relative:{defaultValue:null,description:"",name:"relative",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:"ResponsiveProp<boolean>"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"(instance: HTMLElement | null) => void"},{value:"RefObject<HTMLElement>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}export{v as L,p as a};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-BYouaCF_.js";import{T as n}from"./Text-
|
|
1
|
+
import{j as e}from"./jsx-runtime-BYouaCF_.js";import{T as n}from"./Text-BO29RJXG.js";import{r as k}from"./index-B3evPFBL.js";import{f as Q}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{g as Z}from"./defaults-B1rzzf6M.js";import{u as ee}from"./useHostname-CH18gHFj.js";import{m as ae,s as x,b as f}from"./classNames-BUL1Zq7e.js";import{w as y}from"./componentNames-CpCJzpB9.js";import{a as ne,g as te}from"./index-DdzHuZ-Y.js";import{g as d}from"./getTokenVar-DU_DEzTd.js";import{c as u}from"./tokens-ZvFzTwDp.js";import"./text-accent-DZDDtpIt.js";import"./text-centered-CznToR0o.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./constants-BgBLeZzp.js";const re="Link__Jw0hc",ie={Link:re,"Link--inline":"Link--inline__aWJxC","Link--noUnderline":"Link--noUnderline__vuCBO","Link--variant-accentDark":"Link--variant-accentDark__5RCSd","Link--variant-accentDark--dsInternalSimulation-hover":"Link--variant-accentDark--dsInternalSimulation-hover__5vv1U","Link--variant-accentDark--dsInternalSimulation-active":"Link--variant-accentDark--dsInternalSimulation-active__-PYgd","Link--variant-accentDarkInverted":"Link--variant-accentDarkInverted__5GVfk","Link--variant-accentDarkInverted--dsInternalSimulation-hover":"Link--variant-accentDarkInverted--dsInternalSimulation-hover__u7g4B","Link--variant-accentDarkInverted--dsInternalSimulation-active":"Link--variant-accentDarkInverted--dsInternalSimulation-active__4bGgk","Link--variant-neutral":"Link--variant-neutral__v0PFp","Link--variant-neutral--dsInternalSimulation-hover":"Link--variant-neutral--dsInternalSimulation-hover__L-hBv","Link--variant-neutral--dsInternalSimulation-active":"Link--variant-neutral--dsInternalSimulation-active__5rs0z","Link--variant-neutralInverted":"Link--variant-neutralInverted__t9Ijl","Link--variant-neutralInverted--dsInternalSimulation-hover":"Link--variant-neutralInverted--dsInternalSimulation-hover__H50Xt","Link--variant-neutralInverted--dsInternalSimulation-active":"Link--variant-neutralInverted--dsInternalSimulation-active__Irr0h","Link--variant-unsetColors":"Link--variant-unsetColors__EEbF5","Link--variant-unsetColors--dsInternalSimulation-hover":"Link--variant-unsetColors--dsInternalSimulation-hover__vMIu6","Link--variant-unsetColors--dsInternalSimulation-active":"Link--variant-unsetColors--dsInternalSimulation-active__wlGTN"},a=k.forwardRef(function(E,P){const{variant:v=Z,href:R,download:A,opensInNewTab:H,nofollow:M,assistiveText:B,onClick:O,as:p,url:F,dataset:G,children:m,inline:J,dsInternalSimulation:z,noUnderline:W,...X}=E,$=ee(),K=ae(ie,y.Link,[x(`variant-${v}--dsInternalSimulation`,z),x("variant",v),f("inline",void 0,J),f("noUnderline",void 0,W)]),c=R||F,Y=c?ne($,c,H,M):{},h={...Q(X),ref:P,href:c,download:A,"aria-label":B,onClick:O,className:K.join(" "),...te(G,{preplyDsComponent:y.Link})};return p?k.cloneElement(p,{...h},m):e.jsx("a",{...h,...Y,children:m})});try{a.displayName="Link",a.__docgenInfo={description:`This is an inline element and will inherit font-size, line-height and
|
|
2
2
|
font-weight from the parent context. If you need to customise any of these
|
|
3
3
|
styles, all you have to do is wrap the <Link> in a Text or TextInline
|
|
4
4
|
component.`,displayName:"Link",props:{variant:{defaultValue:null,description:"",name:"variant",required:!1,type:{name:"enum",value:[{value:'"accentDark"'},{value:'"neutral"'},{value:'"accentDarkInverted"'},{value:'"neutralInverted"'},{value:'"unsetColors"'}]}},href:{defaultValue:null,description:"",name:"href",required:!1,type:{name:"enum",value:[{value:"string"}]}},download:{defaultValue:null,description:`When provided, instructs the browser to download the target (the file
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import{j as u}from"./jsx-runtime-BYouaCF_.js";import{r as V}from"./index-B3evPFBL.js";import{F as g}from"./FormControl-CeIJk4_Z.js";import{w as H}from"./componentNames-CpCJzpB9.js";import{I as L}from"./Input-
|
|
2
|
-
If not provided, will be generated for accessibility purposes.`,name:"id",required:!1,type:{name:"enum",value:[{value:"string"}]}},error:{defaultValue:null,description:"Error message to display when the field has an invalid value.",name:"error",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},
|
|
3
|
-
to provide more context or instructions to the user.`,name:"description",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},
|
|
1
|
+
import{j as u}from"./jsx-runtime-BYouaCF_.js";import{r as V}from"./index-B3evPFBL.js";import{F as g}from"./FormControl-CeIJk4_Z.js";import{w as H}from"./componentNames-CpCJzpB9.js";import{I as L}from"./Input-nsKLdjO3.js";const t=V.forwardRef(function({id:i,label:d,description:s,error:o,required:m,inputDataset:p,dataset:v,hideLabel:f,onClick:c,onValueChange:e,onChange:a,hasError:y,useLegacyRequiredLabel:b,className:I,style:R,...h},q){const E=l=>{a==null||a(l);const n=l.target.value;e==null||e(n?Number(n):void 0)};return u.jsx(g,{id:i,label:d,description:s,error:o,hasError:y,required:m,dataset:v,hideLabel:f,onClick:c,useLegacyRequiredLabel:b,preplyDsComponent:H.NumberField,children:u.jsx(L,{...h,type:"number",ref:q,dataset:p,onChange:E})})});try{t.displayName="NumberField",t.__docgenInfo={description:"",displayName:"NumberField",props:{id:{defaultValue:null,description:`The id to be passed to the input element.
|
|
2
|
+
If not provided, will be generated for accessibility purposes.`,name:"id",required:!1,type:{name:"enum",value:[{value:"string"}]}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler<HTMLDivElement> & MouseEventHandler<HTMLInputElement>"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},error:{defaultValue:null,description:"Error message to display when the field has an invalid value.",name:"error",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},label:{defaultValue:null,description:"The field label. This is needed for accessibility purposes, but can be\nhidden using the `hideLabel` prop.",name:"label",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},description:{defaultValue:null,description:`Additional descriptive text that appears below the input field
|
|
3
|
+
to provide more context or instructions to the user.`,name:"description",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},required:{defaultValue:null,description:`Indicates if the field is required. When false, adds a "Optional"
|
|
4
4
|
indicator next to the label.`,name:"required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},hasError:{defaultValue:null,description:"Whether the field has an error.\n@deprecated Use `error` prop to exlicitly describe the error to users",name:"hasError",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},hideLabel:{defaultValue:null,description:"Use this to hide the `label` visually, but keep it in the accessibility\ntree.",name:"hideLabel",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},useLegacyRequiredLabel:{defaultValue:null,description:`When true, adds a "Required" indicator next to the label for the required fields.
|
|
5
5
|
When false, adds a "Optional" indicator next to the label for the optional fields instead.
|
|
6
|
-
@deprecated This is a temporary solution for gradual migration to the "Optional" label.`,name:"useLegacyRequiredLabel",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},
|
|
6
|
+
@deprecated This is a temporary solution for gradual migration to the "Optional" label.`,name:"useLegacyRequiredLabel",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"enum",value:[{value:"string"}]}},name:{defaultValue:null,description:"",name:"name",required:!1,type:{name:"enum",value:[{value:"string"}]}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"enum",value:[{value:"ChangeEventHandler<HTMLInputElement>"}]}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<HTMLInputElement>"}]}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<HTMLInputElement>"}]}},button:{defaultValue:null,description:"",name:"button",required:!1,type:{name:"enum",value:[{value:"ReactElement<any, string | JSXElementConstructor<any>>"}]}},onCopy:{defaultValue:null,description:"",name:"onCopy",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<HTMLInputElement>"}]}},onCut:{defaultValue:null,description:"",name:"onCut",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<HTMLInputElement>"}]}},onPaste:{defaultValue:null,description:"",name:"onPaste",required:!1,type:{name:"enum",value:[{value:"ClipboardEventHandler<HTMLInputElement>"}]}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<HTMLInputElement>"}]}},onKeyUp:{defaultValue:null,description:"",name:"onKeyUp",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<HTMLInputElement>"}]}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"ReactElement<any, string | JSXElementConstructor<any>>"}]}},readOnly:{defaultValue:null,description:"",name:"readOnly",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},maxLength:{defaultValue:null,description:"",name:"maxLength",required:!1,type:{name:"enum",value:[{value:"number"}]}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"enum",value:[{value:"number"}]}},defaultValue:{defaultValue:null,description:"",name:"defaultValue",required:!1,type:{name:"enum",value:[{value:"number"}]}},onValueChange:{defaultValue:null,description:"",name:"onValueChange",required:!1,type:{name:"enum",value:[{value:"(value: number | undefined) => void"}]}},min:{defaultValue:null,description:"",name:"min",required:!1,type:{name:"enum",value:[{value:"number"}]}},max:{defaultValue:null,description:"",name:"max",required:!1,type:{name:"enum",value:[{value:"number"}]}},step:{defaultValue:null,description:"",name:"step",required:!1,type:{name:"enum",value:[{value:"number"}]}},inputDataset:{defaultValue:null,description:"",name:"inputDataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"(instance: HTMLInputElement | null) => void"},{value:"RefObject<HTMLInputElement>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}export{t as N};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as g}from"./jsx-runtime-BYouaCF_.js";import{r as re}from"./index-B3evPFBL.js";import{a as se}from"./chunk-D5ZWXAHU-BhFjjRSl.js";import{f as r,w as x,e as n,u as w}from"./index-DDyIDR-R.js";import{F as te}from"./TokyoUIPhone-BHLDT6dz.js";import{F as ie}from"./TokyoUIAttach-BvBvQVx_.js";import{I as ne}from"./Icon-
|
|
1
|
+
import{j as g}from"./jsx-runtime-BYouaCF_.js";import{r as re}from"./index-B3evPFBL.js";import{a as se}from"./chunk-D5ZWXAHU-BhFjjRSl.js";import{f as r,w as x,e as n,u as w}from"./index-DDyIDR-R.js";import{F as te}from"./TokyoUIPhone-BHLDT6dz.js";import{F as ie}from"./TokyoUIAttach-BvBvQVx_.js";import{I as ne}from"./Icon-w2ilcPHL.js";import{N as ae}from"./NumberField-DTaNQrnr.js";import{F as ce}from"./FieldButton-Bsa9_rJB.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./v4-CtRu48qb.js";import"./text-accent-DZDDtpIt.js";import"./classNames-BUL1Zq7e.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./render-icon-CVTdrNe-.js";import"./componentNames-CpCJzpB9.js";import"./index-DdzHuZ-Y.js";import"./defaults-B1rzzf6M.js";import"./FormControl-CeIJk4_Z.js";import"./index-DRKYGVyc.js";import"./index-BfBdt3zW.js";import"./tslib.es6-BntfKcQG.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./message-BraTJ16C.js";import"./Input-nsKLdjO3.js";import"./InputContainer-Bk0tgFnW.js";const je={title:"components/NumberField",component:ae,args:{name:"number",label:"Number",defaultValue:void 0,placeholder:"Enter a number",dataset:{testid:"field",foo:"bar"},inputDataset:{testid:"input",foo:"bar"},onChange:r(),onValueChange:r(),onBlur:r(),onFocus:r(),onClick:r(),onCopy:r(),onKeyDown:r(),onKeyUp:r(),onPaste:r()}},c={play:async({canvasElement:a,step:e,args:t})=>{const o=x(a),i=o.getByTestId("field"),s=o.getByTestId("input");await e("it should render correct label",async()=>{const oe=x(i).getByTestId("label");n(oe).toHaveTextContent("Number • Optional"),n(s).toHaveAccessibleName("Number")}),await e("it should call onFocus when the input is focused",async()=>{s.focus(),n(t.onFocus).toHaveBeenCalled()}),await e("it should call callback when the value changes",async()=>{await w.type(s,"42"),n(t.onValueChange).toHaveBeenCalledWith(42),n(t.onChange).toHaveBeenCalled()}),await e("it should call onBlur when the input is blurred",async()=>{await w.keyboard("{tab}"),n(t.onBlur).toHaveBeenCalled()}),await e("it should render the dataset props",async()=>{n(i).toHaveAttribute("data-testid","field"),n(i).toHaveAttribute("data-foo","bar"),n(s).toHaveAttribute("data-testid","input"),n(s).toHaveAttribute("data-foo","bar")})}},l={render:function(e){const[t,o]=re.useState(e.value);return g.jsx(ae,{...e,value:t,onChange:i=>{var s;o(Number(i.target.value)),(s=e.onChange)==null||s.call(e,i)}})},args:{label:"Controlled NumberField",placeholder:"Enter a number...",value:42},play:async({canvas:a,step:e})=>{await e("it should render the correct initial value",async()=>{const t=a.getByTestId("input");await n(t).toHaveValue(42)}),await e("it should update the value when the user types",async()=>{const t=a.getByTestId("input");await w.clear(t),await w.type(t,"100"),n(t).toHaveValue(100)})}},u={args:{icon:g.jsx(ne,{svg:te,dataset:{testid:"icon"}})},play:async({canvas:a,step:e})=>{await e("it should render the icon",async()=>{const t=a.getByTestId("icon");n(t).toBeInTheDocument()})}},d={args:{description:"Enter a valid number"},play:async({canvas:a,step:e})=>{const t=a.getByTestId("input"),o=a.getByTestId("description");await e("it should render the description",async()=>{n(t).toHaveAccessibleDescription("Enter a valid number"),n(o).toHaveTextContent("Enter a valid number")})}},p={args:{required:!0},play:async({canvas:a,step:e})=>{const t=a.getByTestId("input"),o=a.getByTestId("label");await e("it should render correct label",async()=>{n(t).toHaveAccessibleName("Number"),n(o).toHaveTextContent("Number")}),await e("it should render required attribute",async()=>{n(t).toHaveAttribute("required")})}},m={args:{hideLabel:!0},play:async({canvas:a,step:e})=>{await e("it should render correct a11y label",async()=>{const t=a.getByTestId("input");n(t).toHaveAccessibleName("Number")})}},b={args:{error:"This is an error message"},play:async({canvas:a,step:e})=>{const t=a.getByTestId("input"),o=a.getByTestId("error");await e("it should render the error message",async()=>{n(t).toHaveAccessibleErrorMessage("This is an error message"),n(o).toHaveTextContent("This is an error message")})}},h={args:{disabled:!0},play:async({canvas:a,step:e})=>{const t=a.getByTestId("input");await e("it should render the disabled input",async()=>{n(t).toHaveAttribute("disabled")})}},y={args:{readOnly:!0},play:async({canvas:a,step:e})=>{const t=a.getByTestId("input");await e("it should render the read only input",async()=>{n(t).toHaveAttribute("readonly")})}},v={parameters:{chromatic:{disableSnapshot:!0}},args:{label:"Number of lessons",placeholder:"How about 3?",description:"These lessons will be scheduled automatically"},argTypes:{label:{control:"text"},placeholder:{control:"text"},description:{control:"text"},error:{control:"text"},value:{control:"number"},defaultValue:{control:"number"},inputDataset:{control:"object"},dataset:{control:"object"},id:{control:"text"},required:{control:"boolean"},hideLabel:{control:"boolean"},name:{control:"text"},disabled:{control:"boolean"},readOnly:{control:"boolean"},min:{control:"number"},max:{control:"number"},step:{control:"number"},icon:{options:["None","With Icon"],mapping:{None:void 0,"With Icon":g.jsx(ne,{svg:te})},control:"select"},button:{options:["None","With Button"],mapping:{None:void 0,"With Button":g.jsx(ce,{svg:ie,assistiveText:"Do the thing",onClick:se("field button clicked")})},control:"select"},maxLength:{control:"number"},hasError:{table:{disable:!0}}}};var B,T,H,f,I;c.parameters={...c.parameters,docs:{...(B=c.parameters)==null?void 0:B.docs,source:{originalSource:`{
|
|
2
2
|
play: async ({
|
|
3
3
|
canvasElement,
|
|
4
4
|
step,
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as t}from"./jsx-runtime-BYouaCF_.js";import{r as n}from"./index-B3evPFBL.js";import{R as _,A as q,P as x,C as O,a as N,b as E}from"./index-jPlWeKki.js";import{F as k}from"./TokyoUIClose-DFIfVIfy.js";import{I as P}from"./Icon-
|
|
1
|
+
import{j as t}from"./jsx-runtime-BYouaCF_.js";import{r as n}from"./index-B3evPFBL.js";import{R as _,A as q,P as x,C as O,a as N,b as E}from"./index-jPlWeKki.js";import{F as k}from"./TokyoUIClose-DFIfVIfy.js";import{I as P}from"./Icon-w2ilcPHL.js";import{T as j}from"./Text-BO29RJXG.js";import{B as D}from"./Button-w2cr0Ds_.js";import{H as T}from"./Heading-DLWgmTU5.js";import{u as S}from"./index-BfBdt3zW.js";import{g as L}from"./shared-strings-CcWGHelY.js";import{g as M}from"./PortalElementProvider-D4ltrA8j.js";import{g as H}from"./index-DdzHuZ-Y.js";import{w as X}from"./componentNames-CpCJzpB9.js";import{M as J}from"./message-BraTJ16C.js";const B="content__KHgp9",F="header__CaLti",U="close__3s-VD",A="footer__X5qXF",G="arrow__0pg-s",o={content:B,header:F,close:U,footer:A,arrow:G},z=e=>{e.scrollIntoViewIfNeeded?e.scrollIntoViewIfNeeded(!1):e.scrollIntoView({behavior:"auto",block:"nearest",inline:"nearest"})},m=({open:e,onOpenChange:i,disabled:r,title:u,text:s,children:a,side:l,dataset:h,actionLabel:g=t.jsx(J,{id:"preply-ds.onboardingTooltip.actionLabel",defaultMessage:"Got it",description:"Default onboarding tooltip action label. Used to acknowledge and close the tooltip."}),actionOnClick:b,actionHref:y,counter:C,autoScroll:v=!0})=>{const{formatMessage:I}=S(),w=M(),f=n.useId(),V=n.useId(),d=n.useId(),c=n.useRef(null);return n.useEffect(()=>{e&&c.current&&v&&z(c.current)},[v,e]),r?a:t.jsxs(_,{open:e,onOpenChange:i,children:[t.jsx(q,{ref:c,id:d,asChild:!0,children:a}),t.jsx(x,{container:w,children:t.jsxs(O,{onInteractOutside:R=>{R.preventDefault()},side:l,className:o.content,"aria-labelledby":f,"aria-describedby":`${d} ${V}`,...H(h,{preplyDsComponent:X.OnboardingTooltip}),children:[t.jsxs("div",{className:o.header,children:[t.jsx(N,{className:o.close,"aria-label":I(L.close),"data-testid":"close",children:t.jsx(P,{accent:"inverted",svg:k})}),t.jsx(T,{tag:"h1",variant:"small",accent:"inverted",id:f,"aria-describedby":d,children:u})]}),t.jsx(j,{variant:"default-regular",accent:"inverted",children:s}),t.jsxs("div",{className:o.footer,children:[C,t.jsx(D,{variant:"inverted",size:"small",onClick:b,href:y,dataset:{testid:"action"},wrap:!0,children:g})]}),t.jsx(E,{"aria-hidden":!0,className:o.arrow,width:18,height:11})]})})]})},p=e=>{const[i,r]=n.useState(!0),u=a=>{var l;a||(l=e.onClose)==null||l.call(e),r(a)},s=()=>{var a,l;(a=e.actionOnClick)==null||a.call(e),r(!1),(l=e.onClose)==null||l.call(e)};return t.jsx(m,{...e,open:i,onOpenChange:u,actionOnClick:s})};try{m.displayName="InternalOnboardingTooltip",m.__docgenInfo={description:"",displayName:"InternalOnboardingTooltip",props:{title:{defaultValue:null,description:"",name:"title",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},text:{defaultValue:null,description:"",name:"text",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},disabled:{defaultValue:null,description:"Disables tooltip completely",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},onClose:{defaultValue:null,description:"Called when the tooltip is closed",name:"onClose",required:!1,type:{name:"enum",value:[{value:"() => void"}]}},actionLabel:{defaultValue:{value:`(
|
|
2
2
|
<FormattedMessage
|
|
3
3
|
id="preply-ds.onboardingTooltip.actionLabel"
|
|
4
4
|
defaultMessage="Got it"
|
package/dist/assets/{OnboardingTooltip.stories-DgJn7s-p.js → OnboardingTooltip.stories-BL04HmvH.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as e}from"./jsx-runtime-BYouaCF_.js";import{O as u}from"./OnboardingTooltip-
|
|
1
|
+
import{j as e}from"./jsx-runtime-BYouaCF_.js";import{O as u}from"./OnboardingTooltip-DL0b2snx.js";import{I as g}from"./IconButton-05fPCnaC.js";import{F as x}from"./TokyoUIFav-DGbkVriC.js";import"./index-B3evPFBL.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./index-jPlWeKki.js";import"./PortalElementProvider-D4ltrA8j.js";import"./index-DRKYGVyc.js";import"./index-jEDObK_5.js";import"./index-C66nt8TK.js";import"./Combination-CCYtWL8C.js";import"./tslib.es6-BntfKcQG.js";import"./index-DbgDZDus.js";import"./TokyoUIClose-DFIfVIfy.js";import"./Icon-w2ilcPHL.js";import"./text-accent-DZDDtpIt.js";import"./classNames-BUL1Zq7e.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./render-icon-CVTdrNe-.js";import"./componentNames-CpCJzpB9.js";import"./index-DdzHuZ-Y.js";import"./defaults-B1rzzf6M.js";import"./Text-BO29RJXG.js";import"./text-centered-CznToR0o.js";import"./Button-w2cr0Ds_.js";import"./ButtonBase-BagNt7Ga.js";import"./Spinner-BCTJunNM.js";import"./useMergeRefs-CeyIhNgY.js";import"./useHostname-CH18gHFj.js";import"./index-CC6DAVyL.js";import"./Heading-DLWgmTU5.js";import"./index-BfBdt3zW.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./shared-strings-CcWGHelY.js";import"./message-BraTJ16C.js";const te={title:"Components/OnboardingTooltip",component:u,parameters:{docs:{story:{inline:!1,height:250},description:{component:"Are you looking for a step-by-step tour? Check out [OnboardingTour](/docs/components-onboardingtour--docs)"}},a11y:{config:{rules:[{id:"color-contrast",enabled:!1}]}}},decorators:[t=>e.jsx("div",{style:{margin:"auto",width:"max-content"},children:t()})]},f=t=>[!1,!1],h=t=>a=>{},o=()=>{const[t,a]=f(),v=h();return e.jsx(u,{title:"New Feature Available!",text:"We've added an exciting new feature to enhance your experience.",disabled:a||t,onClose:()=>v(!0),children:e.jsx(g,{variant:"ghost",svg:e.jsx(x,{}),assistiveText:"Favorite"})})};o.storyName="OnboardingTooltip";const r={tags:["!autodocs"],args:{title:"New Feature Available!",text:"We've added an exciting new feature to enhance your experience.",disabled:!1,onClose:()=>{},children:e.jsx(g,{variant:"ghost",svg:e.jsx(x,{}),assistiveText:"Favorite"})},argTypes:{title:{control:"text"},text:{control:"text"},actionLabel:{control:"text"},actionOnClick:{control:!1},actionHref:{control:"text"},disabled:{control:"boolean"},dataset:{control:"object"},onClose:{control:!1},children:{control:!1}},parameters:{docs:{story:{height:450}},chromatic:{disableSnapshot:!0}},decorators:[t=>e.jsx("div",{style:{minHeight:"100vh",display:"flex"},children:e.jsx("div",{style:{margin:"auto",width:"max-content"},children:t()})})]};var i,n,s,l,c;o.parameters={...o.parameters,docs:{...(i=o.parameters)==null?void 0:i.docs,source:{originalSource:`() => {
|
|
2
2
|
const [wasTooltipSeen, loading] = useIsFeatureActive('new-feature');
|
|
3
3
|
const setTooltipSeen = useToggleFeature('new-feature');
|
|
4
4
|
return <OnboardingTooltip title="New Feature Available!" text="We've added an exciting new feature to enhance your experience." disabled={loading || wasTooltipSeen} onClose={() => setTooltipSeen(true)}>
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as a}from"./jsx-runtime-BYouaCF_.js";import{O as x}from"./OnboardingTooltip-
|
|
1
|
+
import{j as a}from"./jsx-runtime-BYouaCF_.js";import{O as x}from"./OnboardingTooltip-DL0b2snx.js";import{I}from"./IconButton-05fPCnaC.js";import{F as f}from"./TokyoUIFav-DGbkVriC.js";import{w as s,a as r,e as n,u as d}from"./index-DDyIDR-R.js";import{B as k}from"./Button-w2cr0Ds_.js";import{L as F}from"./LayoutFlex-8uO9g6rd.js";import"./index-B3evPFBL.js";import"./_commonjsHelpers-Cpj98o6Y.js";import"./index-jPlWeKki.js";import"./PortalElementProvider-D4ltrA8j.js";import"./index-DRKYGVyc.js";import"./index-jEDObK_5.js";import"./index-C66nt8TK.js";import"./Combination-CCYtWL8C.js";import"./tslib.es6-BntfKcQG.js";import"./index-DbgDZDus.js";import"./TokyoUIClose-DFIfVIfy.js";import"./Icon-w2ilcPHL.js";import"./text-accent-DZDDtpIt.js";import"./classNames-BUL1Zq7e.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./render-icon-CVTdrNe-.js";import"./componentNames-CpCJzpB9.js";import"./index-DdzHuZ-Y.js";import"./defaults-B1rzzf6M.js";import"./Text-BO29RJXG.js";import"./text-centered-CznToR0o.js";import"./Heading-DLWgmTU5.js";import"./index-BfBdt3zW.js";import"./hoist-non-react-statics.cjs-C-Qo8PK8.js";import"./shared-strings-CcWGHelY.js";import"./message-BraTJ16C.js";import"./ButtonBase-BagNt7Ga.js";import"./Spinner-BCTJunNM.js";import"./useMergeRefs-CeyIhNgY.js";import"./useHostname-CH18gHFj.js";import"./index-CC6DAVyL.js";import"./layout-relative.module-ed9bC4H4.js";const mt={title:"Components/OnboardingTooltip/Tests",component:x,parameters:{layout:"centered",controls:{disable:!0},chromatic:{disableSnapshot:!0}},tags:["!autodocs","!a11y-test","test"],decorators:[e=>a.jsx("div",{style:{margin:"100px 0"},children:e()})],args:{title:"Title",text:"Body text",actionLabel:"Action label",disabled:!1,onClose:()=>{},dataset:{testid:"tooltip"},children:a.jsx(I,{svg:a.jsx(f,{}),assistiveText:"Favorite"})}},c={play:async({canvasElement:e,step:o})=>{const i=s(e);await o("wait for tooltip to be visible",async()=>{await r(()=>{const t=i.getByTestId("tooltip");return n(t).toBeVisible()})}),await o("close the tooltip",()=>{const u=s(i.getByTestId("tooltip")).getByTestId("close");return d.click(u)}),await o("wait for tooltip to be hidden",async()=>{await r(()=>{const t=i.queryByTestId("tooltip");return n(t).toBeNull()})})}},l={play:async({canvasElement:e,step:o})=>{const i=s(e);await o("wait for tooltip to be visible",async()=>{await r(()=>{const t=i.getByTestId("tooltip");return n(t).toBeVisible()})}),await o("close the tooltip",()=>{const u=s(i.getByTestId("tooltip")).getByTestId("action");return d.click(u)}),await o("wait for tooltip to be hidden",async()=>{await r(()=>{const t=i.queryByTestId("tooltip");return n(t).toBeNull()})})}};function E(e){return new Promise(o=>setTimeout(o,e))}const p={render:e=>a.jsxs(F,{gap:"24",direction:"column",children:[a.jsx(k,{children:"Click outside the tooltip"}),a.jsx(x,{...e,children:a.jsx(I,{svg:a.jsx(f,{}),assistiveText:"Favorite"})})]}),play:async({canvasElement:e,step:o})=>{const i=s(e);await o("wait for tooltip to be visible",async()=>{await r(()=>{const t=i.getByTestId("tooltip");return n(t).toBeVisible()})}),await o("click outside the tooltip",()=>{const t=i.getByText("Click outside the tooltip");return d.click(t)}),await o("check the tooltip remain open",async()=>{await E(1e3);const t=i.getByTestId("tooltip");return n(t).toBeVisible()})}};var m,y,w;c.parameters={...c.parameters,docs:{...(m=c.parameters)==null?void 0:m.docs,source:{originalSource:`{
|
|
2
2
|
play: async ({
|
|
3
3
|
canvasElement,
|
|
4
4
|
step
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as o}from"./jsx-runtime-BYouaCF_.js";import{r as l}from"./index-B3evPFBL.js";import{I as A}from"./OnboardingTooltip-
|
|
1
|
+
import{j as o}from"./jsx-runtime-BYouaCF_.js";import{r as l}from"./index-B3evPFBL.js";import{I as A}from"./OnboardingTooltip-DL0b2snx.js";import"./index-BfBdt3zW.js";import{M as f}from"./message-BraTJ16C.js";const T="counter__ArBS-",j={counter:T},v=({totalSteps:n,nextActionLabel:e=o.jsx(f,{id:"preply-ds.onboardingTour.nextActionLabel",defaultMessage:"Next",description:"Onboarding tour next action label"}),completeActionLabel:a=o.jsx(f,{id:"preply-ds.onboardingTour.completeActionLabel",defaultMessage:"Got it",description:"Onboarding tour complete action label"}),onClose:t,onComplete:r,onStepChange:i,disabled:s,children:p,ctx:x})=>{const[b,u]=l.useState(!0),[d,g]=l.useState(0),c={totalSteps:n,nextActionLabel:e,completeActionLabel:a,onClose:()=>{u(!1),t==null||t()},active:!s&&b,currentStep:d,onActionClick:()=>{if(d===n-1)r==null||r(),u(!1);else{const h=d+1;g(h),i==null||i(h)}}};return o.jsx(x.Provider,{value:c,children:p})},_=({ctx:n,...e})=>{const a=l.useContext(n);if(!a)throw new Error("OnboardingTourContext not found");const{currentStep:t,totalSteps:r,onActionClick:i,onClose:s,active:p,nextActionLabel:x,completeActionLabel:b}=a,u=e.step===r-1,d=e.step===t,g=u?b:x,m=()=>{var c;(c=e.actionOnClick)==null||c.call(e),i()},O=c=>{c||s==null||s()};return o.jsx(A,{...e,counter:o.jsx("p",{className:j.counter,children:o.jsx(f,{id:"preply-ds.onboardingTour.counter",defaultMessage:"{currentStep} of {totalSteps}",description:"Onboarding tour step counter, e.g. '1 of 3'",values:{currentStep:t+1,totalSteps:r}})}),open:p&&d,onOpenChange:O,actionLabel:g,actionOnClick:m})},S=()=>{const n=l.createContext(null);return{Provider:t=>o.jsx(v,{...t,ctx:n}),Step:t=>o.jsx(_,{...t,ctx:n})}};try{S.displayName="createOnboardingTour",S.__docgenInfo={description:`Creates a new onboarding tour.
|
|
2
2
|
|
|
3
3
|
This factory pattern allows multiple independent tours to be nested within each other
|
|
4
4
|
without context conflicts, as each tour maintains its own separate context and state.`,displayName:"createOnboardingTour",props:{}}}catch{}export{S as c};
|