npm - @ahrowe/ui - Versions diffs - 0.42.0 → 0.43.0 - Mend

@ahrowe/ui 0.42.0 → 0.43.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (273) hide show

package/dist/esm/common/avatar/avatar.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use client";import{renderIcon as e}from"../utils/renderIcon.mjs";import{BadgePosition as t,BadgeStyleType as n}from"../badge/badge.types.mjs";import r from"../badge/badge.mjs";import i from"./avatar.module.mjs";import{useState as a}from"react";import o from"classnames";import{faUser as s}from"@fortawesome/free-solid-svg-icons";import{jsx as c}from"react/jsx-runtime";var l={online:n.Success,away:n.Warn,busy:n.Error,offline:n.Default};function u(e){if(!e)return``;let t=e.trim().split(/\s+/).filter(Boolean);return t.length===0?``:t.length===1?t[0].slice(0,2).toUpperCase():(t[0][0]+t[t.length-1][0]).toUpperCase()}function d({src:n,alt:d,name:f,icon:p=s,content:m,status:h,className:g,style:_,classNames:v,styles:y,...b}){let[x,S]=a(!1),[C,w]=a(n);n!==C&&(w(n),S(!1));let T=u(f),E=n&&!x?c(`img`,{className:o(i.avatarImage,v?.image),style:y?.image,src:n,alt:d??f??``,onError:()=>S(!0)}):c(`span`,{className:o(i.avatarFallback,v?.fallback),style:y?.fallback,children:m??(T||e(p))});return h?c(r,{...b,dot:!0,position:t.BottomRight,styleType:l[h],className:g,style:_,classNames:{badge:o(i.avatarStatusBadge,v?.status)},styles:{badge:y?.status},children:c(`span`,{className:i.avatar,children:E})}):c(`span`,{...b,className:o(i.avatar,g),style:_,children:E})}export{d as default};
+"use client";import{ThemeColor as e}from"../themeProvider/color.types.mjs";import{renderIcon as t}from"../utils/renderIcon.mjs";import{BadgePosition as n}from"../badge/badge.types.mjs";import r from"../badge/badge.mjs";import i from"./avatar.module.mjs";import{useState as a}from"react";import o from"classnames";import{faUser as s}from"@fortawesome/free-solid-svg-icons";import{jsx as c}from"react/jsx-runtime";var l={online:e.Success,away:e.Warn,busy:e.Error,offline:`var(--text-dark)`};function u(e){if(!e)return``;let t=e.trim().split(/\s+/).filter(Boolean);return t.length===0?``:t.length===1?t[0].slice(0,2).toUpperCase():(t[0][0]+t[t.length-1][0]).toUpperCase()}function d({src:e,alt:d,name:f,icon:p=s,content:m,status:h,className:g,style:_,classNames:v,styles:y,...b}){let[x,S]=a(!1),[C,w]=a(e);e!==C&&(w(e),S(!1));let T=u(f),E=e&&!x?c(`img`,{className:o(i.avatarImage,v?.image),style:y?.image,src:e,alt:d??f??``,onError:()=>S(!0)}):c(`span`,{className:o(i.avatarFallback,v?.fallback),style:y?.fallback,children:m??(T||t(p))});return h?c(r,{...b,dot:!0,position:n.BottomRight,color:l[h],className:g,style:_,classNames:{badge:o(i.avatarStatusBadge,v?.status)},styles:{badge:y?.status},children:c(`span`,{className:i.avatar,children:E})}):c(`span`,{...b,className:o(i.avatar,g),style:_,children:E})}export{d as default};
 //# sourceMappingURL=avatar.mjs.map

package/dist/esm/common/avatar/avatar.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"avatar.mjs","names":[],"sources":["../../../../package/common/avatar/avatar.tsx"],"sourcesContent":["import { useState, type ReactElement } from 'react';\nimport cx from 'classnames';\nimport { faUser } from '@fortawesome/free-solid-svg-icons';\nimport Badge, { ~~BadgeStyleType,~~ BadgePosition } from '../badge';\n\nimport type { AvatarProps, AvatarStatus } from './avatar.types';\nimport styles from './avatar.module.pcss';\nimport { renderIcon } from '../utils/renderIcon';\n\nconst ~~STATUS_STYLE~~: Record<AvatarStatus, ~~BadgeStyleType~~> = {\n online: ~~BadgeStyleType~~.Success,\n away: ~~BadgeStyleType~~.Warn,\n busy: ~~BadgeStyleType~~.Error,\n offline: ~~BadgeStyleType.Default~~,\n};\n\nfunction getInitials(name?: string): string {\n if (!name) return '';\n const parts = name.trim().split(/\\s+/).filter(Boolean);\n if (parts.length === 0) return '';\n if (parts.length === 1) return parts[0].slice(0, 2).toUpperCase();\n return (parts[0][0] + parts[parts.length - 1][0]).toUpperCase();\n}\n\nfunction Avatar({\n src,\n alt,\n name,\n icon = faUser,\n content,\n status,\n className,\n style,\n classNames,\n styles: slotStyles,\n ...rest\n}: AvatarProps): ReactElement {\n const [hasError, setHasError] = useState(false);\n const [prevSrc, setPrevSrc] = useState(src);\n\n if (src !== prevSrc) {\n setPrevSrc(src);\n setHasError(false);\n }\n\n const initials = getInitials(name);\n const showImage = !!src && !hasError;\n\n const rendered = showImage ? (\n <img\n className={cx(styles.avatarImage, classNames?.image)}\n style={slotStyles?.image}\n src={src}\n alt={alt ?? name ?? ''}\n onError={() => setHasError(true)}\n />\n ) : (\n <span className={cx(styles.avatarFallback, classNames?.fallback)} style={slotStyles?.fallback}>\n {content ?? (initials \|\| renderIcon(icon))}\n </span>\n );\n\n if (!status) {\n return (\n <span {...rest} className={cx(styles.avatar, className)} style={style}>\n {rendered}\n </span>\n );\n }\n\n return (\n <Badge\n {...rest}\n dot\n position={BadgePosition.BottomRight}\n ~~styleType~~={~~STATUS_STYLE~~[status]}\n className={className}\n style={style}\n classNames={{ badge: cx(styles.avatarStatusBadge, classNames?.status) }}\n styles={{ badge: slotStyles?.status }}\n >\n <span className={styles.avatar}>{rendered}</span>\n </Badge>\n );\n}\n\nexport default Avatar;\n"],"mappings":"~~kXASA~~,IAAM,~~EAAqD~~,~~CACzD~~,OAAQ,~~EAAe~~,~~QACvB~~,KAAM,~~EAAe~~,~~KACrB~~,KAAM,~~EAAe~~,~~MACrB~~,QAAS,~~EAAe~~,~~OAC1B,~~EAEA,SAAS,EAAY,EAAuB,CAC1C,GAAI,CAAC,EAAM,MAAO,GAClB,IAAM,EAAQ,EAAK,KAAK,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,OAAO,OAAO,EAGrD,OAFI,EAAM,SAAW,EAAU,GAC3B,EAAM,SAAW,EAAU,EAAM,EAAE,CAAC,MAAM,EAAG,CAAC,CAAC,CAAC,YAAY,GACxD,EAAM,EAAE,CAAC,GAAK,EAAM,EAAM,OAAS,EAAE,CAAC,GAAA,CAAI,YAAY,CAChE,CAEA,SAAS,EAAO,CACd,MACA,MACA,OACA,OAAO,EACP,UACA,SACA,YACA,QACA,aACA,OAAQ,EACR,GAAG,GACyB,CAC5B,GAAM,CAAC,EAAU,GAAe,EAAS,EAAK,EACxC,CAAC,EAAS,GAAc,EAAS,CAAG,EAEtC,IAAQ,IACV,EAAW,CAAG,EACd,EAAY,EAAK,GAGnB,IAAM,EAAW,EAAY,CAAI,EAG3B,EAFc,GAAO,CAAC,EAG1B,EAAC,MAAD,CACE,UAAW,EAAG,EAAO,YAAa,GAAY,KAAK,EACnD,MAAO,GAAY,MACd,MACL,IAAK,GAAO,GAAQ,GACpB,YAAe,EAAY,EAAI,CAChC,CAAA,EAED,EAAC,OAAD,CAAM,UAAW,EAAG,EAAO,eAAgB,GAAY,QAAQ,EAAG,MAAO,GAAY,SAClF,SAAA,IAAY,GAAY,EAAW,CAAI,EACpC,CAAA,EAWR,OARK,EASH,EAAC,EAAD,CACE,GAAI,EACJ,IAAA,GACA,SAAU,EAAc,YACxB,~~UAAW~~,EAAa,~~GACb~~,YACJ,QACP,WAAY,CAAE,MAAO,EAAG,EAAO,kBAAmB,GAAY,MAAM,CAAE,EACtE,OAAQ,CAAE,MAAO,GAAY,MAAO,EAEpC,SAAA,EAAC,OAAD,CAAM,UAAW,EAAO,OAAS,SAAA,CAAe,CAAA,CAC3C,CAAA,EAlBL,EAAC,OAAD,CAAM,GAAI,EAAM,UAAW,EAAG,EAAO,OAAQ,CAAS,EAAU,QAC7D,SAAA,CACG,CAAA,CAkBZ"}
1	+ {"version":3,"file":"avatar.mjs","names":[],"sources":["../../../../package/common/avatar/avatar.tsx"],"sourcesContent":["import { useState, type ReactElement } from 'react';\nimport cx from 'classnames';\nimport { faUser } from '@fortawesome/free-solid-svg-icons';\nimport Badge, { BadgePosition } from '../badge';\nimport { ThemeColor, type ColorValue } from '../themeProvider/color.types';\n\nimport type { AvatarProps, AvatarStatus } from './avatar.types';\nimport styles from './avatar.module.pcss';\nimport { renderIcon } from '../utils/renderIcon';\n\nconst STATUS_COLOR: Record<AvatarStatus, ColorValue> = {\n online: ThemeColor.Success,\n away: ThemeColor.Warn,\n busy: ThemeColor.Error,\n offline: 'var(--text-dark)',\n};\n\nfunction getInitials(name?: string): string {\n if (!name) return '';\n const parts = name.trim().split(/\\s+/).filter(Boolean);\n if (parts.length === 0) return '';\n if (parts.length === 1) return parts[0].slice(0, 2).toUpperCase();\n return (parts[0][0] + parts[parts.length - 1][0]).toUpperCase();\n}\n\nfunction Avatar({\n src,\n alt,\n name,\n icon = faUser,\n content,\n status,\n className,\n style,\n classNames,\n styles: slotStyles,\n ...rest\n}: AvatarProps): ReactElement {\n const [hasError, setHasError] = useState(false);\n const [prevSrc, setPrevSrc] = useState(src);\n\n if (src !== prevSrc) {\n setPrevSrc(src);\n setHasError(false);\n }\n\n const initials = getInitials(name);\n const showImage = !!src && !hasError;\n\n const rendered = showImage ? (\n <img\n className={cx(styles.avatarImage, classNames?.image)}\n style={slotStyles?.image}\n src={src}\n alt={alt ?? name ?? ''}\n onError={() => setHasError(true)}\n />\n ) : (\n <span className={cx(styles.avatarFallback, classNames?.fallback)} style={slotStyles?.fallback}>\n {content ?? (initials \|\| renderIcon(icon))}\n </span>\n );\n\n if (!status) {\n return (\n <span {...rest} className={cx(styles.avatar, className)} style={style}>\n {rendered}\n </span>\n );\n }\n\n return (\n <Badge\n {...rest}\n dot\n position={BadgePosition.BottomRight}\n color={STATUS_COLOR[status]}\n className={className}\n style={style}\n classNames={{ badge: cx(styles.avatarStatusBadge, classNames?.status) }}\n styles={{ badge: slotStyles?.status }}\n >\n <span className={styles.avatar}>{rendered}</span>\n </Badge>\n );\n}\n\nexport default Avatar;\n"],"mappings":"4ZAUA,IAAM,EAAiD,CACrD,OAAQ,EAAW,QACnB,KAAM,EAAW,KACjB,KAAM,EAAW,MACjB,QAAS,kBACX,EAEA,SAAS,EAAY,EAAuB,CAC1C,GAAI,CAAC,EAAM,MAAO,GAClB,IAAM,EAAQ,EAAK,KAAK,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,OAAO,OAAO,EAGrD,OAFI,EAAM,SAAW,EAAU,GAC3B,EAAM,SAAW,EAAU,EAAM,EAAE,CAAC,MAAM,EAAG,CAAC,CAAC,CAAC,YAAY,GACxD,EAAM,EAAE,CAAC,GAAK,EAAM,EAAM,OAAS,EAAE,CAAC,GAAA,CAAI,YAAY,CAChE,CAEA,SAAS,EAAO,CACd,MACA,MACA,OACA,OAAO,EACP,UACA,SACA,YACA,QACA,aACA,OAAQ,EACR,GAAG,GACyB,CAC5B,GAAM,CAAC,EAAU,GAAe,EAAS,EAAK,EACxC,CAAC,EAAS,GAAc,EAAS,CAAG,EAEtC,IAAQ,IACV,EAAW,CAAG,EACd,EAAY,EAAK,GAGnB,IAAM,EAAW,EAAY,CAAI,EAG3B,EAFc,GAAO,CAAC,EAG1B,EAAC,MAAD,CACE,UAAW,EAAG,EAAO,YAAa,GAAY,KAAK,EACnD,MAAO,GAAY,MACd,MACL,IAAK,GAAO,GAAQ,GACpB,YAAe,EAAY,EAAI,CAChC,CAAA,EAED,EAAC,OAAD,CAAM,UAAW,EAAG,EAAO,eAAgB,GAAY,QAAQ,EAAG,MAAO,GAAY,SAClF,SAAA,IAAY,GAAY,EAAW,CAAI,EACpC,CAAA,EAWR,OARK,EASH,EAAC,EAAD,CACE,GAAI,EACJ,IAAA,GACA,SAAU,EAAc,YACxB,MAAO,EAAa,GACT,YACJ,QACP,WAAY,CAAE,MAAO,EAAG,EAAO,kBAAmB,GAAY,MAAM,CAAE,EACtE,OAAQ,CAAE,MAAO,GAAY,MAAO,EAEpC,SAAA,EAAC,OAAD,CAAM,UAAW,EAAO,OAAS,SAAA,CAAe,CAAA,CAC3C,CAAA,EAlBL,EAAC,OAAD,CAAM,GAAI,EAAM,UAAW,EAAG,EAAO,OAAQ,CAAS,EAAU,QAC7D,SAAA,CACG,CAAA,CAkBZ"}

package/dist/esm/common/badge/badge.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use client";import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import{BadgePosition as t,BadgeStyleType as n}from"./badge.types.mjs";import r from"./badge.module.mjs";import i from"classnames";import{jsx as a,jsxs as o}from"react/jsx-runtime";var s={[n.Default]:r.badgeStyleDefault,[n.Primary]:r.badgeStylePrimary,[n.Success]:r.badgeStyleSuccess,[n.Info]:r.badgeStyleInfo,[n.Warn]:r.badgeStyleWarn,[n.Error]:r.badgeStyleError},c={[t.TopRight]:r.badgePositionTopRight,[t.TopLeft]:r.badgePositionTopLeft,[t.BottomRight]:r.badgePositionBottomRight,[t.BottomLeft]:r.badgePositionBottomLeft};function l(l){let{count:u,max:d=99,content:f,dot:p=!1,showZero:m=!1,styleType:h=n.Primary,position:g=t.TopRight,children:_=null,className:v,style:y,classNames:b,styles:x,...S}=e(`Badge`,l),C=typeof u==`number`,w=f!=null,T=(p||w||C)&&!(!p&&!w&&C&&u===0&&!m),E=w?f:C?u>d?`${d}+`:u:null,D=_!=null;return o(`span`,{...S,className:i(r.wrapper,v),style:y,children:[_,T&&a(`span`,{className:i(r.badge,s[h],p&&r.badgeDot,D&&r.badgeOverlay,D&&c[g],b?.badge),style:x?.badge,children:!p&&E})]})}export{l as default};
+"use client";import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import{ThemeColor as t}from"../themeProvider/color.types.mjs";import{toneProps as n,useToneCheck as r}from"../styles/tone.mjs";import{BadgePosition as i,BadgeStyleType as a}from"./badge.types.mjs";import o from"./badge.module.mjs";import s from"classnames";import{jsx as c,jsxs as l}from"react/jsx-runtime";var u={[a.Filled]:o.badgeStyleFilled,[a.Light]:o.badgeStyleLight,[a.Outlined]:o.badgeStyleOutlined},d={[i.TopRight]:o.badgePositionTopRight,[i.TopLeft]:o.badgePositionTopLeft,[i.BottomRight]:o.badgePositionBottomRight,[i.BottomLeft]:o.badgePositionBottomLeft};function f(f){let{count:p,max:m=99,content:h,dot:g=!1,showZero:_=!1,styleType:v=a.Filled,color:y=t.Primary,position:b=i.TopRight,children:x=null,className:S,style:C,classNames:w,styles:T,...E}=e(`Badge`,f),D=typeof p==`number`,O=h!=null,k=(g||O||D)&&!(!g&&!O&&D&&p===0&&!_),A=O?h:D?p>m?`${m}+`:p:null,j=x!=null,M=n(y);return r(`Badge`,[y]),l(`span`,{...E,className:s(o.wrapper,S),style:C,children:[x,k&&c(`span`,{className:s(o.badge,M.className,g?o.badgeDot:u[v],j&&o.badgeOverlay,j&&d[b],w?.badge),style:{...M.style,...T?.badge},children:!g&&A})]})}export{f as default};
 //# sourceMappingURL=badge.mjs.map

package/dist/esm/common/badge/badge.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"badge.mjs","names":[],"sources":["../../../../package/common/badge/badge.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport cx from 'classnames';\n\nimport { BadgeStyleType, BadgePosition } from './badge.types';\nimport type { BadgeProps } from './badge.types';\nimport styles from './badge.module.pcss';\nimport { useComponentDefaults } from '../configProvider';\n\nconst CLASS_BY_STYLE: Record<BadgeStyleType, string> = {\n [BadgeStyleType.~~Default~~]: styles.~~badgeStyleDefault~~,\n [BadgeStyleType.~~Primary~~]: styles.~~badgeStylePrimary~~,\n [BadgeStyleType.~~Success~~]: styles.~~badgeStyleSuccess~~,\n ~~[BadgeStyleType.Info]: styles.badgeStyleInfo,\n [BadgeStyleType.Warn]: styles.badgeStyleWarn,\n [BadgeStyleType.Error]: styles.badgeStyleError,\n~~};\n\nconst CLASS_BY_POSITION: Record<BadgePosition, string> = {\n [BadgePosition.TopRight]: styles.badgePositionTopRight,\n [BadgePosition.TopLeft]: styles.badgePositionTopLeft,\n [BadgePosition.BottomRight]: styles.badgePositionBottomRight,\n [BadgePosition.BottomLeft]: styles.badgePositionBottomLeft,\n};\n\nfunction Badge(props: BadgeProps): ReactElement {\n const {\n count,\n max = 99,\n content,\n dot = false,\n showZero = false,\n styleType = BadgeStyleType.Primary,\n position = BadgePosition.TopRight,\n children = null,\n className,\n style,\n classNames,\n styles: slotStyles,\n ...rest\n } = useComponentDefaults('Badge', props);\n const hasCount = typeof count === 'number';\n const hasContent = content != null;\n const isHiddenByZero = !dot && !hasContent && hasCount && count === 0 && !showZero;\n const showBadge = (dot \|\| hasContent \|\| hasCount) && !isHiddenByZero;\n\n const displayValue = hasContent ? content : hasCount ? (count > max ? `${max}+` : count) : null;\n const isOverlay = children != null;\n\n return (\n <span {...rest} className={cx(styles.wrapper, className)} style={style}>\n {children}\n {showBadge && (\n <span\n className={cx(\n styles.badge,\n ~~CLASS_BY_STYLE[styleType]~~,\n dot && styles.badgeDot,\n isOverlay && styles.badgeOverlay,\n isOverlay && CLASS_BY_POSITION[position],\n classNames?.badge,\n )}\n style={slotStyles?.badge}\n >\n {!dot && displayValue}\n </span>\n )}\n </span>\n );\n}\n\nexport default Badge;\n"],"mappings":"~~mRAQA~~,IAAM,EAAiD,EACpD,EAAe,~~SAAU~~,EAAO,~~mBAChC~~,EAAe,~~SAAU~~,EAAO,~~mBAChC~~,EAAe,~~SAAU~~,EAAO,~~mBAChC~~,~~EAAe,MAAO,EAAO,gBAC7B,EAAe,MAAO,EAAO,gBAC7B,EAAe,OAAQ,EAAO,eACjC,~~EAEM,EAAmD,EACtD,EAAc,UAAW,EAAO,uBAChC,EAAc,SAAU,EAAO,sBAC/B,EAAc,aAAc,EAAO,0BACnC,EAAc,YAAa,EAAO,uBACrC,EAEA,SAAS,EAAM,EAAiC,CAC9C,GAAM,CACJ,QACA,MAAM,GACN,UACA,MAAM,GACN,WAAW,GACX,YAAY,EAAe,~~QAC3B~~,WAAW,EAAc,SACzB,WAAW,KACX,YACA,QACA,aACA,OAAQ,EACR,GAAG,GACD,EAAqB,QAAS,CAAK,EACjC,EAAW,OAAO,GAAU,SAC5B,EAAa,GAAW,KAExB,GAAa,GAAO,GAAc,IAAa,EAD9B,CAAC,GAAO,CAAC,GAAc,GAAY,IAAU,GAAK,CAAC,GAGpE,EAAe,EAAa,EAAU,EAAY,EAAQ,EAAM,GAAG,EAAI,GAAK,EAAS,KACrF,EAAY,GAAY,~~KAE9B~~,~~OACE~~,EAAC,OAAD,CAAM,GAAI,EAAM,UAAW,EAAG,EAAO,QAAS,CAAS,EAAU,QAAjE,SAAA,CACG,EACA,GACC,EAAC,OAAD,CACE,UAAW,EACT,EAAO,MACP,~~EAAe~~,~~GACf~~,~~GAAO~~,EAAO,~~SACd~~,GAAa,EAAO,aACpB,GAAa,EAAkB,GAC/B,GAAY,KACd,EACA,MAAO,GAAY,~~MAElB~~,SAAA,CAAC,GAAO,CACL,CAAA,CAEJ,GAEV"}
1	+ {"version":3,"file":"badge.mjs","names":[],"sources":["../../../../package/common/badge/badge.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport cx from 'classnames';\n\nimport { BadgeStyleType, BadgePosition } from './badge.types';\nimport type { BadgeProps } from './badge.types';\nimport styles from './badge.module.pcss';\nimport { useComponentDefaults } from '../configProvider';\nimport { ThemeColor } from '../themeProvider/color.types';\nimport { toneProps, useToneCheck } from '../styles/tone';\n\nconst CLASS_BY_STYLE: Record<BadgeStyleType, string> = {\n [BadgeStyleType.Filled]: styles.badgeStyleFilled,\n [BadgeStyleType.Light]: styles.badgeStyleLight,\n [BadgeStyleType.Outlined]: styles.badgeStyleOutlined,\n};\n\nconst CLASS_BY_POSITION: Record<BadgePosition, string> = {\n [BadgePosition.TopRight]: styles.badgePositionTopRight,\n [BadgePosition.TopLeft]: styles.badgePositionTopLeft,\n [BadgePosition.BottomRight]: styles.badgePositionBottomRight,\n [BadgePosition.BottomLeft]: styles.badgePositionBottomLeft,\n};\n\nfunction Badge(props: BadgeProps): ReactElement {\n const {\n count,\n max = 99,\n content,\n dot = false,\n showZero = false,\n styleType = BadgeStyleType.Filled,\n color = ThemeColor.Primary,\n position = BadgePosition.TopRight,\n children = null,\n className,\n style,\n classNames,\n styles: slotStyles,\n ...rest\n } = useComponentDefaults('Badge', props);\n const hasCount = typeof count === 'number';\n const hasContent = content != null;\n const isHiddenByZero = !dot && !hasContent && hasCount && count === 0 && !showZero;\n const showBadge = (dot \|\| hasContent \|\| hasCount) && !isHiddenByZero;\n\n const displayValue = hasContent ? content : hasCount ? (count > max ? `${max}+` : count) : null;\n const isOverlay = children != null;\n const tone = toneProps(color);\n useToneCheck('Badge', [color]);\n\n return (\n <span {...rest} className={cx(styles.wrapper, className)} style={style}>\n {children}\n {showBadge && (\n <span\n className={cx(\n styles.badge,\n tone.className,\n dot ? styles.badgeDot : CLASS_BY_STYLE[styleType],\n isOverlay && styles.badgeOverlay,\n isOverlay && CLASS_BY_POSITION[position],\n classNames?.badge,\n )}\n style={{ ...tone.style, ...slotStyles?.badge }}\n >\n {!dot && displayValue}\n </span>\n )}\n </span>\n );\n}\n\nexport default Badge;\n"],"mappings":"kZAUA,IAAM,EAAiD,EACpD,EAAe,QAAS,EAAO,kBAC/B,EAAe,OAAQ,EAAO,iBAC9B,EAAe,UAAW,EAAO,kBACpC,EAEM,EAAmD,EACtD,EAAc,UAAW,EAAO,uBAChC,EAAc,SAAU,EAAO,sBAC/B,EAAc,aAAc,EAAO,0BACnC,EAAc,YAAa,EAAO,uBACrC,EAEA,SAAS,EAAM,EAAiC,CAC9C,GAAM,CACJ,QACA,MAAM,GACN,UACA,MAAM,GACN,WAAW,GACX,YAAY,EAAe,OAC3B,QAAQ,EAAW,QACnB,WAAW,EAAc,SACzB,WAAW,KACX,YACA,QACA,aACA,OAAQ,EACR,GAAG,GACD,EAAqB,QAAS,CAAK,EACjC,EAAW,OAAO,GAAU,SAC5B,EAAa,GAAW,KAExB,GAAa,GAAO,GAAc,IAAa,EAD9B,CAAC,GAAO,CAAC,GAAc,GAAY,IAAU,GAAK,CAAC,GAGpE,EAAe,EAAa,EAAU,EAAY,EAAQ,EAAM,GAAG,EAAI,GAAK,EAAS,KACrF,EAAY,GAAY,KACxB,EAAO,EAAU,CAAK,EAG5B,OAFA,EAAa,QAAS,CAAC,CAAK,CAAC,EAG3B,EAAC,OAAD,CAAM,GAAI,EAAM,UAAW,EAAG,EAAO,QAAS,CAAS,EAAU,QAAjE,SAAA,CACG,EACA,GACC,EAAC,OAAD,CACE,UAAW,EACT,EAAO,MACP,EAAK,UACL,EAAM,EAAO,SAAW,EAAe,GACvC,GAAa,EAAO,aACpB,GAAa,EAAkB,GAC/B,GAAY,KACd,EACA,MAAO,CAAE,GAAG,EAAK,MAAO,GAAG,GAAY,KAAM,EAE5C,SAAA,CAAC,GAAO,CACL,CAAA,CAEJ,GAEV"}

package/dist/esm/common/badge/badge.module.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use client";var e=`wrapper_bcGTc`,t=`badge_mj0fB`,n=`badge-dot_TFLNc`,r=`badge-position-top-right_ZqWIX`,i=`badge-position-top-left_c-tJc`,a=`badge-position-bottom-right_7JuZ-`,o=`badge-position-bottom-left_nsuJP`,s=`badge-overlay_Xs19S`,c=`badge-style-default_E32XE`,l=`badge-style-primary_x1J3r`,u=`badge-style-success_LK3u0`,d=`badge-style-info_48nNP`,f=`badge-style-warn_0PIRu`,p=`badge-style-error_5RoOd`,m={wrapper:e,badge:t,"badge-dot":`badge-dot_TFLNc`,badgeDot:n,"badge-position-top-right":`badge-position-top-right_ZqWIX`,badgePositionTopRight:r,"badge-position-top-left":`badge-position-top-left_c-tJc`,badgePositionTopLeft:i,"badge-position-bottom-right":`badge-position-bottom-right_7JuZ-`,badgePositionBottomRight:a,"badge-position-bottom-left":`badge-position-bottom-left_nsuJP`,badgePositionBottomLeft:o,"badge-overlay":`badge-overlay_Xs19S`,badgeOverlay:s,"badge-style-default":`badge-style-default_E32XE`,badgeStyleDefault:c,"badge-style-primary":`badge-style-primary_x1J3r`,badgeStylePrimary:l,"badge-style-success":`badge-style-success_LK3u0`,badgeStyleSuccess:u,"badge-style-info":`badge-style-info_48nNP`,badgeStyleInfo:d,"badge-style-warn":`badge-style-warn_0PIRu`,badgeStyleWarn:f,"badge-style-error":`badge-style-error_5RoOd`,badgeStyleError:p};export{t as badge,n as badgeDot,s as badgeOverlay,o as badgePositionBottomLeft,a as badgePositionBottomRight,i as badgePositionTopLeft,r as badgePositionTopRight,c as badgeStyleDefault,p as badgeStyleError,d as badgeStyleInfo,l as badgeStylePrimary,u as badgeStyleSuccess,f as badgeStyleWarn,m as default,e as wrapper};
+"use client";var e=`wrapper_bcGTc`,t=`badge_mj0fB`,n=`badge-dot_TFLNc`,r=`badge-position-top-right_ZqWIX`,i=`badge-position-top-left_c-tJc`,a=`badge-position-bottom-right_7JuZ-`,o=`badge-position-bottom-left_nsuJP`,s=`badge-overlay_Xs19S`,c=`badge-style-filled_Ypk4a`,l=`badge-style-light_Lx97c`,u=`badge-style-outlined_O35rE`,d={wrapper:e,badge:t,"badge-dot":`badge-dot_TFLNc`,badgeDot:n,"badge-position-top-right":`badge-position-top-right_ZqWIX`,badgePositionTopRight:r,"badge-position-top-left":`badge-position-top-left_c-tJc`,badgePositionTopLeft:i,"badge-position-bottom-right":`badge-position-bottom-right_7JuZ-`,badgePositionBottomRight:a,"badge-position-bottom-left":`badge-position-bottom-left_nsuJP`,badgePositionBottomLeft:o,"badge-overlay":`badge-overlay_Xs19S`,badgeOverlay:s,"badge-style-filled":`badge-style-filled_Ypk4a`,badgeStyleFilled:c,"badge-style-light":`badge-style-light_Lx97c`,badgeStyleLight:l,"badge-style-outlined":`badge-style-outlined_O35rE`,badgeStyleOutlined:u};export{t as badge,n as badgeDot,s as badgeOverlay,o as badgePositionBottomLeft,a as badgePositionBottomRight,i as badgePositionTopLeft,r as badgePositionTopRight,c as badgeStyleFilled,l as badgeStyleLight,u as badgeStyleOutlined,d as default,e as wrapper};
 //# sourceMappingURL=badge.module.mjs.map

package/dist/esm/common/badge/badge.module.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"badge.module.mjs","names":[],"sources":["../../../../package/common/badge/badge.module.pcss"],"sourcesContent":[".wrapper {\n position: relative;\n display: inline-flex;\n align-items: center;\n isolation: isolate;\n}\n\n.badge {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n min-width: 1.5em;\n height: 1.5em;\n padding: 0 0.375em;\n border-radius: var(--default-border-radius);\n font-size: 0.75em;\n font-weight: 600;\n line-height: 1;\n white-space: nowrap;\n ~~background: var(--badge-bg);\n~~\n /* ~~Must~~ ~~follow~~ ~~the~~ ~~shorthand~~ ~~above~~, ~~which~~ ~~resets~~ ~~background-image~~. /\n ~~background-image: var(--badge-image, none);\n color: var(--badge-fg);\n\n~~ &-dot {\n min-width: 0.8em;\n width: 0.8em;\n height: 0.8em;\n padding: 0;\n border-radius: 100%;\n background: var(--~~badge-solid~~);\n\n &.badge-position-top-right {\n transform: translate(20%, -20%);\n }\n\n &.badge-position-top-left {\n transform: translate(-20%, -20%);\n }\n\n &.badge-position-bottom-right {\n transform: translate(20%, 20%);\n }\n\n &.badge-position-bottom-left {\n transform: translate(-20%, 20%);\n }\n }\n\n &-overlay {\n position: absolute;\n z-index: 1;\n }\n\n &-position {\n &-top-right {\n top: 0;\n right: 0;\n transform: translate(50%, -50%);\n }\n\n &-top-left {\n top: 0;\n left: 0;\n transform: translate(-50%, -50%);\n }\n\n &-bottom-right {\n bottom: 0;\n right: 0;\n transform: translate(50%, 50%);\n }\n\n &-bottom-left {\n bottom: 0;\n left: 0;\n transform: translate(-50%, 50%);\n }\n }\n\n &-style {\n &-~~default~~ {\n ~~--badge-bg~~: ~~rgb(0 0 0 / 8%);\n --badge-fg:~~ var(--~~text~~-~~color~~);\n ~~--badge-solid: var(--text-dark);\n }~~\n~~\n &-primary {\n~~ ~~--badge-bg: var(--primary-color);\n --badge-fg: var(--text-on-primary);\n --badge-solid: var(--primary-color);\n\n~~ / ~~Set~~ ~~per~~ ~~variant, not on .badge:~~ the ~~other~~ ~~variants paint their own colours~~, ~~and~~ ~~the~~ ~~dot\n (0.8em) is too small to show a ramp, so it keeps --badge~~-~~solid on its own~~. */\n ~~--badge~~-image: var(--~~primary~~-gradient~~, none~~);\n ~~}\n\n &-success {\n~~ ~~--badge-bg: var(--success-lighter);\n --badge-fg: var(--success-~~color~~);\n --badge-solid~~: var(--~~success~~-~~color~~);\n }\n\n &-~~info~~ {\n ~~--badge-bg~~: var(--~~info~~-~~lighter~~);\n ~~--badge-fg: var(--info-~~color~~);\n --badge-solid~~: var(--~~info~~-~~color~~);\n }\n\n ~~&-warn~~ ~~{\n --badge-bg:~~ ~~var(--warn-lighter);\n --badge-fg:~~ ~~var(--warn-color);\n --~~badge~~-solid:~~ ~~var(--warn-color);\~~n ~~}\n\n~~ &-~~error~~ {\n ~~--badge~~-bg: var(--~~error~~-~~lighter~~);\n ~~--badge-fg: var(--error-~~color~~);\n --badge-solid~~: var(--~~error~~-~~color~~);\n }\n }\n}\n"],"mappings":""}
1	+ {"version":3,"file":"badge.module.mjs","names":[],"sources":["../../../../package/common/badge/badge.module.pcss"],"sourcesContent":[".wrapper {\n position: relative;\n display: inline-flex;\n align-items: center;\n isolation: isolate;\n}\n\n.badge {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n min-width: 1.5em;\n height: 1.5em;\n padding: 0 0.375em;\n border-radius: var(--default-border-radius);\n font-size: 0.75em;\n font-weight: 600;\n line-height: 1;\n white-space: nowrap;\n\n /* Always solid: too small for a tint, an outline or a gradient. /\n &-dot {\n min-width: 0.8em;\n width: 0.8em;\n height: 0.8em;\n padding: 0;\n border-radius: 100%;\n background: var(--tone);\n\n &.badge-position-top-right {\n transform: translate(20%, -20%);\n }\n\n &.badge-position-top-left {\n transform: translate(-20%, -20%);\n }\n\n &.badge-position-bottom-right {\n transform: translate(20%, 20%);\n }\n\n &.badge-position-bottom-left {\n transform: translate(-20%, 20%);\n }\n }\n\n / An opaque page-coloured base under the style, or the content shows through Light, Outlined\n and Neutral's fill. /\n &-overlay {\n position: absolute;\n z-index: 1;\n\n &.badge-style-filled {\n background: var(--tone-gradient), linear-gradient(var(--tone-fill), var(--tone-fill)), var(--background);\n }\n\n &.badge-style-light {\n background: linear-gradient(var(--tone-light), var(--tone-light)), var(--background);\n }\n\n &.badge-style-outlined {\n background: var(--background);\n }\n }\n\n &-position {\n &-top-right {\n top: 0;\n right: 0;\n transform: translate(50%, -50%);\n }\n\n &-top-left {\n top: 0;\n left: 0;\n transform: translate(-50%, -50%);\n }\n\n &-bottom-right {\n bottom: 0;\n right: 0;\n transform: translate(50%, 50%);\n }\n\n &-bottom-left {\n bottom: 0;\n left: 0;\n transform: translate(-50%, 50%);\n }\n }\n\n &-style {\n &-filled {\n background: var(--tone-fill);\n\n / Must follow the shorthand above, which resets background-image. /\n background-image: var(--tone-gradient);\n color: var(--tone-contrast);\n }\n\n &-light {\n background: var(--tone-light);\n color: var(--tone-text);\n }\n\n / An inset shadow rather than a border, so an outlined badge is exactly as big as the rest. */\n &-outlined {\n box-shadow: inset 0 0 0 1px var(--tone-outline);\n color: var(--tone-text);\n }\n }\n}\n"],"mappings":""}

package/dist/esm/common/badge/badge.types.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use client";var e=function(e){return e.Default=`default`,e.Primary=`primary`,e.Success=`success`,e.Info=`info`,e.Warn=`warn`,e.Error=`error`,e}({}),t=function(e){return e.TopRight=`top-right`,e.TopLeft=`top-left`,e.BottomRight=`bottom-right`,e.BottomLeft=`bottom-left`,e}({});export{t as BadgePosition,e as BadgeStyleType};
+"use client";var e=function(e){return e.Filled=`filled`,e.Light=`light`,e.Outlined=`outlined`,e}({}),t=function(e){return e.TopRight=`top-right`,e.TopLeft=`top-left`,e.BottomRight=`bottom-right`,e.BottomLeft=`bottom-left`,e}({});export{t as BadgePosition,e as BadgeStyleType};
 //# sourceMappingURL=badge.types.mjs.map

package/dist/esm/common/badge/badge.types.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"badge.types.mjs","names":[],"sources":["../../../../package/common/badge/badge.types.ts"],"sourcesContent":["import type { CSSProperties, ReactNode } from 'react';\nimport type { SlotClassNames, SlotStyles, HtmlProps } from '../types/slots.types';\n\nexport enum BadgeStyleType {\n ~~Default~~ = 'default~~',\~~n ~~Primary~~ = '~~primary~~',\n ~~Success~~ = ~~'success',\~~n ~~Info~~ = '~~info~~',\n ~~Warn~~ = ~~'warn',\~~n ~~Error~~ = '~~error~~',\n}\n\nexport enum BadgePosition {\n TopRight = 'top-right',\n TopLeft = 'top-left',\n BottomRight = 'bottom-right',\n BottomLeft = 'bottom-left',\n}\n\nexport type BadgeSlots = 'badge';\n\nexport interface BadgeProps extends Omit<HtmlProps, 'content'> {\n count?: number;\n max?: number;\n content?: ReactNode;\n dot?: boolean;\n showZero?: boolean;\n styleType?: BadgeStyleType;\n position?: BadgePosition;\n children?: ReactNode;\n className?: string;\n style?: CSSProperties;\n classNames?: SlotClassNames<BadgeSlots>;\n styles?: SlotStyles<BadgeSlots>;\n}\n"],"mappings":"~~aAGA~~,IAAY,EAAL,SAAA,EAAA,~~OACL~~,GAAA,~~QAAA~~,~~UACA~~,EAAA,~~QAAA~~,~~UACA~~,EAAA,~~QAAA~~,~~UACA~~,EAAA,~~KAAA,OACA,EAAA,KAAA,OACA,EAAA,MAAA,SACF,EAAA,~~CAAA,CAAA,EAEY,EAAL,SAAA,EAAA,OACL,GAAA,SAAA,YACA,EAAA,QAAA,WACA,EAAA,YAAA,eACA,EAAA,WAAA,eACF,EAAA,CAAA,CAAA"}
1	+ {"version":3,"file":"badge.types.mjs","names":[],"sources":["../../../../package/common/badge/badge.types.ts"],"sourcesContent":["import type { CSSProperties, ReactNode } from 'react';\nimport type { SlotClassNames, SlotStyles, HtmlProps } from '../types/slots.types';\nimport type { ColorValue } from '../themeProvider/color.types';\n\n/** How much the badge stands out. Independent of its colour; a `dot` is always solid. /\nexport enum BadgeStyleType {\n /* Solid fill. The default. /\n Filled = 'filled',\n /* A light tint of the colour behind text in the colour. /\n Light = 'light',\n /* Border and text in the colour, no fill. /\n Outlined = 'outlined',\n}\n\nexport enum BadgePosition {\n TopRight = 'top-right',\n TopLeft = 'top-left',\n BottomRight = 'bottom-right',\n BottomLeft = 'bottom-left',\n}\n\nexport type BadgeSlots = 'badge';\n\nexport interface BadgeProps extends Omit<HtmlProps, 'content'> {\n count?: number;\n max?: number;\n content?: ReactNode;\n dot?: boolean;\n showZero?: boolean;\n styleType?: BadgeStyleType;\n /* A `ThemeColor` (default `Primary`) or any CSS colour, such as `'var(--brand)'`. */\n color?: ColorValue;\n position?: BadgePosition;\n children?: ReactNode;\n className?: string;\n style?: CSSProperties;\n classNames?: SlotClassNames<BadgeSlots>;\n styles?: SlotStyles<BadgeSlots>;\n}\n"],"mappings":"aAKA,IAAY,EAAL,SAAA,EAAA,OAEL,GAAA,OAAA,SAEA,EAAA,MAAA,QAEA,EAAA,SAAA,YACF,EAAA,CAAA,CAAA,EAEY,EAAL,SAAA,EAAA,OACL,GAAA,SAAA,YACA,EAAA,QAAA,WACA,EAAA,YAAA,eACA,EAAA,WAAA,eACF,EAAA,CAAA,CAAA"}

package/dist/esm/common/bodyEnd/bodyEnd.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use client";import{ThemeVariablesContext as e}from"../themeProvider/themeVariablesContext.mjs";import t from"../themeProvider/theme.module.mjs";import{PortalHostContext as n}from"./portalHostContext.mjs";import{useContext as r}from"react";import{jsx as i}from"react/jsx-runtime";import{createPortal as a}from"react-dom";function o({children:o=null}){let s=r(e),c=r(n),l=c===void 0?document.getElementById(`bodyEnd`):c;return l?a(s?i(`div`,{className:t.themeRoot,style:{display:`contents`,...s},children:o}):o,l):null}export{o as default};
+"use client";import{isDev as e}from"../utils/isDev.mjs";import{ThemeVariablesContext as t}from"../themeProvider/themeVariablesContext.mjs";import n from"../themeProvider/theme.module.mjs";import{PortalHostContext as r}from"./portalHostContext.mjs";import{useContext as i}from"react";import{jsx as a}from"react/jsx-runtime";import{createPortal as o}from"react-dom";function s({children:s=null}){let c=i(t),l=i(r),u=l===void 0?document.getElementById(`bodyEnd`):l;return u?o(c?a(`div`,{className:n.themeRoot,style:{display:`contents`,...c},children:s}):s,u):(l===void 0&&e()&&console.error(`[BodyEnd] Nowhere to render. Wrap your app in <AhroweProvider>, or add <div id="bodyEnd"></div>.`),null)}export{s as default};
 //# sourceMappingURL=bodyEnd.mjs.map

package/dist/esm/common/bodyEnd/bodyEnd.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"bodyEnd.mjs","names":[],"sources":["../../../../package/common/bodyEnd/bodyEnd.tsx"],"sourcesContent":["import { createPortal } from 'react-dom';\nimport { useContext, type CSSProperties, type ReactElement } from 'react';\n\nimport { ThemeVariablesContext } from '../themeProvider/themeVariablesContext';\nimport themeStyles from '../themeProvider/theme.module.pcss';\nimport { PortalHostContext } from './portalHostContext';\nimport type { BodyEndProps } from './bodyEnd.types';\~~n\n//~~ ~~Module-scoped~~ ~~ambient~~ ~~typing~~ ~~for~~ ~~the bundler-replaced NODE_ENV guard below.\n// Browsers don~~'~~t define `process`, so the value is read defensively at runtime;\n// bundlers (Vite~~/~~webpack) still statically replace the `process.env.NODE_ENV`\n// token. Declared at module scope (not globally), it isn~~'~~t emitted into the\n// .d.ts and can't clash with a consumer's @types/node.\ndeclare const process: { env: { NODE_ENV?: string } }~~;\n\nfunction BodyEnd({ children = null }: BodyEndProps): ReactElement \| null {\n const themeVariables = useContext(ThemeVariablesContext);\n const host = useContext(PortalHostContext);\n const target = host === undefined ? document.getElementById('bodyEnd') : host;\n if (!target) {\n if (host === undefined && ~~typeof process !== 'undefined' && process.env.NODE_ENV !== 'production'~~) {\n console.error('[BodyEnd] Nowhere to render. Wrap your app in <AhroweProvider>, or add <div id=\"bodyEnd\"></div>.');\n }\n return null;\n }\n /\n Carry the nearest theme through the portal. `display: contents` is what makes this safe:\n * the wrapper generates no box, so positioning, stacking and clipping are untouched —\n * escaping clipping ancestors is the whole point of this component — while custom\n * properties still inherit, because inheritance follows the element tree, not the box tree.\n \n Variables this theme leaves unset still fall through to whatever wraps the target, which\n * is the same cascade the children would have seen rendered in place. `themeRoot` sets the\n * base typography again, which the target would otherwise pass down from its own theme.\n */\n if (!themeVariables) return createPortal(children, target);\n return createPortal(\n <div className={themeStyles.themeRoot} style={{ display: 'contents', ...themeVariables } as CSSProperties}>\n {children}\n </div>,\n target,\n );\n}\n\nexport default BodyEnd;\n"],"mappings":"~~iUAeA~~,SAAS,EAAQ,CAAE,WAAW,MAA2C,CACvE,IAAM,EAAiB,EAAW,CAAqB,EACjD,EAAO,EAAW,CAAiB,EACnC,EAAS,IAAS,IAAA,GAAY,SAAS,eAAe,SAAS,EAAI,EAkBzE,OAjBK,EAiBE,EADF,EAEH,EAAC,MAAD,CAAK,UAAW,EAAY,UAAW,MAAO,CAAE,QAAS,WAAY,GAAG,CAAe,EACpF,UACE,CAAA,EAJkC,EAKvC,CALuD,~~EAZhD~~,~~IAmBX~~"}
1	+ {"version":3,"file":"bodyEnd.mjs","names":[],"sources":["../../../../package/common/bodyEnd/bodyEnd.tsx"],"sourcesContent":["import { createPortal } from 'react-dom';\nimport { useContext, type CSSProperties, type ReactElement } from 'react';\n\nimport { ThemeVariablesContext } from '../themeProvider/themeVariablesContext';\nimport themeStyles from '../themeProvider/theme.module.pcss';\nimport { PortalHostContext } from './portalHostContext';\nimport type { BodyEndProps } from './bodyEnd.types';\nimport { isDev } from '../utils/isDev';\n\nfunction BodyEnd({ children = null }: BodyEndProps): ReactElement \| null {\n const themeVariables = useContext(ThemeVariablesContext);\n const host = useContext(PortalHostContext);\n const target = host === undefined ? document.getElementById('bodyEnd') : host;\n if (!target) {\n if (host === undefined && isDev()) {\n console.error('[BodyEnd] Nowhere to render. Wrap your app in <AhroweProvider>, or add <div id=\"bodyEnd\"></div>.');\n }\n return null;\n }\n /\n Carry the nearest theme through the portal. `display: contents` is what makes this safe:\n * the wrapper generates no box, so positioning, stacking and clipping are untouched —\n * escaping clipping ancestors is the whole point of this component — while custom\n * properties still inherit, because inheritance follows the element tree, not the box tree.\n \n Variables this theme leaves unset still fall through to whatever wraps the target, which\n * is the same cascade the children would have seen rendered in place. `themeRoot` sets the\n * base typography again, which the target would otherwise pass down from its own theme.\n */\n if (!themeVariables) return createPortal(children, target);\n return createPortal(\n <div className={themeStyles.themeRoot} style={{ display: 'contents', ...themeVariables } as CSSProperties}>\n {children}\n </div>,\n target,\n );\n}\n\nexport default BodyEnd;\n"],"mappings":"4WASA,SAAS,EAAQ,CAAE,WAAW,MAA2C,CACvE,IAAM,EAAiB,EAAW,CAAqB,EACjD,EAAO,EAAW,CAAiB,EACnC,EAAS,IAAS,IAAA,GAAY,SAAS,eAAe,SAAS,EAAI,EAkBzE,OAjBK,EAiBE,EADF,EAEH,EAAC,MAAD,CAAK,UAAW,EAAY,UAAW,MAAO,CAAE,QAAS,WAAY,GAAG,CAAe,EACpF,UACE,CAAA,EAJkC,EAKvC,CALuD,GAfnD,IAAS,IAAA,IAAa,EAAM,GAC9B,QAAQ,MAAM,kGAAkG,EAE3G,KAmBX"}

package/dist/esm/common/breadcrumb/breadcrumb.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use client";import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import{useLabels as t}from"../configProvider/useLabels.mjs";import{renderIcon as n}from"../utils/renderIcon.mjs";import r from"../interactableDiv/index.mjs";import i from"../actionIcon/actionIcon.mjs";import{PopoverAlign as a,PopoverPlacement as o}from"../popover/popover.types.mjs";import s from"../popover/popover.mjs";import c from"./breadcrumb.module.mjs";import{useState as l}from"react";import u from"classnames";import{FontAwesomeIcon as d}from"@fortawesome/react-fontawesome";import{faChevronRight as f,faEllipsis as p}from"@fortawesome/free-solid-svg-icons";import{Fragment as m,jsx as h,jsxs as g}from"react/jsx-runtime";var _={showHidden:`Show hidden breadcrumbs`};function v(e,t){let n=e.map((e,t)=>({item:e,index:t}));if(!t||e.length<=t)return{leading:n,hidden:[],trailing:[]};let r=Math.max(1,t-2),i=e.length-1-r;return i<=0?{leading:n,hidden:[],trailing:[]}:{leading:n.slice(0,1),hidden:n.slice(1,1+i),trailing:n.slice(1+i)}}function y(n){let{items:r=[],separator:m,maxItems:y,"aria-label":x=`Breadcrumb`,className:S,style:C,classNames:w,styles:T,labels:E,...D}=e(`Breadcrumb`,n),O=t(`Breadcrumb`,E,_),[k,A]=l(!1),{leading:j,hidden:M,trailing:N}=v(r,y),P=r.length-1;function F(e){return e===P?null:h(`span`,{className:u(c.breadcrumbSeparator,w?.separator),style:T?.separator,children:m??h(d,{icon:f})})}function I({item:e,index:t}){return g(`li`,{className:u(c.breadcrumbItem,w?.item),style:T?.item,children:[b(e,t===P,c,w,T),F(t)]},e.id??t)}return h(`nav`,{...D,"aria-label":x,className:u(c.breadcrumb,w?.root,S),style:{...C,...T?.root},children:g(`ol`,{className:u(c.breadcrumbList,w?.list),style:T?.list,children:[j.map(I),M.length>0&&g(`li`,{className:u(c.breadcrumbItem,w?.item),style:T?.item,children:[h(s,{isOpen:k,onOpenChange:A,placement:o.Bottom,align:a.Start,constrainWidth:!1,classNames:{panel:c.breadcrumbHiddenPanel},content:h(`ul`,{className:u(c.breadcrumbHiddenList,w?.hiddenList),style:T?.hiddenList,children:M.map(({item:e,index:t})=>h(`li`,{className:u(c.breadcrumbHiddenItem,w?.hiddenItem),style:T?.hiddenItem,children:b({...e,onClick:t=>{e.onClick?.(t),A(!1)}},!1,c,w,T)},e.id??t))}),children:h(i,{icon:p,title:O.showHidden,"aria-label":O.showHidden,"aria-expanded":k,className:u(c.breadcrumbEllipsis,w?.ellipsis),style:T?.ellipsis})}),F(M[M.length-1].index)]}),N.map(I)]})})}function b(e,t,i,a,o){let s=g(m,{children:[e.icon?n(e.icon,{className:u(i.breadcrumbIcon,a?.icon),style:o?.icon}):null,e.label]});return t?h(`span`,{"aria-current":`page`,className:u(i.breadcrumbCurrent,a?.current),style:o?.current,children:s}):e.disabled?h(`span`,{className:u(i.breadcrumbLink,i.breadcrumbLinkDisabled,a?.link),style:o?.link,children:s}):e.href?h(`a`,{href:e.href,onClick:e.onClick,className:u(i.breadcrumbLink,a?.link),style:o?.link,children:s}):e.onClick?h(r,{onClick:e.onClick,className:u(i.breadcrumbLink,a?.link),style:o?.link,children:s}):h(`span`,{className:u(i.breadcrumbLink,i.breadcrumbLinkDisabled,a?.link),style:o?.link,children:s})}export{y as default};
+"use client";import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import{useLabels as t}from"../configProvider/useLabels.mjs";import{renderIcon as n}from"../utils/renderIcon.mjs";import r from"../actionIcon/actionIcon.mjs";import i from"../interactableDiv/index.mjs";import{PopoverAlign as a,PopoverPlacement as o}from"../popover/popover.types.mjs";import s from"../popover/popover.mjs";import c from"./breadcrumb.module.mjs";import{useState as l}from"react";import u from"classnames";import{FontAwesomeIcon as d}from"@fortawesome/react-fontawesome";import{faChevronRight as f,faEllipsis as p}from"@fortawesome/free-solid-svg-icons";import{Fragment as m,jsx as h,jsxs as g}from"react/jsx-runtime";var _={showHidden:`Show hidden breadcrumbs`};function v(e,t){let n=e.map((e,t)=>({item:e,index:t}));if(!t||e.length<=t)return{leading:n,hidden:[],trailing:[]};let r=Math.max(1,t-2),i=e.length-1-r;return i<=0?{leading:n,hidden:[],trailing:[]}:{leading:n.slice(0,1),hidden:n.slice(1,1+i),trailing:n.slice(1+i)}}function y(n){let{items:i=[],separator:m,maxItems:y,"aria-label":x=`Breadcrumb`,className:S,style:C,classNames:w,styles:T,labels:E,...D}=e(`Breadcrumb`,n),O=t(`Breadcrumb`,E,_),[k,A]=l(!1),{leading:j,hidden:M,trailing:N}=v(i,y),P=i.length-1;function F(e){return e===P?null:h(`span`,{className:u(c.breadcrumbSeparator,w?.separator),style:T?.separator,children:m??h(d,{icon:f})})}function I({item:e,index:t}){return g(`li`,{className:u(c.breadcrumbItem,w?.item),style:T?.item,children:[b(e,t===P,c,w,T),F(t)]},e.id??t)}return h(`nav`,{...D,"aria-label":x,className:u(c.breadcrumb,w?.root,S),style:{...C,...T?.root},children:g(`ol`,{className:u(c.breadcrumbList,w?.list),style:T?.list,children:[j.map(I),M.length>0&&g(`li`,{className:u(c.breadcrumbItem,w?.item),style:T?.item,children:[h(s,{isOpen:k,onOpenChange:A,placement:o.Bottom,align:a.Start,constrainWidth:!1,classNames:{panel:c.breadcrumbHiddenPanel},content:h(`ul`,{className:u(c.breadcrumbHiddenList,w?.hiddenList),style:T?.hiddenList,children:M.map(({item:e,index:t})=>h(`li`,{className:u(c.breadcrumbHiddenItem,w?.hiddenItem),style:T?.hiddenItem,children:b({...e,onClick:t=>{e.onClick?.(t),A(!1)}},!1,c,w,T)},e.id??t))}),children:h(r,{icon:p,color:`var(--text-dark)`,title:O.showHidden,"aria-label":O.showHidden,"aria-expanded":k,className:u(c.breadcrumbEllipsis,w?.ellipsis),style:T?.ellipsis})}),F(M[M.length-1].index)]}),N.map(I)]})})}function b(e,t,r,a,o){let s=g(m,{children:[e.icon?n(e.icon,{className:u(r.breadcrumbIcon,a?.icon),style:o?.icon}):null,e.label]});return t?h(`span`,{"aria-current":`page`,className:u(r.breadcrumbCurrent,a?.current),style:o?.current,children:s}):e.disabled?h(`span`,{className:u(r.breadcrumbLink,r.breadcrumbLinkDisabled,a?.link),style:o?.link,children:s}):e.href?h(`a`,{href:e.href,onClick:e.onClick,className:u(r.breadcrumbLink,a?.link),style:o?.link,children:s}):e.onClick?h(i,{onClick:e.onClick,className:u(r.breadcrumbLink,a?.link),style:o?.link,children:s}):h(`span`,{className:u(r.breadcrumbLink,r.breadcrumbLinkDisabled,a?.link),style:o?.link,children:s})}export{y as default};
 //# sourceMappingURL=breadcrumb.mjs.map

package/dist/esm/common/breadcrumb/breadcrumb.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"breadcrumb.mjs","names":[],"sources":["../../../../package/common/breadcrumb/breadcrumb.tsx"],"sourcesContent":["import { useState } from 'react';\nimport type { ReactElement } from 'react';\nimport cx from 'classnames';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faChevronRight, faEllipsis } from '@fortawesome/free-solid-svg-icons';\n\nimport InteractableDiv from '../interactableDiv';\nimport ActionIcon from '../actionIcon';\nimport Popover from '../popover';\nimport { PopoverAlign, PopoverPlacement } from '../popover/popover.types';\nimport { useComponentDefaults, useLabels } from '../configProvider';\nimport type { BreadcrumbItem, BreadcrumbLabels, BreadcrumbProps } from './breadcrumb.types';\n\nimport styles from './breadcrumb.module.pcss';\nimport { renderIcon } from '../utils/renderIcon';\n\ninterface IndexedItem {\n item: BreadcrumbItem;\n index: number;\n}\n\nconst DEFAULT_LABELS: Required<BreadcrumbLabels> = {\n showHidden: 'Show hidden breadcrumbs',\n};\n\nfunction getGroups(items: BreadcrumbItem[], maxItems?: number) {\n const indexed = items.map((item, index) => ({ item, index }));\n if (!maxItems \|\| items.length <= maxItems) {\n return { leading: indexed, hidden: [] as IndexedItem[], trailing: [] as IndexedItem[] };\n }\n\n const trailingCount = Math.max(1, maxItems - 2);\n const hiddenCount = items.length - 1 - trailingCount;\n if (hiddenCount <= 0) {\n return { leading: indexed, hidden: [] as IndexedItem[], trailing: [] as IndexedItem[] };\n }\n\n return {\n leading: indexed.slice(0, 1),\n hidden: indexed.slice(1, 1 + hiddenCount),\n trailing: indexed.slice(1 + hiddenCount),\n };\n}\n\nfunction Breadcrumb(props: BreadcrumbProps): ReactElement {\n const {\n items = [],\n separator,\n maxItems,\n 'aria-label': ariaLabel = 'Breadcrumb',\n className,\n style,\n classNames,\n styles: slotStyles,\n labels,\n ...rest\n } = useComponentDefaults('Breadcrumb', props);\n const text = useLabels('Breadcrumb', labels, DEFAULT_LABELS);\n\n const [isHiddenMenuOpen, setIsHiddenMenuOpen] = useState(false);\n const { leading, hidden, trailing } = getGroups(items, maxItems);\n const lastIndex = items.length - 1;\n\n function renderSeparatorAfter(index: number) {\n if (index === lastIndex) return null;\n return (\n <span className={cx(styles.breadcrumbSeparator, classNames?.separator)} style={slotStyles?.separator}>\n {separator ?? <FontAwesomeIcon icon={faChevronRight} />}\n </span>\n );\n }\n\n function renderItem({ item, index }: IndexedItem) {\n return (\n <li key={item.id ?? index} className={cx(styles.breadcrumbItem, classNames?.item)} style={slotStyles?.item}>\n {renderCrumb(item, index === lastIndex, styles, classNames, slotStyles)}\n {renderSeparatorAfter(index)}\n </li>\n );\n }\n\n return (\n <nav\n {...rest}\n aria-label={ariaLabel}\n className={cx(styles.breadcrumb, classNames?.root, className)}\n style={{ ...style, ...slotStyles?.root }}\n >\n <ol className={cx(styles.breadcrumbList, classNames?.list)} style={slotStyles?.list}>\n {leading.map(renderItem)}\n\n {hidden.length > 0 && (\n <li className={cx(styles.breadcrumbItem, classNames?.item)} style={slotStyles?.item}>\n <Popover\n isOpen={isHiddenMenuOpen}\n onOpenChange={setIsHiddenMenuOpen}\n placement={PopoverPlacement.Bottom}\n align={PopoverAlign.Start}\n // The list brings its own padding and width.\n constrainWidth={false}\n classNames={{ panel: styles.breadcrumbHiddenPanel }}\n content={\n <ul className={cx(styles.breadcrumbHiddenList, classNames?.hiddenList)} style={slotStyles?.hiddenList}>\n {hidden.map(({ item, index }) => (\n <li\n key={item.id ?? index}\n className={cx(styles.breadcrumbHiddenItem, classNames?.hiddenItem)}\n style={slotStyles?.hiddenItem}\n >\n {renderCrumb(\n {\n ...item,\n onClick: (event) => {\n item.onClick?.(event);\n setIsHiddenMenuOpen(false);\n },\n },\n false,\n styles,\n classNames,\n slotStyles,\n )}\n </li>\n ))}\n </ul>\n }\n >\n <ActionIcon\n icon={faEllipsis}\n title={text.showHidden}\n aria-label={text.showHidden}\n aria-expanded={isHiddenMenuOpen}\n className={cx(styles.breadcrumbEllipsis, classNames?.ellipsis)}\n style={slotStyles?.ellipsis}\n />\n </Popover>\n {renderSeparatorAfter(hidden[hidden.length - 1].index)}\n </li>\n )}\n\n {trailing.map(renderItem)}\n </ol>\n </nav>\n );\n}\n\nfunction renderCrumb(\n item: BreadcrumbItem,\n isCurrent: boolean,\n styles: Record<string, string>,\n classNames: BreadcrumbProps['classNames'],\n slotStyles: BreadcrumbProps['styles'],\n) {\n const content = (\n <>\n {item.icon\n ? renderIcon(item.icon, {\n className: cx(styles.breadcrumbIcon, classNames?.icon),\n style: slotStyles?.icon,\n })\n : null}\n {item.label}\n </>\n );\n\n if (isCurrent) {\n return (\n <span\n aria-current='page'\n className={cx(styles.breadcrumbCurrent, classNames?.current)}\n style={slotStyles?.current}\n >\n {content}\n </span>\n );\n }\n\n if (item.disabled) {\n return (\n <span\n className={cx(styles.breadcrumbLink, styles.breadcrumbLinkDisabled, classNames?.link)}\n style={slotStyles?.link}\n >\n {content}\n </span>\n );\n }\n\n if (item.href) {\n return (\n <a\n href={item.href}\n onClick={item.onClick}\n className={cx(styles.breadcrumbLink, classNames?.link)}\n style={slotStyles?.link}\n >\n {content}\n </a>\n );\n }\n\n if (item.onClick) {\n return (\n <InteractableDiv\n onClick={item.onClick}\n className={cx(styles.breadcrumbLink, classNames?.link)}\n style={slotStyles?.link}\n >\n {content}\n </InteractableDiv>\n );\n }\n\n return (\n <span\n className={cx(styles.breadcrumbLink, styles.breadcrumbLinkDisabled, classNames?.link)}\n style={slotStyles?.link}\n >\n {content}\n </span>\n );\n}\n\nexport default Breadcrumb;\n"],"mappings":"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"}
1	+ {"version":3,"file":"breadcrumb.mjs","names":[],"sources":["../../../../package/common/breadcrumb/breadcrumb.tsx"],"sourcesContent":["import { useState } from 'react';\nimport type { ReactElement } from 'react';\nimport cx from 'classnames';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faChevronRight, faEllipsis } from '@fortawesome/free-solid-svg-icons';\n\nimport InteractableDiv from '../interactableDiv';\nimport ActionIcon from '../actionIcon';\nimport Popover from '../popover';\nimport { PopoverAlign, PopoverPlacement } from '../popover/popover.types';\nimport { useComponentDefaults, useLabels } from '../configProvider';\nimport type { BreadcrumbItem, BreadcrumbLabels, BreadcrumbProps } from './breadcrumb.types';\n\nimport styles from './breadcrumb.module.pcss';\nimport { renderIcon } from '../utils/renderIcon';\n\ninterface IndexedItem {\n item: BreadcrumbItem;\n index: number;\n}\n\nconst DEFAULT_LABELS: Required<BreadcrumbLabels> = {\n showHidden: 'Show hidden breadcrumbs',\n};\n\nfunction getGroups(items: BreadcrumbItem[], maxItems?: number) {\n const indexed = items.map((item, index) => ({ item, index }));\n if (!maxItems \|\| items.length <= maxItems) {\n return { leading: indexed, hidden: [] as IndexedItem[], trailing: [] as IndexedItem[] };\n }\n\n const trailingCount = Math.max(1, maxItems - 2);\n const hiddenCount = items.length - 1 - trailingCount;\n if (hiddenCount <= 0) {\n return { leading: indexed, hidden: [] as IndexedItem[], trailing: [] as IndexedItem[] };\n }\n\n return {\n leading: indexed.slice(0, 1),\n hidden: indexed.slice(1, 1 + hiddenCount),\n trailing: indexed.slice(1 + hiddenCount),\n };\n}\n\nfunction Breadcrumb(props: BreadcrumbProps): ReactElement {\n const {\n items = [],\n separator,\n maxItems,\n 'aria-label': ariaLabel = 'Breadcrumb',\n className,\n style,\n classNames,\n styles: slotStyles,\n labels,\n ...rest\n } = useComponentDefaults('Breadcrumb', props);\n const text = useLabels('Breadcrumb', labels, DEFAULT_LABELS);\n\n const [isHiddenMenuOpen, setIsHiddenMenuOpen] = useState(false);\n const { leading, hidden, trailing } = getGroups(items, maxItems);\n const lastIndex = items.length - 1;\n\n function renderSeparatorAfter(index: number) {\n if (index === lastIndex) return null;\n return (\n <span className={cx(styles.breadcrumbSeparator, classNames?.separator)} style={slotStyles?.separator}>\n {separator ?? <FontAwesomeIcon icon={faChevronRight} />}\n </span>\n );\n }\n\n function renderItem({ item, index }: IndexedItem) {\n return (\n <li key={item.id ?? index} className={cx(styles.breadcrumbItem, classNames?.item)} style={slotStyles?.item}>\n {renderCrumb(item, index === lastIndex, styles, classNames, slotStyles)}\n {renderSeparatorAfter(index)}\n </li>\n );\n }\n\n return (\n <nav\n {...rest}\n aria-label={ariaLabel}\n className={cx(styles.breadcrumb, classNames?.root, className)}\n style={{ ...style, ...slotStyles?.root }}\n >\n <ol className={cx(styles.breadcrumbList, classNames?.list)} style={slotStyles?.list}>\n {leading.map(renderItem)}\n\n {hidden.length > 0 && (\n <li className={cx(styles.breadcrumbItem, classNames?.item)} style={slotStyles?.item}>\n <Popover\n isOpen={isHiddenMenuOpen}\n onOpenChange={setIsHiddenMenuOpen}\n placement={PopoverPlacement.Bottom}\n align={PopoverAlign.Start}\n // The list brings its own padding and width.\n constrainWidth={false}\n classNames={{ panel: styles.breadcrumbHiddenPanel }}\n content={\n <ul className={cx(styles.breadcrumbHiddenList, classNames?.hiddenList)} style={slotStyles?.hiddenList}>\n {hidden.map(({ item, index }) => (\n <li\n key={item.id ?? index}\n className={cx(styles.breadcrumbHiddenItem, classNames?.hiddenItem)}\n style={slotStyles?.hiddenItem}\n >\n {renderCrumb(\n {\n ...item,\n onClick: (event) => {\n item.onClick?.(event);\n setIsHiddenMenuOpen(false);\n },\n },\n false,\n styles,\n classNames,\n slotStyles,\n )}\n </li>\n ))}\n </ul>\n }\n >\n <ActionIcon\n icon={faEllipsis}\n color='var(--text-dark)'\n title={text.showHidden}\n aria-label={text.showHidden}\n aria-expanded={isHiddenMenuOpen}\n className={cx(styles.breadcrumbEllipsis, classNames?.ellipsis)}\n style={slotStyles?.ellipsis}\n />\n </Popover>\n {renderSeparatorAfter(hidden[hidden.length - 1].index)}\n </li>\n )}\n\n {trailing.map(renderItem)}\n </ol>\n </nav>\n );\n}\n\nfunction renderCrumb(\n item: BreadcrumbItem,\n isCurrent: boolean,\n styles: Record<string, string>,\n classNames: BreadcrumbProps['classNames'],\n slotStyles: BreadcrumbProps['styles'],\n) {\n const content = (\n <>\n {item.icon\n ? renderIcon(item.icon, {\n className: cx(styles.breadcrumbIcon, classNames?.icon),\n style: slotStyles?.icon,\n })\n : null}\n {item.label}\n </>\n );\n\n if (isCurrent) {\n return (\n <span\n aria-current='page'\n className={cx(styles.breadcrumbCurrent, classNames?.current)}\n style={slotStyles?.current}\n >\n {content}\n </span>\n );\n }\n\n if (item.disabled) {\n return (\n <span\n className={cx(styles.breadcrumbLink, styles.breadcrumbLinkDisabled, classNames?.link)}\n style={slotStyles?.link}\n >\n {content}\n </span>\n );\n }\n\n if (item.href) {\n return (\n <a\n href={item.href}\n onClick={item.onClick}\n className={cx(styles.breadcrumbLink, classNames?.link)}\n style={slotStyles?.link}\n >\n {content}\n </a>\n );\n }\n\n if (item.onClick) {\n return (\n <InteractableDiv\n onClick={item.onClick}\n className={cx(styles.breadcrumbLink, classNames?.link)}\n style={slotStyles?.link}\n >\n {content}\n </InteractableDiv>\n );\n }\n\n return (\n <span\n className={cx(styles.breadcrumbLink, styles.breadcrumbLinkDisabled, classNames?.link)}\n style={slotStyles?.link}\n >\n {content}\n </span>\n );\n}\n\nexport default Breadcrumb;\n"],"mappings":"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"}

package/dist/esm/common/breadcrumb/breadcrumb.module.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"breadcrumb.module.mjs","names":[],"sources":["../../../../package/common/breadcrumb/breadcrumb.module.pcss"],"sourcesContent":[".breadcrumb {\n font-family: var(--default-font);\n font-size: var(--default-font-size);\n\n &-list {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: 6px;\n margin: 0;\n padding: 0;\n list-style: none;\n }\n\n &-item {\n display: flex;\n align-items: center;\n gap: 6px;\n }\n\n &-icon {\n margin-right: 6px;\n font-size: 0.9em;\n }\n\n &-link {\n display: flex;\n align-items: center;\n text-decoration: none;\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n transition: color 0.15s;\n\n /* Explicit :link/:visited beats the browser default a:visited { color: purple } on\n specificity, otherwise every crumb using the same href (e.g. \"#\") turns purple as\n soon as any one of them is clicked. /\n &:link,\n &:visited {\n color: var(--text-dark);\n }\n\n &:hover {\n color: var(--primary-color);\n }\n\n &-disabled {\n color: var(--text-dark);\n opacity: 0.5;\n cursor: default;\n pointer-events: none;\n }\n }\n\n &-current {\n display: flex;\n align-items: center;\n color: var(--text-color);\n font-weight: var(--header-font-weight, 600);\n }\n\n &-separator {\n display: flex;\n align-items: center;\n color: var(--text-dark);\n font-size: 0.75em;\n opacity: 0.7;\n }\n\n &-ellipsis {\n width: 1.8em;\n height: 1.8em;\n font-size: 1em;\n ~~color: var(--text-dark);\n~~\n &:hover {\n color: var(--primary-color);\n }\n }\n\n / The popover panel pads free content; this list pads its own rows instead, so\n that a row's hover highlight reaches the panel edge. /\n &-hiddenPanel {\n padding: 0;\n }\n\n &-hiddenList {\n display: flex;\n flex-direction: column;\n gap: 2px;\n margin: 0;\n padding: 6px;\n list-style: none;\n min-width: 160px;\n }\n\n &-hiddenItem {\n display: flex;\n\n .breadcrumb-link {\n width: 100%;\n padding: 6px 8px;\n border-radius: var(--default-border-radius);\n\n / `:focus` as well, because the panel takes the focus when the keyboard\n opens it. Not `--background-accent-light`: it is the same colour as that\n panel in the default theme. */\n &:hover,\n &:focus {\n background: var(--background-accent);\n }\n }\n }\n}\n"],"mappings":""}
1	+ {"version":3,"file":"breadcrumb.module.mjs","names":[],"sources":["../../../../package/common/breadcrumb/breadcrumb.module.pcss"],"sourcesContent":[".breadcrumb {\n font-family: var(--default-font);\n font-size: var(--default-font-size);\n\n &-list {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: 6px;\n margin: 0;\n padding: 0;\n list-style: none;\n }\n\n &-item {\n display: flex;\n align-items: center;\n gap: 6px;\n }\n\n &-icon {\n margin-right: 6px;\n font-size: 0.9em;\n }\n\n &-link {\n display: flex;\n align-items: center;\n text-decoration: none;\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n transition: color 0.15s;\n\n /* Explicit :link/:visited beats the browser default a:visited { color: purple } on\n specificity, otherwise every crumb using the same href (e.g. \"#\") turns purple as\n soon as any one of them is clicked. /\n &:link,\n &:visited {\n color: var(--text-dark);\n }\n\n &:hover {\n color: var(--primary-color);\n }\n\n &-disabled {\n color: var(--text-dark);\n opacity: 0.5;\n cursor: default;\n pointer-events: none;\n }\n }\n\n &-current {\n display: flex;\n align-items: center;\n color: var(--text-color);\n font-weight: var(--header-font-weight, 600);\n }\n\n &-separator {\n display: flex;\n align-items: center;\n color: var(--text-dark);\n font-size: 0.75em;\n opacity: 0.7;\n }\n\n / Two classes, to outrank Button's font-size and ActionIcon's box whichever stylesheet loads\n first. /\n & &-ellipsis {\n width: 1.8em;\n height: 1.8em;\n font-size: 1em;\n\n &:hover {\n color: var(--primary-color);\n }\n }\n\n / The popover panel pads free content; this list pads its own rows instead, so\n that a row's hover highlight reaches the panel edge. /\n &-hiddenPanel {\n padding: 0;\n }\n\n &-hiddenList {\n display: flex;\n flex-direction: column;\n gap: 2px;\n margin: 0;\n padding: 6px;\n list-style: none;\n min-width: 160px;\n }\n\n &-hiddenItem {\n display: flex;\n\n .breadcrumb-link {\n width: 100%;\n padding: 6px 8px;\n border-radius: var(--default-border-radius);\n\n / `:focus` as well, because the panel takes the focus when the keyboard\n opens it. Not `--background-accent-light`: it is the same colour as that\n panel in the default theme. */\n &:hover,\n &:focus {\n background: var(--background-accent);\n }\n }\n }\n}\n"],"mappings":""}

package/dist/esm/common/button/button.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use client";import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import t from"./button.module.mjs";import n from"../loading/spinnerLoading/index.mjs";import{ButtonSize as r,ButtonStyleType as i,ButtonType as a}from"./button.types.mjs";import o from"../ripple/ripple.mjs";import{renderIcon as s}from"../utils/renderIcon.mjs";import{useRef as c}from"react";import l from"classnames";import{jsx as u,jsxs as d}from"react/jsx-runtime";var f={default:t.buttonStyleDefault,primary:t.buttonStylePrimary,delete:t.buttonStyleDelete},p={default:t.buttonSizeDefault,small:t.buttonSizeSmall,medium:t.buttonSizeMedium,large:t.buttonSizeLarge,icon:t.buttonSizeIcon};function m(m){let{className:h,style:g,type:_=a.Button,styleType:v=i.Default,size:y=r.Default,onClick:b=()=>{},children:x,icon:S,isLoading:C=!1,disabled:w=!1,title:T=void 0,ref:E,classNames:D,styles:O,...k}=e(`Button`,m),A=c(null);function j(e){return e.detail===0&&A.current?.addRipple(),b(e)}return u(`button`,{...k,className:l(t.button,f[v],p[y],{[t.buttonNotAllowed]:C||w},h),style:g,type:_,onClick:j,disabled:w||C,title:T,ref:E,children:u(o,{ref:A,className:t.buttonRipple,disabled:C||w,children:u(`div`,{className:l(t.buttonBackground,D?.background),style:O?.background,children:d(`div`,{className:l(t.buttonContent,D?.content),style:O?.content,children:[C?u(`div`,{className:l(t.buttonLoadingContainer,D?.loadingContainer),style:O?.loadingContainer,children:u(n,{className:t.buttonLoadingIcon})}):null,d(`div`,{className:l(D?.label,{[t.buttonLoading]:C,[t.buttonWithIcon]:!!S}),style:O?.label,children:[S?s(S):null,x]})]})})})})}m.StyleType=i,m.Size=r,m.Type=a;export{m as default};
+"use client";import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import{ThemeColor as t}from"../themeProvider/color.types.mjs";import{toneProps as n,useToneCheck as r}from"../styles/tone.mjs";import i from"./button.module.mjs";import a from"../loading/spinnerLoading/index.mjs";import{ButtonSize as o,ButtonStyleType as s,ButtonType as c}from"./button.types.mjs";import l from"../ripple/ripple.mjs";import{renderIcon as u}from"../utils/renderIcon.mjs";import{useRef as d}from"react";import f from"classnames";import{jsx as p,jsxs as m}from"react/jsx-runtime";var h={filled:i.buttonStyleFilled,light:i.buttonStyleLight,outlined:i.buttonStyleOutlined,plain:i.buttonStylePlain},g={default:i.buttonSizeDefault,small:i.buttonSizeSmall,medium:i.buttonSizeMedium,large:i.buttonSizeLarge,icon:i.buttonSizeIcon},_=`color-mix(in srgb, currentcolor 20%, transparent)`;function v(v){let{className:y,style:b,type:x=c.Button,styleType:S=s.Outlined,color:C=t.Primary,size:w=o.Default,onClick:T=()=>{},children:E,icon:D,isLoading:O=!1,disabled:k=!1,title:A=void 0,ref:j,classNames:M,styles:N,...P}=e(`Button`,v),F=d(null),I=n(C);r(`Button`,[C]);function L(e){return e.detail===0&&F.current?.addRipple(),T(e)}return p(`button`,{...P,className:f(i.button,h[S],I.className,g[w],{[i.buttonNotAllowed]:O||k,[i.buttonDisabled]:k},y),style:{...I.style,...b},type:x,onClick:L,disabled:k||O,title:A,ref:j,children:p(l,{ref:F,className:i.buttonRipple,disabled:O||k,rippleBackground:_,children:p(`div`,{className:f(i.buttonBackground,M?.background),style:N?.background,children:m(`div`,{className:f(i.buttonContent,M?.content),style:N?.content,children:[O?p(`div`,{className:f(i.buttonLoadingContainer,M?.loadingContainer),style:N?.loadingContainer,children:p(a,{className:i.buttonLoadingIcon})}):null,m(`div`,{className:f(M?.label,{[i.buttonLoading]:O,[i.buttonWithIcon]:!!D}),style:N?.label,children:[D?u(D):null,E]})]})})})})}v.StyleType=s,v.Size=o,v.Type=c;export{v as default};
 //# sourceMappingURL=button.mjs.map

package/dist/esm/common/button/button.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"button.mjs","names":[],"sources":["../../../../package/common/button/button.tsx"],"sourcesContent":["import cx from 'classnames';\nimport { useRef, type ReactElement } from 'react';\n\nimport styles from './button.module.pcss';\nimport SpinnerLoading from 'components/common/loading/spinnerLoading';\nimport { ButtonStyleType, ButtonSize, ButtonType } from './button.types';\nimport type { ButtonProps } from './button.types';\nimport Ripple from '../ripple';\nimport type { RippleHandle } from '../ripple';\nimport { useComponentDefaults } from '../configProvider';\nimport { renderIcon } from '../utils/renderIcon';\n\nconst CLASS_BY_STYLE: Record<ButtonStyleType, string> = {\n ~~default~~: styles.~~buttonStyleDefault~~,\n ~~primary~~: styles.~~buttonStylePrimary~~,\n ~~delete~~: styles.~~buttonStyleDelete~~,\n};\n\nconst CLASS_BY_SIZE: Record<ButtonSize, string> = {\n default: styles.buttonSizeDefault,\n small: styles.buttonSizeSmall,\n medium: styles.buttonSizeMedium,\n large: styles.buttonSizeLarge,\n icon: styles.buttonSizeIcon,\n};\n\nfunction Button(props: ButtonProps): ReactElement {\n const {\n className,\n style,\n type = ButtonType.Button,\n styleType = ButtonStyleType.~~Default~~,\n size = ButtonSize.Default,\n onClick = (): void => {},\n children,\n icon,\n isLoading = false,\n disabled = false,\n title = undefined,\n ref,\n classNames,\n styles: slotStyles,\n ...rest\n } = useComponentDefaults('Button', props);\n\n const rippleRef = useRef<RippleHandle>(null);\n\n function handleClick(event: React.MouseEvent<HTMLButtonElement>) {\n if (event.detail === 0) rippleRef.current?.addRipple();\n return onClick(event);\n }\n\n return (\n <button\n {...rest}\n className={cx(\n styles.button,\n CLASS_BY_STYLE[styleType],\n CLASS_BY_SIZE[size],\n {\n [styles.buttonNotAllowed]: isLoading \|\| disabled,\n },\n className,\n )}\n style={style}\n type={type}\n onClick={handleClick}\n disabled={disabled \|\| isLoading}\n title={title}\n ref={ref}\n >\n <Ripple ref={rippleRef} className={styles.buttonRipple} disabled={isLoading \|\| disabled}>\n <div className={cx(styles.buttonBackground, classNames?.background)} style={slotStyles?.background}>\n <div className={cx(styles.buttonContent, classNames?.content)} style={slotStyles?.content}>\n {isLoading ? (\n <div\n className={cx(styles.buttonLoadingContainer, classNames?.loadingContainer)}\n style={slotStyles?.loadingContainer}\n >\n <SpinnerLoading className={styles.buttonLoadingIcon} />\n </div>\n ) : null}\n <div\n className={cx(classNames?.label, {\n [styles.buttonLoading]: isLoading,\n [styles.buttonWithIcon]: !!icon,\n })}\n style={slotStyles?.label}\n >\n {icon ? renderIcon(icon) : null}\n {children}\n </div>\n </div>\n </div>\n </Ripple>\n </button>\n );\n}\n\nButton.StyleType = ButtonStyleType;\nButton.Size = ButtonSize;\nButton.Type = ButtonType;\n\nexport default Button;\n"],"mappings":"~~8cAYA~~,IAAM,EAAkD,CACtD,~~QAAS~~,EAAO,~~mBAChB~~,~~QAAS~~,EAAO,~~mBAChB~~,~~OAAQ~~,EAAO,~~iBACjB~~,EAEM,EAA4C,CAChD,QAAS,EAAO,kBAChB,MAAO,EAAO,gBACd,OAAQ,EAAO,iBACf,MAAO,EAAO,gBACd,KAAM,EAAO,cACf,~~EAEA~~,SAAS,EAAO,EAAkC,CAChD,GAAM,CACJ,YACA,QACA,OAAO,EAAW,OAClB,YAAY,EAAgB,~~QAC5B~~,OAAO,EAAW,QAClB,cAAsB,CAAC,EACvB,WACA,OACA,YAAY,GACZ,WAAW,GACX,QAAQ,IAAA,GACR,MACA,aACA,OAAQ,EACR,GAAG,GACD,EAAqB,SAAU,CAAK,EAElC,EAAY,EAAqB,IAAI,~~EAE3C~~,SAAS,EAAY,EAA4C,CAE/D,OADI,EAAM,SAAW,GAAG,EAAU,SAAS,UAAU,EAC9C,EAAQ,CAAK,CACtB,CAEA,OACE,EAAC,SAAD,CACE,GAAI,EACJ,UAAW,EACT,EAAO,OACP,EAAe,GACf,EAAc,GACd,EACG,EAAO,kBAAmB,GAAa,~~CAC1C~~,EACA,CACF,~~EACO~~,~~QACD~~,OACN,QAAS,EACT,SAAU,GAAY,EACf,QACF,MAEL,SAAA,EAAC,EAAD,~~CAAQ~~,IAAK,~~EAAW~~,UAAW,EAAO,~~aAAc~~,SAAU,GAAa,~~EAC7E~~,SAAA,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,iBAAkB,GAAY,UAAU,EAAG,MAAO,GAAY,WACtF,SAAA,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,cAAe,GAAY,OAAO,EAAG,MAAO,GAAY,QAAlF,SAAA,CACG,EACC,EAAC,MAAD,CACE,UAAW,EAAG,EAAO,uBAAwB,GAAY,gBAAgB,EACzE,MAAO,GAAY,iBAEnB,SAAA,EAAC,EAAD,CAAgB,UAAW,EAAO,iBAAoB,CAAA,CACnD,CAAA,EACH,KACJ,EAAC,MAAD,CACE,UAAW,EAAG,GAAY,MAAO,EAC9B,EAAO,eAAgB,GACvB,EAAO,gBAAiB,CAAC,CAAC,CAC7B,CAAC,EACD,MAAO,GAAY,MALrB,SAAA,CAOG,EAAO,EAAW,CAAI,EAAI,KAC1B,CACE,CACF,CAAA,CAAA,GACF,CAAA,CACC,CAAA,CACF,CAAA,CAEZ,CAEA,EAAO,UAAY,EACnB,EAAO,KAAO,EACd,EAAO,KAAO"}
1	+ {"version":3,"file":"button.mjs","names":[],"sources":["../../../../package/common/button/button.tsx"],"sourcesContent":["import cx from 'classnames';\nimport { useRef, type ReactElement } from 'react';\n\nimport styles from './button.module.pcss';\nimport SpinnerLoading from 'components/common/loading/spinnerLoading';\nimport { ButtonStyleType, ButtonSize, ButtonType } from './button.types';\nimport { ThemeColor } from '../themeProvider/color.types';\nimport type { ButtonProps } from './button.types';\nimport Ripple from '../ripple';\nimport type { RippleHandle } from '../ripple';\nimport { useComponentDefaults } from '../configProvider';\nimport { renderIcon } from '../utils/renderIcon';\nimport { toneProps, useToneCheck } from '../styles/tone';\n\nconst CLASS_BY_STYLE: Record<ButtonStyleType, string> = {\n filled: styles.buttonStyleFilled,\n light: styles.buttonStyleLight,\n outlined: styles.buttonStyleOutlined,\n plain: styles.buttonStylePlain,\n};\n\nconst CLASS_BY_SIZE: Record<ButtonSize, string> = {\n default: styles.buttonSizeDefault,\n small: styles.buttonSizeSmall,\n medium: styles.buttonSizeMedium,\n large: styles.buttonSizeLarge,\n icon: styles.buttonSizeIcon,\n};\n\n// Ripple's own default is white, which vanishes on a transparent button over a light page.\nconst RIPPLE_BACKGROUND = 'color-mix(in srgb, currentcolor 20%, transparent)';\n\nfunction Button(props: ButtonProps): ReactElement {\n const {\n className,\n style,\n type = ButtonType.Button,\n styleType = ButtonStyleType.Outlined,\n color = ThemeColor.Primary,\n size = ButtonSize.Default,\n onClick = (): void => {},\n children,\n icon,\n isLoading = false,\n disabled = false,\n title = undefined,\n ref,\n classNames,\n styles: slotStyles,\n ...rest\n } = useComponentDefaults('Button', props);\n\n const rippleRef = useRef<RippleHandle>(null);\n const tone = toneProps(color);\n useToneCheck('Button', [color]);\n\n function handleClick(event: React.MouseEvent<HTMLButtonElement>) {\n if (event.detail === 0) rippleRef.current?.addRipple();\n return onClick(event);\n }\n\n return (\n <button\n {...rest}\n className={cx(\n styles.button,\n CLASS_BY_STYLE[styleType],\n tone.className,\n CLASS_BY_SIZE[size],\n {\n [styles.buttonNotAllowed]: isLoading \|\| disabled,\n [styles.buttonDisabled]: disabled,\n },\n className,\n )}\n style={{ ...tone.style, ...style }}\n type={type}\n onClick={handleClick}\n disabled={disabled \|\| isLoading}\n title={title}\n ref={ref}\n >\n <Ripple\n ref={rippleRef}\n className={styles.buttonRipple}\n disabled={isLoading \|\| disabled}\n rippleBackground={RIPPLE_BACKGROUND}\n >\n <div className={cx(styles.buttonBackground, classNames?.background)} style={slotStyles?.background}>\n <div className={cx(styles.buttonContent, classNames?.content)} style={slotStyles?.content}>\n {isLoading ? (\n <div\n className={cx(styles.buttonLoadingContainer, classNames?.loadingContainer)}\n style={slotStyles?.loadingContainer}\n >\n <SpinnerLoading className={styles.buttonLoadingIcon} />\n </div>\n ) : null}\n <div\n className={cx(classNames?.label, {\n [styles.buttonLoading]: isLoading,\n [styles.buttonWithIcon]: !!icon,\n })}\n style={slotStyles?.label}\n >\n {icon ? renderIcon(icon) : null}\n {children}\n </div>\n </div>\n </div>\n </Ripple>\n </button>\n );\n}\n\nButton.StyleType = ButtonStyleType;\nButton.Size = ButtonSize;\nButton.Type = ButtonType;\n\nexport default Button;\n"],"mappings":"6kBAcA,IAAM,EAAkD,CACtD,OAAQ,EAAO,kBACf,MAAO,EAAO,iBACd,SAAU,EAAO,oBACjB,MAAO,EAAO,gBAChB,EAEM,EAA4C,CAChD,QAAS,EAAO,kBAChB,MAAO,EAAO,gBACd,OAAQ,EAAO,iBACf,MAAO,EAAO,gBACd,KAAM,EAAO,cACf,EAGM,EAAoB,oDAE1B,SAAS,EAAO,EAAkC,CAChD,GAAM,CACJ,YACA,QACA,OAAO,EAAW,OAClB,YAAY,EAAgB,SAC5B,QAAQ,EAAW,QACnB,OAAO,EAAW,QAClB,cAAsB,CAAC,EACvB,WACA,OACA,YAAY,GACZ,WAAW,GACX,QAAQ,IAAA,GACR,MACA,aACA,OAAQ,EACR,GAAG,GACD,EAAqB,SAAU,CAAK,EAElC,EAAY,EAAqB,IAAI,EACrC,EAAO,EAAU,CAAK,EAC5B,EAAa,SAAU,CAAC,CAAK,CAAC,EAE9B,SAAS,EAAY,EAA4C,CAE/D,OADI,EAAM,SAAW,GAAG,EAAU,SAAS,UAAU,EAC9C,EAAQ,CAAK,CACtB,CAEA,OACE,EAAC,SAAD,CACE,GAAI,EACJ,UAAW,EACT,EAAO,OACP,EAAe,GACf,EAAK,UACL,EAAc,GACd,EACG,EAAO,kBAAmB,GAAa,GACvC,EAAO,gBAAiB,CAC3B,EACA,CACF,EACA,MAAO,CAAE,GAAG,EAAK,MAAO,GAAG,CAAM,EAC3B,OACN,QAAS,EACT,SAAU,GAAY,EACf,QACF,MAEL,SAAA,EAAC,EAAD,CACE,IAAK,EACL,UAAW,EAAO,aAClB,SAAU,GAAa,EACvB,iBAAkB,EAElB,SAAA,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,iBAAkB,GAAY,UAAU,EAAG,MAAO,GAAY,WACtF,SAAA,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,cAAe,GAAY,OAAO,EAAG,MAAO,GAAY,QAAlF,SAAA,CACG,EACC,EAAC,MAAD,CACE,UAAW,EAAG,EAAO,uBAAwB,GAAY,gBAAgB,EACzE,MAAO,GAAY,iBAEnB,SAAA,EAAC,EAAD,CAAgB,UAAW,EAAO,iBAAoB,CAAA,CACnD,CAAA,EACH,KACJ,EAAC,MAAD,CACE,UAAW,EAAG,GAAY,MAAO,EAC9B,EAAO,eAAgB,GACvB,EAAO,gBAAiB,CAAC,CAAC,CAC7B,CAAC,EACD,MAAO,GAAY,MALrB,SAAA,CAOG,EAAO,EAAW,CAAI,EAAI,KAC1B,CACE,CACF,CAAA,CAAA,GACF,CAAA,CACC,CAAA,CACF,CAAA,CAEZ,CAEA,EAAO,UAAY,EACnB,EAAO,KAAO,EACd,EAAO,KAAO"}

package/dist/esm/common/button/button.module.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use client";var e=`button_wYLPJ`,t=`button-notAllowed_xGT-E`,n=`button-loading-icon_1pTTz`,r=`button-content_Q-0-4`,i=`button-loading_TY6y7`,a=`button-loading-container_pMSta`,o=`button-withIcon_IXEKA`,s=`button-style-default_JmAqD`,c=`button-style-primary_Ra5i-`,l=`button-style-delete_jpTCf`,u=`button-background_9Vfo5`,d=`button-size-default_N4HG9`,f=`button-size-small_mn6jE`,p=`button-size-medium_gNVDM`,m=`button-size-large_xSIcS`,h=`button-size-icon_pkqwl`,g=`button-ripple_UGtt8`,_={button:e,"button-notAllowed":`button-notAllowed_xGT-E`,buttonNotAllowed:t,"button-loading-icon":`button-loading-icon_1pTTz`,buttonLoadingIcon:n,"button-content":`button-content_Q-0-4`,buttonContent:r,"button-loading":`button-loading_TY6y7`,buttonLoading:i,"button-loading-container":`button-loading-container_pMSta`,buttonLoadingContainer:a,"button-withIcon":`button-withIcon_IXEKA`,buttonWithIcon:o,"button-style-default":`button-style-default_JmAqD`,buttonStyleDefault:s,"button-style-primary":`button-style-primary_Ra5i-`,buttonStylePrimary:c,"button-style-delete":`button-style-delete_jpTCf`,buttonStyleDelete:l,"button-background":`button-background_9Vfo5`,buttonBackground:u,"button-size-default":`button-size-default_N4HG9`,buttonSizeDefault:d,"button-size-small":`button-size-small_mn6jE`,buttonSizeSmall:f,"button-size-medium":`button-size-medium_gNVDM`,buttonSizeMedium:p,"button-size-large":`button-size-large_xSIcS`,buttonSizeLarge:m,"button-size-icon":`button-size-icon_pkqwl`,buttonSizeIcon:h,"button-ripple":`button-ripple_UGtt8`,buttonRipple:g};export{e as button,u as buttonBackground,r as buttonContent,i as buttonLoading,a as buttonLoadingContainer,n as buttonLoadingIcon,t as buttonNotAllowed,g as buttonRipple,d as buttonSizeDefault,h as buttonSizeIcon,m as buttonSizeLarge,p as buttonSizeMedium,f as buttonSizeSmall,s as buttonStyleDefault,l as buttonStyleDelete,c as buttonStylePrimary,o as buttonWithIcon,_ as default};
+"use client";var e=`button_wYLPJ`,t=`button-notAllowed_xGT-E`,n=`button-disabled_XDm5w`,r=`button-loading-icon_1pTTz`,i=`button-content_Q-0-4`,a=`button-loading_TY6y7`,o=`button-loading-container_pMSta`,s=`button-withIcon_IXEKA`,c=`button-style-filled_gsaJ4`,l=`button-style-light_HBi34`,u=`button-style-outlined_OSfMq`,d=`button-style-plain_CUtTy`,f=`button-background_9Vfo5`,p=`button-size-default_N4HG9`,m=`button-size-small_mn6jE`,h=`button-size-medium_gNVDM`,g=`button-size-large_xSIcS`,_=`button-size-icon_pkqwl`,v=`button-ripple_UGtt8`,y={button:e,"button-notAllowed":`button-notAllowed_xGT-E`,buttonNotAllowed:t,"button-disabled":`button-disabled_XDm5w`,buttonDisabled:n,"button-loading-icon":`button-loading-icon_1pTTz`,buttonLoadingIcon:r,"button-content":`button-content_Q-0-4`,buttonContent:i,"button-loading":`button-loading_TY6y7`,buttonLoading:a,"button-loading-container":`button-loading-container_pMSta`,buttonLoadingContainer:o,"button-withIcon":`button-withIcon_IXEKA`,buttonWithIcon:s,"button-style-filled":`button-style-filled_gsaJ4`,buttonStyleFilled:c,"button-style-light":`button-style-light_HBi34`,buttonStyleLight:l,"button-style-outlined":`button-style-outlined_OSfMq`,buttonStyleOutlined:u,"button-style-plain":`button-style-plain_CUtTy`,buttonStylePlain:d,"button-background":`button-background_9Vfo5`,buttonBackground:f,"button-size-default":`button-size-default_N4HG9`,buttonSizeDefault:p,"button-size-small":`button-size-small_mn6jE`,buttonSizeSmall:m,"button-size-medium":`button-size-medium_gNVDM`,buttonSizeMedium:h,"button-size-large":`button-size-large_xSIcS`,buttonSizeLarge:g,"button-size-icon":`button-size-icon_pkqwl`,buttonSizeIcon:_,"button-ripple":`button-ripple_UGtt8`,buttonRipple:v};export{e as button,f as buttonBackground,i as buttonContent,n as buttonDisabled,a as buttonLoading,o as buttonLoadingContainer,r as buttonLoadingIcon,t as buttonNotAllowed,v as buttonRipple,p as buttonSizeDefault,_ as buttonSizeIcon,g as buttonSizeLarge,h as buttonSizeMedium,m as buttonSizeSmall,c as buttonStyleFilled,l as buttonStyleLight,u as buttonStyleOutlined,d as buttonStylePlain,s as buttonWithIcon,y as default};
 //# sourceMappingURL=button.module.mjs.map

package/dist/esm/common/button/button.module.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"button.module.mjs","names":[],"sources":["../../../../package/common/button/button.module.pcss"],"sourcesContent":[".button {\n appearance: none;\n -webkit-appearance: none;\n box-sizing: border-box;\n font-size: var(--default-font-size);\n background: transparent;\n ~~color: var(--text-color);\n~~ border: 1px solid transparent;\n padding: 0;\n font-family: var(--default-font);\n border-radius: var(--default-border-radius);\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n position: relative;\n overflow: hidden;\n min-width: min-content;\n\n &-notAllowed {\n cursor: not-allowed;\n ~~filter~~: opacity(0.8);\n }\n\n &-loading-icon {\n width: 100% !important;\n height: 100% !important;\n }\n\n &-content {\n position: relative;\n white-space: break-spaces;\n~~\n div {\n text-overflow: ellipsis;\n overflow: hidden;\n }\n~~ }\n\n &-loading {\n visibility: hidden;\n\n &-container {\n position: absolute;\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n }\n\n &-withIcon {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 0.5em;\n }\n\n &-style {\n &-~~default~~ {\n background: var(--~~button~~-~~default-background, transparent~~);\n ~~color: var(--button-default-color, var(--text-color));\n border: var(--button-default-border, 1px solid transparent);\n }~~\n~~\n &-primary {\n~~ ~~background: var(--primary-color);\n\n~~ /* Must follow the shorthand above, which resets background-image. /\n background-image: var(--~~primary~~-gradient~~, none~~);\n color: var(--~~text~~-~~color~~);\n ~~color~~: ~~var(--text-~~on~~-primary);\~~n\n ~~.button~~-~~loading-icon~~ {\n ~~stroke~~: ~~var(--text-on-primary)~~;\n }\n }\n\n &-~~delete~~ {\n background: var(--~~error~~-~~color~~);\n color: var(--text~~-on-delete~~);\n\n ~~.button-loading-icon~~ {\n ~~stroke~~: var(--text-on-~~delete~~);\n }\n }\n }\n\n &-background {\n display: block;\n padding: 0.5em 0.75em;\n }\n\n / Multiples of the theme's base, not em: an em on font-size resolves against the parent,\n so these would follow whatever the button sits in rather than the theme. /\n &-size {\n &-default {\n font-size: var(--default-font-size);\n }\n\n &-small {\n font-size: calc(var(--default-font-size) 0.75);\n }\n\n &-medium {\n /* Medium button is same as default for now /\n font-size: var(--default-font-size);\n }\n\n &-large {\n font-size: calc(var(--default-font-size) 1.25);\n }\n\n /* Square, padding-free button for a lone icon; the caller sets the box size. /\n &-icon {\n display: inline-flex;\n\n / Inherits, unlike the other sizes: a hardcoded px value would have to be out-specified\n from another stylesheet, a specificity tie decided only by bundle order. */\n font-size: inherit;\n\n .button-ripple,\n .button-background,\n .button-content {\n display: flex;\n flex: 1;\n align-items: center;\n justify-content: center;\n padding: 0;\n }\n }\n }\n}\n"],"mappings":""}
1	+ {"version":3,"file":"button.module.mjs","names":[],"sources":["../../../../package/common/button/button.module.pcss"],"sourcesContent":[".button {\n appearance: none;\n -webkit-appearance: none;\n box-sizing: border-box;\n font-size: var(--default-font-size);\n background: transparent;\n border: 1px solid transparent;\n padding: 0;\n font-family: var(--default-font);\n border-radius: var(--default-border-radius);\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n position: relative;\n overflow: hidden;\n min-width: min-content;\n\n /* Hover and press layer in currentcolor, so one rule fits every style. On the root, which a\n stretched button's inner element would not fill; under the Ripple wrapper, which comes later. /\n &::before {\n content: '';\n position: absolute;\n inset: 0;\n background: currentcolor;\n opacity: 0;\n transition: opacity 0.15s;\n pointer-events: none;\n }\n\n &-notAllowed {\n cursor: not-allowed;\n }\n\n / Disabled only, not loading: a faded spinner would read as disabled rather than working. /\n &-disabled {\n opacity: 0.5;\n }\n\n / Inside the edge: outside, a ButtonGroup neighbour with the same fill swallows the ring. A\n Filled button draws it in its text colour instead, as Pagination's active item does. /\n &:focus-visible {\n outline: 2px solid var(--focus-border-color, var(--primary-color));\n outline-offset: -4px;\n }\n\n / (hover: hover) because on touch a tap latches :hover until the next tap elsewhere. /\n @media (hover: hover) {\n &:hover:not(:disabled)::before {\n opacity: 0.08;\n }\n }\n\n / After the hover rule, which it ties on specificity: a press is a hover too. /\n &:active:not(:disabled)::before {\n opacity: 0.16;\n }\n\n &-loading-icon {\n width: 100% !important;\n height: 100% !important;\n stroke: currentcolor;\n }\n\n &-content {\n position: relative;\n white-space: break-spaces;\n }\n\n &-loading {\n visibility: hidden;\n\n &-container {\n position: absolute;\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n }\n\n &-withIcon {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 0.5em;\n }\n\n &-style {\n &-filled {\n background: var(--tone-fill);\n\n / Must follow the shorthand above, which resets background-image. /\n background-image: var(--tone-gradient);\n color: var(--tone-contrast);\n\n / After the base :focus-visible rule, which it ties on specificity. /\n &:focus-visible {\n outline-color: currentcolor;\n }\n }\n\n &-light {\n background: var(--tone-light);\n color: var(--tone-text);\n }\n\n &-outlined {\n color: var(--tone-text);\n border-color: var(--tone-outline);\n }\n\n &-plain {\n color: var(--tone-text);\n }\n }\n\n &-background {\n display: block;\n padding: 0.5em 0.75em;\n }\n\n / Multiples of the theme's base, not em: an em on font-size resolves against the parent,\n so these would follow whatever the button sits in rather than the theme. /\n &-size {\n &-default {\n font-size: var(--default-font-size);\n }\n\n &-small {\n font-size: calc(var(--default-font-size) 0.75);\n }\n\n &-medium {\n /* Medium button is same as default for now /\n font-size: var(--default-font-size);\n }\n\n &-large {\n font-size: calc(var(--default-font-size) 1.25);\n }\n\n /* Square, padding-free button for a lone icon; the caller sets the box size. /\n &-icon {\n display: inline-flex;\n\n / Inherits, unlike the other sizes: a hardcoded px value would have to be out-specified\n from another stylesheet, a specificity tie decided only by bundle order. */\n font-size: inherit;\n\n .button-ripple,\n .button-background,\n .button-content {\n display: flex;\n flex: 1;\n align-items: center;\n justify-content: center;\n padding: 0;\n }\n }\n }\n}\n"],"mappings":""}

package/dist/esm/common/button/button.types.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use client";var e=function(e){return e.Primary=`primary`,e.Default=`default`,e.Delete=`delete`,e}({}),t=function(e){return e.Default=`default`,e.Small=`small`,e.Medium=`medium`,e.Large=`large`,e.Icon=`icon`,e}({}),n=function(e){return e.Button=`button`,e.Reset=`reset`,e.Submit=`submit`,e}({});export{t as ButtonSize,e as ButtonStyleType,n as ButtonType};
+"use client";var e=function(e){return e.Filled=`filled`,e.Light=`light`,e.Outlined=`outlined`,e.Plain=`plain`,e}({}),t=function(e){return e.Default=`default`,e.Small=`small`,e.Medium=`medium`,e.Large=`large`,e.Icon=`icon`,e}({}),n=function(e){return e.Button=`button`,e.Reset=`reset`,e.Submit=`submit`,e}({});export{t as ButtonSize,e as ButtonStyleType,n as ButtonType};
 //# sourceMappingURL=button.types.mjs.map

package/dist/esm/common/button/button.types.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"button.types.mjs","names":[],"sources":["../../../../package/common/button/button.types.ts"],"sourcesContent":["import type React from 'react';\nimport type { CSSProperties } from 'react';\nimport type { IconContent } from '../types/icon.types';\nimport type { SlotClassNames, SlotStyles, DataProps } from '../types/slots.types';\n\nexport enum ButtonStyleType {\n ~~Primary~~ = '~~primary~~',\n ~~Default~~ = 'default',\n ~~Delete~~ = '~~delete~~',\n}\n\nexport enum ButtonSize {\n Default = 'default',\n Small = 'small',\n Medium = 'medium',\n Large = 'large',\n /** Square, padding-free button for a lone icon. Give it its own width/height. /\n Icon = 'icon',\n}\n\nexport enum ButtonType {\n Button = 'button',\n Reset = 'reset',\n Submit = 'submit',\n}\n\nexport type ButtonSlots = 'background' \| 'content' \| 'loadingContainer' \| 'label';\n\n/\n `DataProps` supplies the `data-` index signature, which `ButtonHTMLAttributes` doesn't cover.\n `type` and `onClick` below deliberately narrow their inherited counterparts.\n */\nexport interface ButtonProps extends DataProps, React.ButtonHTMLAttributes<HTMLButtonElement> {\n className?: string;\n style?: CSSProperties;\n type?: ButtonType;\n styleType?: ButtonStyleType;\n size?: ButtonSize;\n onClick?: (event: React.MouseEvent<HTMLButtonElement>) => Promise<void> \| void;\n children?: React.ReactNode;\n icon?: IconContent;\n isLoading?: boolean;\n disabled?: boolean;\n title?: string;\n ref?: React.Ref<HTMLButtonElement>;\n classNames?: SlotClassNames<ButtonSlots>;\n styles?: SlotStyles<ButtonSlots>;\n}\n"],"mappings":"~~aAKA~~,IAAY,EAAL,SAAA,EAAA,~~OACL~~,GAAA,~~QAAA~~,~~UACA~~,EAAA,~~QAAA~~,~~UACA~~,EAAA,~~OAAA~~,~~UACF~~,EAAA,CAAA,CAAA,EAEY,EAAL,SAAA,EAAA,OACL,GAAA,QAAA,UACA,EAAA,MAAA,QACA,EAAA,OAAA,SACA,EAAA,MAAA,QAEA,EAAA,KAAA,QACF,EAAA,CAAA,CAAA,EAEY,EAAL,SAAA,EAAA,OACL,GAAA,OAAA,SACA,EAAA,MAAA,QACA,EAAA,OAAA,UACF,EAAA,CAAA,CAAA"}
1	+ {"version":3,"file":"button.types.mjs","names":[],"sources":["../../../../package/common/button/button.types.ts"],"sourcesContent":["import type React from 'react';\nimport type { CSSProperties } from 'react';\nimport type { IconContent } from '../types/icon.types';\nimport type { SlotClassNames, SlotStyles, DataProps } from '../types/slots.types';\nimport type { ColorValue } from '../themeProvider/color.types';\n\n/** How much the button stands out. Independent of its colour. /\nexport enum ButtonStyleType {\n /* Solid fill, for the one main action. /\n Filled = 'filled',\n /* A light tint of the colour behind text in the colour. /\n Light = 'light',\n /* Border and text in the colour, no fill. The default. /\n Outlined = 'outlined',\n /* Text in the colour, no fill and no border. For toolbar, icon and close buttons. /\n Plain = 'plain',\n}\n\nexport enum ButtonSize {\n Default = 'default',\n Small = 'small',\n Medium = 'medium',\n Large = 'large',\n /* Square, padding-free button for a lone icon. Give it its own width/height. /\n Icon = 'icon',\n}\n\nexport enum ButtonType {\n Button = 'button',\n Reset = 'reset',\n Submit = 'submit',\n}\n\nexport type ButtonSlots = 'background' \| 'content' \| 'loadingContainer' \| 'label';\n\n/\n `DataProps` supplies the `data-` index signature, which `ButtonHTMLAttributes` doesn't cover.\n `type`, `color` and `onClick` below deliberately narrow their inherited counterparts.\n /\nexport interface ButtonProps extends DataProps, React.ButtonHTMLAttributes<HTMLButtonElement> {\n className?: string;\n style?: CSSProperties;\n type?: ButtonType;\n /* Emphasis: `Filled`, `Light`, `Outlined` (default) or `Plain`. /\n styleType?: ButtonStyleType;\n /* A `ThemeColor` (default `Primary`) or any CSS colour, such as `'var(--brand)'`. */\n color?: ColorValue;\n size?: ButtonSize;\n onClick?: (event: React.MouseEvent<HTMLButtonElement>) => Promise<void> \| void;\n children?: React.ReactNode;\n icon?: IconContent;\n isLoading?: boolean;\n disabled?: boolean;\n title?: string;\n ref?: React.Ref<HTMLButtonElement>;\n classNames?: SlotClassNames<ButtonSlots>;\n styles?: SlotStyles<ButtonSlots>;\n}\n"],"mappings":"aAOA,IAAY,EAAL,SAAA,EAAA,OAEL,GAAA,OAAA,SAEA,EAAA,MAAA,QAEA,EAAA,SAAA,WAEA,EAAA,MAAA,SACF,EAAA,CAAA,CAAA,EAEY,EAAL,SAAA,EAAA,OACL,GAAA,QAAA,UACA,EAAA,MAAA,QACA,EAAA,OAAA,SACA,EAAA,MAAA,QAEA,EAAA,KAAA,QACF,EAAA,CAAA,CAAA,EAEY,EAAL,SAAA,EAAA,OACL,GAAA,OAAA,SACA,EAAA,MAAA,QACA,EAAA,OAAA,UACF,EAAA,CAAA,CAAA"}

package/dist/esm/common/calendar/calendar.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use client";import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import{useLabels as t}from"../configProvider/useLabels.mjs";import{mergeRefs as n}from"../utils/mergeRefs.mjs";import{asDay as r,dateToDay as i,dayToDate as a}from"../utils/day.mjs";import{CalendarView as o}from"./calendar.types.mjs";import{addDays as ee,dayDiff as s,hiddenDaySet as te,periodRange as ne,rangeWithNeighbours as re,shownDay as ie,shownDays as c,startOfDay as l,stepDate as u}from"./dates.mjs";import{formatPeriodTitle as d,localeWeekStart as ae}from"./format.mjs";import oe from"./components/agendaList/agendaList.mjs";import se from"./components/calendarHeader/calendarHeader.mjs";import ce from"./components/compactMonth/compactMonth.mjs";import le from"./components/monthView/monthView.mjs";import ue from"./components/timeGrid/timeGrid.mjs";import de from"./calendar.module.mjs";import{useEffect as f,useLayoutEffect as p,useRef as m,useState as h}from"react";import fe from"classnames";import{jsx as g,jsxs as pe}from"react/jsx-runtime";var me=[o.Month,o.Week,o.Day,o.Agenda],he=600,ge={previous:`Previous`,next:`Next`,today:`Today`,viewSwitcher:`Calendar view`,month:`Month`,week:`Week`,day:`Day`,agenda:`Agenda`,allDay:`All day`,more:e=>`+${e} more`,eventCount:e=>e===1?`1 event`:`${e} events`,noEvents:`No events`,newEvent:`New event`};function _(_){let{events:v,date:y,defaultDate:_e,onDateChange:ve,view:b,defaultView:ye=o.Month,onViewChange:be,views:x=me,locale:S,weekStartsOn:xe,slotMinutes:Se=15,hiddenDays:Ce,scrollToHour:we,onRangeChange:C,onEventClick:w,onEventChange:T,onSlotCreate:E,renderEvent:D,labels:O,ref:k,className:A,style:Te,classNames:j,styles:M,...Ee}=e(`Calendar`,_),N=t(`Calendar`,O,ge),P=xe??ae(S),F=te(Ce),I=m(null),De=m(null),[L,Oe]=h(0),[ke,Ae]=h(1),[je,Me]=h(()=>{let e=r(_e);return e?a(e):l(new Date)}),R=r(y),z=ie(R?a(R):je,F),[Ne,Pe]=h(ye),B=b??Ne;p(()=>{let e=I.current;if(!e)return;let t=()=>Oe(e.getBoundingClientRect().width);t();let n=new ResizeObserver(t);return n.observe(e),()=>n.disconnect()},[]);let V=L>0&&L<he,H=re(B,z,P,F),U=`${i(H.start)}/${i(H.end)}`,W=m({range:H,onRangeChange:C}),G=m(null);p(()=>{W.current={range:H,onRangeChange:C}}),f(()=>{G.current!==U&&(G.current=U,W.current.onRangeChange?.(W.current.range))},[U]);function K(e){let t=l(e);i(t)!==i(z)&&(Ae(t>z?1:-1),y===void 0&&Me(t),ve?.(i(t)))}function q(e){e!==B&&(b===void 0&&Pe(e),be?.(e))}let[J,Y]=h(()=>new Map);function Fe(e){let t=T?.(e);if(typeof t?.then!=`function`)return;let n=String(e.event.id),r={start:e.start,end:e.end};Y(e=>new Map(e).set(n,r));let i=()=>Y(e=>{if(e.get(n)!==r)return e;let t=new Map(e);return t.delete(n),t});t.then(i,i)}let X=J.size===0?v:v.map(e=>{let t=J.get(String(e.id));return t?{...e,...t}:e}),Z={events:X,date:z,view:B,locale:S,weekStartsOn:P,slotMinutes:Se,hidden:F,scrollToHour:we,text:N,onDateChange:K,onOpenDay:x.includes(o.Day)?e=>{K(e),q(o.Day)}:void 0,onEventClick:w,onEventChange:T&&Fe,onSlotCreate:E,renderEvent:D,classNames:j,slotStyles:M},Q=ne(B,z,P),$=c(Q.start,s(Q.start,Q.end),F),Ie={start:$[0],end:ee($[$.length-1],1)};function Le(){switch(B){case o.Week:case o.Day:return g(ue,{...Z,zoomRef:De});case o.Agenda:return g(oe,{events:X,start:Q.start,days:s(Q.start,Q.end),hidden:F,scrollTo:z,showDayHeaders:!0,locale:S,text:N,onEventClick:w,renderEvent:D,classNames:j,slotStyles:M});default:return g(V?ce:le,{...Z})}}return pe(`div`,{...Ee,ref:n(I,k),className:fe(de.calendar,A,j?.root),style:{...Te,...M?.root},children:[g(se,{className:j?.header,style:M?.header,compact:V,title:d(B,z,Ie,S),direction:ke,view:B,views:x,text:N,onStep:e=>K(u(B,z,e,F)),onToday:()=>K(new Date),onViewChange:q}),Le()]})}export{_ as default};
+"use client";import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import{useLabels as t}from"../configProvider/useLabels.mjs";import{useToneCheck as n}from"../styles/tone.mjs";import{mergeRefs as r}from"../utils/mergeRefs.mjs";import{asDay as i,dateToDay as a,dayToDate as o}from"../utils/day.mjs";import{CalendarView as s}from"./calendar.types.mjs";import{NARROW_WEEK as ee,addDays as te,dayDiff as c,hiddenDaySet as ne,newEventSlot as re,periodRange as ie,rangeWithNeighbours as ae,shownDay as oe,shownDays as se,startOfDay as l,stepDate as ce}from"./dates.mjs";import{formatPeriodTitle as le,localeWeekStart as ue}from"./format.mjs";import{useToday as de}from"./useNow.mjs";import fe from"./components/agendaList/agendaList.mjs";import pe from"./components/calendarHeader/calendarHeader.mjs";import me from"./components/compactMonth/compactMonth.mjs";import he from"./components/monthView/monthView.mjs";import ge from"./components/timeGrid/timeGrid.mjs";import _e from"./calendar.module.mjs";import{useEffect as ve,useLayoutEffect as u,useRef as d,useState as f}from"react";import ye from"classnames";import{jsx as p,jsxs as m}from"react/jsx-runtime";var be=[s.Month,s.Week,s.Day,s.Agenda],xe=600,Se={previous:`Previous`,next:`Next`,today:`Today`,viewSwitcher:`Calendar view`,month:`Month`,week:`Week`,day:`Day`,agenda:`Agenda`,allDay:`All day`,more:e=>`+${e} more`,eventCount:e=>e===1?`1 event`:`${e} events`,noEvents:`No events`,newEvent:`New event`,weekNumber:e=>`Week ${e}`};function h(h){let{events:g,date:_,defaultDate:Ce,onDateChange:we,view:v,defaultView:Te,onViewChange:Ee,views:y=be,locale:b,weekStartsOn:De,slotMinutes:x=15,hiddenDays:Oe,scrollToHour:ke,workingHours:Ae,showWeekNumbers:je=!1,onRangeChange:S,onEventClick:C,onEventChange:w,onSlotCreate:T,renderEvent:E,eventClassName:D,labels:Me,ref:Ne,className:Pe,style:Fe,classNames:O,styles:k,...A}=e(`Calendar`,h),j=t(`Calendar`,Me,Se);n(`Calendar`,g.map(e=>e.color));let M=De??ue(b),N=ne(Oe),P=d(null),Ie=d(null),[F,Le]=f(null),[Re,ze]=f(1),I=de(),[Be,Ve]=f(()=>{let e=i(Ce);return e?o(e):l(new Date)}),L=i(_),R=oe(L?o(L):Be,N),[He,Ue]=f(()=>Te??y[0]??s.Month),z=v??He;u(()=>{let e=P.current;if(!e)return;let t=()=>Le(e.getBoundingClientRect().width);t();let n=new ResizeObserver(t);return n.observe(e),()=>n.disconnect()},[]);let B=F!==null&&F>0&&F<xe,V=B&&z===s.Week?ee:z,H=ae(V,R,M,N),U=F===null?null:`${a(H.start)}/${a(H.end)}`,W=d({range:H,onRangeChange:S}),G=d(null);u(()=>{W.current={range:H,onRangeChange:S}}),ve(()=>{U!==null&&G.current!==U&&(G.current=U,W.current.onRangeChange?.(W.current.range))},[U]);function K(e){let t=l(e);a(t)!==a(R)&&(ze(t>R?1:-1),_===void 0&&Ve(t),we?.(a(t)))}function q(e){e!==z&&(v===void 0&&Ue(e),Ee?.(e))}let[J,Y]=f(()=>new Map);function We(e){let t=w?.(e);if(typeof t?.then!=`function`)return;let n=String(e.event.id),r={start:e.start,end:e.end};Y(e=>new Map(e).set(n,r));let i=()=>Y(e=>{if(e.get(n)!==r)return e;let t=new Map(e);return t.delete(n),t});t.then(i,i)}let X=J.size===0?g:g.map(e=>{let t=J.get(String(e.id));return t?{...e,...t}:e}),Z={events:X,date:R,period:V,today:I,locale:b,weekStartsOn:M,slotMinutes:x,hidden:N,scrollToHour:ke,workingHours:Ae,showWeekNumbers:je,text:j,onDateChange:K,onOpenDay:y.includes(s.Day)?e=>{K(e),q(s.Day)}:void 0,onEventClick:C,onEventChange:w&&We,onSlotCreate:T,renderEvent:E,eventClassName:D,classNames:O,slotStyles:k},Q=ie(V,R,M,N),$=se(Q.start,c(Q.start,Q.end),N),Ge={start:$[0],end:te($[$.length-1],1)};function Ke(){switch(z){case s.Week:case s.Day:return p(ge,{...Z,zoomRef:Ie},B?`narrow`:`wide`);case s.Agenda:return p(fe,{events:X,start:Q.start,days:c(Q.start,Q.end),hidden:N,scrollTo:R,showDayHeaders:!0,locale:b,today:I,text:j,onEventClick:C,renderEvent:E,eventClassName:D,classNames:O,slotStyles:k});default:return p(B?me:he,{...Z})}}return m(`div`,{...A,ref:r(P,Ne),className:ye(_e.calendar,Pe,O?.root),style:{...Fe,...k?.root},children:[p(pe,{className:O?.header,style:k?.header,compact:B,title:le(V,R,Ge,b),direction:Re,view:z,views:y,text:j,onStep:e=>K(ce(V,R,e,N)),onToday:()=>K(new Date),onViewChange:q,onCreate:T&&(e=>T(re(V,R,new Date,x),e))}),Ke()]})}export{h as default};
 //# sourceMappingURL=calendar.mjs.map

package/dist/esm/common/calendar/calendar.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"calendar.mjs","names":[],"sources":["../../../../package/common/calendar/calendar.tsx"],"sourcesContent":["import { useEffect, useLayoutEffect, useRef, useState, type ReactElement } from 'react';\nimport cx from 'classnames';\n\nimport { useComponentDefaults, useLabels } from '../configProvider';\nimport { mergeRefs } from '../utils/mergeRefs';\nimport { asDay, dayToDate } from '../utils/day';\nimport {\n CalendarView,\n type CalendarEvent,\n type CalendarEventChange,\n type CalendarLabels,\n type CalendarProps,\n} from './calendar.types';\nimport {\n dayDiff,\n dateToDay,\n addDays,\n hiddenDaySet,\n periodRange,\n rangeWithNeighbours,\n shownDay,\n shownDays,\n startOfDay,\n stepDate,\n} from './dates';\nimport { formatPeriodTitle, localeWeekStart } from './format';\nimport AgendaList from './components/agendaList';\nimport CalendarHeader from './components/calendarHeader';\nimport CompactMonth from './components/compactMonth';\nimport MonthView from './components/monthView';\nimport TimeGrid from './components/timeGrid';\nimport type { TimeGridZoom } from './components/timeGrid/timeGrid.types';\nimport type { CalendarViewProps } from './view.types';\n\nimport styles from './calendar.module.pcss';\n\nconst ALL_VIEWS = [CalendarView.Month, CalendarView.Week, CalendarView.Day, CalendarView.Agenda];\n\n/** Below this width the month view folds into the compact month with a day list. */\nconst COMPACT_WIDTH = 600;\n\nconst DEFAULT_LABELS: Required<CalendarLabels> = {\n previous: 'Previous',\n next: 'Next',\n today: 'Today',\n viewSwitcher: 'Calendar view',\n month: 'Month',\n week: 'Week',\n day: 'Day',\n agenda: 'Agenda',\n allDay: 'All day',\n more: (count) => `+${count} more`,\n eventCount: (count) => (count === 1 ? '1 event' : `${count} events`),\n noEvents: 'No events',\n newEvent: 'New event',\n};\n\nfunction Calendar<E extends CalendarEvent = CalendarEvent>(props: CalendarProps<E>): ReactElement {\n const {\n events,\n date: controlledDate,\n defaultDate,\n onDateChange,\n view: controlledView,\n defaultView = CalendarView.Month,\n onViewChange,\n views = ALL_VIEWS,\n locale,\n weekStartsOn: weekStartsOnProp,\n slotMinutes = 15,\n hiddenDays,\n scrollToHour,\n onRangeChange,\n onEventClick,\n onEventChange,\n onSlotCreate,\n renderEvent,\n labels,\n ref,\n className,\n style,\n classNames,\n styles: slotStyles,\n ...rest\n } = useComponentDefaults('Calendar', props);\n const text = useLabels('Calendar', labels, DEFAULT_LABELS);\n const weekStartsOn = weekStartsOnProp ?? localeWeekStart(locale);\n const hidden = hiddenDaySet(hiddenDays);\n\n const rootRef = useRef<HTMLDivElement>(null);\n const zoomRef = useRef<TimeGridZoom \| null>(null);\n const [width, setWidth] = useState(0);\n const [direction, setDirection] = useState<1 \| -1>(1);\n\n // `date` is a day, the same wherever the calendar is opened, and read as its first local moment.\n const [internalDate, setInternalDate] = useState(() => {\n const initial = asDay(defaultDate);\n return initial ? dayToDate(initial) : startOfDay(new Date());\n });\n const controlledDay = asDay(controlledDate);\n // Only ever a day the views show. The selection itself is left alone: a hidden day in `date` is\n // the parent's, and stepping on from it lands where the parent would expect.\n const date = shownDay(controlledDay ? dayToDate(controlledDay) : internalDate, hidden);\n const [internalView, setInternalView] = useState(defaultView);\n const view = controlledView ?? internalView;\n\n // The layout switch follows the calendar's own width rather than the viewport's, so it also\n // happens in a sidebar on a wide screen. Width 0 means no layout (server, jsdom): stay wide.\n useLayoutEffect(() => {\n const root = rootRef.current;\n if (!root) return;\n // The border box, both times: an observer's `contentRect` leaves the border out, and 600px\n // wide would then read as 598.\n const measure = () => setWidth(root.getBoundingClientRect().width);\n measure();\n const observer = new ResizeObserver(measure);\n observer.observe(root);\n return () => observer.disconnect();\n }, []);\n const compact = width > 0 && width < COMPACT_WIDTH;\n\n // Reported per range, not per render: `date` is a new object on every render of a controlled\n // parent. Not `useEffectEvent` for the latest callback, which React only has from 19.2.\n // An effect, since controlled props move the range too; `reported` keeps StrictMode's re-run\n // from reporting a range twice, which a consumer fetching in the callback pays for.\n const range = rangeWithNeighbours(view, date, weekStartsOn, hidden);\n const rangeKey = `${dateToDay(range.start)}/${dateToDay(range.end)}`;\n const latest = useRef({ range, onRangeChange });\n const reported = useRef<string \| null>(null);\n useLayoutEffect(() => {\n latest.current = { range, onRangeChange };\n });\n useEffect(() => {\n if (reported.current === rangeKey) return;\n reported.current = rangeKey;\n latest.current.onRangeChange?.(latest.current.range);\n }, [rangeKey]);\n\n function changeDate(next: Date) {\n const day = startOfDay(next);\n if (dateToDay(day) === dateToDay(date)) return;\n setDirection(day > date ? 1 : -1);\n if (controlledDate === undefined) setInternalDate(day);\n onDateChange?.(dateToDay(day));\n }\n\n function changeView(next: CalendarView) {\n if (next === view) return;\n if (controlledView === undefined) setInternalView(next);\n onViewChange?.(next);\n }\n\n // Moves whose promise has not settled yet, drawn where they were dropped meanwhile.\n const [pending, setPending] = useState<ReadonlyMap<string, { start: Date; end: Date }>>(() => new Map());\n function changeEvent(change: CalendarEventChange<E>) {\n const result = onEventChange?.(change);\n if (typeof (result as Promise<unknown> \| undefined)?.then !== 'function') return;\n const key = String(change.event.id);\n const entry = { start: change.start, end: change.end };\n setPending((current) => new Map(current).set(key, entry));\n // A later move of the same event owns the entry by then, and keeps it.\n const settle = () =>\n setPending((current) => {\n if (current.get(key) !== entry) return current;\n const next = new Map(current);\n next.delete(key);\n return next;\n });\n (result as Promise<unknown>).then(settle, settle);\n }\n const shownEvents =\n pending.size === 0\n ? events\n : events.map((event) => {\n const moved = pending.get(String(event.id));\n return moved ? { ...event, ...moved } : event;\n });\n\n const viewProps: CalendarViewProps<E> = {\n events: shownEvents,\n date,\n view,\n locale,\n weekStartsOn,\n slotMinutes,\n hidden,\n scrollToHour,\n text,\n onDateChange: changeDate,\n onOpenDay: views.includes(CalendarView.Day)\n ? (day) => {\n changeDate(day);\n changeView(CalendarView.Day);\n }\n : undefined,\n onEventClick,\n onEventChange: onEventChange && changeEvent,\n onSlotCreate,\n renderEvent,\n classNames,\n slotStyles,\n };\n\n // The week's title names the days it shows, not the ones it hides at either end.\n const period = periodRange(view, date, weekStartsOn);\n const columns = shownDays(period.start, dayDiff(period.start, period.end), hidden);\n const titleRange = { start: columns[0], end: addDays(columns[columns.length - 1], 1) };\n\n function renderView() {\n switch (view) {\n case CalendarView.Week:\n case CalendarView.Day:\n return <TimeGrid {...viewProps} zoomRef={zoomRef} />;\n case CalendarView.Agenda: {\n return (\n <AgendaList\n events={shownEvents}\n start={period.start}\n days={dayDiff(period.start, period.end)}\n hidden={hidden}\n scrollTo={date}\n showDayHeaders\n locale={locale}\n text={text}\n onEventClick={onEventClick}\n renderEvent={renderEvent}\n classNames={classNames}\n slotStyles={slotStyles}\n />\n );\n }\n default:\n return compact ? <CompactMonth {...viewProps} /> : <MonthView {...viewProps} />;\n }\n }\n\n return (\n <div\n {...rest}\n ref={mergeRefs(rootRef, ref)}\n className={cx(styles.calendar, className, classNames?.root)}\n style={{ ...style, ...slotStyles?.root }}\n >\n <CalendarHeader\n className={classNames?.header}\n style={slotStyles?.header}\n compact={compact}\n title={formatPeriodTitle(view, date, titleRange, locale)}\n direction={direction}\n view={view}\n views={views}\n text={text}\n onStep={(step) => changeDate(stepDate(view, date, step, hidden))}\n onToday={() => changeDate(new Date())}\n onViewChange={changeView}\n />\n {renderView()}\n </div>\n );\n}\n\nexport default Calendar;\n"],"mappings":"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"}
1	+ {"version":3,"file":"calendar.mjs","names":[],"sources":["../../../../package/common/calendar/calendar.tsx"],"sourcesContent":["import { useEffect, useLayoutEffect, useRef, useState, type ReactElement } from 'react';\nimport cx from 'classnames';\n\nimport { useComponentDefaults, useLabels } from '../configProvider';\nimport { mergeRefs } from '../utils/mergeRefs';\nimport { asDay, dayToDate } from '../utils/day';\nimport {\n CalendarView,\n type CalendarEvent,\n type CalendarEventChange,\n type CalendarLabels,\n type CalendarProps,\n} from './calendar.types';\nimport {\n dayDiff,\n dateToDay,\n addDays,\n hiddenDaySet,\n NARROW_WEEK,\n newEventSlot,\n periodRange,\n rangeWithNeighbours,\n shownDay,\n shownDays,\n startOfDay,\n stepDate,\n type CalendarPeriod,\n} from './dates';\nimport { formatPeriodTitle, localeWeekStart } from './format';\nimport { useToday } from './useNow';\nimport AgendaList from './components/agendaList';\nimport CalendarHeader from './components/calendarHeader';\nimport CompactMonth from './components/compactMonth';\nimport MonthView from './components/monthView';\nimport TimeGrid from './components/timeGrid';\nimport type { TimeGridZoom } from './components/timeGrid/timeGrid.types';\nimport type { CalendarViewProps } from './view.types';\n\nimport styles from './calendar.module.pcss';\nimport { useToneCheck } from '../styles/tone';\n\nconst ALL_VIEWS = [CalendarView.Month, CalendarView.Week, CalendarView.Day, CalendarView.Agenda];\n\n/** Below this width the month view folds into the compact month with a day list, and a week shows three days. */\nconst COMPACT_WIDTH = 600;\n\nconst DEFAULT_LABELS: Required<CalendarLabels> = {\n previous: 'Previous',\n next: 'Next',\n today: 'Today',\n viewSwitcher: 'Calendar view',\n month: 'Month',\n week: 'Week',\n day: 'Day',\n agenda: 'Agenda',\n allDay: 'All day',\n more: (count) => `+${count} more`,\n eventCount: (count) => (count === 1 ? '1 event' : `${count} events`),\n noEvents: 'No events',\n newEvent: 'New event',\n weekNumber: (week) => `Week ${week}`,\n};\n\nfunction Calendar<E extends CalendarEvent = CalendarEvent>(props: CalendarProps<E>): ReactElement {\n const {\n events,\n date: controlledDate,\n defaultDate,\n onDateChange,\n view: controlledView,\n defaultView,\n onViewChange,\n views = ALL_VIEWS,\n locale,\n weekStartsOn: weekStartsOnProp,\n slotMinutes = 15,\n hiddenDays,\n scrollToHour,\n workingHours,\n showWeekNumbers = false,\n onRangeChange,\n onEventClick,\n onEventChange,\n onSlotCreate,\n renderEvent,\n eventClassName,\n labels,\n ref,\n className,\n style,\n classNames,\n styles: slotStyles,\n ...rest\n } = useComponentDefaults('Calendar', props);\n const text = useLabels('Calendar', labels, DEFAULT_LABELS);\n useToneCheck(\n 'Calendar',\n events.map((event) => event.color),\n );\n const weekStartsOn = weekStartsOnProp ?? localeWeekStart(locale);\n const hidden = hiddenDaySet(hiddenDays);\n\n const rootRef = useRef<HTMLDivElement>(null);\n const zoomRef = useRef<TimeGridZoom \| null>(null);\n // `null` until measured, so that the first range reported is the one the layout shows.\n const [width, setWidth] = useState<number \| null>(null);\n const [direction, setDirection] = useState<1 \| -1>(1);\n const today = useToday();\n\n // `date` is a day, the same wherever the calendar is opened, and read as its first local moment.\n const [internalDate, setInternalDate] = useState(() => {\n const initial = asDay(defaultDate);\n return initial ? dayToDate(initial) : startOfDay(new Date());\n });\n const controlledDay = asDay(controlledDate);\n // Only ever a day the views show. The selection itself is left alone: a hidden day in `date` is\n // the parent's, and stepping on from it lands where the parent would expect.\n const date = shownDay(controlledDay ? dayToDate(controlledDay) : internalDate, hidden);\n const [internalView, setInternalView] = useState(() => defaultView ?? views[0] ?? CalendarView.Month);\n const view = controlledView ?? internalView;\n\n // The layout switch follows the calendar's own width rather than the viewport's, so it also\n // happens in a sidebar on a wide screen. Width 0 means no layout (server, jsdom): stay wide.\n useLayoutEffect(() => {\n const root = rootRef.current;\n if (!root) return;\n // The border box, both times: an observer's `contentRect` leaves the border out, and 600px\n // wide would then read as 598.\n const measure = () => setWidth(root.getBoundingClientRect().width);\n measure();\n const observer = new ResizeObserver(measure);\n observer.observe(root);\n return () => observer.disconnect();\n }, []);\n const compact = width !== null && width > 0 && width < COMPACT_WIDTH;\n const period: CalendarPeriod = compact && view === CalendarView.Week ? NARROW_WEEK : view;\n\n // Reported per range, not per render: `date` is a new object on every render of a controlled\n // parent. Not `useEffectEvent` for the latest callback, which React only has from 19.2.\n // An effect, since controlled props move the range too; `reported` keeps StrictMode's re-run\n // from reporting a range twice, which a consumer fetching in the callback pays for.\n const range = rangeWithNeighbours(period, date, weekStartsOn, hidden);\n const rangeKey = width === null ? null : `${dateToDay(range.start)}/${dateToDay(range.end)}`;\n const latest = useRef({ range, onRangeChange });\n const reported = useRef<string \| null>(null);\n useLayoutEffect(() => {\n latest.current = { range, onRangeChange };\n });\n useEffect(() => {\n if (rangeKey === null \|\| reported.current === rangeKey) return;\n reported.current = rangeKey;\n latest.current.onRangeChange?.(latest.current.range);\n }, [rangeKey]);\n\n function changeDate(next: Date) {\n const day = startOfDay(next);\n if (dateToDay(day) === dateToDay(date)) return;\n setDirection(day > date ? 1 : -1);\n if (controlledDate === undefined) setInternalDate(day);\n onDateChange?.(dateToDay(day));\n }\n\n function changeView(next: CalendarView) {\n if (next === view) return;\n if (controlledView === undefined) setInternalView(next);\n onViewChange?.(next);\n }\n\n // Moves whose promise has not settled yet, drawn where they were dropped meanwhile.\n const [pending, setPending] = useState<ReadonlyMap<string, { start: Date; end: Date }>>(() => new Map());\n function changeEvent(change: CalendarEventChange<E>) {\n const result = onEventChange?.(change);\n if (typeof (result as Promise<unknown> \| undefined)?.then !== 'function') return;\n const key = String(change.event.id);\n const entry = { start: change.start, end: change.end };\n setPending((current) => new Map(current).set(key, entry));\n // A later move of the same event owns the entry by then, and keeps it.\n const settle = () =>\n setPending((current) => {\n if (current.get(key) !== entry) return current;\n const next = new Map(current);\n next.delete(key);\n return next;\n });\n (result as Promise<unknown>).then(settle, settle);\n }\n const shownEvents =\n pending.size === 0\n ? events\n : events.map((event) => {\n const moved = pending.get(String(event.id));\n return moved ? { ...event, ...moved } : event;\n });\n\n const viewProps: CalendarViewProps<E> = {\n events: shownEvents,\n date,\n period,\n today,\n locale,\n weekStartsOn,\n slotMinutes,\n hidden,\n scrollToHour,\n workingHours,\n showWeekNumbers,\n text,\n onDateChange: changeDate,\n onOpenDay: views.includes(CalendarView.Day)\n ? (day) => {\n changeDate(day);\n changeView(CalendarView.Day);\n }\n : undefined,\n onEventClick,\n onEventChange: onEventChange && changeEvent,\n onSlotCreate,\n renderEvent,\n eventClassName,\n classNames,\n slotStyles,\n };\n\n // The week's title names the days it shows, not the ones it hides at either end.\n const shown = periodRange(period, date, weekStartsOn, hidden);\n const columns = shownDays(shown.start, dayDiff(shown.start, shown.end), hidden);\n const titleRange = { start: columns[0], end: addDays(columns[columns.length - 1], 1) };\n\n function renderView() {\n switch (view) {\n case CalendarView.Week:\n case CalendarView.Day:\n // Remounted across the narrow width: it decides where to open the hours on mount, from the\n // days it shows, and the first render, before the width is measured, is the wide one.\n return <TimeGrid key={compact ? 'narrow' : 'wide'} {...viewProps} zoomRef={zoomRef} />;\n case CalendarView.Agenda: {\n return (\n <AgendaList\n events={shownEvents}\n start={shown.start}\n days={dayDiff(shown.start, shown.end)}\n hidden={hidden}\n scrollTo={date}\n showDayHeaders\n locale={locale}\n today={today}\n text={text}\n onEventClick={onEventClick}\n renderEvent={renderEvent}\n eventClassName={eventClassName}\n classNames={classNames}\n slotStyles={slotStyles}\n />\n );\n }\n default:\n return compact ? <CompactMonth {...viewProps} /> : <MonthView {...viewProps} />;\n }\n }\n\n return (\n <div\n {...rest}\n ref={mergeRefs(rootRef, ref)}\n className={cx(styles.calendar, className, classNames?.root)}\n style={{ ...style, ...slotStyles?.root }}\n >\n <CalendarHeader\n className={classNames?.header}\n style={slotStyles?.header}\n compact={compact}\n title={formatPeriodTitle(period, date, titleRange, locale)}\n direction={direction}\n view={view}\n views={views}\n text={text}\n onStep={(step) => changeDate(stepDate(period, date, step, hidden))}\n onToday={() => changeDate(new Date())}\n onViewChange={changeView}\n onCreate={\n onSlotCreate && ((anchor) => onSlotCreate(newEventSlot(period, date, new Date(), slotMinutes), anchor))\n }\n />\n {renderView()}\n </div>\n );\n}\n\nexport default Calendar;\n"],"mappings":"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"}

package/dist/esm/common/calendar/calendar.module.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"calendar.module.mjs","names":[],"sources":["../../../../package/common/calendar/calendar.module.pcss"],"sourcesContent":[".calendar {\n /* Theme tokens resolved once, each with a built-in fallback. Set any of the public\n `--calendar-` variables through ThemeProvider (theme-wide) or `style` (per instance). /\n --custom-calendar-hour-height: var(--calendar-hour-height, 3em);\n --custom-calendar-today-color: var(--calendar-today-color, var(--primary-color));\n --custom-calendar-now-color: var(--calendar-now-color, var(--error-color));\n --custom-calendar-event-radius: var(--calendar-event-radius, 6px);\n\n isolation: isolate;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n height: 40em;\n min-height: 0;\n overflow: hidden;\n border: 1px solid var(--border-color);\n border-radius: var(--default-border-radius);\n background: var(--background);\n color: var(--text-color);\n}\n"],"mappings":""}
1	+ {"version":3,"file":"calendar.module.mjs","names":[],"sources":["../../../../package/common/calendar/calendar.module.pcss"],"sourcesContent":[".calendar {\n /* Theme tokens resolved once, each with a built-in fallback. Set any of the public\n `--calendar-` variables through ThemeProvider (theme-wide) or `style` (per instance). /\n --custom-calendar-hour-height: var(--calendar-hour-height, 3em);\n --custom-calendar-today-color: var(--calendar-today-color, var(--primary-color));\n --custom-calendar-now-color: var(--calendar-now-color, var(--error-color));\n --custom-calendar-event-radius: var(--calendar-event-radius, 6px);\n --custom-calendar-off-hours-color: var(--calendar-off-hours-color, var(--background-accent));\n\n isolation: isolate;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n height: 40em;\n min-height: 0;\n overflow: hidden;\n border: 1px solid var(--border-color);\n border-radius: var(--default-border-radius);\n background: var(--background);\n color: var(--text-color);\n}\n"],"mappings":""}

package/dist/esm/common/calendar/calendar.types.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"calendar.types.mjs","names":[],"sources":["../../../../package/common/calendar/calendar.types.ts"],"sourcesContent":["import type { CSSProperties, ReactNode, Ref } from 'react';\nimport type { SlotClassNames, SlotStyles, HtmlProps } from '../types/slots.types';\n\nexport enum CalendarView {\n Month = 'month',\n Week = 'week',\n Day = 'day',\n Agenda = 'agenda',\n}\n\n/** A day of the week, as `Date#getDay()` counts: 0 is Sunday, 1 is Monday. /\nexport type CalendarWeekday = 0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6;\n\n/* First day of the week, as `Date#getDay()` counts: 0 is Sunday, 1 is Monday. /\nexport type CalendarWeekStart = CalendarWeekday;\n\nexport interface CalendarEvent {\n id: string \| number;\n title: string;\n /* Local time. /\n start: Date;\n /* Local time, exclusive. An all-day event on the 26th ends at midnight on the 27th. /\n end: Date;\n /* Shown in the all-day row instead of the time grid. Timed events of 24 hours or more are too. /\n allDay?: boolean;\n /* ~~Any~~ CSS colour. Falls back to `--primary-color`. /\n color?: ~~string~~;\n /* Can be clicked but not moved or resized. /\n readOnly?: boolean;\n}\n\n/* A span of local time. `end` is exclusive. /\nexport interface CalendarRange {\n start: Date;\n end: Date;\n}\n\nexport interface CalendarEventChange<E extends CalendarEvent = CalendarEvent> {\n event: E;\n start: Date;\n end: Date;\n}\n\nexport interface CalendarSlot {\n start: Date;\n end: Date;\n allDay: boolean;\n}\n\n/* Where `renderEvent` draws an event. /\nexport interface CalendarEventContext {\n /\n The event has one line: an event under 45 minutes in the week and day views, an all-day bar,\n * or a row of the month view. The day and agenda lists have room for more.\n /\n singleLine: boolean;\n}\n\nexport type CalendarSlots = 'root' \| 'header' \| 'dayHeader' \| 'cell' \| 'event';\n\n/* Text Calendar renders of its own, for translating it. Dates and times come from `locale`. /\nexport interface CalendarLabels {\n /* Previous period button (default `Previous`). /\n previous?: string;\n /* Next period button (default `Next`). /\n next?: string;\n /* Jump to today (default `Today`). /\n today?: string;\n /* Name of the view switcher, read out by screen readers (default `Calendar view`). /\n viewSwitcher?: string;\n month?: string;\n week?: string;\n day?: string;\n agenda?: string;\n /* All-day row and all-day events (default `All day`). /\n allDay?: string;\n /* Overflow button in a month cell (default `+3 more`). /\n more?: (count: number) => string;\n /* Appended to a day's name for screen readers (default `3 events`). /\n eventCount?: (count: number) => string;\n /* A day or period without events (default `No events`). /\n noEvents?: string;\n /* Create button in a day's event list, shown when `onSlotCreate` is set (default `New event`). /\n newEvent?: string;\n}\n\nexport interface CalendarProps<E extends CalendarEvent = CalendarEvent> extends HtmlProps<HTMLDivElement> {\n /* The events to show. Only the ones inside the range `onRangeChange` reports are needed. /\n events: E[];\n /* Controlled: the selected day, `'YYYY-MM-DD'`, whose period is shown. Omit for uncontrolled. /\n date?: string;\n /* Day shown initially when uncontrolled, `'YYYY-MM-DD'` (default today). /\n defaultDate?: string;\n /* Called with the new day, `'YYYY-MM-DD'`: the value a DatePicker holds. /\n onDateChange?: (day: string) => void;\n /* Controlled view. Omit for uncontrolled. /\n view?: CalendarView;\n /* View shown initially when uncontrolled (default `~~CalendarView.Month~~`). /\n defaultView?: CalendarView;\n onViewChange?: (view: CalendarView) => void;\n /* Views offered in the switcher, in order. The switcher is hidden when there is only one (default all four). /\n views?: CalendarView[];\n /* BCP 47 tag for dates, times and the week start (default the browser's locale). /\n locale?: string;\n /* Overrides the locale's first day of the week. /\n weekStartsOn?: CalendarWeekStart;\n /* Minutes that creating, moving and resizing snap to (default `15`). /\n slotMinutes?: number;\n /* Days of the week left out of every view: `[0, 6]` hides the weekend. /\n hiddenDays?: CalendarWeekday[];\n /\n Hour the week and day views open at, such as `6` for 06:00 (default an hour before now while\n * today is shown, otherwise 07:00).\n /\n scrollToHour?: number;\n /\n Called on mount and whenever the shown period changes, with the period and one either side of\n * it, so the neighbours are already filled while swiping. Fetch events and expand recurring\n * series for this range.\n /\n onRangeChange?: (range: CalendarRange) => void;\n /* An event was clicked or tapped. `anchor` is its element, for positioning a popover. /\n onEventClick?: (event: E, anchor: HTMLElement) => void;\n /\n An event was moved or resized. Setting it is what makes events draggable. Update `events`\n * in the same render, or return a promise: the event then stays where it was dropped until the\n * promise settles, and is drawn from `events` again after that, back in place if it rejected.\n /\n onEventChange?: (change: CalendarEventChange<E>) => void \| Promise<unknown>;\n /\n Empty time was clicked or dragged over. Setting it is what enables creating: a click creates\n * an hour, or an all-day slot in the month view. `anchor` marks the slot on screen, for a\n * popover's `anchor`: the day's cell in the month view, an invisible box over the slot ~~in the~~\n * ~~week~~ and ~~day~~ ~~views~~.\n /\n onSlotCreate?: (slot: CalendarSlot, anchor: HTMLElement) => void;\n /\n Content of an event, in place of its title. Must not contain interactive elements. Keep to the\n * title where `context.singleLine` is set: further lines have no room there.\n /\n renderEvent?: (event: E, context: CalendarEventContext) => ReactNode;\n /* The root element. /\n ref?: Ref<HTMLDivElement>;\n\n className?: string;\n style?: CSSProperties;\n classNames?: SlotClassNames<CalendarSlots>;\n styles?: SlotStyles<CalendarSlots>;\n /* Overrides the text Calendar renders of its own. Merged per key. /\n labels?: CalendarLabels;\n}\n\n/* The props `ConfigProvider` can set for every Calendar. The rest depend on the event type. */\nexport type CalendarDefaults = Pick<\n CalendarProps,\n 'labels' \| 'locale' \| 'weekStartsOn' \| 'slotMinutes' \| 'views' \| 'hiddenDays' \| 'scrollToHour'\n>;\n"],"mappings":"~~aAGA~~,IAAY,EAAL,SAAA,EAAA,OACL,GAAA,MAAA,QACA,EAAA,KAAA,OACA,EAAA,IAAA,MACA,EAAA,OAAA,UACF,EAAA,CAAA,CAAA"}
1	+ {"version":3,"file":"calendar.types.mjs","names":[],"sources":["../../../../package/common/calendar/calendar.types.ts"],"sourcesContent":["import type { CSSProperties, ReactNode, Ref } from 'react';\nimport type { SlotClassNames, SlotStyles, HtmlProps } from '../types/slots.types';\nimport type { ColorValue } from '../themeProvider/color.types';\n\nexport enum CalendarView {\n Month = 'month',\n Week = 'week',\n Day = 'day',\n Agenda = 'agenda',\n}\n\n/** A day of the week, as `Date#getDay()` counts: 0 is Sunday, 1 is Monday. /\nexport type CalendarWeekday = 0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6;\n\n/* First day of the week, as `Date#getDay()` counts: 0 is Sunday, 1 is Monday. /\nexport type CalendarWeekStart = CalendarWeekday;\n\nexport interface CalendarEvent {\n /* Unique among `events`: each occurrence of a recurring series needs an id of its own. /\n id: string \| number;\n title: string;\n /* Local time. /\n start: Date;\n /* Local time, exclusive. An all-day event on the 26th ends at midnight on the 27th. /\n end: Date;\n /* Shown in the all-day row instead of the time grid. Timed events of 24 hours or more are too. /\n allDay?: boolean;\n /* A `ThemeColor` or any CSS colour. Falls back to `--primary-color`. /\n color?: ColorValue;\n /* Can be clicked but not moved or resized. /\n readOnly?: boolean;\n}\n\n/* A span of local time. `end` is exclusive. /\nexport interface CalendarRange {\n start: Date;\n end: Date;\n}\n\nexport interface CalendarEventChange<E extends CalendarEvent = CalendarEvent> {\n event: E;\n start: Date;\n end: Date;\n}\n\nexport interface CalendarSlot {\n start: Date;\n end: Date;\n allDay: boolean;\n}\n\n/* Where `renderEvent` draws an event. /\nexport interface CalendarEventContext {\n /\n The event has one line: an event under 45 minutes in the week and day views, an all-day bar,\n * or a row of the month view. The day and agenda lists have room for more.\n /\n singleLine: boolean;\n}\n\nexport type CalendarSlots = 'root' \| 'header' \| 'dayHeader' \| 'cell' \| 'event';\n\n/* Text Calendar renders of its own, for translating it. Dates and times come from `locale`. /\nexport interface CalendarLabels {\n /* Previous period button (default `Previous`). /\n previous?: string;\n /* Next period button (default `Next`). /\n next?: string;\n /* Jump to today (default `Today`). /\n today?: string;\n /* Name of the view switcher, read out by screen readers (default `Calendar view`). /\n viewSwitcher?: string;\n month?: string;\n week?: string;\n day?: string;\n agenda?: string;\n /* All-day row and all-day events (default `All day`). /\n allDay?: string;\n /* Overflow button in a month cell (default `+3 more`). /\n more?: (count: number) => string;\n /* Appended to a day's name for screen readers (default `3 events`). /\n eventCount?: (count: number) => string;\n /* A day or period without events (default `No events`). /\n noEvents?: string;\n /* Create button in the header and in a day's event list, shown when `onSlotCreate` is set (default `New event`). /\n newEvent?: string;\n /* A week number, shown with `showWeekNumbers` (default `Week 40`). /\n weekNumber?: (week: number) => string;\n}\n\nexport interface CalendarProps<E extends CalendarEvent = CalendarEvent> extends HtmlProps<HTMLDivElement> {\n /* The events to show. Only the ones inside the range `onRangeChange` reports are needed. /\n events: E[];\n /* Controlled: the selected day, `'YYYY-MM-DD'`, whose period is shown. Omit for uncontrolled. /\n date?: string;\n /* Day shown initially when uncontrolled, `'YYYY-MM-DD'` (default today). /\n defaultDate?: string;\n /* Called with the new day, `'YYYY-MM-DD'`: the value a DatePicker holds. /\n onDateChange?: (day: string) => void;\n /* Controlled view. Omit for uncontrolled. /\n view?: CalendarView;\n /* View shown initially when uncontrolled (default the first of `views`). /\n defaultView?: CalendarView;\n onViewChange?: (view: CalendarView) => void;\n /* Views offered in the switcher, in order. The switcher is hidden when there is only one (default all four). /\n views?: CalendarView[];\n /* BCP 47 tag for dates, times and the week start (default the browser's locale). /\n locale?: string;\n /* Overrides the locale's first day of the week. /\n weekStartsOn?: CalendarWeekStart;\n /* Minutes that creating, moving and resizing snap to (default `15`). /\n slotMinutes?: number;\n /* Days of the week left out of every view: `[0, 6]` hides the weekend. /\n hiddenDays?: CalendarWeekday[];\n /\n Hour the week and day views open at, such as `6` for 06:00 (default an hour before now while\n * today is shown, otherwise the start of `workingHours`, or 07:00).\n /\n scrollToHour?: number;\n /\n Working time in the week and day views, `[8, 17]` for 08:00 to 17:00: the hours outside it are\n * shaded. `[22, 6]` runs overnight. Its start is also the hour those views open at when today is\n * not shown and `scrollToHour` is not set.\n /\n workingHours?: readonly [start: number, end: number];\n /* Shows ISO 8601 week numbers: on each row of the month view, and in the corner of the week and day views. /\n showWeekNumbers?: boolean;\n /\n Called on mount and whenever the shown period changes, with the period and one either side of\n * it, so the neighbours are already filled while swiping. Fetch events and expand recurring\n * series for this range.\n /\n onRangeChange?: (range: CalendarRange) => void;\n /* An event was clicked or tapped. `anchor` is its element, for positioning a popover. /\n onEventClick?: (event: E, anchor: HTMLElement) => void;\n /\n An event was moved or resized. Setting it is what makes events draggable. Update `events`\n * in the same render, or return a promise: the event then stays where it was dropped until the\n * promise settles, and is drawn from `events` again after that, back in place if it rejected.\n /\n onEventChange?: (change: CalendarEventChange<E>) => void \| Promise<unknown>;\n /\n Empty time was clicked or dragged over, or the header's New event button pressed. Setting it is\n * what enables creating: a click creates an hour, or an all-day slot in the month view and the\n * all-day row. `anchor` marks the slot on screen, for a popover's `anchor`: the first day's cell\n * in the month view, the first day's header for the all-day row, an invisible box over the slot\n * in the time grid, and the button itself from the header.\n /\n onSlotCreate?: (slot: CalendarSlot, anchor: HTMLElement) => void;\n /\n Content of an event, in place of its title. Must not contain interactive elements. Keep to the\n * title where `context.singleLine` is set: further lines have no room there.\n /\n renderEvent?: (event: E, context: CalendarEventContext) => ReactNode;\n /* A class for one event's element, next to `classNames.event`: a tentative, cancelled or selected event. /\n eventClassName?: (event: E) => string \| undefined;\n /* The root element. /\n ref?: Ref<HTMLDivElement>;\n\n className?: string;\n style?: CSSProperties;\n classNames?: SlotClassNames<CalendarSlots>;\n styles?: SlotStyles<CalendarSlots>;\n /* Overrides the text Calendar renders of its own. Merged per key. /\n labels?: CalendarLabels;\n}\n\n/* The props `ConfigProvider` can set for every Calendar. The rest depend on the event type. */\nexport type CalendarDefaults = Pick<\n CalendarProps,\n \| 'labels'\n \| 'locale'\n \| 'weekStartsOn'\n \| 'slotMinutes'\n \| 'views'\n \| 'hiddenDays'\n \| 'scrollToHour'\n \| 'workingHours'\n \| 'showWeekNumbers'\n>;\n"],"mappings":"aAIA,IAAY,EAAL,SAAA,EAAA,OACL,GAAA,MAAA,QACA,EAAA,KAAA,OACA,EAAA,IAAA,MACA,EAAA,OAAA,UACF,EAAA,CAAA,CAAA"}

package/dist/esm/common/calendar/components/agendaList/agendaList.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use client";import{dateToDay as e}from"../../../utils/day.mjs";import{addDays as t,isSameDay as n,shownDays as r}from"../../dates.mjs";import{formatDayNumber as i,formatLongDate as a,formatTime as o,formatTimeRange as s,formatWeekday as c}from"../../format.mjs";import{eventEnd as l,eventsByDay as u,isAllDayLike as d}from"../../layout.mjs";import f from"./agendaList.module.mjs";import{useId as p,useLayoutEffect as m,useRef as h}from"react";import g from"classnames";import{Fragment as _,jsx as v,jsxs as y}from"react/jsx-runtime";function b({events:b,start:x,days:S,hidden:C,scrollTo:w,showDayHeaders:T,locale:E,text:D,onEventClick:O,renderEvent:k,className:A,classNames:j,slotStyles:M}){let N=p(),P=h(null),F=r(x,S,C),I=u(b,F),L=new Date,R=w?e(w):null;m(()=>{let e=P.current;if(!e||R===null)return;let t=[...e.querySelectorAll(`[data-cal-day]`)].find(e=>(e.dataset.calDay??``)>=R);e.scrollTop=t?t.offsetTop:0},[R]);let z=I.flatMap((e,t)=>e.length>0||!T?[{day:F[t],dayEvents:e}]:[]);return y(`div`,{ref:P,className:g(f.agendaList,A),children:[z.every(({dayEvents:e})=>e.length===0)&&v(`p`,{className:f.agendaListEmpty,children:D.noEvents}),z.map(({day:r,dayEvents:u})=>{if(u.length===0)return null;let p=`${N}-${e(r)}`,m=n(r,L),h=t(r,1);return y(`div`,{role:`group`,"aria-labelledby":T?p:void 0,className:g(f.agendaListDay,T&&f.agendaListDayWithHeader),"data-cal-day":e(r),children:[T&&y(`div`,{id:p,className:g(f.agendaListDayHeader,j?.dayHeader),style:M?.dayHeader,"aria-label":a(r,E),children:[v(`span`,{className:g(f.agendaListDayNumber,m&&f.agendaListDayNumberToday),"aria-hidden":!0,children:i(r,E)}),v(`span`,{className:f.agendaListDayName,"aria-hidden":!0,children:c(r,E,`short`)})]}),v(`ul`,{className:f.agendaListEvents,children:u.map(e=>{let t=l(e),n=e.start<r?r:e.start,i=t>h?h:t,a=d(e)||e.start<=r&&t>=h,c=a?D.allDay:s(e.start,t,E);return v(`li`,{children:y(`button`,{type:`button`,className:g(f.agendaListEvent,j?.event),style:{"--event-color":e.color,...M?.event},"aria-label":`${e.title}, ${c}`,"data-cal-event":String(e.id),onClick:t=>O?.(e,t.currentTarget),children:[v(`span`,{className:f.agendaListTime,"aria-hidden":!0,children:a?D.allDay:y(_,{children:[v(`span`,{children:o(n,E)}),v(`span`,{className:f.agendaListTimeEnd,children:o(i,E)})]})}),v(`span`,{className:f.agendaListAccent,"aria-hidden":!0}),v(`span`,{className:f.agendaListTitle,"aria-hidden":!0,children:k?k(e,{singleLine:!1}):e.title})]})},e.id)})})]},e(r))})]})}export{b as default};
+"use client";import{cssColor as e}from"../../../styles/tone.mjs";import{dateToDay as t}from"../../../utils/day.mjs";import{addDays as n,isSameDay as r,shownDays as i}from"../../dates.mjs";import{formatDayNumber as a,formatLongDate as o,formatTime as s,formatTimeRange as c,formatWeekday as l}from"../../format.mjs";import u from"../../../emptyState/emptyState.mjs";import{eventEnd as d,eventsByDay as f,isAllDayLike as p}from"../../layout.mjs";import m from"./agendaList.module.mjs";import{useId as h,useLayoutEffect as g,useRef as _}from"react";import v from"classnames";import{Fragment as y,jsx as b,jsxs as x}from"react/jsx-runtime";function S({events:S,start:C,days:w,hidden:T,scrollTo:E,showDayHeaders:D,locale:O,today:k,text:A,onEventClick:j,renderEvent:M,eventClassName:N,className:P,classNames:F,slotStyles:I}){let L=h(),R=_(null),z=i(C,w,T),B=f(S,z),V=E?t(E):null;g(()=>{let e=R.current;if(!e||V===null)return;let t=[...e.querySelectorAll(`[data-cal-day]`)].find(e=>(e.dataset.calDay??``)>=V);e.scrollTop=t?t.offsetTop:0},[V]);let H=B.flatMap((e,t)=>e.length>0||!D?[{day:z[t],dayEvents:e}]:[]);return x(`div`,{ref:R,className:v(m.agendaList,P),children:[H.every(({dayEvents:e})=>e.length===0)&&b(u,{className:m.agendaListEmpty,children:A.noEvents}),H.map(({day:i,dayEvents:u})=>{if(u.length===0)return null;let f=`${L}-${t(i)}`,h=r(i,k),g=n(i,1);return x(`div`,{role:`group`,"aria-labelledby":D?f:void 0,className:v(m.agendaListDay,D&&m.agendaListDayWithHeader),"data-cal-day":t(i),children:[D&&x(`div`,{id:f,className:v(m.agendaListDayHeader,F?.dayHeader),style:I?.dayHeader,"aria-label":o(i,O),children:[b(`span`,{className:v(m.agendaListDayNumber,h&&m.agendaListDayNumberToday),"aria-hidden":!0,children:a(i,O)}),b(`span`,{className:m.agendaListDayName,"aria-hidden":!0,children:l(i,O,`short`)})]}),b(`ul`,{className:m.agendaListEvents,children:u.map(t=>{let n=d(t),r=t.start<i?i:t.start,a=n>g?g:n,o=p(t)||t.start<=i&&n>=g,l=o?A.allDay:c(t.start,n,O);return b(`li`,{children:x(`button`,{type:`button`,className:v(m.agendaListEvent,F?.event,N?.(t)),style:{"--event-color":t.color&&e(t.color),...I?.event},"aria-label":`${t.title}, ${l}`,"data-cal-event":String(t.id),onClick:e=>j?.(t,e.currentTarget),children:[b(`span`,{className:m.agendaListTime,"aria-hidden":!0,children:o?A.allDay:x(y,{children:[b(`span`,{children:s(r,O)}),b(`span`,{className:m.agendaListTimeEnd,children:s(a,O)})]})}),b(`span`,{className:m.agendaListAccent,"aria-hidden":!0}),b(`span`,{className:m.agendaListTitle,"aria-hidden":!0,children:M?M(t,{singleLine:!1}):t.title})]})},t.id)})})]},t(i))})]})}export{S as default};
 //# sourceMappingURL=agendaList.mjs.map