@tempoxyz/ds 0.2.4 → 0.2.6

package/dist/web/components/OtpField.css

@@ -1 +1 @@
-.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-appearance-0{appearance:none}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-bg-1{background-color:var(--z-tds_2f_web-color-grayAlpha-100,light-dark(#0000000d,#ffffff12))}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-border-2{border:none}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-box-sizing-3{box-sizing:border-box}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-caret-color-4{caret-color:var(--z-tds_2f_web-color-blue-700,#4471ed)}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-text-5{color:var(--z-tds_2f_web-color-foreground,light-dark(#171717,#fff))}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-outline-color-6{outline-color:#0000}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-outline-offset-7{outline-offset:var(--z-tds_2f_web-outlineOffset-0,0px)}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-outline-style-8{outline-style:solid}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-outline-width-9{outline-width:var(--z-tds_2f_web-outlineWidth-2,2px)}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-p-10{padding:var(--z-tds_2f_web-spacing-0,0rem)}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-text-align-11{text-align:center}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-transition-duration-12{transition-duration:var(--z-tds_2f_web-transitionDuration-200,.2s)}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-transition-property-13{transition-property:background-color,color,opacity,outline-color,outline-offset,scale}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-transition-timing-function-14{transition-timing-function:var(--z-tds_2f_web-ease-overshoot,cubic-bezier(.34, 1.36, .64, 1))}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-opacity-15{&:disabled{opacity:var(--z-tds_2f_web-opacity-disabled,.4)}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-scale-16{&:focus{scale:1.06}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-outline-color-17{&:focus-visible{outline-color:var(--z-tds_2f_web-color-blue-700,#4471ed)}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-outline-offset-18{&:focus-visible{outline-offset:var(--z-tds_2f_web-outlineOffset-2,2px)}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-bg-19{&:hover:not(:disabled){background-color:var(--z-tds_2f_web-color-grayAlpha-200,light-dark(#00000014,#ffffff1a))}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-caret-color-20{&[data-invalid],[data-invalid] &{caret-color:var(--z-tds_2f_web-color-red-900,light-dark(#cf2203,#f55c45))}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-text-21{&[data-invalid],[data-invalid] &{color:var(--z-tds_2f_web-color-red-900,light-dark(#cf2203,#f55c45))}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-outline-color-22{&[data-invalid],[data-invalid] &{outline-color:var(--z-tds_2f_web-color-red-800,light-dark(#e02401,#d8351f))}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-outline-offset-23{&[data-invalid],[data-invalid] &{outline-offset:-2px}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-animation-24{[data-success] &{animation:z-kid-tds_2f_web_2f_otp_2d_field_2f_pop .32s var(--z-tds_2f_web-ease-overshoot,cubic-bezier(.34, 1.36, .64, 1)) both}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-bg-25{[data-success] &{background-color:light-dark(#13a9631f,#13a96329)}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-caret-color-26{[data-success] &{caret-color:var(--z-tds_2f_web-color-green-900,light-dark(#037c46,#59e5a4))}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-text-27{[data-success] &{color:var(--z-tds_2f_web-color-green-900,light-dark(#037c46,#59e5a4))}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-outline-color-28{[data-success] &{outline-color:var(--z-tds_2f_web-color-green-700,#13a963)}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-outline-offset-29{[data-success] &{outline-offset:-2px}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-bg-30{[data-success] &:hover:not(:disabled){background-color:light-dark(#13a9632e,#13a9633d)}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-outline-offset-31{&[data-invalid]:focus-visible,[data-invalid] &:focus-visible,[data-success] &:focus-visible{outline-offset:2px}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-animation-delay-32{[data-success] &:nth-child(2){animation-delay:40ms}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-animation-delay-33{[data-success] &:nth-child(3){animation-delay:80ms}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-animation-delay-34{[data-success] &:nth-child(4){animation-delay:.12s}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-animation-delay-35{[data-success] &:nth-child(5){animation-delay:.16s}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-animation-delay-36{[data-success] &:nth-child(6){animation-delay:.2s}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-animation-delay-37{[data-success] &:nth-child(7){animation-delay:.24s}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-animation-delay-38{[data-success] &:nth-child(8){animation-delay:.28s}}@media (prefers-reduced-motion:reduce){.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-transition-property-39{transition-property:background-color,color,opacity,outline-color}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-scale-40{&:focus{scale:none}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-animation-41{[data-success] &{animation:none}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-align-items-0{align-items:center}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-display-1{display:inline-flex}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-flex-wrap-2{flex-wrap:nowrap}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-max-width-3{max-width:100%}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-min-width-4{min-width:var(--z-tds_2f_web-spacing-0,0rem)}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-animation-5{&[data-invalid]{animation:z-kid-tds_2f_web_2f_otp_2d_field_2f_nudge .36s var(--z-tds_2f_web-ease-snappy,cubic-bezier(.23, 1, .32, 1))}}@media (prefers-reduced-motion:reduce){.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-animation-6{&[data-invalid]{animation:none}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-column-gap-7{&:where([data-size=large]){column-gap:var(--z-tds_2f_web-spacing-8,.5rem)}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-aspect-ratio-8{&:where([data-size=large]){&>input{aspect-ratio:6/7}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-border-radius-9{&:where([data-size=large]){&>input{border-radius:var(--z-tds_2f_web-radius-16,1rem)}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-flex-10{&:where([data-size=large]){&>input{flex:0 3rem}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-min-width-11{&:where([data-size=large]){&>input{min-width:var(--z-tds_2f_web-spacing-0,0rem)}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-font-family-12{&:where([data-size=large]){&>input{font-family:var(--z-tds_2f_web-typography-copy-24-fontFamily,Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji")}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-font-size-13{&:where([data-size=large]){&>input{font-size:var(--z-tds_2f_web-typography-copy-24-fontSize,24px)}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-font-weight-14{&:where([data-size=large]){&>input{font-weight:var(--z-tds_2f_web-typography-copy-24-fontWeight,450)}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-letter-spacing-15{&:where([data-size=large]){&>input{letter-spacing:var(--z-tds_2f_web-typography-copy-24-letterSpacing,-.47px)}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-line-height-16{&:where([data-size=large]){&>input{line-height:var(--z-tds_2f_web-typography-copy-24-lineHeight,36px)}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-column-gap-17{&:where([data-size=medium]){column-gap:var(--z-tds_2f_web-spacing-8,.5rem)}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-aspect-ratio-18{&:where([data-size=medium]){&>input{aspect-ratio:9/10}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-border-radius-19{&:where([data-size=medium]){&>input{border-radius:var(--z-tds_2f_web-radius-12,.75rem)}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-flex-20{&:where([data-size=medium]){&>input{flex:0 2.25rem}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-min-width-21{&:where([data-size=medium]){&>input{min-width:var(--z-tds_2f_web-spacing-0,0rem)}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-font-family-22{&:where([data-size=medium]){&>input{font-family:var(--z-tds_2f_web-typography-copy-18-fontFamily,Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji")}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-font-size-23{&:where([data-size=medium]){&>input{font-size:var(--z-tds_2f_web-typography-copy-18-fontSize,18px)}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-font-weight-24{&:where([data-size=medium]){&>input{font-weight:var(--z-tds_2f_web-typography-copy-18-fontWeight,450)}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-letter-spacing-25{&:where([data-size=medium]){&>input{letter-spacing:var(--z-tds_2f_web-typography-copy-18-letterSpacing,-.26px)}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-line-height-26{&:where([data-size=medium]){&>input{line-height:var(--z-tds_2f_web-typography-copy-18-lineHeight,28px)}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-column-gap-27{&:where([data-size=small]){column-gap:var(--z-tds_2f_web-spacing-4,.25rem)}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-aspect-ratio-28{&:where([data-size=small]){&>input{aspect-ratio:7/8}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-border-radius-29{&:where([data-size=small]){&>input{border-radius:var(--z-tds_2f_web-radius-8,.5rem)}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-flex-30{&:where([data-size=small]){&>input{flex:0 1.75rem}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-min-width-31{&:where([data-size=small]){&>input{min-width:var(--z-tds_2f_web-spacing-0,0rem)}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-font-family-32{&:where([data-size=small]){&>input{font-family:var(--z-tds_2f_web-typography-copy-14-fontFamily,Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji")}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-font-size-33{&:where([data-size=small]){&>input{font-size:var(--z-tds_2f_web-typography-copy-14-fontSize,14px)}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-font-weight-34{&:where([data-size=small]){&>input{font-weight:var(--z-tds_2f_web-typography-copy-14-fontWeight,450)}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-letter-spacing-35{&:where([data-size=small]){&>input{letter-spacing:var(--z-tds_2f_web-typography-copy-14-letterSpacing,-.09px)}}}.z-tds_2f_web-tds_2f_web_2f_otp_2d_field-line-height-36{&:where([data-size=small]){&>input{line-height:var(--z-tds_2f_web-typography-copy-14-lineHeight,20px)}}}
+.z_tds_2f_web-iELgRU0{appearance:none}.z_tds_2f_web-iELgRU1{background-color:var(--z-tds_2f_web-color-grayAlpha-100,light-dark(#0000000d,#ffffff12))}.z_tds_2f_web-iELgRU2{border:none}.z_tds_2f_web-iELgRU3{box-sizing:border-box}.z_tds_2f_web-iELgRU4{caret-color:var(--z-tds_2f_web-color-blue-700,#4471ed)}.z_tds_2f_web-iELgRU5{color:var(--z-tds_2f_web-color-foreground,light-dark(#171717,#fff))}.z_tds_2f_web-iELgRU6{outline-color:#0000}.z_tds_2f_web-iELgRU7{outline-offset:var(--z-tds_2f_web-outlineOffset-0,0px)}.z_tds_2f_web-iELgRU8{outline-style:solid}.z_tds_2f_web-iELgRU9{outline-width:var(--z-tds_2f_web-outlineWidth-2,2px)}.z_tds_2f_web-iELgRUa{padding:var(--z-tds_2f_web-spacing-0,0rem)}.z_tds_2f_web-iELgRUb{text-align:center}.z_tds_2f_web-iELgRUc{transition-duration:var(--z-tds_2f_web-transitionDuration-200,.2s)}.z_tds_2f_web-iELgRUd{transition-property:background-color,color,opacity,outline-color,outline-offset,scale}.z_tds_2f_web-iELgRUe{transition-timing-function:var(--z-tds_2f_web-ease-overshoot,cubic-bezier(.34, 1.36, .64, 1))}.z_tds_2f_web-iELgRUf{&:disabled{opacity:var(--z-tds_2f_web-opacity-disabled,.4)}}.z_tds_2f_web-iELgRUg{&:focus{scale:1.06}}.z_tds_2f_web-iELgRUh{&:focus-visible{outline-color:var(--z-tds_2f_web-color-blue-700,#4471ed)}}.z_tds_2f_web-iELgRUi{&:focus-visible{outline-offset:var(--z-tds_2f_web-outlineOffset-2,2px)}}.z_tds_2f_web-iELgRUj{&:hover:not(:disabled){background-color:var(--z-tds_2f_web-color-grayAlpha-200,light-dark(#00000014,#ffffff1a))}}.z_tds_2f_web-iELgRUk{&[data-invalid],[data-invalid] &{caret-color:var(--z-tds_2f_web-color-red-900,light-dark(#cf2203,#f55c45))}}.z_tds_2f_web-iELgRUl{&[data-invalid],[data-invalid] &{color:var(--z-tds_2f_web-color-red-900,light-dark(#cf2203,#f55c45))}}.z_tds_2f_web-iELgRUm{&[data-invalid],[data-invalid] &{outline-color:var(--z-tds_2f_web-color-red-800,light-dark(#e02401,#d8351f))}}.z_tds_2f_web-iELgRUn{&[data-invalid],[data-invalid] &{outline-offset:-2px}}.z_tds_2f_web-iELgRUo{[data-success] &{animation:z-kid-tds_2f_web_2f_otp_2d_field_2f_pop .32s var(--z-tds_2f_web-ease-overshoot,cubic-bezier(.34, 1.36, .64, 1)) both}}.z_tds_2f_web-iELgRUp{[data-success] &{background-color:light-dark(#13a9631f,#13a96329)}}.z_tds_2f_web-iELgRUq{[data-success] &{caret-color:var(--z-tds_2f_web-color-green-900,light-dark(#037c46,#59e5a4))}}.z_tds_2f_web-iELgRUr{[data-success] &{color:var(--z-tds_2f_web-color-green-900,light-dark(#037c46,#59e5a4))}}.z_tds_2f_web-iELgRUs{[data-success] &{outline-color:var(--z-tds_2f_web-color-green-700,#13a963)}}.z_tds_2f_web-iELgRUt{[data-success] &{outline-offset:-2px}}.z_tds_2f_web-iELgRUu{[data-success] &:hover:not(:disabled){background-color:light-dark(#13a9632e,#13a9633d)}}.z_tds_2f_web-iELgRUv{&[data-invalid]:focus-visible,[data-invalid] &:focus-visible,[data-success] &:focus-visible{outline-offset:2px}}.z_tds_2f_web-iELgRUw{[data-success] &:nth-child(2){animation-delay:40ms}}.z_tds_2f_web-iELgRUx{[data-success] &:nth-child(3){animation-delay:80ms}}.z_tds_2f_web-iELgRUy{[data-success] &:nth-child(4){animation-delay:.12s}}.z_tds_2f_web-iELgRUz{[data-success] &:nth-child(5){animation-delay:.16s}}.z_tds_2f_web-iELgRU10{[data-success] &:nth-child(6){animation-delay:.2s}}.z_tds_2f_web-iELgRU11{[data-success] &:nth-child(7){animation-delay:.24s}}.z_tds_2f_web-iELgRU12{[data-success] &:nth-child(8){animation-delay:.28s}}@media (prefers-reduced-motion:reduce){.z_tds_2f_web-iELgRU13{transition-property:background-color,color,opacity,outline-color}.z_tds_2f_web-iELgRU14{&:focus{scale:none}}.z_tds_2f_web-iELgRU15{[data-success] &{animation:none}}}.z_tds_2f_web-iELgRU16{align-items:center}.z_tds_2f_web-iELgRU17{display:inline-flex}.z_tds_2f_web-iELgRU18{flex-wrap:nowrap}.z_tds_2f_web-iELgRU19{max-width:100%}.z_tds_2f_web-iELgRU1a{min-width:var(--z-tds_2f_web-spacing-0,0rem)}.z_tds_2f_web-iELgRU1b{&[data-invalid]{animation:z-kid-tds_2f_web_2f_otp_2d_field_2f_nudge .36s var(--z-tds_2f_web-ease-snappy,cubic-bezier(.23, 1, .32, 1))}}@media (prefers-reduced-motion:reduce){.z_tds_2f_web-iELgRU1c{&[data-invalid]{animation:none}}}.z_tds_2f_web-iELgRU1d{&:where([data-size=large]){column-gap:var(--z-tds_2f_web-spacing-8,.5rem)}}.z_tds_2f_web-iELgRU1e{&:where([data-size=large]){&>input{aspect-ratio:6/7}}}.z_tds_2f_web-iELgRU1f{&:where([data-size=large]){&>input{border-radius:var(--z-tds_2f_web-radius-16,1rem)}}}.z_tds_2f_web-iELgRU1g{&:where([data-size=large]){&>input{flex:0 3rem}}}.z_tds_2f_web-iELgRU1h{&:where([data-size=large]){&>input{min-width:var(--z-tds_2f_web-spacing-0,0rem)}}}.z_tds_2f_web-iELgRU1i{&:where([data-size=large]){&>input{font-family:var(--z-tds_2f_web-typography-copy-24-fontFamily,Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji")}}}.z_tds_2f_web-iELgRU1j{&:where([data-size=large]){&>input{font-size:var(--z-tds_2f_web-typography-copy-24-fontSize,24px)}}}.z_tds_2f_web-iELgRU1k{&:where([data-size=large]){&>input{font-weight:var(--z-tds_2f_web-typography-copy-24-fontWeight,450)}}}.z_tds_2f_web-iELgRU1l{&:where([data-size=large]){&>input{letter-spacing:var(--z-tds_2f_web-typography-copy-24-letterSpacing,-.47px)}}}.z_tds_2f_web-iELgRU1m{&:where([data-size=large]){&>input{line-height:var(--z-tds_2f_web-typography-copy-24-lineHeight,36px)}}}.z_tds_2f_web-iELgRU1n{&:where([data-size=medium]){column-gap:var(--z-tds_2f_web-spacing-8,.5rem)}}.z_tds_2f_web-iELgRU1o{&:where([data-size=medium]){&>input{aspect-ratio:9/10}}}.z_tds_2f_web-iELgRU1p{&:where([data-size=medium]){&>input{border-radius:var(--z-tds_2f_web-radius-12,.75rem)}}}.z_tds_2f_web-iELgRU1q{&:where([data-size=medium]){&>input{flex:0 2.25rem}}}.z_tds_2f_web-iELgRU1r{&:where([data-size=medium]){&>input{min-width:var(--z-tds_2f_web-spacing-0,0rem)}}}.z_tds_2f_web-iELgRU1s{&:where([data-size=medium]){&>input{font-family:var(--z-tds_2f_web-typography-copy-18-fontFamily,Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji")}}}.z_tds_2f_web-iELgRU1t{&:where([data-size=medium]){&>input{font-size:var(--z-tds_2f_web-typography-copy-18-fontSize,18px)}}}.z_tds_2f_web-iELgRU1u{&:where([data-size=medium]){&>input{font-weight:var(--z-tds_2f_web-typography-copy-18-fontWeight,450)}}}.z_tds_2f_web-iELgRU1v{&:where([data-size=medium]){&>input{letter-spacing:var(--z-tds_2f_web-typography-copy-18-letterSpacing,-.26px)}}}.z_tds_2f_web-iELgRU1w{&:where([data-size=medium]){&>input{line-height:var(--z-tds_2f_web-typography-copy-18-lineHeight,28px)}}}.z_tds_2f_web-iELgRU1x{&:where([data-size=small]){column-gap:var(--z-tds_2f_web-spacing-4,.25rem)}}.z_tds_2f_web-iELgRU1y{&:where([data-size=small]){&>input{aspect-ratio:7/8}}}.z_tds_2f_web-iELgRU1z{&:where([data-size=small]){&>input{border-radius:var(--z-tds_2f_web-radius-8,.5rem)}}}.z_tds_2f_web-iELgRU20{&:where([data-size=small]){&>input{flex:0 1.75rem}}}.z_tds_2f_web-iELgRU21{&:where([data-size=small]){&>input{min-width:var(--z-tds_2f_web-spacing-0,0rem)}}}.z_tds_2f_web-iELgRU22{&:where([data-size=small]){&>input{font-family:var(--z-tds_2f_web-typography-copy-14-fontFamily,Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji")}}}.z_tds_2f_web-iELgRU23{&:where([data-size=small]){&>input{font-size:var(--z-tds_2f_web-typography-copy-14-fontSize,14px)}}}.z_tds_2f_web-iELgRU24{&:where([data-size=small]){&>input{font-weight:var(--z-tds_2f_web-typography-copy-14-fontWeight,450)}}}.z_tds_2f_web-iELgRU25{&:where([data-size=small]){&>input{letter-spacing:var(--z-tds_2f_web-typography-copy-14-letterSpacing,-.09px)}}}.z_tds_2f_web-iELgRU26{&:where([data-size=small]){&>input{line-height:var(--z-tds_2f_web-typography-copy-14-lineHeight,20px)}}}

package/dist/web/components/OtpField.js

@@ -1,5 +1,5 @@
 
-import { Props as __zyzzProps, Recipe as __zyzzRecipe } from 'zyzz/runtime';
+import { Props as __zyzzProps } from 'zyzz/runtime';
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as BaseUi from '@base-ui/react/otp-field';
 import { createContext, useContext } from 'react';
@@ -55,8 +55,8 @@ const nudge = "z-kid-tds_2f_web_2f_otp_2d_field_2f_nudge";
 const pop = "z-kid-tds_2f_web_2f_otp_2d_field_2f_pop";
 var styles;
 (function (styles) {
-    styles.input = __zyzzProps.create({className:"z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-appearance-0 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-bg-1 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-border-2 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-box-sizing-3 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-caret-color-4 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-text-5 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-outline-color-6 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-outline-offset-7 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-outline-style-8 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-outline-width-9 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-p-10 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-text-align-11 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-transition-duration-12 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-transition-property-13 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-transition-timing-function-14 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-opacity-15 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-scale-16 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-outline-color-17 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-outline-offset-18 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-bg-19 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-caret-color-20 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-text-21 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-outline-color-22 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-outline-offset-23 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-animation-24 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-bg-25 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-caret-color-26 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-text-27 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-outline-color-28 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-outline-offset-29 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-bg-30 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-outline-offset-31 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-animation-delay-32 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-animation-delay-33 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-animation-delay-34 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-animation-delay-35 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-animation-delay-36 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-animation-delay-37 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-animation-delay-38 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-transition-property-39 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-scale-40 z-tds_2f_web-tds_2f_web_2f_otp_2d_field_2f_input-animation-41"});
-    styles.root = __zyzzRecipe.create({"axes":{"size":["large","medium","small"]},"defaults":{"size":"medium"},"className":"z-tds_2f_web-tds_2f_web_2f_otp_2d_field-align-items-0 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-display-1 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-flex-wrap-2 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-max-width-3 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-min-width-4 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-animation-5 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-animation-6 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-column-gap-7 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-aspect-ratio-8 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-border-radius-9 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-flex-10 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-min-width-11 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-font-family-12 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-font-size-13 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-font-weight-14 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-letter-spacing-15 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-line-height-16 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-column-gap-17 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-aspect-ratio-18 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-border-radius-19 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-flex-20 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-min-width-21 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-font-family-22 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-font-size-23 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-font-weight-24 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-letter-spacing-25 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-line-height-26 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-column-gap-27 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-aspect-ratio-28 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-border-radius-29 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-flex-30 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-min-width-31 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-font-family-32 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-font-size-33 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-font-weight-34 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-letter-spacing-35 z-tds_2f_web-tds_2f_web_2f_otp_2d_field-line-height-36"});
+    styles.input = /*#__PURE__*/__zyzzProps.create({className:"z_tds_2f_web-iELgRU0 z_tds_2f_web-iELgRU1 z_tds_2f_web-iELgRU2 z_tds_2f_web-iELgRU3 z_tds_2f_web-iELgRU4 z_tds_2f_web-iELgRU5 z_tds_2f_web-iELgRU6 z_tds_2f_web-iELgRU7 z_tds_2f_web-iELgRU8 z_tds_2f_web-iELgRU9 z_tds_2f_web-iELgRUa z_tds_2f_web-iELgRUb z_tds_2f_web-iELgRUc z_tds_2f_web-iELgRUd z_tds_2f_web-iELgRUe z_tds_2f_web-iELgRUf z_tds_2f_web-iELgRUg z_tds_2f_web-iELgRUh z_tds_2f_web-iELgRUi z_tds_2f_web-iELgRUj z_tds_2f_web-iELgRUk z_tds_2f_web-iELgRUl z_tds_2f_web-iELgRUm z_tds_2f_web-iELgRUn z_tds_2f_web-iELgRUo z_tds_2f_web-iELgRUp z_tds_2f_web-iELgRUq z_tds_2f_web-iELgRUr z_tds_2f_web-iELgRUs z_tds_2f_web-iELgRUt z_tds_2f_web-iELgRUu z_tds_2f_web-iELgRUv z_tds_2f_web-iELgRUw z_tds_2f_web-iELgRUx z_tds_2f_web-iELgRUy z_tds_2f_web-iELgRUz z_tds_2f_web-iELgRU10 z_tds_2f_web-iELgRU11 z_tds_2f_web-iELgRU12 z_tds_2f_web-iELgRU13 z_tds_2f_web-iELgRU14 z_tds_2f_web-iELgRU15"});
+    styles.root = ((input={})=>{const external=input.className,style=input.style,vars=input.vars,inline=vars?{...vars,...style}:style,className=external?"z_tds_2f_web-iELgRU16 z_tds_2f_web-iELgRU17 z_tds_2f_web-iELgRU18 z_tds_2f_web-iELgRU19 z_tds_2f_web-iELgRU1a z_tds_2f_web-iELgRU1b z_tds_2f_web-iELgRU1c z_tds_2f_web-iELgRU1d z_tds_2f_web-iELgRU1e z_tds_2f_web-iELgRU1f z_tds_2f_web-iELgRU1g z_tds_2f_web-iELgRU1h z_tds_2f_web-iELgRU1i z_tds_2f_web-iELgRU1j z_tds_2f_web-iELgRU1k z_tds_2f_web-iELgRU1l z_tds_2f_web-iELgRU1m z_tds_2f_web-iELgRU1n z_tds_2f_web-iELgRU1o z_tds_2f_web-iELgRU1p z_tds_2f_web-iELgRU1q z_tds_2f_web-iELgRU1r z_tds_2f_web-iELgRU1s z_tds_2f_web-iELgRU1t z_tds_2f_web-iELgRU1u z_tds_2f_web-iELgRU1v z_tds_2f_web-iELgRU1w z_tds_2f_web-iELgRU1x z_tds_2f_web-iELgRU1y z_tds_2f_web-iELgRU1z z_tds_2f_web-iELgRU20 z_tds_2f_web-iELgRU21 z_tds_2f_web-iELgRU22 z_tds_2f_web-iELgRU23 z_tds_2f_web-iELgRU24 z_tds_2f_web-iELgRU25 z_tds_2f_web-iELgRU26"+" "+external:"z_tds_2f_web-iELgRU16 z_tds_2f_web-iELgRU17 z_tds_2f_web-iELgRU18 z_tds_2f_web-iELgRU19 z_tds_2f_web-iELgRU1a z_tds_2f_web-iELgRU1b z_tds_2f_web-iELgRU1c z_tds_2f_web-iELgRU1d z_tds_2f_web-iELgRU1e z_tds_2f_web-iELgRU1f z_tds_2f_web-iELgRU1g z_tds_2f_web-iELgRU1h z_tds_2f_web-iELgRU1i z_tds_2f_web-iELgRU1j z_tds_2f_web-iELgRU1k z_tds_2f_web-iELgRU1l z_tds_2f_web-iELgRU1m z_tds_2f_web-iELgRU1n z_tds_2f_web-iELgRU1o z_tds_2f_web-iELgRU1p z_tds_2f_web-iELgRU1q z_tds_2f_web-iELgRU1r z_tds_2f_web-iELgRU1s z_tds_2f_web-iELgRU1t z_tds_2f_web-iELgRU1u z_tds_2f_web-iELgRU1v z_tds_2f_web-iELgRU1w z_tds_2f_web-iELgRU1x z_tds_2f_web-iELgRU1y z_tds_2f_web-iELgRU1z z_tds_2f_web-iELgRU20 z_tds_2f_web-iELgRU21 z_tds_2f_web-iELgRU22 z_tds_2f_web-iELgRU23 z_tds_2f_web-iELgRU24 z_tds_2f_web-iELgRU25 z_tds_2f_web-iELgRU26",result=inline?{className,style:inline}:{className};let value;value=Object.hasOwn(input,"size")?input["size"]:void 0;if(value===void 0)value="medium";if(value!==null&&value!==void 0)result["data-size"]=String(value);return result});
 })(styles || (styles = {}));
 //# sourceMappingURL=OtpField.js.map
 import './OtpField.css';