@mage-ui/components 1.0.16 → 1.0.18

package/dist/semedlab/components/navigations/notification-menu/NotificationMenu.d.mts

@@ -1,5 +1,5 @@
 import { NotificationProps } from "../../data-display/notification/Notification.mjs";
-import * as react_jsx_runtime1 from "react/jsx-runtime";
+import * as react_jsx_runtime2 from "react/jsx-runtime";
 import React from "react";
 
 //#region src/semedlab/components/navigations/notification-menu/NotificationMenu.d.ts
@@ -26,7 +26,7 @@ declare const NotificationMenu: ({
   targetLabel,
   indicatorAriaLabel,
   maxNotificationsToShow
-}: NotificationMenuProps) => react_jsx_runtime1.JSX.Element;
+}: NotificationMenuProps) => react_jsx_runtime2.JSX.Element;
 //#endregion
 export { NotificationMenu, NotificationMenuProps };
 //# sourceMappingURL=NotificationMenu.d.mts.map

package/dist/semedlab/components/navigations/notification-menu/NotificationMenu.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"NotificationMenu.d.mts","names":[],"sources":["../../../../../src/semedlab/components/navigations/notification-menu/NotificationMenu.tsx"],"mappings":";;;;;KAuBK,qBAAA,GAAwB,IAAA,CAC3B,iBAAA;AAAA,KAIU,qBAAA;EACV,aAAA,EAAe,qBAAA;EACf,YAAA,GAAe,IAAA;EACf,YAAA;EACA,eAAA;EACA,kBAAA,GAAqB,KAAA,CAAM,SAAA;EAC3B,eAAA,GAAkB,KAAA,CAAM,SAAA;EACxB,WAAA;EACA,YAAA;EACA,sBAAA;EACA,kBAAA;AAAA;AAAA,cAGW,gBAAA;EAAoB,aAAA;EAAA,YAAA;EAAA,YAAA;EAAA,eAAA;EAAA,kBAAA;EAAA,eAAA;EAAA,WAAA;EAAA,kBAAA;EAAA;AAAA,GAU9B,qBAAA,KAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"NotificationMenu.d.mts","names":[],"sources":["../../../../../src/semedlab/components/navigations/notification-menu/NotificationMenu.tsx"],"mappings":";;;;;KAwBK,qBAAA,GAAwB,IAAA,CAC3B,iBAAA;AAAA,KAIU,qBAAA;EACV,aAAA,EAAe,qBAAA;EACf,YAAA,GAAe,IAAA;EACf,YAAA;EACA,eAAA;EACA,kBAAA,GAAqB,KAAA,CAAM,SAAA;EAC3B,eAAA,GAAkB,KAAA,CAAM,SAAA;EACxB,WAAA;EACA,YAAA;EACA,sBAAA;EACA,kBAAA;AAAA;AAAA,cAGW,gBAAA;EAAoB,aAAA;EAAA,YAAA;EAAA,YAAA;EAAA,eAAA;EAAA,kBAAA;EAAA,eAAA;EAAA,WAAA;EAAA,kBAAA;EAAA;AAAA,GAU9B,qBAAA,KAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/semedlab/components/navigations/notification-menu/NotificationMenu.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"NotificationMenu.mjs","names":[],"sources":["../../../../../src/semedlab/components/navigations/notification-menu/NotificationMenu.tsx"],"sourcesContent":["import React from 'react';\nimport {\n  Button,\n  ButtonIconVisual,\n  ButtonVisual,\n  Indicator,\n  Menu,\n  ScrollAreaAutosize,\n} from '../../../../components';\n\nimport {\n  Notification,\n  type NotificationProps,\n} from '../../data-display/notification/Notification';\nimport {\n  notificationMenu,\n  notificationMenuButtonIconVisual,\n  notificationMenuButtonRow,\n  notificationMenuEmptyText,\n  notificationMenuEmptyWrapper,\n  notificationMenuIndicator,\n} from '@mage-ui/styled-system/recipes';\n\ntype NotificationItemProps = Omit<\n  NotificationProps,\n  'onDismiss' | 'dismissBtnLabel'\n>;\n\nexport type NotificationMenuProps = {\n  notifications: NotificationItemProps[];\n  onDismissOne: (slug: string) => void;\n  onDismissAll: () => void;\n  dismissBtnLabel?: string;\n  dismissAllBtnLabel?: React.ReactNode;\n  viewAllBtnLabel?: React.ReactNode;\n  targetLabel?: string;\n  emptyMessage?: string;\n  maxNotificationsToShow?: number;\n  indicatorAriaLabel?: string;\n};\n\nexport const NotificationMenu = ({\n  notifications,\n  onDismissOne,\n  onDismissAll,\n  dismissBtnLabel = 'Dismiss notification',\n  dismissAllBtnLabel = 'Dismiss all notifications',\n  viewAllBtnLabel = 'View all notifications',\n  targetLabel = 'Notifications',\n  indicatorAriaLabel = 'You have new notifications',\n  maxNotificationsToShow = 10,\n}: NotificationMenuProps) => {\n\n  const [isOpen, setIsOpen] = React.useState(false);\n\n  const hasNotifications = notifications.length > 0;\n  const notificationsToShow = notifications.slice(0, maxNotificationsToShow);\n  const showIndicator = hasNotifications && !isOpen;\n\n  const target = (\n    <Indicator\n      label={showIndicator ? notifications.length : undefined}\n      ariaLabel={showIndicator ? indicatorAriaLabel : undefined}\n      disabled={!showIndicator}\n      offset={2}\n      classNames={{\n        label: notificationMenuIndicator()\n      }}\n    >\n      <ButtonIconVisual\n        classNames={{\n          buttonIconVisual: notificationMenuButtonIconVisual()\n        }}\n        path='/icons/sprite-theme.svg'\n        name='bell-01'\n        label={targetLabel}\n      />\n    </Indicator>\n  );\n\n  return (\n    <Menu\n      target={target}\n      position='bottom-end'\n      keepMounted={false}\n      width={320}\n      targetButtonProps={{\n        onClick: () => setIsOpen(true),\n      }}\n      classNames={{\n        menu: notificationMenu(),\n      }}\n    >\n      {hasNotifications ? (\n        <ScrollAreaAutosize mah={192}>\n          {notificationsToShow.map((noti) => (\n            <Notification\n              key={noti.slug}\n              slug={noti.slug}\n              title={noti.title}\n              description={noti.description}\n              iconName={noti.iconName}\n              dismissBtnLabel={dismissBtnLabel}\n              onDismiss={() => onDismissOne(noti.slug)}\n            />\n          ))}\n        </ScrollAreaAutosize>\n      ) : (\n        <NotificationMenuEmpty />\n      )}\n      <Menu.Item>\n        <div className={notificationMenuButtonRow()}>\n          <ButtonVisual>{viewAllBtnLabel}</ButtonVisual>\n          {hasNotifications && (\n            <Button onClick={onDismissAll}>{dismissAllBtnLabel}</Button>\n          )}\n        </div>\n      </Menu.Item>\n    </Menu>\n  );\n};\n\nconst NotificationMenuEmpty = ({\n  emptyMessage = 'You have no notifications',\n}) => {\n  return (\n    <Menu.Item>\n      <div className={notificationMenuEmptyWrapper()}>\n        <img src=\"/images/bell-empty.svg\" alt=\"No notifications\" />\n        <p className={notificationMenuEmptyText()}>{emptyMessage}</p>\n      </div>\n    </Menu.Item >\n    // TODO: receptes amb ui final del projecte\n    // TODO: img svg reemplaçar per component o svgr per controlar light/dark?\n  );\n}\n"],"mappings":"45BAyCA,MAAa,GAAoB,CAC/B,gBACA,eACA,eACA,kBAAkB,uBAClB,qBAAqB,4BACrB,kBAAkB,yBAClB,cAAc,gBACd,qBAAqB,6BACrB,yBAAyB,MACE,CAE3B,GAAM,CAAC,EAAQ,GAAa,EAAM,SAAS,GAAM,CAE3C,EAAmB,EAAc,OAAS,EAC1C,EAAsB,EAAc,MAAM,EAAG,EAAuB,CACpE,EAAgB,GAAoB,CAAC,EAuB3C,OACE,EAAC,EAAA,CACC,OAtBF,EAAC,EAAA,CACC,MAAO,EAAgB,EAAc,OAAS,IAAA,GAC9C,UAAW,EAAgB,EAAqB,IAAA,GAChD,SAAU,CAAC,EACX,OAAQ,EACR,WAAY,CACV,MAAO,GAA2B,CACnC,UAED,EAAC,EAAA,CACC,WAAY,CACV,iBAAkB,GAAkC,CACrD,CACD,KAAK,0BACL,KAAK,UACL,MAAO,GACP,EACQ,CAMV,SAAS,aACT,YAAa,GACb,MAAO,IACP,kBAAmB,CACjB,YAAe,EAAU,GAAK,CAC/B,CACD,WAAY,CACV,KAAM,GAAkB,CACzB,WAEA,EACC,EAAC,EAAA,CAAmB,IAAK,aACtB,EAAoB,IAAK,GACxB,EAAC,EAAA,CAEC,KAAM,EAAK,KACX,MAAO,EAAK,MACZ,YAAa,EAAK,YAClB,SAAU,EAAK,SACE,kBACjB,cAAiB,EAAa,EAAK,KAAK,EANnC,EAAK,KAOV,CACF,EACiB,CAErB,EAAC,EAAA,EAAA,CAAwB,CAE3B,EAAC,EAAK,KAAA,CAAA,SACJ,EAAC,MAAA,CAAI,UAAW,GAA2B,WACzC,EAAC,EAAA,CAAA,SAAc,EAAA,CAA+B,CAC7C,GACC,EAAC,EAAA,CAAO,QAAS,WAAe,GAA4B,CAAA,EAE1D,CAAA,CACI,CAAA,EACP,EAIL,GAAyB,CAC7B,eAAe,+BAGb,EAAC,EAAK,KAAA,CAAA,SACJ,EAAC,MAAA,CAAI,UAAW,GAA8B,WAC5C,EAAC,MAAA,CAAI,IAAI,yBAAyB,IAAI,oBAAqB,CAC3D,EAAC,IAAA,CAAE,UAAW,GAA2B,UAAG,GAAiB,CAAA,EACzD,CAAA,CACK"}
+{"version":3,"file":"NotificationMenu.mjs","names":[],"sources":["../../../../../src/semedlab/components/navigations/notification-menu/NotificationMenu.tsx"],"sourcesContent":["import React from 'react';\n\nimport {\n  notificationMenu,\n  notificationMenuButtonIconVisual,\n  notificationMenuButtonRow,\n  notificationMenuEmptyText,\n  notificationMenuEmptyWrapper,\n  notificationMenuIndicator,\n} from '@mage-ui/styled-system/recipes';\n\nimport {\n  Button,\n  ButtonIconVisual,\n  ButtonVisual,\n  Indicator,\n  Menu,\n  ScrollAreaAutosize,\n} from '../../../../components';\nimport {\n  Notification,\n  type NotificationProps,\n} from '../../data-display/notification/Notification';\n\ntype NotificationItemProps = Omit<\n  NotificationProps,\n  'onDismiss' | 'dismissBtnLabel'\n>;\n\nexport type NotificationMenuProps = {\n  notifications: NotificationItemProps[];\n  onDismissOne: (slug: string) => void;\n  onDismissAll: () => void;\n  dismissBtnLabel?: string;\n  dismissAllBtnLabel?: React.ReactNode;\n  viewAllBtnLabel?: React.ReactNode;\n  targetLabel?: string;\n  emptyMessage?: string;\n  maxNotificationsToShow?: number;\n  indicatorAriaLabel?: string;\n};\n\nexport const NotificationMenu = ({\n  notifications,\n  onDismissOne,\n  onDismissAll,\n  dismissBtnLabel = 'Dismiss notification',\n  dismissAllBtnLabel = 'Dismiss all notifications',\n  viewAllBtnLabel = 'View all notifications',\n  targetLabel = 'Notifications',\n  indicatorAriaLabel = 'You have new notifications',\n  maxNotificationsToShow = 10,\n}: NotificationMenuProps) => {\n  const [isOpen, setIsOpen] = React.useState(false);\n\n  const hasNotifications = notifications.length > 0;\n  const notificationsToShow = notifications.slice(0, maxNotificationsToShow);\n  const showIndicator = hasNotifications && !isOpen;\n\n  const target = (\n    <Indicator\n      label={showIndicator ? notifications.length : undefined}\n      ariaLabel={showIndicator ? indicatorAriaLabel : undefined}\n      disabled={!showIndicator}\n      offset={2}\n      classNames={{\n        label: notificationMenuIndicator(),\n      }}\n    >\n      <ButtonIconVisual\n        classNames={{\n          buttonIconVisual: notificationMenuButtonIconVisual(),\n        }}\n        path='/icons/sprite-theme.svg'\n        name='bell-01'\n        label={targetLabel}\n      />\n    </Indicator>\n  );\n\n  return (\n    <Menu\n      target={target}\n      position='bottom-end'\n      keepMounted={false}\n      width={320}\n      targetButtonProps={{\n        onClick: () => setIsOpen(true),\n      }}\n      classNames={{\n        menu: notificationMenu(),\n      }}\n    >\n      {hasNotifications ? (\n        <ScrollAreaAutosize mah={192}>\n          {notificationsToShow.map((noti) => (\n            <Notification\n              key={noti.slug}\n              slug={noti.slug}\n              title={noti.title}\n              description={noti.description}\n              iconName={noti.iconName}\n              dismissBtnLabel={dismissBtnLabel}\n              onDismiss={() => onDismissOne(noti.slug)}\n            />\n          ))}\n        </ScrollAreaAutosize>\n      ) : (\n        <NotificationMenuEmpty />\n      )}\n      <Menu.Item>\n        <div className={notificationMenuButtonRow()}>\n          <ButtonVisual>{viewAllBtnLabel}</ButtonVisual>\n          {hasNotifications && (\n            <Button onClick={onDismissAll}>{dismissAllBtnLabel}</Button>\n          )}\n        </div>\n      </Menu.Item>\n    </Menu>\n  );\n};\n\nconst NotificationMenuEmpty = ({\n  emptyMessage = 'You have no notifications',\n}) => {\n  return (\n    <Menu.Item>\n      <div className={notificationMenuEmptyWrapper()}>\n        <img src='/images/bell-empty.svg' alt='No notifications' />\n        <p className={notificationMenuEmptyText()}>{emptyMessage}</p>\n      </div>\n    </Menu.Item>\n    // TODO: receptes amb ui final del projecte\n    // TODO: img svg reemplaçar per component o svgr per controlar light/dark?\n  );\n};\n"],"mappings":"45BA0CA,MAAa,GAAoB,CAC/B,gBACA,eACA,eACA,kBAAkB,uBAClB,qBAAqB,4BACrB,kBAAkB,yBAClB,cAAc,gBACd,qBAAqB,6BACrB,yBAAyB,MACE,CAC3B,GAAM,CAAC,EAAQ,GAAa,EAAM,SAAS,GAAM,CAE3C,EAAmB,EAAc,OAAS,EAC1C,EAAsB,EAAc,MAAM,EAAG,EAAuB,CACpE,EAAgB,GAAoB,CAAC,EAuB3C,OACE,EAAC,EAAA,CACC,OAtBF,EAAC,EAAA,CACC,MAAO,EAAgB,EAAc,OAAS,IAAA,GAC9C,UAAW,EAAgB,EAAqB,IAAA,GAChD,SAAU,CAAC,EACX,OAAQ,EACR,WAAY,CACV,MAAO,GAA2B,CACnC,UAED,EAAC,EAAA,CACC,WAAY,CACV,iBAAkB,GAAkC,CACrD,CACD,KAAK,0BACL,KAAK,UACL,MAAO,GACP,EACQ,CAMV,SAAS,aACT,YAAa,GACb,MAAO,IACP,kBAAmB,CACjB,YAAe,EAAU,GAAK,CAC/B,CACD,WAAY,CACV,KAAM,GAAkB,CACzB,WAEA,EACC,EAAC,EAAA,CAAmB,IAAK,aACtB,EAAoB,IAAK,GACxB,EAAC,EAAA,CAEC,KAAM,EAAK,KACX,MAAO,EAAK,MACZ,YAAa,EAAK,YAClB,SAAU,EAAK,SACE,kBACjB,cAAiB,EAAa,EAAK,KAAK,EANnC,EAAK,KAOV,CACF,EACiB,CAErB,EAAC,EAAA,EAAA,CAAwB,CAE3B,EAAC,EAAK,KAAA,CAAA,SACJ,EAAC,MAAA,CAAI,UAAW,GAA2B,WACzC,EAAC,EAAA,CAAA,SAAc,EAAA,CAA+B,CAC7C,GACC,EAAC,EAAA,CAAO,QAAS,WAAe,GAA4B,CAAA,EAE1D,CAAA,CACI,CAAA,EACP,EAIL,GAAyB,CAC7B,eAAe,+BAGb,EAAC,EAAK,KAAA,CAAA,SACJ,EAAC,MAAA,CAAI,UAAW,GAA8B,WAC5C,EAAC,MAAA,CAAI,IAAI,yBAAyB,IAAI,oBAAqB,CAC3D,EAAC,IAAA,CAAE,UAAW,GAA2B,UAAG,GAAiB,CAAA,EACzD,CAAA,CACI"}

package/dist/semedlab/components/navigations/profile-menu/ProfileMenu.d.mts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime2 from "react/jsx-runtime";
+import * as react_jsx_runtime3 from "react/jsx-runtime";
 import { ReactNode } from "react";
 
 //#region src/semedlab/components/navigations/profile-menu/ProfileMenu.d.ts
@@ -15,7 +15,7 @@ declare const ProfileMenu: ({
   alt,
   description,
   children
-}: ProfileMenuProps) => react_jsx_runtime2.JSX.Element;
+}: ProfileMenuProps) => react_jsx_runtime3.JSX.Element;
 //#endregion
 export { ProfileMenu, ProfileMenuProps };
 //# sourceMappingURL=ProfileMenu.d.mts.map

package/dist/semedlab/components/navigations/profile-menu/ProfileMenu.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ProfileMenu.mjs","names":[],"sources":["../../../../../src/semedlab/components/navigations/profile-menu/ProfileMenu.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { Avatar, Menu } from '../../../../components';\nimport { UserProfile } from '../../data-display';\n\nimport {\n  profileMenu,\n  profileMenuUserProfile,\n} from '@mage-ui/styled-system/recipes';\n\nexport type ProfileMenuProps = {\n  name: string;\n  src?: string;\n  alt?: string;\n  description?: string;\n  children?: ReactNode;\n};\n\nexport const ProfileMenu = ({\n  name,\n  src,\n  alt,\n  description,\n  children,\n}: ProfileMenuProps) => {\n  return (\n    <Menu\n      target={<Avatar name={name} src={src} alt={alt} />}\n      position='bottom-end'\n      width={248}\n      classNames={{\n        menu: profileMenu(),\n      }}\n    >\n      <UserProfile\n        name={name}\n        src={src}\n        alt={alt}\n        description={description}\n        classNames={{ userProfile: profileMenuUserProfile() }}\n      />\n      {children}\n    </Menu>\n  );\n};\n"],"mappings":"gXAkBA,MAAa,GAAe,CAC1B,OACA,MACA,MACA,cACA,cAGE,EAAC,EAAA,CACC,OAAQ,EAAC,EAAA,CAAa,OAAW,MAAU,OAAO,CAClD,SAAS,aACT,MAAO,IACP,WAAY,CACV,KAAM,GAAa,CACpB,WAED,EAAC,EAAA,CACO,OACD,MACA,MACQ,cACb,WAAY,CAAE,YAAa,GAAwB,CAAE,EACrD,CACD,EAAA,EACI"}
+{"version":3,"file":"ProfileMenu.mjs","names":[],"sources":["../../../../../src/semedlab/components/navigations/profile-menu/ProfileMenu.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport {\n  profileMenu,\n  profileMenuUserProfile,\n} from '@mage-ui/styled-system/recipes';\n\nimport { Avatar, Menu } from '../../../../components';\nimport { UserProfile } from '../../data-display';\n\nexport type ProfileMenuProps = {\n  name: string;\n  src?: string;\n  alt?: string;\n  description?: string;\n  children?: ReactNode;\n};\n\nexport const ProfileMenu = ({\n  name,\n  src,\n  alt,\n  description,\n  children,\n}: ProfileMenuProps) => {\n  return (\n    <Menu\n      target={<Avatar name={name} src={src} alt={alt} />}\n      position='bottom-end'\n      width={248}\n      classNames={{\n        menu: profileMenu(),\n      }}\n    >\n      <UserProfile\n        name={name}\n        src={src}\n        alt={alt}\n        description={description}\n        classNames={{ userProfile: profileMenuUserProfile() }}\n      />\n      {children}\n    </Menu>\n  );\n};\n"],"mappings":"gXAkBA,MAAa,GAAe,CAC1B,OACA,MACA,MACA,cACA,cAGE,EAAC,EAAA,CACC,OAAQ,EAAC,EAAA,CAAa,OAAW,MAAU,OAAO,CAClD,SAAS,aACT,MAAO,IACP,WAAY,CACV,KAAM,GAAa,CACpB,WAED,EAAC,EAAA,CACO,OACD,MACA,MACQ,cACb,WAAY,CAAE,YAAa,GAAwB,CAAE,EACrD,CACD,EAAA,EACI"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mage-ui/components",
-  "version": "1.0.16",
+  "version": "1.0.18",
   "private": false,
   "description": "",
   "keywords": [],
@@ -18,7 +18,7 @@
   "devDependencies": {
     "@biomejs/biome": "^2.3.13",
     "@pandacss/types": "^1.8.1",
-    "@types/node": "^25.1.0",
+    "@types/node": "^25.2.0",
     "@types/react": "^19.2.10",
     "@types/react-dom": "^19.2.3",
     "@types/react-big-calendar": "^1.16.3",
@@ -26,15 +26,15 @@
     "tsdown": "^0.20.1",
     "typescript": "^5.9.3",
     "baseline-browser-mapping": "^2.9.19",
-    "@mage-ui/preset": "1.0.16",
+    "@mage-ui/preset": "1.0.18",
     "@mage-ui/styled-system": "1.0.8"
   },
   "peerDependencies": {
     "@hookform/resolvers": "^5.2.2",
-    "@mantine/core": "^8.3.13",
-    "@mantine/dates": "^8.3.13",
-    "@mantine/dropzone": "^8.3.13",
-    "@mantine/hooks": "^8.3.13",
+    "@mantine/core": "^8.3.14",
+    "@mantine/dates": "^8.3.14",
+    "@mantine/dropzone": "^8.3.14",
+    "@mantine/hooks": "^8.3.14",
     "@pandabox/define-recipe": "^0.0.3",
     "@pandacss/dev": "^1.8.1",
     "@tanstack/react-query": "^5.90.20",

package/dist/components/controls/password-input-strength/PasswordInputStrength.d.mts.map

@@ -1 +0,0 @@
-{"version":3,"file":"PasswordInputStrength.d.mts","names":[],"sources":["../../../../src/components/controls/password-input-strength/PasswordInputStrength.tsx"],"mappings":";;;;KAyBY,0BAAA,GAA6B,IAAA,CACvC,kBAAA;EAGA,gBAAA;EACA,kBAAA;EACA,kBAAA;EACA,UAAA,GAAa,IAAA,CACX,WAAA,CAAY,kBAAA;IAGZ,qBAAA;IACA,iBAAA;MACE,iBAAA;MACA,IAAA;MACA,IAAA;MACA,GAAA;MACA,IAAA;IAAA;EAAA;AAAA;AAAA,cA0DO,qBAAA;EAAyB,IAAA;EAAA,KAAA;EAAA,WAAA;EAAA,KAAA;EAAA,WAAA;EAAA,UAAA;EAAA,SAAA;EAAA,QAAA;EAAA,KAAA;EAAA,YAAA;EAAA,EAAA;EAAA,QAAA;EAAA,QAAA;EAAA,QAAA;EAAA,OAAA;EAAA,OAAA;EAAA,gBAAA;EAAA,kBAAA;EAAA;AAAA,GAoBnC,0BAAA,KAA0B,mBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/controls/password-input-strength/PasswordInputStrength.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"PasswordInputStrength.mjs","names":[],"sources":["../../../../src/components/controls/password-input-strength/PasswordInputStrength.tsx"],"sourcesContent":["import { cx } from '@mage-ui/styled-system/css';\n\nimport {\n  PasswordInput,\n  type PasswordInputProps,\n} from '../password-input/PasswordInput';\nimport {\n  passwordInputStrength,\n  passwordInputStrengthDescription,\n  passwordInputStrengthError,\n  passwordInputStrengthInput,\n  passwordInputStrengthLabel,\n  passwordInputStrengthRequired,\n  passwordInputStrengthRoot,\n  passwordInputStrengthSection,\n  passwordInputStrengthStrengthIndicator,\n  passwordInputStrengthStrengthIndicatorBar,\n  passwordInputStrengthStrengthIndicatorBars,\n  passwordInputStrengthStrengthIndicatorText,\n  passwordInputStrengthStrengthIndicatorRoot,\n  passwordInputStrengthWrapper,\n} from '@mage-ui/styled-system/recipes';\n\nimport { type ChangeEvent, type CSSProperties, useState } from 'react';\n\nexport type PasswordInputStrengthProps = Omit<\n  PasswordInputProps,\n  'classNames'\n> & {\n  weakPasswordText?: string;\n  mediumPasswordText?: string;\n  strongPasswordText?: string;\n  classNames?: Omit<\n    NonNullable<PasswordInputProps['classNames']>,\n    'passwordInput'\n  > & {\n    passwordInputStrength?: string;\n    strengthIndicator?: {\n      strengthIndicator?: string;\n      root?: string;\n      bars?: string;\n      bar?: string;\n      text?: string;\n    };\n  };\n};\n\nconst requirements = [\n  { re: /.{6,}/ },\n  { re: /.{10,}/ },\n  { re: /[0-9]/ },\n  { re: /[a-z]/ },\n  { re: /[A-Z]/ },\n  { re: /[$&+,:;=?@#|'<>.^*()%!-]/ },\n];\n\nconst calculateStrength = (password: string) => {\n  let score = 0;\n  if (!password) return 0;\n\n  for (let i = 0; i < requirements.length; i++) {\n    const req = requirements[i];\n    if (req.re.test(password)) {\n      score++;\n    }\n  }\n  return score;\n};\n\nconst getStrengthState = (score: number, index: number) => {\n  const filledBars = Math.min(score, 4);\n\n  if (index >= filledBars) return 'neutral';\n  if (filledBars <= 1) return 'weak';\n  if (filledBars <= 3) return 'medium';\n  return 'strong';\n};\n\nconst getStateBackgroundBar = (score: number, index: number): string => {\n  const state = getStrengthState(score, index);\n  if (state === 'neutral') {\n    return 'var(--password-input-strength-strength-indicator-bar-background-neutral)';\n  }\n  return `var(--password-input-strength-strength-indicator-bar-background-${state})`;\n};\n\nconst getStrengthLabel = (\n  score: number,\n  texts: {\n    weakPasswordText: string;\n    mediumPasswordText: string;\n    strongPasswordText: string;\n  },\n) => {\n  if (score === 0) return '';\n  if (score <= 1) return texts.weakPasswordText;\n  if (score <= 3) return texts.mediumPasswordText;\n  return texts.strongPasswordText;\n};\n\nexport const PasswordInputStrength = ({\n  name,\n  label,\n  description,\n  error,\n  placeholder,\n  classNames,\n  startSlot,\n  onChange,\n  value,\n  defaultValue,\n  id,\n  disabled,\n  required,\n  readOnly,\n  onClick,\n  onFocus,\n  weakPasswordText,\n  mediumPasswordText,\n  strongPasswordText,\n}: PasswordInputStrengthProps) => {\n  const [innerValue, setInnerValue] = useState<string>(\n    (value as string) ?? (defaultValue as string) ?? '',\n  );\n\n  const currentValue = (value as string) ?? innerValue;\n\n  const handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n    if (value === undefined) {\n      setInnerValue(e.target.value);\n    }\n    onChange?.(e);\n  };\n  const passwordTexts = {\n    weakPasswordText: weakPasswordText ?? 'Weak',\n    mediumPasswordText: mediumPasswordText ?? 'Medium',\n    strongPasswordText: strongPasswordText ?? 'Strong',\n  };\n  const score = calculateStrength(currentValue);\n  const strengthLabel = getStrengthLabel(score, passwordTexts);\n\n  return (\n    <>\n      <PasswordInput\n        name={name}\n        label={label}\n        description={description}\n        error={error}\n        placeholder={placeholder}\n        value={value}\n        id={id}\n        disabled={disabled}\n        required={required}\n        readOnly={readOnly}\n        onChange={handleChange}\n        onClick={onClick}\n        onFocus={onFocus}\n        defaultValue={defaultValue}\n        startSlot={startSlot}\n        classNames={{\n          root: cx(\n            classNames?.passwordInputStrength ?? passwordInputStrength(),\n            classNames?.root ?? passwordInputStrengthRoot(),\n          ),\n          label: classNames?.label ?? passwordInputStrengthLabel(),\n          required: classNames?.required ?? passwordInputStrengthRequired(),\n          description:\n            classNames?.description ?? passwordInputStrengthDescription(),\n          error: classNames?.error ?? passwordInputStrengthError(),\n          wrapper: classNames?.wrapper ?? passwordInputStrengthWrapper(),\n          input: classNames?.input ?? passwordInputStrengthInput(),\n          section: classNames?.section ?? passwordInputStrengthSection(),\n        }}\n      />\n      <div\n        className={cx(\n          classNames?.strengthIndicator?.strengthIndicator ??\n            passwordInputStrengthStrengthIndicator(),\n          classNames?.strengthIndicator?.root ??\n            passwordInputStrengthStrengthIndicatorRoot(),\n        )}\n      >\n        <div\n          className={\n            classNames?.strengthIndicator?.bars ??\n            passwordInputStrengthStrengthIndicatorBars()\n          }\n        >\n          {[0, 1, 2, 3].map((index) => (\n            <div\n              key={index}\n              className={\n                classNames?.strengthIndicator?.bar ??\n                passwordInputStrengthStrengthIndicatorBar()\n              }\n              style={\n                {\n                  '--password-input-strength-strength-indicator-bar-background':\n                    getStateBackgroundBar(score, index),\n                } as CSSProperties\n              }\n            />\n          ))}\n        </div>\n        <p\n          className={\n            classNames?.strengthIndicator?.text ??\n            passwordInputStrengthStrengthIndicatorText()\n          }\n        >\n          {strengthLabel}\n        </p>\n      </div>\n    </>\n  );\n};\n"],"mappings":"mxBA+CA,MAAM,EAAe,CACnB,CAAE,GAAI,QAAS,CACf,CAAE,GAAI,SAAU,CAChB,CAAE,GAAI,QAAS,CACf,CAAE,GAAI,QAAS,CACf,CAAE,GAAI,QAAS,CACf,CAAE,GAAI,2BAA4B,CACnC,CAEK,EAAqB,GAAqB,CAC9C,IAAI,EAAQ,EACZ,GAAI,CAAC,EAAU,MAAO,GAEtB,IAAK,IAAI,EAAI,EAAG,EAAI,EAAa,OAAQ,IAC3B,EAAa,GACjB,GAAG,KAAK,EAAS,EACvB,IAGJ,OAAO,GAGH,GAAoB,EAAe,IAAkB,CACzD,IAAM,EAAa,KAAK,IAAI,EAAO,EAAE,CAKrC,OAHI,GAAS,EAAmB,UAC5B,GAAc,EAAU,OACxB,GAAc,EAAU,SACrB,UAGH,GAAyB,EAAe,IAA0B,CACtE,IAAM,EAAQ,EAAiB,EAAO,EAAM,CAI5C,OAHI,IAAU,UACL,2EAEF,mEAAmE,EAAM,IAG5E,GACJ,EACA,IAMI,IAAU,EAAU,GACpB,GAAS,EAAU,EAAM,iBACzB,GAAS,EAAU,EAAM,mBACtB,EAAM,mBAGF,GAAyB,CACpC,OACA,QACA,cACA,QACA,cACA,aACA,YACA,WACA,QACA,eACA,KACA,WACA,WACA,WACA,UACA,UACA,mBACA,qBACA,wBACgC,CAChC,GAAM,CAAC,EAAY,GAAiB,EACjC,GAAqB,GAA2B,GAClD,CAEK,EAAgB,GAAoB,EAEpC,EAAgB,GAAqC,CACrD,IAAU,IAAA,IACZ,EAAc,EAAE,OAAO,MAAM,CAE/B,IAAW,EAAE,EAET,EAAgB,CACpB,iBAAkB,GAAoB,OACtC,mBAAoB,GAAsB,SAC1C,mBAAoB,GAAsB,SAC3C,CACK,EAAQ,EAAkB,EAAa,CACvC,EAAgB,EAAiB,EAAO,EAAc,CAE5D,OACE,EAAA,EAAA,CAAA,SAAA,CACE,EAAC,EAAA,CACO,OACC,QACM,cACN,QACM,cACN,QACH,KACM,WACA,WACA,WACV,SAAU,EACD,UACA,UACK,eACH,YACX,WAAY,CACV,KAAM,EACJ,GAAY,uBAAyB,GAAuB,CAC5D,GAAY,MAAQ,GAA2B,CAChD,CACD,MAAO,GAAY,OAAS,GAA4B,CACxD,SAAU,GAAY,UAAY,GAA+B,CACjE,YACE,GAAY,aAAe,GAAkC,CAC/D,MAAO,GAAY,OAAS,GAA4B,CACxD,QAAS,GAAY,SAAW,GAA8B,CAC9D,MAAO,GAAY,OAAS,GAA4B,CACxD,QAAS,GAAY,SAAW,GAA8B,CAC/D,EACD,CACF,EAAC,MAAA,CACC,UAAW,EACT,GAAY,mBAAmB,mBAC7B,GAAwC,CAC1C,GAAY,mBAAmB,MAC7B,GAA4C,CAC/C,WAED,EAAC,MAAA,CACC,UACE,GAAY,mBAAmB,MAC/B,GAA4C,UAG7C,CAAC,EAAG,EAAG,EAAG,EAAE,CAAC,IAAK,GACjB,EAAC,MAAA,CAEC,UACE,GAAY,mBAAmB,KAC/B,GAA2C,CAE7C,MACE,CACE,8DACE,EAAsB,EAAO,EAAM,CACtC,EATE,EAWL,CACF,EACE,CACN,EAAC,IAAA,CACC,UACE,GAAY,mBAAmB,MAC/B,GAA4C,UAG7C,GACC,CAAA,EACA,CAAA,CAAA,CACL"}