UNPKG

@yamada-ui/react

Version:

React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion

1 lines 1.89 kB
{"version":3,"file":"use-strength-meter.cjs","names":["useI18n","getRootProps: PropGetter"],"sources":["../../../../src/components/password-input/use-strength-meter.ts"],"sourcesContent":["\"use client\"\n\nimport type { HTMLProps, PropGetter, RequiredPropGetter } from \"../../core\"\nimport { useCallback } from \"react\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport { dataAttr } from \"../../utils\"\n\nexport interface UseStrengthMeterProps extends HTMLProps {\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\nexport const useStrengthMeter = ({\n max = 4,\n value,\n ...rest\n}: UseStrengthMeterProps) => {\n const { t } = useI18n(\"passwordInput\")\n\n const getRootProps: PropGetter = useCallback(\n (props) => ({\n \"aria-label\": t(\"Password strength meter\"),\n \"aria-valuemax\": max,\n \"aria-valuemin\": 0,\n \"aria-valuenow\": value,\n role: \"meter\",\n ...rest,\n ...props,\n }),\n [max, rest, value, t],\n )\n\n const getIndicatorProps: RequiredPropGetter<\"div\", { index: number }> =\n useCallback(\n ({ index, ...props }) => ({\n \"data-selected\": dataAttr(index < value),\n ...props,\n }),\n [value],\n )\n\n return { getIndicatorProps, getRootProps }\n}\n\nexport type UseStrengthMeterReturn = ReturnType<typeof useStrengthMeter>\n"],"mappings":";;;;;;;;;;AAoBA,MAAa,oBAAoB,EAC/B,MAAM,GACN,MACA,GAAG,WACwB;CAC3B,MAAM,EAAE,MAAMA,8BAAQ,gBAAgB;CAEtC,MAAMC,uCACH,WAAW;EACV,cAAc,EAAE,0BAA0B;EAC1C,iBAAiB;EACjB,iBAAiB;EACjB,iBAAiB;EACjB,MAAM;EACN,GAAG;EACH,GAAG;EACJ,GACD;EAAC;EAAK;EAAM;EAAO;EAAE,CACtB;AAWD,QAAO;EAAE,2CAPJ,EAAE,MAAO,GAAG,aAAa;GACxB,iEAA0B,QAAQ,MAAM;GACxC,GAAG;GACJ,GACD,CAAC,MAAM,CACR;EAEyB;EAAc"}