{"version":3,"file":"index.js","sources":["../../../../../../../legos/text-field/new-password/new-password.theme.ts","../../../../../../../legos/text-field/new-password/new-password-error-message.ccm.css.ts","../../../../../../../legos/text-field/new-password/new-password-error-message.tsx","../../../../../../../legos/text-field/new-password/new-password.tsx","../../../../../../../legos/text-field/new-password/confirm-password.tsx"],"sourcesContent":["import { createUseThemeHook } from 'legos/theme';\n\ndeclare module 'legos/theme' {\n  interface BulkLegoTheme {\n    newpassword: NewPasswordTheme;\n  }\n}\n\nexport interface NewPasswordTheme {\n  neutral: string;\n  negative: string;\n  positive: string;\n  labelColor: string;\n}\n\nconst [NewPasswordThemeProvider, useNewPasswordTheme] = createUseThemeHook(\n  'newpassword',\n  (global): NewPasswordTheme => ({\n    neutral: global.neutral.color200,\n    negative: global.negative.color500,\n    positive: global.positive.color500,\n    labelColor: global.neutral.color700\n  })\n);\n\nexport { NewPasswordThemeProvider, useNewPasswordTheme };\n","\nimport { ComponentCreator, createComponentCreator, styleInject } from 'packages/css-component-modules';\n\nconst _css = `.PasswordMessage_2b2ef4ead4e23f4c{color:var(--color_45c0f58f3d5b05b4)}.DefaultIcon_8f5ac13970851b4d,.InvalidIcon_ade51793329c1202,.ValidIcon_c70829a659cbd140{display:inline-block;width:14px;height:14px;vertical-align:middle;margin-right:2px}`;\nstyleInject(_css)\n\n/** PasswordMessage Props */\nexport type PasswordMessageCCM = {\n  /** PasswordMessage Component Custom Properties */\n  '$color': string;\n\n  /** PasswordMessage Modifier Flags */\n  // No modifiers classes found\n};\n/** Base PasswordMessage component */\nexport const PasswordMessage: ComponentCreator<PasswordMessageCCM> = createComponentCreator({\n  \"name\": \"PasswordMessage\",\n  \"base\": \"PasswordMessage_2b2ef4ead4e23f4c\",\n  \"prop\": {\n    \"$color\": \"--color_45c0f58f3d5b05b4\"\n  },\n  \"mod\": {}\n});\n\n\n/** InvalidIcon Props */\nexport type InvalidIconCCM = {\n  /** InvalidIcon Component Custom Properties */\n  // No custom properties found\n\n  /** InvalidIcon Modifier Flags */\n  // No modifiers classes found\n};\n/** Base InvalidIcon component */\nexport const InvalidIcon: ComponentCreator<InvalidIconCCM> = createComponentCreator({\n  \"name\": \"InvalidIcon\",\n  \"base\": \"InvalidIcon_ade51793329c1202\",\n  \"prop\": {},\n  \"mod\": {}\n});\n\n\n/** ValidIcon Props */\nexport type ValidIconCCM = {\n  /** ValidIcon Component Custom Properties */\n  // No custom properties found\n\n  /** ValidIcon Modifier Flags */\n  // No modifiers classes found\n};\n/** Base ValidIcon component */\nexport const ValidIcon: ComponentCreator<ValidIconCCM> = createComponentCreator({\n  \"name\": \"ValidIcon\",\n  \"base\": \"ValidIcon_c70829a659cbd140\",\n  \"prop\": {},\n  \"mod\": {}\n});\n\n\n/** DefaultIcon Props */\nexport type DefaultIconCCM = {\n  /** DefaultIcon Component Custom Properties */\n  // No custom properties found\n\n  /** DefaultIcon Modifier Flags */\n  // No modifiers classes found\n};\n/** Base DefaultIcon component */\nexport const DefaultIcon: ComponentCreator<DefaultIconCCM> = createComponentCreator({\n  \"name\": \"DefaultIcon\",\n  \"base\": \"DefaultIcon_8f5ac13970851b4d\",\n  \"prop\": {},\n  \"mod\": {}\n});\n\n","import { createElement, FC, PropsWithoutRef, ReactNode } from 'react';\nimport { useNewPasswordTheme } from './new-password.theme';\nimport {\n  PasswordMessage,\n  InvalidIcon,\n  InvalidIconCCM,\n  ValidIcon,\n  ValidIconCCM,\n  DefaultIcon,\n  DefaultIconCCM\n} from './new-password-error-message.ccm.css';\n\nconst Invalid: FC<\n  Partial<InvalidIconCCM> & PropsWithoutRef<JSX.IntrinsicElements['svg']>\n> = () => {\n  const theme = useNewPasswordTheme();\n  return (\n    <InvalidIcon.svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 16\">\n      <title>Invalid</title>\n      <path\n        fill={theme.negative}\n        stroke={theme.negative}\n        strokeWidth=\"2%\"\n        d=\"M9.102,6.6 L12.854625,2.847375 C13.315125,2.386875 13.315125,1.64025 12.854625,1.179375 L12.020625,0.345375 C11.560125,-0.115125 10.8135,-0.115125 10.352625,0.345375 L6.6,4.098 L2.847375,0.345375 C2.386875,-0.115125 1.64025,-0.115125 1.179375,0.345375 L0.345375,1.179375 C-0.115125,1.639875 -0.115125,2.3865 0.345375,2.847375 L4.098,6.6 L0.345375,10.352625 C-0.115125,10.813125 -0.115125,11.55975 0.345375,12.020625 L1.179375,12.854625 C1.639875,13.315125 2.386875,13.315125 2.847375,12.854625 L6.6,9.102 L10.352625,12.854625 C10.813125,13.315125 11.560125,13.315125 12.020625,12.854625 L12.854625,12.020625 C13.315125,11.560125 13.315125,10.8135 12.854625,10.352625 L9.102,6.6 Z\"\n      ></path>\n    </InvalidIcon.svg>\n  );\n};\n\nconst Valid: FC<\n  Partial<ValidIconCCM> & PropsWithoutRef<JSX.IntrinsicElements['svg']>\n> = () => {\n  const theme = useNewPasswordTheme();\n  return (\n    <ValidIcon.svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 16\">\n      <title>Valid</title>\n      <path\n        fill={theme.positive}\n        stroke={theme.positive}\n        strokeWidth=\"2%\"\n        d=\"M6.521175,14.04015 L0.281175,7.80015 C-0.0937125,7.4252625 -0.0937125,6.817425 0.281175,6.4425 L1.6387875,5.08485 C2.013675,4.709925 2.62155,4.709925 2.9964375,5.08485 L7.2,9.288375 L16.2035625,0.28485 C16.57845,-0.0900375 17.186325,-0.0900375 17.5612125,0.28485 L18.918825,1.6425 C19.2937125,2.0173875 19.2937125,2.625225 18.918825,3.00015 L7.878825,14.0401875 C7.5039,14.415075 6.8960625,14.415075 6.521175,14.04015 L6.521175,14.04015 Z\"\n      ></path>\n    </ValidIcon.svg>\n  );\n};\n\nconst Default: FC<\n  Partial<DefaultIconCCM> & PropsWithoutRef<JSX.IntrinsicElements['svg']>\n> = () => {\n  const theme = useNewPasswordTheme();\n  return (\n    <DefaultIcon.svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 22\">\n      <title>Default</title>\n      <path\n        fill={theme.neutral}\n        stroke={theme.neutral}\n        strokeWidth=\"2%\"\n        d=\"M9.3,0 C4.1625,0 0,4.1625 0,9.3 C0,14.4375 4.1625,18.6 9.3,18.6 C14.4375,18.6 18.6,14.4375 18.6,9.3 C18.6,4.1625 14.4375,0 9.3,0 Z M9.3,16.8 C5.15625,16.8 1.8,13.44375 1.8,9.3 C1.8,5.15625 5.15625,1.8 9.3,1.8 C13.44375,1.8 16.8,5.15625 16.8,9.3 C16.8,13.44375 13.44375,16.8 9.3,16.8 Z\"\n      ></path>\n    </DefaultIcon.svg>\n  );\n};\n\nexport interface NewPasswordErrorMessageProps {\n  values?: any;\n  constraint?: string;\n  children: ReactNode;\n}\n\nexport const NewPasswordErrorMessage: FC<NewPasswordErrorMessageProps> = ({\n  values,\n  constraint,\n  children\n}) => {\n  const theme = useNewPasswordTheme();\n  const findIcon = (values: any, constraint: string) => {\n    const isInvalid =\n      values.error === 'required' ||\n      (values.error && values.error.split(',').includes(constraint));\n\n    if (!isInvalid) {\n      return <Valid />;\n    }\n\n    if (values.touched) {\n      return <Invalid />;\n    }\n\n    return <Default />;\n  };\n  return (\n    <PasswordMessage.div $color={theme.labelColor}>\n      {constraint && findIcon(values, constraint)}\n      <span>{children}</span>\n    </PasswordMessage.div>\n  );\n};\n","import {\n  patternValidator,\n  Message,\n  minLengthError,\n  minLengthValidator,\n  maxLengthValidator,\n  validateAllErrors,\n  TextField,\n  maxLengthError\n} from 'legos/text-field/base-field';\nimport { createElement, FC, ReactNode, useMemo } from 'react';\nimport { NewPasswordErrorMessage } from './new-password-error-message';\n\nexport interface NewPasswordFieldProps {\n  /** The name of this form field, unique in the current form context */\n  name: string;\n  /** Label node to display to the user for this field */\n  label: ReactNode;\n  /** Should display the password in plain text */\n  showPlainText?: boolean;\n  /** Message to display password constraints */\n  passwordConstraintMessage: ReactNode;\n  /** Error to show when the field does not have at least one number */\n  errorOneNumberMessage: ReactNode;\n  /** Error to show when the field does not have at least one UPPERCASE letter */\n  errorOneUppercaseLetterMessage: ReactNode;\n  /** Error to show when the field does not have at least one lower letter */\n  errorOneLowercaseLetterMessage: ReactNode;\n  /** Error to show when the field does not meet the min-length requirement */\n  errorMinLengthMessage: ReactNode;\n  /** Error to show when the field does not meet the max-length requirement */\n  errorMaxLengthMessage?: ReactNode;\n  /** A hash of error messages to show the user that occurred after a failed form submission */\n  submitErrorMessages?: { [submitErrorName: string]: ReactNode };\n}\n\nconst pwdConstraintOneNumber = 'oneNumber';\nconst pwdConstraintOneUppercaseLetter = 'oneUpperCaseLetter';\nconst pwdConstraintOneLowercaseLetter = 'oneLowerCaseLetter';\n\nexport const NewPasswordField: FC<NewPasswordFieldProps> = ({\n  name,\n  label,\n  showPlainText,\n  passwordConstraintMessage,\n  errorOneNumberMessage,\n  errorOneUppercaseLetterMessage,\n  errorOneLowercaseLetterMessage,\n  errorMinLengthMessage,\n  errorMaxLengthMessage,\n  submitErrorMessages\n}) => {\n  const validate = useMemo(\n    () =>\n      validateAllErrors(\n        // Must be >= 8\n        minLengthValidator(8),\n        // Must be <= 60\n        maxLengthValidator(60),\n        // Must have 1 number\n        patternValidator(/[0-9]/, pwdConstraintOneNumber),\n        // Must have 1 uppercase letter\n        patternValidator(/(?=.*[A-Z])/, pwdConstraintOneUppercaseLetter),\n        // Must have 1 lowercase letter\n        patternValidator(/(?=.*[a-z])/, pwdConstraintOneLowercaseLetter)\n      ),\n    []\n  );\n\n  return (\n    <TextField\n      autoComplete=\"new-password\"\n      type={showPlainText ? 'text' : 'password'}\n      validate={validate}\n      name={name}\n      label={label}\n      multiMessages\n      required\n    >\n      <Message>\n        <NewPasswordErrorMessage children={passwordConstraintMessage} />\n      </Message>\n      <Message>\n        {(props: object) => (\n          <NewPasswordErrorMessage\n            values={props}\n            constraint={pwdConstraintOneNumber}\n            children={errorOneNumberMessage}\n          />\n        )}\n      </Message>\n      <Message>\n        {(props: object) => (\n          <NewPasswordErrorMessage\n            values={props}\n            constraint={pwdConstraintOneUppercaseLetter}\n            children={errorOneUppercaseLetterMessage}\n          />\n        )}\n      </Message>\n      <Message>\n        {(props: object) => (\n          <NewPasswordErrorMessage\n            values={props}\n            constraint={pwdConstraintOneLowercaseLetter}\n            children={errorOneLowercaseLetterMessage}\n          />\n        )}\n      </Message>\n      <Message>\n        {(props: object) => (\n          <NewPasswordErrorMessage\n            values={props}\n            constraint={minLengthError}\n            children={errorMinLengthMessage}\n          />\n        )}\n      </Message>\n      <Message>\n        {(props: object) => (\n          <NewPasswordErrorMessage\n            values={props}\n            constraint={maxLengthError}\n            children={errorMaxLengthMessage}\n          />\n        )}\n      </Message>\n      {submitErrorMessages &&\n        Object.entries(submitErrorMessages).map(([error, node]) => (\n          <Message\n            key={error}\n            submitError={error}\n            dirtySinceLastSubmit={false}\n            children={node}\n          />\n        ))}\n    </TextField>\n  );\n};\n","import {\n  mismatchValidator,\n  Message,\n  TextField\n} from 'legos/text-field/base-field';\nimport { createElement, FC, useMemo, ReactNode } from 'react';\n\nexport interface ConfirmPasswordFieldProps {\n  /** The name of this form field, unique in the current form context */\n  name: string;\n  /** Label node to display to the user for this field */\n  label: ReactNode;\n  /** The name of the new password field with which value should match */\n  passwordField: string;\n  /** Error to show when the value does not match with the password field  */\n  errorPasswordMismatchMessage: ReactNode;\n  /** Should display the password in plain text */\n  showPlainText?: boolean;\n}\n\nexport const ConfirmPasswordField: FC<ConfirmPasswordFieldProps> = ({\n  name,\n  label,\n  showPlainText,\n  passwordField,\n  errorPasswordMismatchMessage\n}) => {\n  const mismatchError = 'mismatch';\n\n  const validate = useMemo(\n    () => mismatchValidator(passwordField, mismatchError),\n    [passwordField]\n  );\n\n  return (\n    <TextField\n      type={showPlainText ? 'text' : 'password'}\n      name={name}\n      label={label}\n      required\n      validate={validate}\n    >\n      <Message\n        touched\n        error={mismatchError}\n        children={errorPasswordMismatchMessage}\n      />\n    </TextField>\n  );\n};\n"],"names":["NewPasswordThemeProvider","useNewPasswordTheme","createUseThemeHook","global","neutral","color200","negative","color500","positive","labelColor","color700","styleInject","PasswordMessage","createComponentCreator","name","base","prop","$color","mod","InvalidIcon","ValidIcon","DefaultIcon","Invalid","theme","createElement","svg","xmlns","viewBox","fill","stroke","strokeWidth","d","Valid","Default","NewPasswordErrorMessage","values","constraint","children","div","error","split","includes","touched","findIcon","label","showPlainText","passwordConstraintMessage","errorOneNumberMessage","errorOneUppercaseLetterMessage","errorOneLowercaseLetterMessage","errorMinLengthMessage","errorMaxLengthMessage","submitErrorMessages","validate","useMemo","validateAllErrors","minLengthValidator","maxLengthValidator","patternValidator","TextField","autoComplete","type","multiMessages","required","Message","props","minLengthError","maxLengthError","Object","entries","map","node","key","submitError","dirtySinceLastSubmit","passwordField","errorPasswordMismatchMessage","mismatchValidator"],"mappings":"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"}