@pega/cosmos-react-core 3.0.0-dev.2.1 → 3.0.0-dev.20.0

package/lib/components/DateTime/Picker/Weeks.js.map

@@ -1 +1 @@
-{"version":3,"file":"Weeks.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Picker/Weeks.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  FC,\n  useLayoutEffect,\n  KeyboardEvent,\n  useState,\n  forwardRef,\n  PropsWithoutRef,\n  Ref\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Flex from '../../Flex';\nimport { defaultThemeProp } from '../../../theme';\nimport Text from '../../Text';\nimport { getDateOfISOWeek, getWeek, parseToDate, toUTCDateString } from '../Input/utils';\nimport { useConsolidatedRef, useFocusWithin, useI18n } from '../../../hooks';\nimport { CALENDAR_TYPES } from '../Input/local';\nimport { ForwardProps } from '../../../types';\nimport { FormControlProps } from '../../FormControl';\n\nimport { StyledColumnLabel, StyledPick } from './Calendar.styles';\nimport { getWeeksOfMonth } from './utils';\n\nexport interface WeeksProps {\n  /**\n   * Sets DOM id for the control and associates label element via 'for' attribute.\n   * If an id is not pass, a random id will be generated for any render.\n   */\n  id?: FormControlProps['id'];\n  /**\n   * Defines default week that will be selected when the Date Picker is opened.\n   */\n  selected?: Date;\n  /**\n   * Defines default week that will be focused initially when the Date Picker is opened.\n   * @default new Date()\n   */\n  current?: Date;\n  /** Callback fired when user focuses new week. */\n  onFocus?: (date: Date) => void;\n  /** Callback fired when new week is selected. */\n  onSelect?: (date: Date) => void;\n  /** Sets the type of calendar to be used. This will be determined by locale if no value is provided. */\n  calendarType?: string;\n  /** Defines minimum available value that can be selected by the user. */\n  min?: string | number | Date;\n  /** Defines maximum available value that can be selected by the user. */\n  max?: string | number | Date;\n  /** Set the calendar to disabled state, ie. non-interactive. */\n  disabled?: boolean;\n  /** Should text be in long or short format (ie. only number). */\n  size?: 'short' | 'long';\n}\n\nexport const StyledWeekNumbers = styled.div`\n  margin-inline-end: ${props => props.theme.base.spacing};\n  color: rgba(0, 0, 0, 0.75);\n`;\n\nStyledWeekNumbers.defaultProps = defaultThemeProp;\n\nconst StyledWeekNumber = styled(StyledPick)(props => {\n  const {\n    theme: {\n      base: { 'border-radius': borderRadius }\n    }\n  } = props;\n\n  return css`\n    &:disabled {\n      &:nth-child(2) {\n        border-radius: calc(0.5 * ${borderRadius}) calc(0.5 * ${borderRadius}) 0 0;\n      }\n      &:last-child {\n        border-radius: 0 0 calc(0.5 * ${borderRadius}) calc(0.5 * ${borderRadius});\n      }\n    }\n  `;\n});\n\nStyledWeekNumber.defaultProps = defaultThemeProp;\n\nconst Weeks: FC<WeeksProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<WeeksProps>, ref: Ref<HTMLButtonElement>) => {\n    const {\n      selected,\n      current = selected ? new Date(selected.getTime()) : new Date(),\n      calendarType = CALENDAR_TYPES.ISO_8601,\n      onSelect,\n      onFocus,\n      disabled = false,\n      size = 'short'\n    } = props;\n\n    const [focusedWeek, setFocusedWeek] = useState(current);\n    useLayoutEffect(() => {\n      setFocusedWeek(current);\n    }, [current.getUTCFullYear(), current.getUTCMonth()]);\n\n    let newFocused: Date;\n    const onKeyDown = (ev: KeyboardEvent<HTMLElement>) => {\n      if (['ArrowUp', 'ArrowDown', 'Enter'].includes(ev.key)) ev.preventDefault();\n      switch (ev.key) {\n        case 'ArrowUp':\n          newFocused = new Date(focusedWeek);\n          newFocused.setUTCDate(focusedWeek.getUTCDate() - 7);\n          setFocusedWeek(newFocused);\n          onFocus?.(newFocused);\n          break;\n        case 'ArrowDown':\n          newFocused = new Date(focusedWeek);\n          newFocused.setUTCDate(focusedWeek.getUTCDate() + 7);\n          setFocusedWeek(newFocused);\n          onFocus?.(newFocused);\n          break;\n        case 'Enter':\n          onSelect?.(focusedWeek);\n          break;\n        default:\n      }\n    };\n\n    const containerRef = useConsolidatedRef(ref);\n    const hasFocus = useFocusWithin([containerRef]);\n\n    const min = props.min ? parseToDate(props.min) : -Infinity;\n    const max = props.max ? parseToDate(props.max) : Infinity;\n    const isDisabled = (day: Date) => {\n      return disabled || min > day.getTime() || day.getTime() > max;\n    };\n\n    const isChecked = (day: Date) => {\n      return (\n        selected &&\n        toUTCDateString(day) ===\n          toUTCDateString(getDateOfISOWeek(getWeek(selected, calendarType), selected.getFullYear()))\n      );\n    };\n\n    const isFocused = (day: Date) => {\n      return (\n        toUTCDateString(day) ===\n        toUTCDateString(\n          getDateOfISOWeek(getWeek(focusedWeek, calendarType), focusedWeek.getFullYear())\n        )\n      );\n    };\n\n    const t = useI18n();\n\n    const weekText = t('week_label_a11y');\n\n    const weeks = getWeeksOfMonth(current, calendarType).map(weekNo => {\n      const dateOfISOWeek = getDateOfISOWeek(weekNo, current.getUTCFullYear());\n      return (\n        <StyledWeekNumber\n          key={weekNo}\n          variant='simple'\n          icon={false}\n          type='button'\n          loading={false}\n          ref={\n            isFocused(dateOfISOWeek)\n              ? (focusedRef: HTMLButtonElement) => {\n                  if (hasFocus) focusedRef?.focus();\n                }\n              : undefined\n          }\n          tabIndex={isFocused(dateOfISOWeek) ? 0 : -1}\n          disabled={isDisabled(dateOfISOWeek)}\n          aria-selected={isChecked(dateOfISOWeek) || undefined}\n          aria-label={`${t('week_label_a11y')} ${weekNo.toString()} ${current\n            .getUTCFullYear()\n            .toString()}`}\n          onClick={() => {\n            onSelect?.(dateOfISOWeek);\n          }}\n        >\n          {size === 'long' && `${weekText} `}\n          {weekNo.toString()}\n        </StyledWeekNumber>\n      );\n    });\n\n    const label =\n      size === 'short' ? (\n        <Text as={StyledColumnLabel} forwardedAs='abbr' title={weekText}>\n          {t('week_text_short')}\n        </Text>\n      ) : (\n        <Text as={StyledColumnLabel}>{weekText}</Text>\n      );\n\n    return (\n      <Flex\n        as={StyledWeekNumbers}\n        container={{ direction: 'column' }}\n        ref={containerRef}\n        onKeyDown={onKeyDown}\n      >\n        {label}\n        {weeks}\n      </Flex>\n    );\n  }\n);\n\nexport default Weeks;\n"]}
+{"version":3,"file":"Weeks.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Picker/Weeks.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  FC,\n  useLayoutEffect,\n  KeyboardEvent,\n  useState,\n  forwardRef,\n  PropsWithoutRef,\n  Ref\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Flex from '../../Flex';\nimport { defaultThemeProp } from '../../../theme';\nimport Text from '../../Text';\nimport { getDateOfISOWeek, getWeek, parseToDate, toUTCDateString } from '../Input/utils';\nimport { useConsolidatedRef, useFocusWithin, useI18n } from '../../../hooks';\nimport { CALENDAR_TYPES } from '../Input/local';\nimport { ForwardProps } from '../../../types';\nimport { FormControlProps } from '../../FormControl';\n\nimport { StyledColumnLabel, StyledPick } from './Calendar.styles';\nimport { getWeeksOfMonth } from './utils';\n\nexport interface WeeksProps {\n  /**\n   * Sets DOM id for the control and associates label element via 'for' attribute.\n   * If an id is not pass, a random id will be generated for any render.\n   */\n  id?: FormControlProps['id'];\n  /**\n   * Defines default week that will be selected when the Date Picker is opened.\n   */\n  selected?: Date;\n  /**\n   * Defines default week that will be focused initially when the Date Picker is opened.\n   * @default new Date()\n   */\n  current?: Date;\n  /** Callback fired when user focuses new week. */\n  onFocus?: (date: Date) => void;\n  /** Callback fired when new week is selected. */\n  onSelect?: (date: Date) => void;\n  /** Sets the type of calendar to be used. This will be determined by locale if no value is provided. */\n  calendarType?: string;\n  /** Defines minimum available value that can be selected by the user. */\n  min?: string | number | Date;\n  /** Defines maximum available value that can be selected by the user. */\n  max?: string | number | Date;\n  /** Set the calendar to disabled state, ie. non-interactive. */\n  disabled?: boolean;\n  /** Should text be in long or short format (ie. only number). */\n  size?: 'short' | 'long';\n}\n\nexport const StyledWeekNumbers = styled.div`\n  margin-inline-end: ${props => props.theme.base.spacing};\n  color: rgba(0, 0, 0, 0.75);\n`;\n\nStyledWeekNumbers.defaultProps = defaultThemeProp;\n\nconst StyledWeekNumber = styled(StyledPick)(props => {\n  const {\n    theme: {\n      base: { 'border-radius': borderRadius }\n    }\n  } = props;\n\n  return css`\n    &:disabled {\n      &:nth-child(2) {\n        border-radius: calc(0.5 * ${borderRadius}) calc(0.5 * ${borderRadius}) 0 0;\n      }\n      &:last-child {\n        border-radius: 0 0 calc(0.5 * ${borderRadius}) calc(0.5 * ${borderRadius});\n      }\n    }\n  `;\n});\n\nStyledWeekNumber.defaultProps = defaultThemeProp;\n\nconst Weeks: FC<WeeksProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<WeeksProps>, ref: Ref<HTMLButtonElement>) => {\n    const {\n      selected,\n      current = selected ? new Date(selected.getTime()) : new Date(),\n      calendarType = CALENDAR_TYPES.ISO_8601,\n      onSelect,\n      onFocus,\n      disabled = false,\n      size = 'short'\n    } = props;\n\n    const [focusedWeek, setFocusedWeek] = useState(current);\n    useLayoutEffect(() => {\n      setFocusedWeek(current);\n    }, [current.getUTCFullYear(), current.getUTCMonth()]);\n\n    let newFocused: Date;\n    const onKeyDown = (ev: KeyboardEvent<HTMLElement>) => {\n      if (['ArrowUp', 'ArrowDown', 'Enter'].includes(ev.key)) ev.preventDefault();\n      switch (ev.key) {\n        case 'ArrowUp':\n          newFocused = new Date(focusedWeek);\n          newFocused.setUTCDate(focusedWeek.getUTCDate() - 7);\n          setFocusedWeek(newFocused);\n          onFocus?.(newFocused);\n          break;\n        case 'ArrowDown':\n          newFocused = new Date(focusedWeek);\n          newFocused.setUTCDate(focusedWeek.getUTCDate() + 7);\n          setFocusedWeek(newFocused);\n          onFocus?.(newFocused);\n          break;\n        case 'Enter':\n          onSelect?.(focusedWeek);\n          break;\n        default:\n      }\n    };\n\n    const containerRef = useConsolidatedRef(ref);\n    const hasFocus = useFocusWithin([containerRef]);\n\n    const min = props.min ? parseToDate(props.min) : -Infinity;\n    const max = props.max ? parseToDate(props.max) : Infinity;\n    const isDisabled = (day: Date) => {\n      return disabled || min > day.getTime() || day.getTime() > max;\n    };\n\n    const isChecked = (day: Date) => {\n      return (\n        selected &&\n        toUTCDateString(day) ===\n          toUTCDateString(getDateOfISOWeek(getWeek(selected, calendarType), selected.getFullYear()))\n      );\n    };\n\n    const isFocused = (day: Date) => {\n      return (\n        toUTCDateString(day) ===\n        toUTCDateString(\n          getDateOfISOWeek(getWeek(focusedWeek, calendarType), focusedWeek.getFullYear())\n        )\n      );\n    };\n\n    const t = useI18n();\n\n    const weekText = t('week_label_a11y');\n\n    const weeks = getWeeksOfMonth(current, calendarType).map(weekNo => {\n      const dateOfISOWeek = getDateOfISOWeek(weekNo, current.getUTCFullYear());\n      return (\n        <StyledWeekNumber\n          key={weekNo}\n          variant='simple'\n          icon={false}\n          type='button'\n          loading={false}\n          ref={\n            isFocused(dateOfISOWeek)\n              ? (focusedRef: HTMLButtonElement) => {\n                  if (hasFocus) focusedRef?.focus();\n                }\n              : undefined\n          }\n          tabIndex={isFocused(dateOfISOWeek) ? 0 : -1}\n          disabled={isDisabled(dateOfISOWeek)}\n          aria-selected={isChecked(dateOfISOWeek) || undefined}\n          aria-label={`${t('week_label_a11y')} ${weekNo.toString()} ${current\n            .getUTCFullYear()\n            .toString()}`}\n          onClick={() => {\n            onSelect?.(dateOfISOWeek);\n          }}\n        >\n          {size === 'long' && `${weekText} `}\n          {weekNo.toString()}\n        </StyledWeekNumber>\n      );\n    });\n\n    const label =\n      size === 'short' ? (\n        <Text as={StyledColumnLabel} forwardedAs='abbr' title={weekText}>\n          {t('week_text_short')}\n        </Text>\n      ) : (\n        <Text as={StyledColumnLabel}>{weekText}</Text>\n      );\n\n    return (\n      <Flex\n        as={StyledWeekNumbers}\n        container={{ direction: 'column' }}\n        ref={containerRef}\n        onKeyDown={onKeyDown}\n      >\n        {label}\n        {weeks}\n      </Flex>\n    );\n  }\n);\n\nexport default Weeks;\n"]}

package/lib/components/DateTime/Picker/utils.d.ts

@@ -1,4 +1,4 @@
-export declare const getLocalizedDays: (calendarType: string, localeTag?: string | undefined) => string[][];
+export declare const getLocalizedDays: (calendarType: string, localeTag?: string) => string[][];
 export declare const isValidDate: (date: Date) => boolean;
 export declare const getDaysOfMonth: (date: Date, calendarType: string) => Date[];
 export declare const getWeeksOfMonth: (date: Date, calendarType: string) => number[];

package/lib/components/DateTime/Picker/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/components/DateTime/Picker/utils.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,gBAAgB,iBAAkB,MAAM,+CAOpD,CAAC;AAEF,eAAO,MAAM,WAAW,SAAU,IAAI,YAErC,CAAC;AAEF,eAAO,MAAM,cAAc,SAAU,IAAI,gBAAgB,MAAM,KAAG,IAAI,EAQrE,CAAC;AAEF,eAAO,MAAM,eAAe,SAAU,IAAI,gBAAgB,MAAM,KAAG,MAAM,EAmBxE,CAAC;AAEF,eAAO,MAAM,YAAY,SAAU,IAAI,WAGtC,CAAC;AAEF,eAAO,MAAM,gBAAgB,SAAU,IAAI,WAG1C,CAAC;AAIF,wBAAiB,oBAAoB,CAAC,QAAQ,EAAE,MAAM,kCAMrD"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/components/DateTime/Picker/utils.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,gBAAgB,iBAAkB,MAAM,cAAc,MAAM,eAOxE,CAAC;AAEF,eAAO,MAAM,WAAW,SAAU,IAAI,YAErC,CAAC;AAEF,eAAO,MAAM,cAAc,SAAU,IAAI,gBAAgB,MAAM,KAAG,IAAI,EAQrE,CAAC;AAEF,eAAO,MAAM,eAAe,SAAU,IAAI,gBAAgB,MAAM,KAAG,MAAM,EAmBxE,CAAC;AAEF,eAAO,MAAM,YAAY,SAAU,IAAI,WAGtC,CAAC;AAEF,eAAO,MAAM,gBAAgB,SAAU,IAAI,WAG1C,CAAC;AAIF,wBAAiB,oBAAoB,CAAC,QAAQ,EAAE,MAAM,kCAMrD"}

package/lib/components/DateTime/index.d.ts

@@ -25,4 +25,7 @@ export { default as DateTimeDisplay } from './DateTimeDisplay';
 export type { DateTimeDisplayProps } from './DateTimeDisplay';
 export { default as DurationDisplay } from './DurationDisplay';
 export type { DurationDisplayProps } from './DurationDisplay';
+export { formatDateTime, formatDuration } from './utils';
+export { parseToDate } from './Input/utils';
+export { isValidDate } from './Picker/utils';
 //# sourceMappingURL=index.d.ts.map

package/lib/components/DateTime/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DateTime/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACzD,YAAY,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACzD,YAAY,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAC3D,YAAY,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAC1D,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACzD,YAAY,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACnE,YAAY,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,gCAAgC,CAAC;AAC1E,YAAY,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sCAAsC,CAAC;AAC1F,OAAO,EAAE,MAAM,EAAE,MAAM,sCAAsC,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACjE,YAAY,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAChE,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACnE,YAAY,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAC/D,YAAY,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAE9D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,YAAY,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,YAAY,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAE5E,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,YAAY,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,YAAY,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DateTime/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACzD,YAAY,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACzD,YAAY,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAC3D,YAAY,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAC1D,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACzD,YAAY,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACnE,YAAY,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,gCAAgC,CAAC;AAC1E,YAAY,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sCAAsC,CAAC;AAC1F,OAAO,EAAE,MAAM,EAAE,MAAM,sCAAsC,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACjE,YAAY,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAChE,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACnE,YAAY,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAC/D,YAAY,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAE9D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,YAAY,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,YAAY,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAE5E,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,YAAY,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,YAAY,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC9D,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC"}

package/lib/components/DateTime/index.js

@@ -12,4 +12,7 @@ export { default as TimePicker } from './Picker/TimePicker';
 export { default as DatePicker } from './Picker/DatePicker';
 export { default as DateTimeDisplay } from './DateTimeDisplay';
 export { default as DurationDisplay } from './DurationDisplay';
+export { formatDateTime, formatDuration } from './utils';
+export { parseToDate } from './Input/utils';
+export { isValidDate } from './Picker/utils';
 //# sourceMappingURL=index.js.map

package/lib/components/DateTime/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/DateTime/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAEzD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAEzD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAE3D,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAEzD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAEnE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,gCAAgC,CAAC;AAE1E,OAAO,EAAE,MAAM,EAAE,MAAM,sCAAsC,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAEjE,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAEnE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAG/D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAE5D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAG5D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAE/D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC","sourcesContent":["export { default as DateInput } from './Input/DateInput';\nexport type { DateInputProps } from './Input/DateInput';\nexport { default as WeekInput } from './Input/WeekInput';\nexport type { WeekInputProps } from './Input/WeekInput';\nexport { default as MonthInput } from './Input/MonthInput';\nexport type { MonthInputProps } from './Input/MonthInput';\nexport { default as TimeInput } from './Input/TimeInput';\nexport type { TimeInputProps } from './Input/TimeInput';\nexport { default as DateRangeInput } from './Input/DateRangeInput';\nexport type { DateRangeInputProps } from './Input/DateRangeInput';\nexport { default as DurationInput } from './Input/Duration/DurationInput';\nexport type { default as DurationInputProps } from './Input/Duration/DurationInput.types';\nexport { Format } from './Input/Duration/DurationInput.types';\nexport { default as DateTimeInput } from './Input/DateTimeInput';\nexport type { DateTimeInputProps } from './Input/DateTimeInput';\nexport { default as DayOfWeekInput } from './Input/DayOfWeekInput';\nexport type { DayOfWeekInputProps } from './Input/DayOfWeekInput';\nexport { default as QuarterInput } from './Input/QuarterInput';\nexport type { QuarterInputProps } from './Input/QuarterInput';\n\nexport { default as TimePicker } from './Picker/TimePicker';\nexport type { TimePickerProps } from './Picker/TimePicker';\nexport { default as DatePicker } from './Picker/DatePicker';\nexport type { default as DatePickerProps } from './Picker/DatePicker.types';\n\nexport { default as DateTimeDisplay } from './DateTimeDisplay';\nexport type { DateTimeDisplayProps } from './DateTimeDisplay';\nexport { default as DurationDisplay } from './DurationDisplay';\nexport type { DurationDisplayProps } from './DurationDisplay';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/DateTime/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAEzD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAEzD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAE3D,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAEzD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAEnE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,gCAAgC,CAAC;AAE1E,OAAO,EAAE,MAAM,EAAE,MAAM,sCAAsC,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAEjE,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAEnE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAG/D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAE5D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAG5D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAE/D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAE/D,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC","sourcesContent":["export { default as DateInput } from './Input/DateInput';\nexport type { DateInputProps } from './Input/DateInput';\nexport { default as WeekInput } from './Input/WeekInput';\nexport type { WeekInputProps } from './Input/WeekInput';\nexport { default as MonthInput } from './Input/MonthInput';\nexport type { MonthInputProps } from './Input/MonthInput';\nexport { default as TimeInput } from './Input/TimeInput';\nexport type { TimeInputProps } from './Input/TimeInput';\nexport { default as DateRangeInput } from './Input/DateRangeInput';\nexport type { DateRangeInputProps } from './Input/DateRangeInput';\nexport { default as DurationInput } from './Input/Duration/DurationInput';\nexport type { default as DurationInputProps } from './Input/Duration/DurationInput.types';\nexport { Format } from './Input/Duration/DurationInput.types';\nexport { default as DateTimeInput } from './Input/DateTimeInput';\nexport type { DateTimeInputProps } from './Input/DateTimeInput';\nexport { default as DayOfWeekInput } from './Input/DayOfWeekInput';\nexport type { DayOfWeekInputProps } from './Input/DayOfWeekInput';\nexport { default as QuarterInput } from './Input/QuarterInput';\nexport type { QuarterInputProps } from './Input/QuarterInput';\n\nexport { default as TimePicker } from './Picker/TimePicker';\nexport type { TimePickerProps } from './Picker/TimePicker';\nexport { default as DatePicker } from './Picker/DatePicker';\nexport type { default as DatePickerProps } from './Picker/DatePicker.types';\n\nexport { default as DateTimeDisplay } from './DateTimeDisplay';\nexport type { DateTimeDisplayProps } from './DateTimeDisplay';\nexport { default as DurationDisplay } from './DurationDisplay';\nexport type { DurationDisplayProps } from './DurationDisplay';\nexport { formatDateTime, formatDuration } from './utils';\nexport { parseToDate } from './Input/utils';\nexport { isValidDate } from './Picker/utils';\n"]}

package/lib/components/DateTime/utils.d.ts

@@ -0,0 +1,18 @@
+import { DateTimeFormat, DateTimeVariant } from '@pega/cosmos-react-core/lib/components/DateTime/DateTime.types';
+import { TranslationFunction, TranslationPack } from '../../i18n';
+import { ClockFormat } from './Input/utils';
+interface DateTimeFormatOptions {
+    t: TranslationFunction<TranslationPack>;
+    locale: string;
+    format: DateTimeFormat;
+    variant: DateTimeVariant;
+    clockFormat?: ClockFormat;
+}
+export declare function formatDateTime(value: Date, { t, locale, format, variant, clockFormat }: DateTimeFormatOptions): string;
+interface DurationFormatOptions {
+    t: TranslationFunction<TranslationPack>;
+    significantUnits: 4 | 3 | 2 | 1;
+}
+export declare function formatDuration(valueInMs: number, { t, significantUnits }: DurationFormatOptions): string;
+export {};
+//# sourceMappingURL=utils.d.ts.map

package/lib/components/DateTime/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/components/DateTime/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,cAAc,EACd,eAAe,EAChB,MAAM,gEAAgE,CAAC;AAExE,OAAO,EAAE,mBAAmB,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAElE,OAAO,EACL,WAAW,EAMZ,MAAM,eAAe,CAAC;AAsBvB,UAAU,qBAAqB;IAC7B,CAAC,EAAE,mBAAmB,CAAC,eAAe,CAAC,CAAC;IACxC,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,cAAc,CAAC;IACvB,OAAO,EAAE,eAAe,CAAC;IACzB,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B;AAED,wBAAgB,cAAc,CAC5B,KAAK,EAAE,IAAI,EACX,EAAE,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW,EAAE,EAAE,qBAAqB,UAoGnE;AAOD,UAAU,qBAAqB;IAC7B,CAAC,EAAE,mBAAmB,CAAC,eAAe,CAAC,CAAC;IACxC,gBAAgB,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;CACjC;AAED,wBAAgB,cAAc,CAAC,SAAS,EAAE,MAAM,EAAE,EAAE,CAAC,EAAE,gBAAgB,EAAE,EAAE,qBAAqB,UAuB/F"}

package/lib/components/DateTime/utils.js

@@ -0,0 +1,126 @@
+import { getEndOfWeek, getQuarter, getStartOfWeek, getWeek, getWeekYear } from './Input/utils';
+const unitsInMs = {
+    year: 24 * 60 * 60 * 1000 * 365,
+    month: (24 * 60 * 60 * 1000 * 365) / 12,
+    day: 24 * 60 * 60 * 1000,
+    hour: 60 * 60 * 1000,
+    minute: 60 * 1000,
+    second: 1000
+};
+export function formatDateTime(value, { t, locale, format, variant, clockFormat }) {
+    const timeShort = {
+        hour: 'numeric',
+        minute: 'numeric',
+        hour12: clockFormat ? clockFormat === 12 : undefined
+    };
+    const timeLong = {
+        ...timeShort,
+        second: 'numeric',
+        hour12: clockFormat ? clockFormat === 12 : undefined
+    };
+    const formatMapping = {
+        date: {
+            short: { year: 'numeric', month: 'short', day: 'numeric' },
+            long: { year: 'numeric', month: 'long', day: 'numeric' },
+            numeric: { year: 'numeric', month: 'numeric', day: 'numeric' }
+        },
+        datetime: {
+            short: { year: 'numeric', month: 'short', day: 'numeric', ...timeShort },
+            long: { year: 'numeric', month: 'long', day: 'numeric', ...timeLong },
+            numeric: { year: 'numeric', month: 'numeric', day: 'numeric', ...timeShort }
+        },
+        time: {
+            short: timeShort,
+            long: timeLong,
+            numeric: timeShort
+        },
+        month: {
+            short: { month: 'short' },
+            long: { month: 'long' },
+            numeric: { month: 'numeric' }
+        },
+        year: {
+            short: { year: 'numeric' },
+            long: { year: 'numeric' },
+            numeric: { year: '2-digit' }
+        },
+        monthyear: {
+            short: { year: 'numeric', month: 'short' },
+            long: { year: 'numeric', month: 'long' },
+            numeric: { year: 'numeric', month: 'numeric' }
+        },
+        week: {
+            short: { month: 'short', day: 'numeric' },
+            long: { month: 'long', day: 'numeric' },
+            numeric: { month: 'numeric', day: 'numeric' }
+        },
+        relative: {
+            short: { style: 'long', numeric: 'auto' },
+            long: { style: 'long', numeric: 'auto' },
+            numeric: { style: 'short', numeric: 'auto' }
+        }
+    };
+    const getFormattedDate = (date, dateVariant) => {
+        return new Intl.DateTimeFormat(locale, {
+            ...formatMapping[dateVariant][format],
+            timeZone: 'UTC'
+        }).format(date);
+    };
+    const relativeTimeFormatter = (relativeValue, unit) => {
+        return new Intl.RelativeTimeFormat(locale, formatMapping.relative[format]).format(relativeValue, unit);
+    };
+    const getRelativeTime = (date) => {
+        let elapsed = date.getTime() - Date.now();
+        // Deliberately reduce precision to 1 minute
+        if (Math.abs(elapsed) < 60000)
+            elapsed = 0;
+        const unit = (Object.keys(unitsInMs).find(u => Math.abs(elapsed) >= unitsInMs[u]) ||
+            'second');
+        return relativeTimeFormatter(Math.round(elapsed / unitsInMs[unit]), unit);
+    };
+    const getFormattedWeek = (date) => {
+        const startDate = getFormattedDate(getStartOfWeek(date), 'week');
+        const endDate = getFormattedDate(getEndOfWeek(date), 'week');
+        return `${t('week_text')} ${getWeek(date)}, ${getWeekYear(date)} (${startDate} - ${endDate})`;
+    };
+    const getFormattedQuarterYear = (date) => {
+        const formattedYear = getFormattedDate(date, 'year');
+        const quarterNumber = getQuarter(date);
+        return `${t(`date_quarter_q${quarterNumber}`, [formattedYear])}`;
+    };
+    switch (variant) {
+        case 'relative':
+            return getRelativeTime(value);
+        case 'week':
+            return getFormattedWeek(value);
+        case 'quarteryear':
+            return getFormattedQuarterYear(value);
+        default:
+            return getFormattedDate(value, variant);
+    }
+}
+const dayInMs = 24 * 60 * 60 * 1000;
+const hourInMs = 60 * 60 * 1000;
+const minuteInMs = 60 * 1000;
+const secondInMs = 1000;
+export function formatDuration(valueInMs, { t, significantUnits }) {
+    const sign = valueInMs < 0 ? '-' : '';
+    const absMs = Math.abs(valueInMs);
+    if (absMs < secondInMs) {
+        return `0${t('second_text_short')}`;
+    }
+    const durationParts = [
+        { unit: 'day', value: Math.floor(absMs / dayInMs) },
+        { unit: 'hour', value: Math.floor((absMs % dayInMs) / hourInMs) },
+        { unit: 'minute', value: Math.floor((absMs % hourInMs) / minuteInMs) },
+        { unit: 'second', value: Math.floor((absMs % minuteInMs) / secondInMs) }
+    ];
+    const result = [];
+    for (let i = 0; result.length < significantUnits && i < durationParts.length; i += 1) {
+        if (durationParts[i].value > 0) {
+            result.push(`${durationParts[i].value + t(`${durationParts[i].unit}_text_short`)}`);
+        }
+    }
+    return `${sign}${result.join(' ')}`;
+}
+//# sourceMappingURL=utils.js.map

package/lib/components/DateTime/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/components/DateTime/utils.ts"],"names":[],"mappings":"AAQA,OAAO,EAEL,YAAY,EACZ,UAAU,EACV,cAAc,EACd,OAAO,EACP,WAAW,EACZ,MAAM,eAAe,CAAC;AAEvB,MAAM,SAAS,GAAG;IAChB,IAAI,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,IAAI,GAAG,GAAG;IAC/B,KAAK,EAAE,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,IAAI,GAAG,GAAG,CAAC,GAAG,EAAE;IACvC,GAAG,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,IAAI;IACxB,IAAI,EAAE,EAAE,GAAG,EAAE,GAAG,IAAI;IACpB,MAAM,EAAE,EAAE,GAAG,IAAI;IACjB,MAAM,EAAE,IAAI;CACJ,CAAC;AAqBX,MAAM,UAAU,cAAc,CAC5B,KAAW,EACX,EAAE,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW,EAAyB;IAElE,MAAM,SAAS,GAAc;QAC3B,IAAI,EAAE,SAAS;QACf,MAAM,EAAE,SAAS;QACjB,MAAM,EAAE,WAAW,CAAC,CAAC,CAAC,WAAW,KAAK,EAAE,CAAC,CAAC,CAAC,SAAS;KACrD,CAAC;IACF,MAAM,QAAQ,GAAa;QACzB,GAAG,SAAS;QACZ,MAAM,EAAE,SAAS;QACjB,MAAM,EAAE,WAAW,CAAC,CAAC,CAAC,WAAW,KAAK,EAAE,CAAC,CAAC,CAAC,SAAS;KACrD,CAAC;IACF,MAAM,aAAa,GAAG;QACpB,IAAI,EAAE;YACJ,KAAK,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,EAAE,SAAS,EAAW;YACnE,IAAI,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,SAAS,EAAW;YACjE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,SAAS,EAAW;SACxE;QACD,QAAQ,EAAE;YACR,KAAK,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,EAAE,SAAS,EAAE,GAAG,SAAS,EAAW;YACjF,IAAI,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,SAAS,EAAE,GAAG,QAAQ,EAAW;YAC9E,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,SAAS,EAAE,GAAG,SAAS,EAAW;SACtF;QACD,IAAI,EAAE;YACJ,KAAK,EAAE,SAAS;YAChB,IAAI,EAAE,QAAQ;YACd,OAAO,EAAE,SAAS;SACnB;QACD,KAAK,EAAE;YACL,KAAK,EAAE,EAAE,KAAK,EAAE,OAAO,EAAW;YAClC,IAAI,EAAE,EAAE,KAAK,EAAE,MAAM,EAAW;YAChC,OAAO,EAAE,EAAE,KAAK,EAAE,SAAS,EAAW;SACvC;QACD,IAAI,EAAE;YACJ,KAAK,EAAE,EAAE,IAAI,EAAE,SAAS,EAAW;YACnC,IAAI,EAAE,EAAE,IAAI,EAAE,SAAS,EAAW;YAClC,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAW;SACtC;QACD,SAAS,EAAE;YACT,KAAK,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,EAAW;YACnD,IAAI,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAW;YACjD,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAW;SACxD;QACD,IAAI,EAAE;YACJ,KAAK,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,EAAE,SAAS,EAAW;YAClD,IAAI,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,SAAS,EAAW;YAChD,OAAO,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,SAAS,EAAW;SACvD;QACD,QAAQ,EAAE;YACR,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAW;YAClD,IAAI,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAW;YACjD,OAAO,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAW;SACtD;KACF,CAAC;IAEF,MAAM,gBAAgB,GAAG,CAAC,IAAU,EAAE,WAAoD,EAAE,EAAE;QAC5F,OAAO,IAAI,IAAI,CAAC,cAAc,CAAC,MAAM,EAAE;YACrC,GAAG,aAAa,CAAC,WAAW,CAAC,CAAC,MAAM,CAAC;YACrC,QAAQ,EAAE,KAAK;SAChB,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAClB,CAAC,CAAC;IAEF,MAAM,qBAAqB,GAAG,CAAC,aAAqB,EAAE,IAAc,EAAE,EAAE;QACtE,OAAO,IAAI,IAAI,CAAC,kBAAkB,CAAC,MAAM,EAAE,aAAa,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAC/E,aAAa,EACb,IAAI,CACL,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,eAAe,GAAG,CAAC,IAAU,EAAE,EAAE;QACrC,IAAI,OAAO,GAAG,IAAI,CAAC,OAAO,EAAE,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC;QAC1C,4CAA4C;QAC5C,IAAI,IAAI,CAAC,GAAG,CAAC,OAAO,CAAC,GAAG,KAAK;YAAE,OAAO,GAAG,CAAC,CAAC;QAC3C,MAAM,IAAI,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,SAAS,CAAC,CAAa,CAAC,CAAC;YAC3F,QAAQ,CAAa,CAAC;QACxB,OAAO,qBAAqB,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,SAAS,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC;IAC5E,CAAC,CAAC;IAEF,MAAM,gBAAgB,GAAG,CAAC,IAAU,EAAE,EAAE;QACtC,MAAM,SAAS,GAAG,gBAAgB,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,MAAM,CAAC,CAAC;QACjE,MAAM,OAAO,GAAG,gBAAgB,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,MAAM,CAAC,CAAC;QAC7D,OAAO,GAAG,CAAC,CAAC,WAAW,CAAC,IAAI,OAAO,CAAC,IAAI,CAAC,KAAK,WAAW,CAAC,IAAI,CAAC,KAAK,SAAS,MAAM,OAAO,GAAG,CAAC;IAChG,CAAC,CAAC;IAEF,MAAM,uBAAuB,GAAG,CAAC,IAAU,EAAE,EAAE;QAC7C,MAAM,aAAa,GAAG,gBAAgB,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC;QACrD,MAAM,aAAa,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC;QACvC,OAAO,GAAG,CAAC,CAAC,iBAAiB,aAAa,EAAE,EAAE,CAAC,aAAa,CAAC,CAAC,EAAE,CAAC;IACnE,CAAC,CAAC;IAEF,QAAQ,OAAO,EAAE;QACf,KAAK,UAAU;YACb,OAAO,eAAe,CAAC,KAAK,CAAC,CAAC;QAChC,KAAK,MAAM;YACT,OAAO,gBAAgB,CAAC,KAAK,CAAC,CAAC;QACjC,KAAK,aAAa;YAChB,OAAO,uBAAuB,CAAC,KAAK,CAAC,CAAC;QACxC;YACE,OAAO,gBAAgB,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;KAC3C;AACH,CAAC;AAED,MAAM,OAAO,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC;AACpC,MAAM,QAAQ,GAAG,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC;AAChC,MAAM,UAAU,GAAG,EAAE,GAAG,IAAI,CAAC;AAC7B,MAAM,UAAU,GAAG,IAAI,CAAC;AAOxB,MAAM,UAAU,cAAc,CAAC,SAAiB,EAAE,EAAE,CAAC,EAAE,gBAAgB,EAAyB;IAC9F,MAAM,IAAI,GAAG,SAAS,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC;IACtC,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;IAClC,IAAI,KAAK,GAAG,UAAU,EAAE;QACtB,OAAO,IAAI,CAAC,CAAC,mBAAmB,CAAC,EAAE,CAAC;KACrC;IACD,MAAM,aAAa,GAAG;QACpB,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,OAAO,CAAC,EAAE;QACnD,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,KAAK,GAAG,OAAO,CAAC,GAAG,QAAQ,CAAC,EAAE;QACjE,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,KAAK,GAAG,QAAQ,CAAC,GAAG,UAAU,CAAC,EAAE;QACtE,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,KAAK,GAAG,UAAU,CAAC,GAAG,UAAU,CAAC,EAAE;KACzE,CAAC;IACF,MAAM,MAAM,GAAG,EAAE,CAAC;IAClB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,MAAM,CAAC,MAAM,GAAG,gBAAgB,IAAI,CAAC,GAAG,aAAa,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC,EAAE;QACpF,IAAI,aAAa,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,EAAE;YAC9B,MAAM,CAAC,IAAI,CACT,GACE,aAAa,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,GAAG,aAAa,CAAC,CAAC,CAAC,CAAC,IAAI,aAAsC,CAC3F,EAAE,CACH,CAAC;SACH;KACF;IACD,OAAO,GAAG,IAAI,GAAG,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC;AACtC,CAAC","sourcesContent":["import {\n  AbsoluteVariant,\n  DateTimeFormat,\n  DateTimeVariant\n} from '@pega/cosmos-react-core/lib/components/DateTime/DateTime.types';\n\nimport { TranslationFunction, TranslationPack } from '../../i18n';\n\nimport {\n  ClockFormat,\n  getEndOfWeek,\n  getQuarter,\n  getStartOfWeek,\n  getWeek,\n  getWeekYear\n} from './Input/utils';\n\nconst unitsInMs = {\n  year: 24 * 60 * 60 * 1000 * 365,\n  month: (24 * 60 * 60 * 1000 * 365) / 12,\n  day: 24 * 60 * 60 * 1000,\n  hour: 60 * 60 * 1000,\n  minute: 60 * 1000,\n  second: 1000\n} as const;\n\ntype TimeUnit = keyof typeof unitsInMs;\n\ninterface TimeShort {\n  hour: 'numeric';\n  minute: 'numeric';\n  hour12: boolean | undefined;\n}\ninterface TimeLong extends TimeShort {\n  second: 'numeric';\n}\n\ninterface DateTimeFormatOptions {\n  t: TranslationFunction<TranslationPack>;\n  locale: string;\n  format: DateTimeFormat;\n  variant: DateTimeVariant;\n  clockFormat?: ClockFormat;\n}\n\nexport function formatDateTime(\n  value: Date,\n  { t, locale, format, variant, clockFormat }: DateTimeFormatOptions\n) {\n  const timeShort: TimeShort = {\n    hour: 'numeric',\n    minute: 'numeric',\n    hour12: clockFormat ? clockFormat === 12 : undefined\n  };\n  const timeLong: TimeLong = {\n    ...timeShort,\n    second: 'numeric',\n    hour12: clockFormat ? clockFormat === 12 : undefined\n  };\n  const formatMapping = {\n    date: {\n      short: { year: 'numeric', month: 'short', day: 'numeric' } as const,\n      long: { year: 'numeric', month: 'long', day: 'numeric' } as const,\n      numeric: { year: 'numeric', month: 'numeric', day: 'numeric' } as const\n    },\n    datetime: {\n      short: { year: 'numeric', month: 'short', day: 'numeric', ...timeShort } as const,\n      long: { year: 'numeric', month: 'long', day: 'numeric', ...timeLong } as const,\n      numeric: { year: 'numeric', month: 'numeric', day: 'numeric', ...timeShort } as const\n    },\n    time: {\n      short: timeShort,\n      long: timeLong,\n      numeric: timeShort\n    },\n    month: {\n      short: { month: 'short' } as const,\n      long: { month: 'long' } as const,\n      numeric: { month: 'numeric' } as const\n    },\n    year: {\n      short: { year: 'numeric' } as const,\n      long: { year: 'numeric' } as const,\n      numeric: { year: '2-digit' } as const\n    },\n    monthyear: {\n      short: { year: 'numeric', month: 'short' } as const,\n      long: { year: 'numeric', month: 'long' } as const,\n      numeric: { year: 'numeric', month: 'numeric' } as const\n    },\n    week: {\n      short: { month: 'short', day: 'numeric' } as const,\n      long: { month: 'long', day: 'numeric' } as const,\n      numeric: { month: 'numeric', day: 'numeric' } as const\n    },\n    relative: {\n      short: { style: 'long', numeric: 'auto' } as const,\n      long: { style: 'long', numeric: 'auto' } as const,\n      numeric: { style: 'short', numeric: 'auto' } as const\n    }\n  };\n\n  const getFormattedDate = (date: Date, dateVariant: Exclude<AbsoluteVariant, 'quarteryear'>) => {\n    return new Intl.DateTimeFormat(locale, {\n      ...formatMapping[dateVariant][format],\n      timeZone: 'UTC'\n    }).format(date);\n  };\n\n  const relativeTimeFormatter = (relativeValue: number, unit: TimeUnit) => {\n    return new Intl.RelativeTimeFormat(locale, formatMapping.relative[format]).format(\n      relativeValue,\n      unit\n    );\n  };\n\n  const getRelativeTime = (date: Date) => {\n    let elapsed = date.getTime() - Date.now();\n    // Deliberately reduce precision to 1 minute\n    if (Math.abs(elapsed) < 60000) elapsed = 0;\n    const unit = (Object.keys(unitsInMs).find(u => Math.abs(elapsed) >= unitsInMs[u as TimeUnit]) ||\n      'second') as TimeUnit;\n    return relativeTimeFormatter(Math.round(elapsed / unitsInMs[unit]), unit);\n  };\n\n  const getFormattedWeek = (date: Date) => {\n    const startDate = getFormattedDate(getStartOfWeek(date), 'week');\n    const endDate = getFormattedDate(getEndOfWeek(date), 'week');\n    return `${t('week_text')} ${getWeek(date)}, ${getWeekYear(date)} (${startDate} - ${endDate})`;\n  };\n\n  const getFormattedQuarterYear = (date: Date) => {\n    const formattedYear = getFormattedDate(date, 'year');\n    const quarterNumber = getQuarter(date);\n    return `${t(`date_quarter_q${quarterNumber}`, [formattedYear])}`;\n  };\n\n  switch (variant) {\n    case 'relative':\n      return getRelativeTime(value);\n    case 'week':\n      return getFormattedWeek(value);\n    case 'quarteryear':\n      return getFormattedQuarterYear(value);\n    default:\n      return getFormattedDate(value, variant);\n  }\n}\n\nconst dayInMs = 24 * 60 * 60 * 1000;\nconst hourInMs = 60 * 60 * 1000;\nconst minuteInMs = 60 * 1000;\nconst secondInMs = 1000;\n\ninterface DurationFormatOptions {\n  t: TranslationFunction<TranslationPack>;\n  significantUnits: 4 | 3 | 2 | 1;\n}\n\nexport function formatDuration(valueInMs: number, { t, significantUnits }: DurationFormatOptions) {\n  const sign = valueInMs < 0 ? '-' : '';\n  const absMs = Math.abs(valueInMs);\n  if (absMs < secondInMs) {\n    return `0${t('second_text_short')}`;\n  }\n  const durationParts = [\n    { unit: 'day', value: Math.floor(absMs / dayInMs) },\n    { unit: 'hour', value: Math.floor((absMs % dayInMs) / hourInMs) },\n    { unit: 'minute', value: Math.floor((absMs % hourInMs) / minuteInMs) },\n    { unit: 'second', value: Math.floor((absMs % minuteInMs) / secondInMs) }\n  ];\n  const result = [];\n  for (let i = 0; result.length < significantUnits && i < durationParts.length; i += 1) {\n    if (durationParts[i].value > 0) {\n      result.push(\n        `${\n          durationParts[i].value + t(`${durationParts[i].unit}_text_short` as keyof TranslationPack)\n        }`\n      );\n    }\n  }\n  return `${sign}${result.join(' ')}`;\n}\n"]}

package/lib/components/Dialog/Dialog.d.ts

@@ -0,0 +1,31 @@
+import { FunctionComponent, Ref, MouseEvent as ReactMouseEvent, KeyboardEvent as ReactKeyboardEvent } from 'react';
+import { BaseProps, ForwardProps } from '../../types';
+import { PopoverProps } from '../Popover';
+export interface DialogProps extends BaseProps {
+    target: HTMLElement | null;
+    placement?: PopoverProps['placement'];
+    children: PopoverProps['children'];
+    heading: string;
+    headingHidden?: boolean;
+    onSubmit?: (arg: {
+        close: () => void;
+    }) => void;
+    onClose?: () => void;
+    onOpen?: () => void;
+    loading?: boolean;
+    ref?: Ref<HTMLDivElement>;
+}
+export declare const StyledDialogTitle: import("styled-components").StyledComponent<FunctionComponent<import("../Text").TextProps & ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
+export declare const useDialog: () => {
+    target: HTMLElement | null;
+    loading: boolean;
+    setLoading: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+    events: {
+        onMouseDown: (e: ReactMouseEvent) => void;
+        onKeyDown: (e: ReactKeyboardEvent) => void;
+    };
+    setTargetWithEvent: (e: ReactMouseEvent | ReactKeyboardEvent) => void;
+};
+declare const Dialog: FunctionComponent<DialogProps & ForwardProps>;
+export default Dialog;
+//# sourceMappingURL=Dialog.d.ts.map

package/lib/components/Dialog/Dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAEjB,GAAG,EAKH,UAAU,IAAI,eAAe,EAC7B,aAAa,IAAI,kBAAkB,EACpC,MAAM,OAAO,CAAC;AAcf,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAKtD,OAAgB,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAKnD,MAAM,WAAW,WAAY,SAAQ,SAAS;IAC5C,MAAM,EAAE,WAAW,GAAG,IAAI,CAAC;IAC3B,SAAS,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,CAAC;IACtC,QAAQ,EAAE,YAAY,CAAC,UAAU,CAAC,CAAC;IACnC,OAAO,EAAE,MAAM,CAAC;IAChB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE;QAAE,KAAK,EAAE,MAAM,IAAI,CAAA;KAAE,KAAK,IAAI,CAAC;IAChD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAkBD,eAAO,MAAM,iBAAiB,iKAsB7B,CAAC;AAIF,eAAO,MAAM,SAAS;;;;;yBAeC,eAAe;uBAGjB,kBAAkB;;4BAdN,eAAe,GAAG,kBAAkB;CAsBpE,CAAC;AAEF,QAAA,MAAM,MAAM,EAAE,iBAAiB,CAAC,WAAW,GAAG,YAAY,CA8JzD,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/lib/components/Dialog/Dialog.js

@@ -0,0 +1,149 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useEffect, useLayoutEffect, useRef, useState } from 'react';
+import styled, { css } from 'styled-components';
+import { useConsolidatedRef, useElement, useEscape, useFocusTrap, useI18n, useOuterEvent, usePrevious, useUID } from '../../hooks';
+import { defaultThemeProp } from '../../theme';
+import { getFocusables } from '../../utils';
+import Button from '../Button';
+import { CardContent, CardFooter, CardHeader } from '../Card';
+import Icon from '../Icon';
+import Popover from '../Popover';
+import Progress from '../Progress';
+import Text from '../Text';
+import VisuallyHiddenText from '../VisuallyHiddenText';
+const StyledDialog = styled.dialog(({ theme: { base: { 'content-width': contentWidth } } }) => {
+    return css `
+      border: none;
+      min-width: ${contentWidth.sm};
+      max-width: ${contentWidth.lg};
+    `;
+});
+StyledDialog.defaultProps = defaultThemeProp;
+export const StyledDialogTitle = styled(Text)(({ theme: { base: { shadow, 'border-radius': borderRadius } } }) => {
+    return css `
+      position: relative;
+      ::after {
+        content: '';
+        border-radius: ${borderRadius};
+        position: absolute;
+        inset: -0.25rem;
+      }
+      :focus-visible {
+        outline: none;
+        ::after {
+          box-shadow: ${shadow.focus}, inset ${shadow['focus-solid']};
+        }
+      }
+    `;
+});
+StyledDialogTitle.defaultProps = defaultThemeProp;
+export const useDialog = () => {
+    const [target, setTarget] = useState(null);
+    const [loading, setLoading] = useState(false);
+    const setTargetWithEvent = (e) => {
+        if (e.target instanceof HTMLElement) {
+            setTarget(e.target);
+        }
+    };
+    return {
+        target,
+        loading,
+        setLoading,
+        events: {
+            onMouseDown: (e) => {
+                setTargetWithEvent(e);
+            },
+            onKeyDown: (e) => {
+                if (e.key === 'Enter') {
+                    setTargetWithEvent(e);
+                }
+            }
+        },
+        setTargetWithEvent
+    };
+};
+const Dialog = forwardRef(({ target, placement, heading, headingHidden = false, onSubmit, onClose, onOpen, loading, children }, ref) => {
+    const t = useI18n();
+    const headingId = useUID();
+    const [popoverEl, setPopoverEl] = useElement();
+    const popoverRef = useConsolidatedRef(ref, setPopoverEl);
+    const headingRef = useRef(null);
+    const [currentTarget, setCurrentTarget] = useState(() => target);
+    const [show, setShow] = useState(false);
+    const skipChangeShow = useRef(false);
+    const prevTarget = usePrevious(target);
+    useEscape(() => {
+        if (show) {
+            setShow(false);
+        }
+    }, undefined, [show, setShow]);
+    useOuterEvent('mousedown', [target, popoverEl], () => {
+        if (target && popoverEl && show) {
+            setShow(false);
+            onClose?.();
+        }
+    });
+    useFocusTrap(popoverRef);
+    useEffect(() => {
+        if (!show) {
+            currentTarget?.focus();
+        }
+    }, [show]);
+    useEffect(() => {
+        if (show && popoverEl) {
+            if (headingRef.current) {
+                headingRef.current.focus();
+            }
+            else {
+                const focusables = getFocusables(popoverRef);
+                focusables[0]?.focus();
+            }
+        }
+    }, [show, popoverEl]);
+    useLayoutEffect(() => {
+        const onTargetClick = (e) => {
+            setCurrentTarget(prev => (e.target ? e.target : prev));
+            if (!skipChangeShow.current) {
+                setShow(prev => !prev);
+            }
+            else {
+                skipChangeShow.current = false;
+            }
+        };
+        if (target instanceof HTMLElement) {
+            target.addEventListener('click', onTargetClick);
+        }
+        return () => {
+            if (target instanceof HTMLElement) {
+                target.removeEventListener('click', onTargetClick);
+            }
+        };
+    }, [target]);
+    useEffect(() => {
+        if (show) {
+            onOpen?.();
+        }
+        else {
+            onClose?.();
+        }
+    }, [show]);
+    useEffect(() => {
+        /* If our target is changing and the popover is already open we will want
+        to skip the next change. The next show change would come from a click on the new button,
+        the popover should stay open. */
+        if (target !== prevTarget && show) {
+            skipChangeShow.current = true;
+        }
+    }, [target, show]);
+    const onTitleKeyDown = (e) => {
+        const focusables = getFocusables(popoverRef);
+        if (e.shiftKey && e.key === 'Tab') {
+            e.preventDefault();
+            focusables[focusables.length - 1].focus();
+        }
+    };
+    const progress = loading ? _jsx(Progress, { placement: 'local' }) : null;
+    return (_jsxs(Popover, { as: StyledDialog, ref: popoverRef, target: currentTarget, placement: placement, show: show, open: show, "aria-labelledby": headingId, children: [_jsx(CardHeader, { actions: !onSubmit ? (_jsx(Button, { icon: true, variant: 'simple', onClick: () => setShow(false), "aria-label": t('close'), children: _jsx(Icon, { name: 'times' }) })) : undefined, children: headingHidden ? (_jsx(VisuallyHiddenText, { id: headingId, children: heading })) : (_jsx(StyledDialogTitle, { variant: 'h2', tabIndex: -1, ref: headingRef, onKeyDown: onTitleKeyDown, id: headingId, children: heading })) }), _jsxs(CardContent, { children: [children, progress] }), onSubmit && (_jsxs(CardFooter, { justify: 'between', children: [_jsx(Button, { variant: 'secondary', onClick: () => setShow(false), children: t('cancel') }), _jsx(Button, { variant: 'primary', onClick: () => onSubmit({ close: () => setShow(false) }), disabled: loading, children: t('submit') })] }))] }));
+});
+export default Dialog;
+//# sourceMappingURL=Dialog.js.map

package/lib/components/Dialog/Dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,UAAU,EAIV,SAAS,EACT,eAAe,EACf,MAAM,EACN,QAAQ,EAGT,MAAM,OAAO,CAAC;AACf,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,kBAAkB,EAClB,UAAU,EACV,SAAS,EACT,YAAY,EACZ,OAAO,EACP,aAAa,EACb,WAAW,EACX,MAAM,EACP,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAC9D,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,OAAyB,MAAM,YAAY,CAAC;AACnD,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,kBAAkB,MAAM,uBAAuB,CAAC;AAevD,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,CAChC,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,eAAe,EAAE,YAAY,EAAE,EACxC,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;;mBAEK,YAAY,CAAC,EAAE;mBACf,YAAY,CAAC,EAAE;KAC7B,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,YAAY,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE7C,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,IAAI,CAAC,CAC3C,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,MAAM,EAAE,eAAe,EAAE,YAAY,EAAE,EAChD,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;;;;yBAIW,YAAY;;;;;;;wBAOb,MAAM,CAAC,KAAK,WAAW,MAAM,CAAC,aAAa,CAAC;;;KAG/D,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,EAAE;IAC5B,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAqB,IAAI,CAAC,CAAC;IAC/D,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE9C,MAAM,kBAAkB,GAAG,CAAC,CAAuC,EAAE,EAAE;QACrE,IAAI,CAAC,CAAC,MAAM,YAAY,WAAW,EAAE;YACnC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;SACrB;IACH,CAAC,CAAC;IAEF,OAAO;QACL,MAAM;QACN,OAAO;QACP,UAAU;QACV,MAAM,EAAE;YACN,WAAW,EAAE,CAAC,CAAkB,EAAE,EAAE;gBAClC,kBAAkB,CAAC,CAAC,CAAC,CAAC;YACxB,CAAC;YACD,SAAS,EAAE,CAAC,CAAqB,EAAE,EAAE;gBACnC,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE;oBACrB,kBAAkB,CAAC,CAAC,CAAC,CAAC;iBACvB;YACH,CAAC;SACF;QACD,kBAAkB;KACnB,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,MAAM,GAAkD,UAAU,CACtE,CACE,EACE,MAAM,EACN,SAAS,EACT,OAAO,EACP,aAAa,GAAG,KAAK,EACrB,QAAQ,EACR,OAAO,EACP,MAAM,EACN,OAAO,EACP,QAAQ,EACqB,EAC/B,GAAuB,EACvB,EAAE;IACF,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,SAAS,GAAG,MAAM,EAAE,CAAC;IAC3B,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,UAAU,EAAkB,CAAC;IAC/D,MAAM,UAAU,GAAG,kBAAkB,CAAC,GAAG,EAAE,YAAY,CAAC,CAAC;IACzD,MAAM,UAAU,GAAG,MAAM,CAAkB,IAAI,CAAC,CAAC;IACjD,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,CAAC;IACjE,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACxC,MAAM,cAAc,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IACrC,MAAM,UAAU,GAAG,WAAW,CAAC,MAAM,CAAC,CAAC;IACvC,SAAS,CACP,GAAG,EAAE;QACH,IAAI,IAAI,EAAE;YACR,OAAO,CAAC,KAAK,CAAC,CAAC;SAChB;IACH,CAAC,EACD,SAAS,EACT,CAAC,IAAI,EAAE,OAAO,CAAC,CAChB,CAAC;IACF,aAAa,CAAC,WAAW,EAAE,CAAC,MAAM,EAAE,SAAS,CAAC,EAAE,GAAG,EAAE;QACnD,IAAI,MAAM,IAAI,SAAS,IAAI,IAAI,EAAE;YAC/B,OAAO,CAAC,KAAK,CAAC,CAAC;YACf,OAAO,EAAE,EAAE,CAAC;SACb;IACH,CAAC,CAAC,CAAC;IACH,YAAY,CAAC,UAAU,CAAC,CAAC;IAEzB,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,IAAI,EAAE;YACT,aAAa,EAAE,KAAK,EAAE,CAAC;SACxB;IACH,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,IAAI,IAAI,SAAS,EAAE;YACrB,IAAI,UAAU,CAAC,OAAO,EAAE;gBACtB,UAAU,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;aAC5B;iBAAM;gBACL,MAAM,UAAU,GAAG,aAAa,CAAC,UAAU,CAAC,CAAC;gBAC7C,UAAU,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC;aACxB;SACF;IACH,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC;IAEtB,eAAe,CAAC,GAAG,EAAE;QACnB,MAAM,aAAa,GAAG,CAAC,CAAa,EAAE,EAAE;YACtC,gBAAgB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAE,CAAC,CAAC,MAAsB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;YACxE,IAAI,CAAC,cAAc,CAAC,OAAO,EAAE;gBAC3B,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC;aACxB;iBAAM;gBACL,cAAc,CAAC,OAAO,GAAG,KAAK,CAAC;aAChC;QACH,CAAC,CAAC;QACF,IAAI,MAAM,YAAY,WAAW,EAAE;YACjC,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE,aAAa,CAAC,CAAC;SACjD;QACD,OAAO,GAAG,EAAE;YACV,IAAI,MAAM,YAAY,WAAW,EAAE;gBACjC,MAAM,CAAC,mBAAmB,CAAC,OAAO,EAAE,aAAa,CAAC,CAAC;aACpD;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAEb,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,IAAI,EAAE;YACR,MAAM,EAAE,EAAE,CAAC;SACZ;aAAM;YACL,OAAO,EAAE,EAAE,CAAC;SACb;IACH,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,SAAS,CAAC,GAAG,EAAE;QACb;;wCAEgC;QAChC,IAAI,MAAM,KAAK,UAAU,IAAI,IAAI,EAAE;YACjC,cAAc,CAAC,OAAO,GAAG,IAAI,CAAC;SAC/B;IACH,CAAC,EAAE,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC,CAAC;IAEnB,MAAM,cAAc,GAAG,CAAC,CAAqB,EAAE,EAAE;QAC/C,MAAM,UAAU,GAAG,aAAa,CAAC,UAAU,CAAC,CAAC;QAC7C,IAAI,CAAC,CAAC,QAAQ,IAAI,CAAC,CAAC,GAAG,KAAK,KAAK,EAAE;YACjC,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,UAAU,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC;SAC3C;IACH,CAAC,CAAC;IAEF,MAAM,QAAQ,GAAG,OAAO,CAAC,CAAC,CAAC,KAAC,QAAQ,IAAC,SAAS,EAAC,OAAO,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC;IAEjE,OAAO,CACL,MAAC,OAAO,IACN,EAAE,EAAE,YAAY,EAChB,GAAG,EAAE,UAAU,EACf,MAAM,EAAE,aAAa,EACrB,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,qBACO,SAAS,aAE1B,KAAC,UAAU,IACT,OAAO,EACL,CAAC,QAAQ,CAAC,CAAC,CAAC,CACV,KAAC,MAAM,IAAC,IAAI,QAAC,OAAO,EAAC,QAAQ,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,gBAAc,CAAC,CAAC,OAAO,CAAC,YACjF,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,GACd,CACV,CAAC,CAAC,CAAC,SAAS,YAGd,aAAa,CAAC,CAAC,CAAC,CACf,KAAC,kBAAkB,IAAC,EAAE,EAAE,SAAS,YAAG,OAAO,GAAsB,CAClE,CAAC,CAAC,CAAC,CACF,KAAC,iBAAiB,IAChB,OAAO,EAAC,IAAI,EACZ,QAAQ,EAAE,CAAC,CAAC,EACZ,GAAG,EAAE,UAAU,EACf,SAAS,EAAE,cAAc,EACzB,EAAE,EAAE,SAAS,YAEZ,OAAO,GACU,CACrB,GACU,EACb,MAAC,WAAW,eACT,QAAQ,EACR,QAAQ,IACG,EACb,QAAQ,IAAI,CACX,MAAC,UAAU,IAAC,OAAO,EAAC,SAAS,aAC3B,KAAC,MAAM,IAAC,OAAO,EAAC,WAAW,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,YACtD,CAAC,CAAC,QAAQ,CAAC,GACL,EACT,KAAC,MAAM,IACL,OAAO,EAAC,SAAS,EACjB,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC,EACxD,QAAQ,EAAE,OAAO,YAEhB,CAAC,CAAC,QAAQ,CAAC,GACL,IACE,CACd,IACO,CACX,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,MAAM,CAAC","sourcesContent":["import {\n  forwardRef,\n  FunctionComponent,\n  PropsWithoutRef,\n  Ref,\n  useEffect,\n  useLayoutEffect,\n  useRef,\n  useState,\n  MouseEvent as ReactMouseEvent,\n  KeyboardEvent as ReactKeyboardEvent\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n  useConsolidatedRef,\n  useElement,\n  useEscape,\n  useFocusTrap,\n  useI18n,\n  useOuterEvent,\n  usePrevious,\n  useUID\n} from '../../hooks';\nimport { defaultThemeProp } from '../../theme';\nimport { BaseProps, ForwardProps } from '../../types';\nimport { getFocusables } from '../../utils';\nimport Button from '../Button';\nimport { CardContent, CardFooter, CardHeader } from '../Card';\nimport Icon from '../Icon';\nimport Popover, { PopoverProps } from '../Popover';\nimport Progress from '../Progress';\nimport Text from '../Text';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\n\nexport interface DialogProps extends BaseProps {\n  target: HTMLElement | null;\n  placement?: PopoverProps['placement'];\n  children: PopoverProps['children'];\n  heading: string;\n  headingHidden?: boolean;\n  onSubmit?: (arg: { close: () => void }) => void;\n  onClose?: () => void;\n  onOpen?: () => void;\n  loading?: boolean;\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst StyledDialog = styled.dialog(\n  ({\n    theme: {\n      base: { 'content-width': contentWidth }\n    }\n  }) => {\n    return css`\n      border: none;\n      min-width: ${contentWidth.sm};\n      max-width: ${contentWidth.lg};\n    `;\n  }\n);\n\nStyledDialog.defaultProps = defaultThemeProp;\n\nexport const StyledDialogTitle = styled(Text)(\n  ({\n    theme: {\n      base: { shadow, 'border-radius': borderRadius }\n    }\n  }) => {\n    return css`\n      position: relative;\n      ::after {\n        content: '';\n        border-radius: ${borderRadius};\n        position: absolute;\n        inset: -0.25rem;\n      }\n      :focus-visible {\n        outline: none;\n        ::after {\n          box-shadow: ${shadow.focus}, inset ${shadow['focus-solid']};\n        }\n      }\n    `;\n  }\n);\n\nStyledDialogTitle.defaultProps = defaultThemeProp;\n\nexport const useDialog = () => {\n  const [target, setTarget] = useState<HTMLElement | null>(null);\n  const [loading, setLoading] = useState(false);\n\n  const setTargetWithEvent = (e: ReactMouseEvent | ReactKeyboardEvent) => {\n    if (e.target instanceof HTMLElement) {\n      setTarget(e.target);\n    }\n  };\n\n  return {\n    target,\n    loading,\n    setLoading,\n    events: {\n      onMouseDown: (e: ReactMouseEvent) => {\n        setTargetWithEvent(e);\n      },\n      onKeyDown: (e: ReactKeyboardEvent) => {\n        if (e.key === 'Enter') {\n          setTargetWithEvent(e);\n        }\n      }\n    },\n    setTargetWithEvent\n  };\n};\n\nconst Dialog: FunctionComponent<DialogProps & ForwardProps> = forwardRef(\n  (\n    {\n      target,\n      placement,\n      heading,\n      headingHidden = false,\n      onSubmit,\n      onClose,\n      onOpen,\n      loading,\n      children\n    }: PropsWithoutRef<DialogProps>,\n    ref: DialogProps['ref']\n  ) => {\n    const t = useI18n();\n    const headingId = useUID();\n    const [popoverEl, setPopoverEl] = useElement<HTMLDivElement>();\n    const popoverRef = useConsolidatedRef(ref, setPopoverEl);\n    const headingRef = useRef<HTMLSpanElement>(null);\n    const [currentTarget, setCurrentTarget] = useState(() => target);\n    const [show, setShow] = useState(false);\n    const skipChangeShow = useRef(false);\n    const prevTarget = usePrevious(target);\n    useEscape(\n      () => {\n        if (show) {\n          setShow(false);\n        }\n      },\n      undefined,\n      [show, setShow]\n    );\n    useOuterEvent('mousedown', [target, popoverEl], () => {\n      if (target && popoverEl && show) {\n        setShow(false);\n        onClose?.();\n      }\n    });\n    useFocusTrap(popoverRef);\n\n    useEffect(() => {\n      if (!show) {\n        currentTarget?.focus();\n      }\n    }, [show]);\n\n    useEffect(() => {\n      if (show && popoverEl) {\n        if (headingRef.current) {\n          headingRef.current.focus();\n        } else {\n          const focusables = getFocusables(popoverRef);\n          focusables[0]?.focus();\n        }\n      }\n    }, [show, popoverEl]);\n\n    useLayoutEffect(() => {\n      const onTargetClick = (e: MouseEvent) => {\n        setCurrentTarget(prev => (e.target ? (e.target as HTMLElement) : prev));\n        if (!skipChangeShow.current) {\n          setShow(prev => !prev);\n        } else {\n          skipChangeShow.current = false;\n        }\n      };\n      if (target instanceof HTMLElement) {\n        target.addEventListener('click', onTargetClick);\n      }\n      return () => {\n        if (target instanceof HTMLElement) {\n          target.removeEventListener('click', onTargetClick);\n        }\n      };\n    }, [target]);\n\n    useEffect(() => {\n      if (show) {\n        onOpen?.();\n      } else {\n        onClose?.();\n      }\n    }, [show]);\n\n    useEffect(() => {\n      /* If our target is changing and the popover is already open we will want\n      to skip the next change. The next show change would come from a click on the new button,\n      the popover should stay open. */\n      if (target !== prevTarget && show) {\n        skipChangeShow.current = true;\n      }\n    }, [target, show]);\n\n    const onTitleKeyDown = (e: ReactKeyboardEvent) => {\n      const focusables = getFocusables(popoverRef);\n      if (e.shiftKey && e.key === 'Tab') {\n        e.preventDefault();\n        focusables[focusables.length - 1].focus();\n      }\n    };\n\n    const progress = loading ? <Progress placement='local' /> : null;\n\n    return (\n      <Popover\n        as={StyledDialog}\n        ref={popoverRef}\n        target={currentTarget}\n        placement={placement}\n        show={show}\n        open={show}\n        aria-labelledby={headingId}\n      >\n        <CardHeader\n          actions={\n            !onSubmit ? (\n              <Button icon variant='simple' onClick={() => setShow(false)} aria-label={t('close')}>\n                <Icon name='times' />\n              </Button>\n            ) : undefined\n          }\n        >\n          {headingHidden ? (\n            <VisuallyHiddenText id={headingId}>{heading}</VisuallyHiddenText>\n          ) : (\n            <StyledDialogTitle\n              variant='h2'\n              tabIndex={-1}\n              ref={headingRef}\n              onKeyDown={onTitleKeyDown}\n              id={headingId}\n            >\n              {heading}\n            </StyledDialogTitle>\n          )}\n        </CardHeader>\n        <CardContent>\n          {children}\n          {progress}\n        </CardContent>\n        {onSubmit && (\n          <CardFooter justify='between'>\n            <Button variant='secondary' onClick={() => setShow(false)}>\n              {t('cancel')}\n            </Button>\n            <Button\n              variant='primary'\n              onClick={() => onSubmit({ close: () => setShow(false) })}\n              disabled={loading}\n            >\n              {t('submit')}\n            </Button>\n          </CardFooter>\n        )}\n      </Popover>\n    );\n  }\n);\n\nexport default Dialog;\n"]}

package/lib/components/Dialog/index.d.ts

@@ -0,0 +1,3 @@
+export { default } from './Dialog';
+export { DialogProps, useDialog } from './Dialog';
+//# sourceMappingURL=index.d.ts.map

package/lib/components/Dialog/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AACnC,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC"}

package/lib/components/Dialog/index.js

@@ -0,0 +1,3 @@
+export { default } from './Dialog';
+export { useDialog } from './Dialog';
+//# sourceMappingURL=index.js.map

package/lib/components/Dialog/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Dialog/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AACnC,OAAO,EAAe,SAAS,EAAE,MAAM,UAAU,CAAC","sourcesContent":["export { default } from './Dialog';\nexport { DialogProps, useDialog } from './Dialog';\n"]}

package/lib/components/Drawer/Drawer.js

@@ -70,7 +70,7 @@ const Drawer = forwardRef((props, ref) => {
             return;
         setState(open ? 'open' : 'closed');
     }, [open]);
-    return state === 'closed' && !open && nullWhenClosed ? null : (_jsx(StyledDrawer, { ref: drawerRef, position: position, shadow: shadow && open, transitionSpeed: transitionSpeed, placement: placement, size: size, open: open, state: state, onTransitionEnd: onTransitionEnd, ...restProps, children: children }, void 0));
+    return state === 'closed' && !open && nullWhenClosed ? null : (_jsx(StyledDrawer, { ref: drawerRef, position: position, shadow: shadow && open, transitionSpeed: transitionSpeed, placement: placement, size: size, open: open, state: state, onTransitionEnd: onTransitionEnd, ...restProps, children: children }));
 });
 export default Drawer;
 //# sourceMappingURL=Drawer.js.map

package/lib/components/Drawer/Drawer.js.map

@@ -1 +1 @@
-{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../../src/components/Drawer/Drawer.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  useEffect,\n  Ref,\n  useCallback,\n  FunctionComponent,\n  forwardRef,\n  ReactNode,\n  TransitionEvent,\n  useState\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useOuterEvent, useConsolidatedRef, usePrevious } from '../../hooks';\nimport { AsProp, BaseProps, ForwardProps } from '../../types';\nimport { reflow } from '../../utils';\nimport { defaultThemeProp } from '../../theme';\n\nexport interface DrawerProps extends AsProp, BaseProps {\n  /**\n   * If true, the Drawer will be visible.\n   * @default false\n   */\n  open: boolean;\n  /** Content of the Drawer. */\n  children?: ReactNode;\n  /**\n   * Determines whether a drop shadow should be visible along the edge of the Drawer for contrast purposes.\n   * @default false\n   */\n  shadow?: boolean;\n  /**\n   * Used to determine which side of the viewport the Drawer should open from.\n   * @default \"right\"\n   */\n  placement?: 'top' | 'right' | 'bottom' | 'left';\n  /**\n   * The position of the Drawer.\n   * @default \"absolute\"\n   */\n  position?: 'absolute' | 'fixed';\n  /**\n   * Determines the speed of the transition. This value comes from `theme.base.animation.speed`.\n   * @default \"0.25s\"\n   */\n  transitionSpeed?: string;\n  /**\n   * The width or height that the Drawer will open to, depending on its placement.\n   * @default \"100%\"\n   */\n  size?: string;\n  /**  Callback fired after Drawer opens.  */\n  onAfterOpen?: () => void;\n  /**  Callback fired after Drawer closes.  */\n  onAfterClose?: () => void;\n  /**  Callback fired before Drawer opens.  */\n  onBeforeOpen?: () => void;\n  /** Callback fired before Drawer closes.  */\n  onBeforeClose?: () => void;\n  /** Callback fired when a click action occurs outside of the Drawer.  */\n  onOuterClick?: () => void;\n  /**\n   * If true, removes the component from the real DOM when closed. For full virtual DOM unmount(if necessary), perform at a parent level.\n   * @default false\n   */\n  nullWhenClosed?: boolean;\n}\n\ntype State = 'open' | 'closed' | 'opening' | 'closing';\n\nexport const StyledDrawer = styled.div<Partial<DrawerProps & { state: State }>>(props => {\n  const { state, shadow, position, placement, transitionSpeed, size, theme } = props;\n  let dimension = 'horizontal';\n  let axis = 'X';\n  let anchor = 'top';\n\n  if (placement === 'top' || placement === 'bottom') {\n    dimension = 'vertical';\n    axis = 'Y';\n    anchor = 'left';\n  }\n\n  const translate = state === 'open' || state === 'opening' ? 0 : '100%';\n  const speed = transitionSpeed || theme.base.animation.speed;\n\n  return css`\n    z-index: ${theme.base['z-index'].drawer};\n    position: ${position};\n    ${placement}: 0;\n    ${anchor}: 0;\n    height: ${dimension === 'vertical' ? size : '100%'};\n    width: ${dimension === 'horizontal' ? size : '100%'};\n    transition-property: transform, box-shadow, opacity;\n    transition-duration: max(${speed}, 0.0001s);\n    transition-timing-function: ${theme.base.animation.timing.ease};\n    transform: ${state === 'open'\n      ? 'none'\n      : `translate${axis}(${placement === 'top' || placement === 'left' ? '-' : ''}${translate})`};\n\n    ${shadow &&\n    css`\n      box-shadow: ${theme.base.shadow.high};\n    `}\n  `;\n});\n\nStyledDrawer.defaultProps = defaultThemeProp;\n\nconst Drawer: FunctionComponent<DrawerProps & ForwardProps> = forwardRef(\n  (props: DrawerProps, ref: Ref<HTMLElement>) => {\n    const {\n      open = false,\n      shadow = false,\n      position = 'absolute',\n      children,\n      placement = 'right',\n      transitionSpeed,\n      size = '100%',\n      onAfterOpen,\n      onAfterClose,\n      onBeforeOpen,\n      onBeforeClose,\n      onOuterClick,\n      nullWhenClosed = false,\n      ...restProps\n    } = props;\n\n    const drawerRef = useConsolidatedRef(ref);\n\n    const [state, setState] = useState<State>(open ? 'open' : 'closed');\n\n    let prevState = usePrevious(state);\n    if (!prevState) prevState = state;\n\n    useOuterEvent(\n      'mousedown',\n      [drawerRef.current],\n      useCallback(() => {\n        if (open) onOuterClick?.();\n      }, [open, onOuterClick])\n    );\n\n    useEffect(() => {\n      if (open && (state === 'closed' || state === 'closing')) {\n        onBeforeOpen?.();\n        reflow(drawerRef.current);\n        setState('opening');\n      } else if (!open && (state === 'open' || state === 'opening')) {\n        onBeforeClose?.();\n        setState('closing');\n      } else if (open && state === 'open' && prevState !== 'open') {\n        onAfterOpen?.();\n      } else if (!open && state === 'closed' && prevState !== 'closed') {\n        onAfterClose?.();\n      }\n    }, [open, state, prevState, onBeforeOpen, onBeforeClose, onAfterOpen, onAfterClose]);\n\n    const onTransitionEnd = useCallback(\n      (e: TransitionEvent): void => {\n        if (e.target !== drawerRef.current || e.propertyName !== 'transform') return;\n        setState(open ? 'open' : 'closed');\n      },\n      [open]\n    );\n\n    return state === 'closed' && !open && nullWhenClosed ? null : (\n      <StyledDrawer\n        ref={drawerRef}\n        position={position}\n        shadow={shadow && open}\n        transitionSpeed={transitionSpeed}\n        placement={placement}\n        size={size}\n        open={open}\n        state={state}\n        onTransitionEnd={onTransitionEnd}\n        {...restProps}\n      >\n        {children}\n      </StyledDrawer>\n    );\n  }\n);\n\nexport default Drawer;\n"]}
+{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../../src/components/Drawer/Drawer.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  useEffect,\n  Ref,\n  useCallback,\n  FunctionComponent,\n  forwardRef,\n  ReactNode,\n  TransitionEvent,\n  useState\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useOuterEvent, useConsolidatedRef, usePrevious } from '../../hooks';\nimport { AsProp, BaseProps, ForwardProps } from '../../types';\nimport { reflow } from '../../utils';\nimport { defaultThemeProp } from '../../theme';\n\nexport interface DrawerProps extends AsProp, BaseProps {\n  /**\n   * If true, the Drawer will be visible.\n   * @default false\n   */\n  open: boolean;\n  /** Content of the Drawer. */\n  children?: ReactNode;\n  /**\n   * Determines whether a drop shadow should be visible along the edge of the Drawer for contrast purposes.\n   * @default false\n   */\n  shadow?: boolean;\n  /**\n   * Used to determine which side of the viewport the Drawer should open from.\n   * @default \"right\"\n   */\n  placement?: 'top' | 'right' | 'bottom' | 'left';\n  /**\n   * The position of the Drawer.\n   * @default \"absolute\"\n   */\n  position?: 'absolute' | 'fixed';\n  /**\n   * Determines the speed of the transition. This value comes from `theme.base.animation.speed`.\n   * @default \"0.25s\"\n   */\n  transitionSpeed?: string;\n  /**\n   * The width or height that the Drawer will open to, depending on its placement.\n   * @default \"100%\"\n   */\n  size?: string;\n  /**  Callback fired after Drawer opens.  */\n  onAfterOpen?: () => void;\n  /**  Callback fired after Drawer closes.  */\n  onAfterClose?: () => void;\n  /**  Callback fired before Drawer opens.  */\n  onBeforeOpen?: () => void;\n  /** Callback fired before Drawer closes.  */\n  onBeforeClose?: () => void;\n  /** Callback fired when a click action occurs outside of the Drawer.  */\n  onOuterClick?: () => void;\n  /**\n   * If true, removes the component from the real DOM when closed. For full virtual DOM unmount(if necessary), perform at a parent level.\n   * @default false\n   */\n  nullWhenClosed?: boolean;\n}\n\ntype State = 'open' | 'closed' | 'opening' | 'closing';\n\nexport const StyledDrawer = styled.div<Partial<DrawerProps & { state: State }>>(props => {\n  const { state, shadow, position, placement, transitionSpeed, size, theme } = props;\n  let dimension = 'horizontal';\n  let axis = 'X';\n  let anchor = 'top';\n\n  if (placement === 'top' || placement === 'bottom') {\n    dimension = 'vertical';\n    axis = 'Y';\n    anchor = 'left';\n  }\n\n  const translate = state === 'open' || state === 'opening' ? 0 : '100%';\n  const speed = transitionSpeed || theme.base.animation.speed;\n\n  return css`\n    z-index: ${theme.base['z-index'].drawer};\n    position: ${position};\n    ${placement}: 0;\n    ${anchor}: 0;\n    height: ${dimension === 'vertical' ? size : '100%'};\n    width: ${dimension === 'horizontal' ? size : '100%'};\n    transition-property: transform, box-shadow, opacity;\n    transition-duration: max(${speed}, 0.0001s);\n    transition-timing-function: ${theme.base.animation.timing.ease};\n    transform: ${state === 'open'\n      ? 'none'\n      : `translate${axis}(${placement === 'top' || placement === 'left' ? '-' : ''}${translate})`};\n\n    ${shadow &&\n    css`\n      box-shadow: ${theme.base.shadow.high};\n    `}\n  `;\n});\n\nStyledDrawer.defaultProps = defaultThemeProp;\n\nconst Drawer: FunctionComponent<DrawerProps & ForwardProps> = forwardRef(\n  (props: DrawerProps, ref: Ref<HTMLElement>) => {\n    const {\n      open = false,\n      shadow = false,\n      position = 'absolute',\n      children,\n      placement = 'right',\n      transitionSpeed,\n      size = '100%',\n      onAfterOpen,\n      onAfterClose,\n      onBeforeOpen,\n      onBeforeClose,\n      onOuterClick,\n      nullWhenClosed = false,\n      ...restProps\n    } = props;\n\n    const drawerRef = useConsolidatedRef(ref);\n\n    const [state, setState] = useState<State>(open ? 'open' : 'closed');\n\n    let prevState = usePrevious(state);\n    if (!prevState) prevState = state;\n\n    useOuterEvent(\n      'mousedown',\n      [drawerRef.current],\n      useCallback(() => {\n        if (open) onOuterClick?.();\n      }, [open, onOuterClick])\n    );\n\n    useEffect(() => {\n      if (open && (state === 'closed' || state === 'closing')) {\n        onBeforeOpen?.();\n        reflow(drawerRef.current);\n        setState('opening');\n      } else if (!open && (state === 'open' || state === 'opening')) {\n        onBeforeClose?.();\n        setState('closing');\n      } else if (open && state === 'open' && prevState !== 'open') {\n        onAfterOpen?.();\n      } else if (!open && state === 'closed' && prevState !== 'closed') {\n        onAfterClose?.();\n      }\n    }, [open, state, prevState, onBeforeOpen, onBeforeClose, onAfterOpen, onAfterClose]);\n\n    const onTransitionEnd = useCallback(\n      (e: TransitionEvent): void => {\n        if (e.target !== drawerRef.current || e.propertyName !== 'transform') return;\n        setState(open ? 'open' : 'closed');\n      },\n      [open]\n    );\n\n    return state === 'closed' && !open && nullWhenClosed ? null : (\n      <StyledDrawer\n        ref={drawerRef}\n        position={position}\n        shadow={shadow && open}\n        transitionSpeed={transitionSpeed}\n        placement={placement}\n        size={size}\n        open={open}\n        state={state}\n        onTransitionEnd={onTransitionEnd}\n        {...restProps}\n      >\n        {children}\n      </StyledDrawer>\n    );\n  }\n);\n\nexport default Drawer;\n"]}

package/lib/components/Email/EmailDisplay.js

@@ -2,8 +2,8 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from 'react';
 import Link from '../Link';
 const EmailDisplay = forwardRef(({ value, displayText, variant = 'link', ...restProps }, ref) => {
-    const displayValue = value ? (displayText || value) : (_jsx("span", { "aria-hidden": 'true', children: "\u2013\u2013" }, void 0));
-    return variant === 'text' || !value ? (_jsx("span", { ref: ref, ...restProps, children: displayValue }, void 0)) : (_jsx(Link, { ref: ref, ...restProps, href: `mailto:${value}`, children: displayValue }, void 0));
+    const displayValue = value ? (displayText || value) : (_jsx("span", { "aria-hidden": 'true', children: "\u2013\u2013" }));
+    return variant === 'text' || !value ? (_jsx("span", { ref: ref, ...restProps, children: displayValue })) : (_jsx(Link, { ref: ref, ...restProps, href: `mailto:${value}`, children: displayValue }));
 });
 export default EmailDisplay;
 //# sourceMappingURL=EmailDisplay.js.map

package/lib/components/Email/EmailDisplay.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmailDisplay.js","sourceRoot":"","sources":["../../../src/components/Email/EmailDisplay.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAA2C,MAAM,OAAO,CAAC;AAG5E,OAAO,IAAI,MAAM,SAAS,CAAC;AAgB3B,MAAM,YAAY,GAAwD,UAAU,CAClF,CACE,EAAE,KAAK,EAAE,WAAW,EAAE,OAAO,GAAG,MAAM,EAAE,GAAG,SAAS,EAAsC,EAC1F,GAA6B,EAC7B,EAAE;IACF,MAAM,YAAY,GAAG,KAAK,CAAC,CAAC,CAAC,CAC3B,WAAW,IAAI,KAAK,CACrB,CAAC,CAAC,CAAC,CACF,8BAAkB,MAAM,qCAAsB,CAC/C,CAAC;IACF,OAAO,OAAO,KAAK,MAAM,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CACpC,eAAM,GAAG,EAAE,GAAG,KAAM,SAAS,YAC1B,YAAY,WACR,CACR,CAAC,CAAC,CAAC,CACF,KAAC,IAAI,IAAC,GAAG,EAAE,GAA6B,KAAM,SAAS,EAAE,IAAI,EAAE,UAAU,KAAK,EAAE,YAC7E,YAAY,WACR,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, Ref } from 'react';\n\nimport { BaseProps, ForwardProps, NoChildrenProp } from '../../types';\nimport Link from '../Link';\n\nexport interface EmailDisplayProps extends BaseProps, NoChildrenProp {\n  /** Email address, no 'mailto:' scheme */\n  value?: string;\n  /** The text to be displayed. */\n  displayText?: string;\n  /**\n   * Controls styling of the field.\n   * @default \"link\"\n   */\n  variant?: 'link' | 'text';\n  /** Ref for the wrapping element. */\n  ref?: Ref<HTMLAnchorElement | HTMLSpanElement>;\n}\n\nconst EmailDisplay: FunctionComponent<EmailDisplayProps & ForwardProps> = forwardRef(\n  (\n    { value, displayText, variant = 'link', ...restProps }: PropsWithoutRef<EmailDisplayProps>,\n    ref: EmailDisplayProps['ref']\n  ) => {\n    const displayValue = value ? (\n      displayText || value\n    ) : (\n      <span aria-hidden='true'>&ndash;&ndash;</span>\n    );\n    return variant === 'text' || !value ? (\n      <span ref={ref} {...restProps}>\n        {displayValue}\n      </span>\n    ) : (\n      <Link ref={ref as Ref<HTMLAnchorElement>} {...restProps} href={`mailto:${value}`}>\n        {displayValue}\n      </Link>\n    );\n  }\n);\n\nexport default EmailDisplay;\n"]}
+{"version":3,"file":"EmailDisplay.js","sourceRoot":"","sources":["../../../src/components/Email/EmailDisplay.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAA2C,MAAM,OAAO,CAAC;AAG5E,OAAO,IAAI,MAAM,SAAS,CAAC;AAgB3B,MAAM,YAAY,GAAwD,UAAU,CAClF,CACE,EAAE,KAAK,EAAE,WAAW,EAAE,OAAO,GAAG,MAAM,EAAE,GAAG,SAAS,EAAsC,EAC1F,GAA6B,EAC7B,EAAE;IACF,MAAM,YAAY,GAAG,KAAK,CAAC,CAAC,CAAC,CAC3B,WAAW,IAAI,KAAK,CACrB,CAAC,CAAC,CAAC,CACF,8BAAkB,MAAM,6BAAsB,CAC/C,CAAC;IACF,OAAO,OAAO,KAAK,MAAM,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CACpC,eAAM,GAAG,EAAE,GAAG,KAAM,SAAS,YAC1B,YAAY,GACR,CACR,CAAC,CAAC,CAAC,CACF,KAAC,IAAI,IAAC,GAAG,EAAE,GAA6B,KAAM,SAAS,EAAE,IAAI,EAAE,UAAU,KAAK,EAAE,YAC7E,YAAY,GACR,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, Ref } from 'react';\n\nimport { BaseProps, ForwardProps, NoChildrenProp } from '../../types';\nimport Link from '../Link';\n\nexport interface EmailDisplayProps extends BaseProps, NoChildrenProp {\n  /** Email address, no 'mailto:' scheme */\n  value?: string;\n  /** The text to be displayed. */\n  displayText?: string;\n  /**\n   * Controls styling of the field.\n   * @default \"link\"\n   */\n  variant?: 'link' | 'text';\n  /** Ref for the wrapping element. */\n  ref?: Ref<HTMLAnchorElement | HTMLSpanElement>;\n}\n\nconst EmailDisplay: FunctionComponent<EmailDisplayProps & ForwardProps> = forwardRef(\n  (\n    { value, displayText, variant = 'link', ...restProps }: PropsWithoutRef<EmailDisplayProps>,\n    ref: EmailDisplayProps['ref']\n  ) => {\n    const displayValue = value ? (\n      displayText || value\n    ) : (\n      <span aria-hidden='true'>&ndash;&ndash;</span>\n    );\n    return variant === 'text' || !value ? (\n      <span ref={ref} {...restProps}>\n        {displayValue}\n      </span>\n    ) : (\n      <Link ref={ref as Ref<HTMLAnchorElement>} {...restProps} href={`mailto:${value}`}>\n        {displayValue}\n      </Link>\n    );\n  }\n);\n\nexport default EmailDisplay;\n"]}