@yamada-ui/password-input/dist/chunk-ZFUFMRPW.mjs.map

Yamada UI password input component

{"version":3,"sources":["../src/password-input-strength-meter.tsx"],"sourcesContent":["import type { HTMLUIProps } from \"@yamada-ui/core\"\nimport type { ReactNode } from \"react\"\nimport { forwardRef, ui, useComponentMultiStyle } from \"@yamada-ui/core\"\nimport { cx, dataAttr } from \"@yamada-ui/utils\"\n\ninterface StrengthMeterIndicatorProps extends HTMLUIProps {\n  label?: ReactNode\n}\n\nconst getDefaultStrengthMeterIndicatorProps = (\n  percent: number,\n): StrengthMeterIndicatorProps => {\n  switch (true) {\n    case percent < 33:\n      return { label: \"Low\", _selected: { bg: \"red.500\" } }\n    case percent < 66:\n      return { label: \"Medium\", _selected: { bg: \"orange.500\" } }\n    default:\n      return { label: \"High\", _selected: { bg: \"green.500\" } }\n  }\n}\n\ninterface PasswordInputStrengthMeterOptions {\n  /**\n   * The value of the password strength meter.\n   */\n  value: number\n  /**\n   * The maximum value of the password strength meter.\n   *\n   * @default 4\n   */\n  max?: number\n  /**\n   * If `true`, the password strength meter will display the label.\n   *\n   * @default true\n   */\n  withLabel?: boolean\n  /**\n   * The props of the password strength meter indicator.\n   */\n  getStrengthMeterIndicatorProps?: (\n    percent: number,\n  ) => StrengthMeterIndicatorProps\n}\n\nexport interface PasswordInputStrengthMeterProps\n  extends HTMLUIProps,\n    PasswordInputStrengthMeterOptions {}\n\nexport const PasswordInputStrengthMeter = forwardRef<\n  PasswordInputStrengthMeterProps,\n  \"div\"\n>((props, ref) => {\n  const [\n    styles,\n    {\n      className,\n      max = 4,\n      value,\n      withLabel = true,\n      getStrengthMeterIndicatorProps = getDefaultStrengthMeterIndicatorProps,\n      ...rest\n    },\n  ] = useComponentMultiStyle(\"PasswordInput\", props)\n\n  const percent = (value / max) * 100\n\n  const { label, ...indicatorProps } = getStrengthMeterIndicatorProps(percent)\n\n  return (\n    <ui.div\n      ref={ref}\n      className={cx(\"ui-password-input__strength-meter\", className)}\n      aria-label=\"Password strength meter\"\n      aria-valuemax={max}\n      aria-valuemin={0}\n      aria-valuenow={value}\n      role=\"meter\"\n      __css={{ ...styles.strengthMeter }}\n      {...rest}\n    >\n      <ui.div\n        ref={ref}\n        className=\"ui-password-input__strength-meter-indicators\"\n        __css={{ ...styles.strengthMeterIndicators }}\n        {...rest}\n      >\n        {Array.from({ length: max }).map((_, index) => (\n          <ui.div\n            key={index}\n            data-selected={dataAttr(index < value)}\n            __css={{ ...styles.strengthMeterIndicator }}\n            {...indicatorProps}\n          />\n        ))}\n      </ui.div>\n\n      {withLabel && label ? (\n        <ui.span __css={{ ...styles.strengthMeterLabel }}>{label}</ui.span>\n      ) : null}\n    </ui.div>\n  )\n})\n\nPasswordInputStrengthMeter.displayName = \"PasswordInputStrengthMeter\"\nPasswordInputStrengthMeter.__ui__ = \"PasswordInputStrengthMeter\"\n"],"mappings":";;;AAEA,SAAS,YAAY,IAAI,8BAA8B;AACvD,SAAS,IAAI,gBAAgB;AAqEzB,SAkBM,KAlBN;AA/DJ,IAAM,wCAAwC,CAC5C,YACgC;AAChC,UAAQ,MAAM;AAAA,IACZ,KAAK,UAAU;AACb,aAAO,EAAE,OAAO,OAAO,WAAW,EAAE,IAAI,UAAU,EAAE;AAAA,IACtD,KAAK,UAAU;AACb,aAAO,EAAE,OAAO,UAAU,WAAW,EAAE,IAAI,aAAa,EAAE;AAAA,IAC5D;AACE,aAAO,EAAE,OAAO,QAAQ,WAAW,EAAE,IAAI,YAAY,EAAE;AAAA,EAC3D;AACF;AA+BO,IAAM,6BAA6B,WAGxC,CAAC,OAAO,QAAQ;AAChB,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,MACE;AAAA,MACA,MAAM;AAAA,MACN;AAAA,MACA,YAAY;AAAA,MACZ,iCAAiC;AAAA,MACjC,GAAG;AAAA,IACL;AAAA,EACF,IAAI,uBAAuB,iBAAiB,KAAK;AAEjD,QAAM,UAAW,QAAQ,MAAO;AAEhC,QAAM,EAAE,OAAO,GAAG,eAAe,IAAI,+BAA+B,OAAO;AAE3E,SACE;AAAA,IAAC,GAAG;AAAA,IAAH;AAAA,MACC;AAAA,MACA,WAAW,GAAG,qCAAqC,SAAS;AAAA,MAC5D,cAAW;AAAA,MACX,iBAAe;AAAA,MACf,iBAAe;AAAA,MACf,iBAAe;AAAA,MACf,MAAK;AAAA,MACL,OAAO,EAAE,GAAG,OAAO,cAAc;AAAA,MAChC,GAAG;AAAA,MAEJ;AAAA;AAAA,UAAC,GAAG;AAAA,UAAH;AAAA,YACC;AAAA,YACA,WAAU;AAAA,YACV,OAAO,EAAE,GAAG,OAAO,wBAAwB;AAAA,YAC1C,GAAG;AAAA,YAEH,gBAAM,KAAK,EAAE,QAAQ,IAAI,CAAC,EAAE,IAAI,CAAC,GAAG,UACnC;AAAA,cAAC,GAAG;AAAA,cAAH;AAAA,gBAEC,iBAAe,SAAS,QAAQ,KAAK;AAAA,gBACrC,OAAO,EAAE,GAAG,OAAO,uBAAuB;AAAA,gBACzC,GAAG;AAAA;AAAA,cAHC;AAAA,YAIP,CACD;AAAA;AAAA,QACH;AAAA,QAEC,aAAa,QACZ,oBAAC,GAAG,MAAH,EAAQ,OAAO,EAAE,GAAG,OAAO,mBAAmB,GAAI,iBAAM,IACvD;AAAA;AAAA;AAAA,EACN;AAEJ,CAAC;AAED,2BAA2B,cAAc;AACzC,2BAA2B,SAAS;","names":[]}