@ahrowe/ui 0.32.0 → 0.34.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.
- package/dist/esm/common/actionIcon/actionIcon.module.mjs.map +1 -1
- package/dist/esm/common/breadcrumb/breadcrumb.mjs +1 -1
- package/dist/esm/common/breadcrumb/breadcrumb.mjs.map +1 -1
- package/dist/esm/common/breadcrumb/breadcrumb.module.mjs +1 -1
- package/dist/esm/common/breadcrumb/breadcrumb.module.mjs.map +1 -1
- package/dist/esm/common/card/Card.mjs +1 -1
- package/dist/esm/common/card/Card.mjs.map +1 -1
- package/dist/esm/common/card/card.types.mjs.map +1 -1
- package/dist/esm/common/chip/chip.mjs +1 -1
- package/dist/esm/common/chip/chip.mjs.map +1 -1
- package/dist/esm/common/chip/chip.types.mjs.map +1 -1
- package/dist/esm/common/colorPicker/colorPicker.mjs +1 -1
- package/dist/esm/common/colorPicker/colorPicker.mjs.map +1 -1
- package/dist/esm/common/colorPicker/colorPicker.module.mjs.map +1 -1
- package/dist/esm/common/configProvider/configProvider.mjs.map +1 -1
- package/dist/esm/common/configProvider/presentation.types.mjs +2 -0
- package/dist/esm/common/configProvider/presentation.types.mjs.map +1 -0
- package/dist/esm/common/configProvider/usePresentationDefault.mjs.map +1 -1
- package/dist/esm/common/confirmModal/confirmModal.mjs +1 -1
- package/dist/esm/common/confirmModal/confirmModal.mjs.map +1 -1
- package/dist/esm/common/datePicker/components/datePickerMonth/datePickerMonth.mjs +1 -1
- package/dist/esm/common/datePicker/components/datePickerMonth/datePickerMonth.mjs.map +1 -1
- package/dist/esm/common/datePicker/components/datePickerMonth/datePickerMonth.module.mjs.map +1 -1
- package/dist/esm/common/datePicker/datePicker.mjs +1 -1
- package/dist/esm/common/datePicker/datePicker.mjs.map +1 -1
- package/dist/esm/common/drawer/drawer.mjs +1 -1
- package/dist/esm/common/drawer/drawer.mjs.map +1 -1
- package/dist/esm/common/dropdown/dropdown.mjs +1 -1
- package/dist/esm/common/dropdown/dropdown.mjs.map +1 -1
- package/dist/esm/common/dropdown/dropdown.module.mjs +1 -1
- package/dist/esm/common/dropdown/dropdown.module.mjs.map +1 -1
- package/dist/esm/common/emptyState/emptyState.mjs +1 -1
- package/dist/esm/common/emptyState/emptyState.mjs.map +1 -1
- package/dist/esm/common/fab/components/fabBase/fabBase.mjs +1 -1
- package/dist/esm/common/fab/components/fabBase/fabBase.mjs.map +1 -1
- package/dist/esm/common/fab/fab.mjs +1 -1
- package/dist/esm/common/fab/fab.mjs.map +1 -1
- package/dist/esm/common/hooks/useAnchorTracking.mjs.map +1 -1
- package/dist/esm/common/hooks/useFocusBoundary.mjs +1 -1
- package/dist/esm/common/hooks/useFocusBoundary.mjs.map +1 -1
- package/dist/esm/common/hooks/useSheet.mjs +1 -1
- package/dist/esm/common/hooks/useSheet.mjs.map +1 -1
- package/dist/esm/common/infiniteBlock/infiniteBlock.mjs +1 -1
- package/dist/esm/common/infiniteBlock/infiniteBlock.mjs.map +1 -1
- package/dist/esm/common/inputDropdown/inputDropdown.mjs +1 -1
- package/dist/esm/common/inputDropdown/inputDropdown.mjs.map +1 -1
- package/dist/esm/common/inputDropdown/inputDropdown.module.mjs +1 -1
- package/dist/esm/common/inputDropdown/inputDropdown.module.mjs.map +1 -1
- package/dist/esm/common/interactableDiv/interactableDiv.mjs +1 -1
- package/dist/esm/common/interactableDiv/interactableDiv.mjs.map +1 -1
- package/dist/esm/common/klipyPicker/klipyPicker.mjs +1 -1
- package/dist/esm/common/klipyPicker/klipyPicker.mjs.map +1 -1
- package/dist/esm/common/menu/menu.mjs +2 -0
- package/dist/esm/common/menu/menu.mjs.map +1 -0
- package/dist/esm/common/menu/menu.module.mjs +2 -0
- package/dist/esm/common/menu/menu.module.mjs.map +1 -0
- package/dist/esm/common/menu/menu.types.mjs +2 -0
- package/dist/esm/common/menu/menu.types.mjs.map +1 -0
- package/dist/esm/common/multiSelect/multiSelect.mjs +1 -1
- package/dist/esm/common/multiSelect/multiSelect.mjs.map +1 -1
- package/dist/esm/common/multiSelect/multiSelect.module.mjs +1 -1
- package/dist/esm/common/multiSelect/multiSelect.module.mjs.map +1 -1
- package/dist/esm/common/numberInput/numberInput.mjs +1 -1
- package/dist/esm/common/numberInput/numberInput.mjs.map +1 -1
- package/dist/esm/common/popover/popover.mjs +1 -1
- package/dist/esm/common/popover/popover.mjs.map +1 -1
- package/dist/esm/common/popover/popover.module.mjs +1 -1
- package/dist/esm/common/popover/popover.module.mjs.map +1 -1
- package/dist/esm/common/popover/popover.types.mjs.map +1 -1
- package/dist/esm/common/popover/usePopoverPosition.mjs +1 -1
- package/dist/esm/common/popover/usePopoverPosition.mjs.map +1 -1
- package/dist/esm/common/progressBar/progressBar.mjs +1 -1
- package/dist/esm/common/progressBar/progressBar.mjs.map +1 -1
- package/dist/esm/common/searchInput/searchInput.mjs +1 -1
- package/dist/esm/common/searchInput/searchInput.mjs.map +1 -1
- package/dist/esm/common/splitButton/splitButton.mjs +1 -1
- package/dist/esm/common/splitButton/splitButton.mjs.map +1 -1
- package/dist/esm/common/splitButton/splitButton.module.mjs +1 -1
- package/dist/esm/common/splitButton/splitButton.module.mjs.map +1 -1
- package/dist/esm/common/timeInput/timeInput.mjs +1 -1
- package/dist/esm/common/timeInput/timeInput.mjs.map +1 -1
- package/dist/esm/common/toast/toast.module.mjs.map +1 -1
- package/dist/esm/common/tooltip/tooltip.mjs +1 -1
- package/dist/esm/common/tooltip/tooltip.mjs.map +1 -1
- package/dist/esm/common/tooltip/tooltip.module.mjs +1 -1
- package/dist/esm/common/tooltip/tooltip.module.mjs.map +1 -1
- package/dist/esm/common/virtualList/virtualList.module.mjs +1 -1
- package/dist/esm/common/virtualList/virtualList.module.mjs.map +1 -1
- package/dist/esm/common/virtualList/virtualListHeader.mjs +1 -1
- package/dist/esm/common/virtualList/virtualListHeader.mjs.map +1 -1
- package/dist/esm/index.mjs +1 -1
- package/dist/index.cjs +3 -3
- package/dist/index.cjs.map +1 -1
- package/dist/style.css +1 -1
- package/dist/types/common/card/card.types.d.ts +6 -1
- package/dist/types/common/chip/chip.types.d.ts +6 -1
- package/dist/types/common/colorPicker/colorPicker.d.ts +1 -1
- package/dist/types/common/colorPicker/colorPicker.types.d.ts +6 -1
- package/dist/types/common/configProvider/configProvider.d.ts +1 -1
- package/dist/types/common/configProvider/configProvider.types.d.ts +6 -3
- package/dist/types/common/configProvider/index.d.ts +1 -0
- package/dist/types/common/configProvider/presentation.types.d.ts +14 -0
- package/dist/types/common/configProvider/usePresentationDefault.d.ts +1 -1
- package/dist/types/common/confirmModal/confirmModal.types.d.ts +4 -2
- package/dist/types/common/datePicker/components/datePickerMonth/datePickerMonth.d.ts +1 -1
- package/dist/types/common/datePicker/components/datePickerMonth/datePickerMonth.types.d.ts +3 -0
- package/dist/types/common/datePicker/datePicker.types.d.ts +11 -2
- package/dist/types/common/drawer/drawer.d.ts +1 -1
- package/dist/types/common/drawer/drawer.types.d.ts +7 -1
- package/dist/types/common/dropdown/dropdown.types.d.ts +7 -7
- package/dist/types/common/emptyState/emptyState.d.ts +1 -1
- package/dist/types/common/emptyState/emptyState.types.d.ts +6 -1
- package/dist/types/common/fab/components/fabBase/fabBase.d.ts +1 -1
- package/dist/types/common/fab/components/fabBase/fabBase.types.d.ts +3 -1
- package/dist/types/common/fab/fab.d.ts +1 -1
- package/dist/types/common/fab/fab.types.d.ts +6 -1
- package/dist/types/common/hooks/useAnchorTracking.d.ts +1 -1
- package/dist/types/common/hooks/useFocusBoundary.d.ts +3 -3
- package/dist/types/common/hooks/useSheet.d.ts +1 -1
- package/dist/types/common/infiniteBlock/infiniteBlock.d.ts +1 -1
- package/dist/types/common/infiniteBlock/infiniteBlock.types.d.ts +2 -0
- package/dist/types/common/menu/index.d.ts +2 -0
- package/dist/types/common/menu/menu.d.ts +14 -0
- package/dist/types/common/menu/menu.types.d.ts +55 -0
- package/dist/types/common/modal/modal.types.d.ts +1 -1
- package/dist/types/common/multiSelect/multiSelect.types.d.ts +1 -1
- package/dist/types/common/numberInput/numberInput.types.d.ts +6 -0
- package/dist/types/common/popover/popover.types.d.ts +34 -3
- package/dist/types/common/popover/usePopoverPosition.d.ts +20 -1
- package/dist/types/common/progressBar/progressBar.d.ts +1 -1
- package/dist/types/common/progressBar/progressBar.types.d.ts +6 -1
- package/dist/types/common/searchInput/searchInput.d.ts +1 -1
- package/dist/types/common/searchInput/searchInput.types.d.ts +13 -1
- package/dist/types/common/splitButton/splitButton.types.d.ts +3 -3
- package/dist/types/index.d.ts +2 -2
- package/docs/Breadcrumb.md +2 -2
- package/docs/ButtonGroup.md +1 -1
- package/docs/CLAUDE.md +1 -1
- package/docs/Card.md +3 -1
- package/docs/Chip.md +2 -0
- package/docs/ColorPicker.md +4 -0
- package/docs/ConfigProvider.md +2 -2
- package/docs/DatePicker.md +4 -0
- package/docs/Drawer.md +2 -0
- package/docs/Dropdown.md +3 -1
- package/docs/EmptyState.md +2 -0
- package/docs/Fab.md +2 -0
- package/docs/InputDropdown.md +1 -1
- package/docs/InteractableDiv.md +2 -0
- package/docs/Menu.md +107 -0
- package/docs/Modal.md +1 -1
- package/docs/NumberInput.md +4 -0
- package/docs/Popover.md +11 -5
- package/docs/ProgressBar.md +2 -0
- package/docs/SearchInput.md +4 -0
- package/docs/SplitButton.md +8 -4
- package/docs/ThemeProvider.md +1 -1
- package/docs/VirtualList.md +2 -2
- package/package.json +1 -1
- package/dist/esm/common/floatingMenu/floatingMenu.mjs +0 -2
- package/dist/esm/common/floatingMenu/floatingMenu.mjs.map +0 -1
- package/dist/esm/common/floatingMenu/floatingMenu.module.mjs +0 -2
- package/dist/esm/common/floatingMenu/floatingMenu.module.mjs.map +0 -1
- package/dist/esm/common/floatingMenu/floatingMenu.types.mjs +0 -2
- package/dist/esm/common/floatingMenu/floatingMenu.types.mjs.map +0 -1
- package/dist/esm/common/floatingMenu/useFloatingPosition.mjs +0 -2
- package/dist/esm/common/floatingMenu/useFloatingPosition.mjs.map +0 -1
- package/dist/types/common/floatingMenu/floatingMenu.d.ts +0 -3
- package/dist/types/common/floatingMenu/floatingMenu.types.d.ts +0 -32
- package/dist/types/common/floatingMenu/index.d.ts +0 -2
- package/dist/types/common/floatingMenu/useFloatingPosition.d.ts +0 -27
- package/docs/FloatingMenu.md +0 -90
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"timeInput.mjs","names":[],"sources":["../../../../package/common/timeInput/timeInput.tsx"],"sourcesContent":["import React, { useState, useEffect, useRef } from 'react';\nimport cx from 'classnames';\nimport InputMask, { type BeforeMaskedStateChangeStates, type InputState } from '@mona-health/react-input-mask';\nimport { faClock } from '@fortawesome/free-solid-svg-icons';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Input from '../input';\nimport Modal from '../modal';\nimport FloatingMenu from '../floatingMenu';\nimport Button from '../button';\nimport { ButtonStyleType } from '../button/button.types';\nimport Tooltip from '../tooltip';\nimport ClockDial from './components/clockDial';\nimport { Align } from '../floatingMenu/floatingMenu.types';\nimport { type TimeValue, parseTimeString, formatTime, snapMinute, clampToRange, clampHour } from './timeFunctions';\nimport type { TimeInputProps } from './timeInput.types';\n\nimport styles from './timeInput.module.pcss';\n\ntype ClockMode = 'hours' | 'minutes';\n\nexport default function TimeInput({\n value,\n selected,\n onChange = () => null,\n onSelect = () => null,\n formValidator = null,\n isInline = false,\n isModal = false,\n noInput = false,\n noHeader = false,\n showClearButton = false,\n showNowButton = false,\n minuteStep = 1,\n use24Hour = true,\n minTime = null,\n maxTime = null,\n label = '',\n isValid = true,\n errorMessage = '',\n isRequired = false,\n disabled = false,\n className = '',\n style,\n classNames,\n styles: slotStyles,\n ...rest\n}: TimeInputProps) {\n const getExternalString = (): string => {\n if (formValidator) return (formValidator.value as string) || '';\n return value ?? selected ?? '';\n };\n\n const [currentTimeString, setCurrentTimeString] = useState(getExternalString);\n const [isPickerOpen, setIsPickerOpen] = useState(false);\n const [mode, setMode] = useState<ClockMode>('hours');\n const [isFocused, setIsFocused] = useState(false);\n const [isHovered, setIsHovered] = useState(false);\n const [, forceUpdate] = useState(0);\n\n const externalString = getExternalString();\n const [prevExternal, setPrevExternal] = useState(externalString);\n const fvRef = useRef(formValidator);\n\n // Sync when the controlled value changes externally.\n if (!formValidator && prevExternal !== externalString) {\n setPrevExternal(externalString);\n setCurrentTimeString(externalString);\n }\n\n useEffect(() => {\n fvRef.current = formValidator;\n if (!formValidator) return;\n const listener = () => {\n setCurrentTimeString((formValidator.value as string) || '');\n forceUpdate((n) => n + 1);\n };\n formValidator.registerOnUpdateListener(listener);\n return () => formValidator.removeOnUpdateListener(listener);\n }, [formValidator]);\n\n const hasError = (): boolean =>\n formValidator ? formValidator.touched && formValidator.hasError() : !isValid || !!errorMessage;\n\n const computedIsRequired = (): boolean =>\n !!(isRequired || formValidator?.validators.find((v) => (v as { validatorId?: string }).validatorId === 'required'));\n\n /** Push a value out to formValidator/onChange without touching the input string. */\n const emit = (time: TimeValue | null) => {\n const str = time ? formatTime(time) : null;\n if (formValidator) formValidator.set(str);\n onChange?.(str);\n };\n\n const applyTime = (time: TimeValue | null) => {\n setCurrentTimeString(time ? formatTime(time) : '');\n emit(time);\n };\n\n const parsed = parseTimeString(currentTimeString);\n const dialTime: TimeValue = parsed ?? { hours: 12, minutes: 0 };\n\n const handleDialChange = (time: TimeValue) => {\n const snapped = { hours: time.hours, minutes: snapMinute(time.minutes, minuteStep) };\n applyTime(clampToRange(snapped, minTime, maxTime));\n };\n\n const handleDialCommit = (time: TimeValue) => {\n const snapped = { hours: time.hours, minutes: snapMinute(time.minutes, minuteStep) };\n const next = clampToRange(snapped, minTime, maxTime);\n applyTime(next);\n if (mode === 'hours') {\n setMode('minutes');\n return;\n }\n onSelect?.(formatTime(next));\n if (!isInline) setIsPickerOpen(false);\n };\n\n const openPicker = () => {\n if (disabled) return;\n setMode('hours');\n setIsPickerOpen(true);\n };\n\n const beforeMaskedStateChange = ({ previousState, nextState }: BeforeMaskedStateChangeStates): InputState => {\n if (!previousState || nextState.value === previousState.value) return nextState;\n let v = nextState.value;\n const hourStr = v.slice(0, 2);\n if (/^\\d\\d$/.test(hourStr) && Number(hourStr) > 23) v = `23${v.slice(2)}`;\n const minStr = v.slice(3, 5);\n if (/^\\d\\d$/.test(minStr) && Number(minStr) > 59) v = `${v.slice(0, 3)}59`;\n return v === nextState.value ? nextState : { ...nextState, value: v };\n };\n\n const handleInputChange = (v: string) => {\n setCurrentTimeString(v);\n const t = parseTimeString(v);\n if (t) emit(t);\n };\n\n const handleBlur = () => {\n if (fvRef.current) fvRef.current.touched = true;\n setIsFocused(false);\n emit(parseTimeString(currentTimeString));\n };\n\n const setMeridiem = (pm: boolean) => {\n const isPm = dialTime.hours >= 12;\n if (pm === isPm) return;\n applyTime({ hours: clampHour(dialTime.hours + (pm ? 12 : -12)), minutes: dialTime.minutes });\n };\n\n const hasErr = hasError();\n const displayHours = parsed\n ? String(use24Hour ? parsed.hours : ((parsed.hours + 11) % 12) + 1).padStart(2, '0')\n : '--';\n const displayMinutes = parsed ? String(parsed.minutes).padStart(2, '0') : '--';\n\n const header = noHeader ? null : (\n <div className={cx(styles.timeInputClockHeader, classNames?.clockHeader)} style={slotStyles?.clockHeader}>\n <button\n type='button'\n className={cx(\n styles.timeInputHeaderSegment,\n mode === 'hours' && styles.timeInputHeaderSegmentActive,\n classNames?.headerSegment,\n )}\n style={slotStyles?.headerSegment}\n onClick={() => setMode('hours')}\n >\n {displayHours}\n </button>\n <span className={styles.timeInputHeaderColon}>:</span>\n <button\n type='button'\n className={cx(\n styles.timeInputHeaderSegment,\n mode === 'minutes' && styles.timeInputHeaderSegmentActive,\n classNames?.headerSegment,\n )}\n style={slotStyles?.headerSegment}\n onClick={() => setMode('minutes')}\n >\n {displayMinutes}\n </button>\n {!use24Hour && (\n <div className={cx(styles.timeInputMeridiem, classNames?.meridiem)} style={slotStyles?.meridiem}>\n <button\n type='button'\n className={cx(dialTime.hours < 12 && styles.timeInputMeridiemActive)}\n onClick={() => setMeridiem(false)}\n >\n AM\n </button>\n <button\n type='button'\n className={cx(dialTime.hours >= 12 && styles.timeInputMeridiemActive)}\n onClick={() => setMeridiem(true)}\n >\n PM\n </button>\n </div>\n )}\n </div>\n );\n\n const footer =\n showClearButton || showNowButton ? (\n <div className={cx(styles.timeInputFooter, classNames?.footer)} style={slotStyles?.footer}>\n {showNowButton && (\n <Button\n styleType={ButtonStyleType.Default}\n onClick={() => {\n const now = new Date();\n handleDialChange({ hours: now.getHours(), minutes: now.getMinutes() });\n }}\n >\n Now\n </Button>\n )}\n {showClearButton && (\n <Button\n styleType={ButtonStyleType.Default}\n onClick={() => {\n applyTime(null);\n onSelect?.(null);\n }}\n >\n Clear\n </Button>\n )}\n </div>\n ) : null;\n\n const pickerContent = (\n <div className={cx(styles.timeInputClock, classNames?.clock)} style={slotStyles?.clock}>\n {header}\n <ClockDial\n time={dialTime}\n mode={mode}\n use24Hour={use24Hour}\n minuteStep={minuteStep}\n onChange={handleDialChange}\n onCommit={handleDialCommit}\n classNames={classNames}\n styles={slotStyles}\n />\n {footer}\n </div>\n );\n\n const input = noInput ? null : (\n <Input\n autoComplete='off'\n label={`${label}${computedIsRequired() ? ' *' : ''}`}\n value={currentTimeString}\n icon={<FontAwesomeIcon icon={faClock} />}\n onIconClick={openPicker}\n onClick={openPicker}\n readOnly={isModal}\n disabled={disabled}\n isValid={!hasErr}\n customInput={<InputMask mask='99:99' maskPlaceholder='_' beforeMaskedStateChange={beforeMaskedStateChange} />}\n onChange={(v) => handleInputChange(v as string)}\n onBlur={handleBlur}\n onFocus={() => setIsFocused(true)}\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n />\n );\n\n const picker = (() => {\n if (isInline) return pickerContent;\n if (isModal) {\n return (\n <Modal hideHeader isOpen={isPickerOpen} onClose={() => setIsPickerOpen(false)}>\n {pickerContent}\n </Modal>\n );\n }\n return (\n <FloatingMenu\n isOpen={isPickerOpen}\n onOpenChange={setIsPickerOpen}\n content={pickerContent}\n align={Align.Left}\n dontCloseOnChildClick\n >\n {input}\n </FloatingMenu>\n );\n })();\n\n return (\n <div\n className={cx(styles.timeInput, classNames?.root, className)}\n style={{ ...slotStyles?.root, ...style }}\n {...rest}\n >\n {(isModal || isInline) && input}\n {picker}\n <Tooltip\n variant='error'\n message={formValidator ? (formValidator.getCurrentErrorMessage() ?? '') : errorMessage || ''}\n isVisible={hasErr && (isFocused || isHovered)}\n />\n </div>\n );\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"timeInput.mjs","names":[],"sources":["../../../../package/common/timeInput/timeInput.tsx"],"sourcesContent":["import React, { useState, useEffect, useRef } from 'react';\nimport cx from 'classnames';\nimport InputMask, { type BeforeMaskedStateChangeStates, type InputState } from '@mona-health/react-input-mask';\nimport { faClock } from '@fortawesome/free-solid-svg-icons';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Input from '../input';\nimport Modal from '../modal';\nimport Popover from '../popover';\nimport Button from '../button';\nimport { ButtonStyleType } from '../button/button.types';\nimport Tooltip from '../tooltip';\nimport ClockDial from './components/clockDial';\nimport { PopoverAlign, PopoverPlacement } from '../popover/popover.types';\nimport { type TimeValue, parseTimeString, formatTime, snapMinute, clampToRange, clampHour } from './timeFunctions';\nimport type { TimeInputProps } from './timeInput.types';\n\nimport styles from './timeInput.module.pcss';\n\ntype ClockMode = 'hours' | 'minutes';\n\nexport default function TimeInput({\n value,\n selected,\n onChange = () => null,\n onSelect = () => null,\n formValidator = null,\n isInline = false,\n isModal = false,\n noInput = false,\n noHeader = false,\n showClearButton = false,\n showNowButton = false,\n minuteStep = 1,\n use24Hour = true,\n minTime = null,\n maxTime = null,\n label = '',\n isValid = true,\n errorMessage = '',\n isRequired = false,\n disabled = false,\n className = '',\n style,\n classNames,\n styles: slotStyles,\n ...rest\n}: TimeInputProps) {\n const getExternalString = (): string => {\n if (formValidator) return (formValidator.value as string) || '';\n return value ?? selected ?? '';\n };\n\n const [currentTimeString, setCurrentTimeString] = useState(getExternalString);\n const [isPickerOpen, setIsPickerOpen] = useState(false);\n const [mode, setMode] = useState<ClockMode>('hours');\n const [isFocused, setIsFocused] = useState(false);\n const [isHovered, setIsHovered] = useState(false);\n const [, forceUpdate] = useState(0);\n\n const externalString = getExternalString();\n const [prevExternal, setPrevExternal] = useState(externalString);\n const fvRef = useRef(formValidator);\n\n // Sync when the controlled value changes externally.\n if (!formValidator && prevExternal !== externalString) {\n setPrevExternal(externalString);\n setCurrentTimeString(externalString);\n }\n\n useEffect(() => {\n fvRef.current = formValidator;\n if (!formValidator) return;\n const listener = () => {\n setCurrentTimeString((formValidator.value as string) || '');\n forceUpdate((n) => n + 1);\n };\n formValidator.registerOnUpdateListener(listener);\n return () => formValidator.removeOnUpdateListener(listener);\n }, [formValidator]);\n\n const hasError = (): boolean =>\n formValidator ? formValidator.touched && formValidator.hasError() : !isValid || !!errorMessage;\n\n const computedIsRequired = (): boolean =>\n !!(isRequired || formValidator?.validators.find((v) => (v as { validatorId?: string }).validatorId === 'required'));\n\n /** Push a value out to formValidator/onChange without touching the input string. */\n const emit = (time: TimeValue | null) => {\n const str = time ? formatTime(time) : null;\n if (formValidator) formValidator.set(str);\n onChange?.(str);\n };\n\n const applyTime = (time: TimeValue | null) => {\n setCurrentTimeString(time ? formatTime(time) : '');\n emit(time);\n };\n\n const parsed = parseTimeString(currentTimeString);\n const dialTime: TimeValue = parsed ?? { hours: 12, minutes: 0 };\n\n const handleDialChange = (time: TimeValue) => {\n const snapped = { hours: time.hours, minutes: snapMinute(time.minutes, minuteStep) };\n applyTime(clampToRange(snapped, minTime, maxTime));\n };\n\n const handleDialCommit = (time: TimeValue) => {\n const snapped = { hours: time.hours, minutes: snapMinute(time.minutes, minuteStep) };\n const next = clampToRange(snapped, minTime, maxTime);\n applyTime(next);\n if (mode === 'hours') {\n setMode('minutes');\n return;\n }\n onSelect?.(formatTime(next));\n if (!isInline) setIsPickerOpen(false);\n };\n\n const openPicker = () => {\n if (disabled) return;\n setMode('hours');\n setIsPickerOpen(true);\n };\n\n const beforeMaskedStateChange = ({ previousState, nextState }: BeforeMaskedStateChangeStates): InputState => {\n if (!previousState || nextState.value === previousState.value) return nextState;\n let v = nextState.value;\n const hourStr = v.slice(0, 2);\n if (/^\\d\\d$/.test(hourStr) && Number(hourStr) > 23) v = `23${v.slice(2)}`;\n const minStr = v.slice(3, 5);\n if (/^\\d\\d$/.test(minStr) && Number(minStr) > 59) v = `${v.slice(0, 3)}59`;\n return v === nextState.value ? nextState : { ...nextState, value: v };\n };\n\n const handleInputChange = (v: string) => {\n setCurrentTimeString(v);\n const t = parseTimeString(v);\n if (t) emit(t);\n };\n\n const handleBlur = () => {\n if (fvRef.current) fvRef.current.touched = true;\n setIsFocused(false);\n emit(parseTimeString(currentTimeString));\n };\n\n const setMeridiem = (pm: boolean) => {\n const isPm = dialTime.hours >= 12;\n if (pm === isPm) return;\n applyTime({ hours: clampHour(dialTime.hours + (pm ? 12 : -12)), minutes: dialTime.minutes });\n };\n\n const hasErr = hasError();\n const displayHours = parsed\n ? String(use24Hour ? parsed.hours : ((parsed.hours + 11) % 12) + 1).padStart(2, '0')\n : '--';\n const displayMinutes = parsed ? String(parsed.minutes).padStart(2, '0') : '--';\n\n const header = noHeader ? null : (\n <div className={cx(styles.timeInputClockHeader, classNames?.clockHeader)} style={slotStyles?.clockHeader}>\n <button\n type='button'\n className={cx(\n styles.timeInputHeaderSegment,\n mode === 'hours' && styles.timeInputHeaderSegmentActive,\n classNames?.headerSegment,\n )}\n style={slotStyles?.headerSegment}\n onClick={() => setMode('hours')}\n >\n {displayHours}\n </button>\n <span className={styles.timeInputHeaderColon}>:</span>\n <button\n type='button'\n className={cx(\n styles.timeInputHeaderSegment,\n mode === 'minutes' && styles.timeInputHeaderSegmentActive,\n classNames?.headerSegment,\n )}\n style={slotStyles?.headerSegment}\n onClick={() => setMode('minutes')}\n >\n {displayMinutes}\n </button>\n {!use24Hour && (\n <div className={cx(styles.timeInputMeridiem, classNames?.meridiem)} style={slotStyles?.meridiem}>\n <button\n type='button'\n className={cx(dialTime.hours < 12 && styles.timeInputMeridiemActive)}\n onClick={() => setMeridiem(false)}\n >\n AM\n </button>\n <button\n type='button'\n className={cx(dialTime.hours >= 12 && styles.timeInputMeridiemActive)}\n onClick={() => setMeridiem(true)}\n >\n PM\n </button>\n </div>\n )}\n </div>\n );\n\n const footer =\n showClearButton || showNowButton ? (\n <div className={cx(styles.timeInputFooter, classNames?.footer)} style={slotStyles?.footer}>\n {showNowButton && (\n <Button\n styleType={ButtonStyleType.Default}\n onClick={() => {\n const now = new Date();\n handleDialChange({ hours: now.getHours(), minutes: now.getMinutes() });\n }}\n >\n Now\n </Button>\n )}\n {showClearButton && (\n <Button\n styleType={ButtonStyleType.Default}\n onClick={() => {\n applyTime(null);\n onSelect?.(null);\n }}\n >\n Clear\n </Button>\n )}\n </div>\n ) : null;\n\n const pickerContent = (\n <div className={cx(styles.timeInputClock, classNames?.clock)} style={slotStyles?.clock}>\n {header}\n <ClockDial\n time={dialTime}\n mode={mode}\n use24Hour={use24Hour}\n minuteStep={minuteStep}\n onChange={handleDialChange}\n onCommit={handleDialCommit}\n classNames={classNames}\n styles={slotStyles}\n />\n {footer}\n </div>\n );\n\n const input = noInput ? null : (\n <Input\n autoComplete='off'\n label={`${label}${computedIsRequired() ? ' *' : ''}`}\n value={currentTimeString}\n icon={<FontAwesomeIcon icon={faClock} />}\n onIconClick={openPicker}\n onClick={openPicker}\n readOnly={isModal}\n disabled={disabled}\n isValid={!hasErr}\n customInput={<InputMask mask='99:99' maskPlaceholder='_' beforeMaskedStateChange={beforeMaskedStateChange} />}\n onChange={(v) => handleInputChange(v as string)}\n onBlur={handleBlur}\n onFocus={() => setIsFocused(true)}\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n />\n );\n\n const picker = (() => {\n if (isInline) return pickerContent;\n if (isModal) {\n return (\n <Modal hideHeader isOpen={isPickerOpen} onClose={() => setIsPickerOpen(false)}>\n {pickerContent}\n </Modal>\n );\n }\n return (\n <Popover\n isOpen={isPickerOpen}\n onOpenChange={setIsPickerOpen}\n content={pickerContent}\n placement={PopoverPlacement.Bottom}\n align={PopoverAlign.Start}\n // A click to place the caret in the field must not take the panel away.\n // The focus stays there on its own: Popover only follows a keyboard open.\n closeOnTriggerClick={false}\n constrainWidth={false}\n >\n {input}\n </Popover>\n );\n })();\n\n return (\n <div\n className={cx(styles.timeInput, classNames?.root, className)}\n style={{ ...slotStyles?.root, ...style }}\n {...rest}\n >\n {(isModal || isInline) && input}\n {picker}\n <Tooltip\n variant='error'\n message={formValidator ? (formValidator.getCurrentErrorMessage() ?? '') : errorMessage || ''}\n isVisible={hasErr && (isFocused || isHovered)}\n />\n </div>\n );\n}\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"toast.module.mjs","names":[],"sources":["../../../../package/common/toast/toast.module.pcss"],"sourcesContent":[".container {\n position: fixed;\n z-index: 9999;\n display: flex;\n flex-direction: column;\n gap: 0.5em;\n pointer-events: none;\n padding: 1em;\n box-sizing: border-box;\n\n &-top-left {\n top: 0;\n left: 0;\n align-items: flex-start;\n }\n\n &-top-center {\n top: 0;\n left: 50%;\n transform: translateX(-50%);\n align-items: center;\n }\n\n &-top-right {\n top: 0;\n right: 0;\n align-items: flex-end;\n }\n\n &-bottom-left {\n bottom: 0;\n left: 0;\n align-items: flex-start;\n flex-direction: column-reverse;\n }\n\n &-bottom-center {\n bottom: 0;\n left: 50%;\n transform: translateX(-50%);\n align-items: center;\n flex-direction: column-reverse;\n }\n\n &-bottom-right {\n bottom: 0;\n right: 0;\n align-items: flex-end;\n flex-direction: column-reverse;\n }\n}\n\n.toast {\n pointer-events: all;\n display: flex;\n align-items: flex-start;\n gap: 0.625em;\n padding: 0.75em 0.875em;\n border-radius: var(--default-border-radius);\n background: var(--background-modal);\n color: var(--text-color);\n font-family: var(--default-font);\n box-shadow: var(--card-shadow);\n\n /* em, so the line length stays a measure rather than a pixel count. */\n min-width: 15em;\n max-width: 23.75em;\n box-sizing: border-box;\n position: relative;\n\n /* Tells the browser vertical panning is native (so the page can still scroll behind the toast)\n while horizontal movement is left for useSwipeDismiss's own pointer handling to decide. */\n touch-action: pan-y;\n overflow: hidden;\n animation: toastSlideDown 0.25s ease forwards;\n\n &-bottom {\n animation: toastSlideUp 0.25s ease forwards;\n }\n\n &-dismissing {\n animation: toastFadeOut 0.2s ease forwards;\n }\n\n &-paused .toastProgressBar {\n animation-play-state: paused;\n }\n\n &-info {\n border-left: 0.1875em solid var(--info-color, #3b82f6);\n\n .toastIcon {\n color: var(--info-color, #3b82f6);\n }\n }\n\n &-success {\n border-left: 0.1875em solid var(--success-color);\n\n .toastIcon {\n color: var(--success-color);\n }\n }\n\n &-error {\n border-left: 0.1875em solid var(--error-color, #ef4444);\n\n .toastIcon {\n color: var(--error-color, #ef4444);\n }\n }\n\n &-warn {\n border-left: 0.1875em solid var(--warn-color);\n\n .toastIcon {\n color: var(--warn-color);\n }\n }\n\n &-default {\n border-left: 0.1875em solid var(--primary-color);\n\n /* Paints the gradient exactly over border-left, which a background layer only reaches\n because its origin is the border box. The border stays as the no-gradient fallback. */\n background-image: var(--primary-gradient, none);\n background-repeat: no-repeat;\n background-size: 0.1875em 100%;\n background-origin: border-box;\n\n .toastIcon {\n color: var(--primary-color);\n }\n }\n}\n\n.toastIcon {\n flex-shrink: 0;\n margin-top: 0.0667em; /* 1px against this element's own 0.9375em */\n font-size: 0.9375em;\n}\n\n.toastContent {\n flex: 1;\n font-size: 0.875em;\n line-height: 1.4;\n}\n\n.toastCloseButton {\n flex-shrink: 0;\n background: none;\n border: none;\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n padding: 0;\n color: var(--text-dark);\n font-size: 0.8125em;\n opacity: 0.6;\n transition: opacity 0.15s;\n margin-top: 0.0769em; /* 1px against this element's own 0.8125em */\n\n &:hover {\n opacity: 1;\n }\n}\n\n.toastProgressBar {\n position: absolute;\n bottom: 0;\n left: 0;\n height: 0.1875em;\n width: 100%;\n background: currentcolor;\n opacity: 0.35;\n transform-origin: left;\n animation: toastShrink var(--toast-duration) linear forwards;\n}\n\n@keyframes toastSlideDown {\n from {\n opacity: 0;\n transform: translateY(-0.75em);\n }\n\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes toastSlideUp {\n from {\n opacity: 0;\n transform: translateY(0.75em);\n }\n\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes toastFadeOut {\n from {\n opacity: 1;\n transform: scale(1);\n }\n\n to {\n opacity: 0;\n transform: scale(0.92);\n }\n}\n\n@keyframes toastShrink {\n from {\n transform: scaleX(1);\n }\n\n to {\n transform: scaleX(0);\n }\n}\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"toast.module.mjs","names":[],"sources":["../../../../package/common/toast/toast.module.pcss"],"sourcesContent":[".container {\n position: fixed;\n z-index: 9999;\n display: flex;\n flex-direction: column;\n gap: 0.5em;\n pointer-events: none;\n padding: 1em;\n box-sizing: border-box;\n\n &-top-left {\n top: 0;\n left: 0;\n align-items: flex-start;\n }\n\n &-top-center {\n top: 0;\n left: 50%;\n transform: translateX(-50%);\n align-items: center;\n }\n\n &-top-right {\n top: 0;\n right: 0;\n align-items: flex-end;\n }\n\n &-bottom-left {\n bottom: 0;\n left: 0;\n align-items: flex-start;\n flex-direction: column-reverse;\n }\n\n &-bottom-center {\n bottom: 0;\n left: 50%;\n transform: translateX(-50%);\n align-items: center;\n flex-direction: column-reverse;\n }\n\n &-bottom-right {\n bottom: 0;\n right: 0;\n align-items: flex-end;\n flex-direction: column-reverse;\n }\n}\n\n.toast {\n pointer-events: all;\n display: flex;\n align-items: flex-start;\n gap: 0.625em;\n padding: 0.75em 0.875em;\n border-radius: var(--default-border-radius);\n background: var(--background-modal);\n color: var(--text-color);\n font-family: var(--default-font);\n box-shadow: var(--card-shadow);\n\n /* em, so the line length stays a measure rather than a pixel count. The screen\n wins over both: below about 270px the minimum alone was wider than the space\n the container had, and a toast pinned to one edge hung off the other. The 2em\n is the container's own padding, which is in the same em as these. */\n min-width: min(15em, calc(100vw - 2em));\n max-width: min(23.75em, calc(100vw - 2em));\n box-sizing: border-box;\n position: relative;\n\n /* Tells the browser vertical panning is native (so the page can still scroll behind the toast)\n while horizontal movement is left for useSwipeDismiss's own pointer handling to decide. */\n touch-action: pan-y;\n overflow: hidden;\n animation: toastSlideDown 0.25s ease forwards;\n\n &-bottom {\n animation: toastSlideUp 0.25s ease forwards;\n }\n\n &-dismissing {\n animation: toastFadeOut 0.2s ease forwards;\n }\n\n &-paused .toastProgressBar {\n animation-play-state: paused;\n }\n\n &-info {\n border-left: 0.1875em solid var(--info-color, #3b82f6);\n\n .toastIcon {\n color: var(--info-color, #3b82f6);\n }\n }\n\n &-success {\n border-left: 0.1875em solid var(--success-color);\n\n .toastIcon {\n color: var(--success-color);\n }\n }\n\n &-error {\n border-left: 0.1875em solid var(--error-color, #ef4444);\n\n .toastIcon {\n color: var(--error-color, #ef4444);\n }\n }\n\n &-warn {\n border-left: 0.1875em solid var(--warn-color);\n\n .toastIcon {\n color: var(--warn-color);\n }\n }\n\n &-default {\n border-left: 0.1875em solid var(--primary-color);\n\n /* Paints the gradient exactly over border-left, which a background layer only reaches\n because its origin is the border box. The border stays as the no-gradient fallback. */\n background-image: var(--primary-gradient, none);\n background-repeat: no-repeat;\n background-size: 0.1875em 100%;\n background-origin: border-box;\n\n .toastIcon {\n color: var(--primary-color);\n }\n }\n}\n\n.toastIcon {\n flex-shrink: 0;\n margin-top: 0.0667em; /* 1px against this element's own 0.9375em */\n font-size: 0.9375em;\n}\n\n.toastContent {\n flex: 1;\n font-size: 0.875em;\n line-height: 1.4;\n}\n\n.toastCloseButton {\n flex-shrink: 0;\n background: none;\n border: none;\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n padding: 0;\n color: var(--text-dark);\n font-size: 0.8125em;\n opacity: 0.6;\n transition: opacity 0.15s;\n margin-top: 0.0769em; /* 1px against this element's own 0.8125em */\n\n &:hover {\n opacity: 1;\n }\n}\n\n.toastProgressBar {\n position: absolute;\n bottom: 0;\n left: 0;\n height: 0.1875em;\n width: 100%;\n background: currentcolor;\n opacity: 0.35;\n transform-origin: left;\n animation: toastShrink var(--toast-duration) linear forwards;\n}\n\n@keyframes toastSlideDown {\n from {\n opacity: 0;\n transform: translateY(-0.75em);\n }\n\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes toastSlideUp {\n from {\n opacity: 0;\n transform: translateY(0.75em);\n }\n\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes toastFadeOut {\n from {\n opacity: 1;\n transform: scale(1);\n }\n\n to {\n opacity: 0;\n transform: scale(0.92);\n }\n}\n\n@keyframes toastShrink {\n from {\n transform: scaleX(1);\n }\n\n to {\n transform: scaleX(0);\n }\n}\n"],"mappings":""}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import e from"../bodyEnd/bodyEnd.mjs";import{
|
|
1
|
+
import e from"../bodyEnd/bodyEnd.mjs";import{PopoverAlign as t,PopoverPlacement as n}from"../popover/popover.types.mjs";import{usePopoverPosition as r}from"../popover/usePopoverPosition.mjs";import i from"./tooltip.module.mjs";import{useLayoutEffect as a,useRef as o,useState as s}from"react";import c from"classnames";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";var f=6;function p({variant:p,message:m=``,isVisible:h=!0,tooltipPosition:g,onClick:_}){let[v,y]=s(!1),b=o(null),x=o(null),S=o(null),C=o(null),w=o(null),[T,E]=s(10),D=p===`details`?v:h;a(()=>{S.current=p===`details`?x.current:b.current?.parentElement??null}),a(()=>{if(D){let e=S.current?.getBoundingClientRect();E(e?.width??10)}},[D]),r({isOpen:D,placement:n.Top,align:p===`error`?t.End:t.Start,offset:f,triggerRef:S,floatingRef:C,panelRef:C,arrowRef:w,shrinkToFit:!0});let O=D&&u(e,{children:u(`div`,{ref:C,className:c(p===`error`?i.tooltipError:i.tooltipBubble,g),style:{"--tooltip-trigger-width":`${T}px`},onClick:_,children:m})});return p===`details`?d(`div`,{ref:x,className:i.tooltipDetails,children:[u(`span`,{className:i.tooltipDetailsIcon,onMouseEnter:()=>y(!0),onMouseLeave:()=>y(!1),children:`?`}),O]}):p===`info`||p===`error`?d(l,{children:[u(`span`,{ref:b,style:{display:`none`}}),O]}):null}export{p as default};
|
|
2
2
|
//# sourceMappingURL=tooltip.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tooltip.mjs","names":[],"sources":["../../../../package/common/tooltip/tooltip.tsx"],"sourcesContent":["import React, { useLayoutEffect, useRef, useState } from 'react';\nimport cx from 'classnames';\nimport BodyEnd from 'components/common/bodyEnd';\nimport {
|
|
1
|
+
{"version":3,"file":"tooltip.mjs","names":[],"sources":["../../../../package/common/tooltip/tooltip.tsx"],"sourcesContent":["import React, { useLayoutEffect, useRef, useState } from 'react';\nimport cx from 'classnames';\nimport BodyEnd from 'components/common/bodyEnd';\nimport { usePopoverPosition } from '../popover/usePopoverPosition';\nimport { PopoverAlign, PopoverPlacement } from '../popover/popover.types';\nimport styles from './tooltip.module.pcss';\nimport type { TooltipProps } from './tooltip.types';\n\n/** The gap the arrow sits in, between the bubble and the trigger it points at. */\nconst TOOLTIP_OFFSET = 6;\n\nexport default function Tooltip({ variant, message = '', isVisible = true, tooltipPosition, onClick }: TooltipProps) {\n const [detailsHovered, setDetailsHovered] = useState(false);\n\n const sentinelRef = useRef<HTMLSpanElement>(null);\n const detailsRef = useRef<HTMLDivElement>(null);\n const triggerRef = useRef<HTMLElement | null>(null);\n const bubbleRef = useRef<HTMLDivElement>(null);\n // The bubble draws its own arrow in CSS, pointed by `--tooltip-trigger-width`,\n // rather than taking Popover's separate arrow element.\n const arrowRef = useRef<HTMLElement | null>(null);\n const [triggerWidth, setTriggerWidth] = useState(10);\n\n const shown = variant === 'details' ? detailsHovered : isVisible;\n\n useLayoutEffect(() => {\n triggerRef.current = variant === 'details' ? detailsRef.current : (sentinelRef.current?.parentElement ?? null);\n });\n\n useLayoutEffect(() => {\n if (shown) {\n const rect = triggerRef.current?.getBoundingClientRect();\n setTriggerWidth(rect?.width ?? 10);\n }\n }, [shown]);\n\n usePopoverPosition({\n isOpen: shown,\n placement: PopoverPlacement.Top,\n // An error hangs off the trailing edge of the field it belongs to; the other\n // two off the leading edge, which is where their arrow is drawn.\n align: variant === 'error' ? PopoverAlign.End : PopoverAlign.Start,\n offset: TOOLTIP_OFFSET,\n triggerRef,\n floatingRef: bubbleRef,\n panelRef: bubbleRef,\n arrowRef,\n // A bubble that slid off its trigger's edge to stay on screen would leave its\n // arrow pointing at nothing. Wrapping one more line keeps both.\n shrinkToFit: true,\n });\n\n const bubble = shown && (\n <BodyEnd>\n <div\n ref={bubbleRef}\n className={cx(variant === 'error' ? styles.tooltipError : styles.tooltipBubble, tooltipPosition)}\n style={{ '--tooltip-trigger-width': `${triggerWidth}px` } as React.CSSProperties}\n onClick={onClick}\n >\n {message}\n </div>\n </BodyEnd>\n );\n\n if (variant === 'details') {\n return (\n <div ref={detailsRef} className={styles.tooltipDetails}>\n <span\n className={styles.tooltipDetailsIcon}\n onMouseEnter={() => setDetailsHovered(true)}\n onMouseLeave={() => setDetailsHovered(false)}\n >\n ?\n </span>\n {bubble}\n </div>\n );\n }\n\n if (variant === 'info' || variant === 'error') {\n return (\n <>\n <span ref={sentinelRef} style={{ display: 'none' }} />\n {bubble}\n </>\n );\n }\n\n return null;\n}\n"],"mappings":"+XASA,IAAM,EAAiB,EAEvB,SAAwB,EAAQ,CAAE,UAAS,UAAU,GAAI,YAAY,GAAM,kBAAiB,WAAyB,CACnH,GAAM,CAAC,EAAgB,GAAqB,EAAS,EAAK,EAEpD,EAAc,EAAwB,IAAI,EAC1C,EAAa,EAAuB,IAAI,EACxC,EAAa,EAA2B,IAAI,EAC5C,EAAY,EAAuB,IAAI,EAGvC,EAAW,EAA2B,IAAI,EAC1C,CAAC,EAAc,GAAmB,EAAS,EAAE,EAE7C,EAAQ,IAAY,UAAY,EAAiB,EAEvD,MAAsB,CACpB,EAAW,QAAU,IAAY,UAAY,EAAW,QAAW,EAAY,SAAS,eAAiB,IAC3G,CAAC,EAED,MAAsB,CACpB,GAAI,EAAO,CACT,IAAM,EAAO,EAAW,SAAS,sBAAsB,EACvD,EAAgB,GAAM,OAAS,EAAE,CACnC,CACF,EAAG,CAAC,CAAK,CAAC,EAEV,EAAmB,CACjB,OAAQ,EACR,UAAW,EAAiB,IAG5B,MAAO,IAAY,QAAU,EAAa,IAAM,EAAa,MAC7D,OAAQ,EACR,aACA,YAAa,EACb,SAAU,EACV,WAGA,YAAa,EACf,CAAC,EAED,IAAM,EAAS,GACb,EAAC,EAAD,CAAA,SACE,EAAC,MAAD,CACE,IAAK,EACL,UAAW,EAAG,IAAY,QAAU,EAAO,aAAe,EAAO,cAAe,CAAe,EAC/F,MAAO,CAAE,0BAA2B,GAAG,EAAa,GAAI,EAC/C,UAER,SAAA,CACE,CAAA,CACE,CAAA,EA2BX,OAxBI,IAAY,UAEZ,EAAC,MAAD,CAAK,IAAK,EAAY,UAAW,EAAO,eAAxC,SAAA,CACE,EAAC,OAAD,CACE,UAAW,EAAO,mBAClB,iBAAoB,EAAkB,EAAI,EAC1C,iBAAoB,EAAkB,EAAK,EAC5C,SAAA,GAEK,CAAA,EACL,CACE,IAIL,IAAY,QAAU,IAAY,QAElC,EAAA,EAAA,CAAA,SAAA,CACE,EAAC,OAAD,CAAM,IAAK,EAAa,MAAO,CAAE,QAAS,MAAO,CAAI,CAAA,EACpD,CACD,CAAA,CAAA,EAIC,IACT"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var e=`
|
|
1
|
+
var e=`tooltipBubble_uyev0`,t=`tooltipError_gUBut`,n=`tooltipDetails_R7N16`,r=`tooltipDetails-icon_rsjns`,i={tooltipBubble:e,tooltipError:t,tooltipDetails:n,"tooltipDetails-icon":`tooltipDetails-icon_rsjns`,tooltipDetailsIcon:r};export{i as default,e as tooltipBubble,n as tooltipDetails,r as tooltipDetailsIcon,t as tooltipError};
|
|
2
2
|
//# sourceMappingURL=tooltip.module.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tooltip.module.mjs","names":[],"sources":["../../../../package/common/tooltip/tooltip.module.pcss"],"sourcesContent":[".
|
|
1
|
+
{"version":3,"file":"tooltip.module.mjs","names":[],"sources":["../../../../package/common/tooltip/tooltip.module.pcss"],"sourcesContent":["/* Both bubbles are portaled to the end of the document and placed by\n `usePopoverPosition`, which writes `top`, `left`, `visibility` and\n `data-placement` straight onto them. */\n.tooltipBubble,\n.tooltipError {\n position: fixed;\n z-index: 10;\n width: max-content;\n\n /* So a max-width is the width you actually get, padding included. Without it the\n screen cap below let the box out by its own padding. */\n box-sizing: border-box;\n\n /* Hidden until the first coordinates are written, to avoid a top-left flash. */\n visibility: hidden;\n}\n\n.tooltipBubble {\n /* Resolved on the bubble so it, its arrow and the badge cannot drift apart. The\n default is an inverse of the theme, not a fixed slate: a tooltip has to separate\n from the page it floats over, and a dark bubble sat almost invisibly on a dark\n theme. */\n --custom-tooltip-background: var(--tooltip-background, color-mix(in oklab, var(--text-color) 82%, var(--background)));\n --custom-tooltip-color: var(--tooltip-color, var(--background));\n\n /* The lengths here are em against this bubble's own 0.75em, so the ratios are of 12px,\n not 16, and max-width is a line measure rather than a pixel cap. */\n border-radius: 0.25em;\n\n /* Padding included, per the border-box above. The second term is the screen, with\n the gutter `usePopoverPosition` keeps when it shifts a panel back on-screen: a\n bubble wider than that cannot be clamped into view, only pushed off one edge,\n so it wraps instead. */\n max-width: min(16.667em, calc(100vw - 16px));\n font-size: 0.75em;\n background-color: var(--custom-tooltip-background);\n padding: 0.5em 0.75em;\n color: var(--custom-tooltip-color);\n pointer-events: none;\n\n &::after {\n content: '';\n position: absolute;\n top: 100%;\n\n /* The bubble's leading edge is the trigger's, so half the trigger's width is the\n trigger's centre. The second term must stay half the arrow's own width, or it\n stops pointing at it. */\n left: calc(var(--tooltip-trigger-width, 10px) / 2 - 0.4167em);\n border-width: 0.4167em;\n border-style: solid;\n border-color: var(--custom-tooltip-background) transparent transparent;\n }\n\n &[data-placement='bottom']::after {\n top: auto;\n bottom: 100%;\n border-color: transparent transparent var(--custom-tooltip-background);\n }\n}\n\n.tooltipDetails {\n /* Repeated from .tooltipBubble above: the badge is a second root, rendered without one. */\n --custom-tooltip-background: var(--tooltip-background, color-mix(in oklab, var(--text-color) 82%, var(--background)));\n --custom-tooltip-color: var(--tooltip-color, var(--background));\n\n position: relative;\n display: inline-flex;\n align-items: center;\n\n &-icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n\n /* The theme's base, not a multiple of the font below: that landed a fraction of a pixel short. */\n width: var(--default-font-size);\n height: var(--default-font-size);\n border-radius: 50%;\n\n /* calc, not em: this badge renders inline wherever the consumer puts it, so em would\n measure that text. The bubble above can use em, being portaled to #bodyEnd. */\n font-size: calc(var(--default-font-size) * 0.6875);\n font-weight: 700;\n background-color: var(--custom-tooltip-background);\n color: var(--custom-tooltip-color);\n cursor: default;\n user-select: none;\n }\n}\n\n.tooltipError {\n border-radius: 0.3em;\n\n /* No measure of its own: a validator's message is as long as it is. The screen is\n still the limit, though, the same one the bubble above takes. */\n max-width: calc(100vw - 16px);\n background-color: var(--error-lighter);\n color: var(--error-color);\n font-size: 0.625em;\n padding: 0.6em 0.9em;\n\n &::after {\n content: '';\n position: absolute;\n top: 100%;\n right: 1.2em;\n border-width: 0.5em;\n border-style: solid;\n border-color: var(--error-border-color) transparent transparent transparent;\n }\n\n &[data-placement='bottom']::after {\n top: auto;\n bottom: 100%;\n border-color: transparent transparent var(--error-border-color) transparent;\n }\n}\n"],"mappings":""}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var e=`virtualList_qBPNc`,t=`virtualList-drag-clone_artnC`,n=`virtualList-header_0Ellb`,r=`virtualList-header-cell_c8NGV`,i=`virtualList-header-resize_cbYFc`,a=`virtualList-header-sort_Cdpe3`,o=`virtualList-header-sort-label_6MaZ3`,s=`virtualList-header-sort-icon_Z-Nrd`,c=`virtualList-header-sort-icon-active_g7qrb`,l=`virtualList-header-toggle_pYFxD`,u=`virtualList-toggle-
|
|
1
|
+
var e=`virtualList_qBPNc`,t=`virtualList-drag-clone_artnC`,n=`virtualList-header_0Ellb`,r=`virtualList-header-cell_c8NGV`,i=`virtualList-header-resize_cbYFc`,a=`virtualList-header-sort_Cdpe3`,o=`virtualList-header-sort-label_6MaZ3`,s=`virtualList-header-sort-icon_Z-Nrd`,c=`virtualList-header-sort-icon-active_g7qrb`,l=`virtualList-header-toggle_pYFxD`,u=`virtualList-toggle-panel_Uksmk`,d=`virtualList-toggle-wrapper_JP32M`,f=`virtualList-toggle-popover_gbpd7`,p=`virtualList-toggle-item_5gu5d`,m=`virtualList-toggle-reset_3UANJ`,h=`virtualList-column-chip_nOqr6`,g=`virtualList-select-cell_s9kAy`,_=`virtualList-body_k-fRr`,v=`virtualList-row-active_H5r5-`,y=`virtualList-resizing_28Mn4`,b=`virtualList-row_TTY50`,x=`virtualList-row-no-divider_Ct0gV`,S=`virtualList-row-no-hover_2d3mH`,C=`virtualList-row-selected_hwEN-`,w=`virtualList-row-draggable_I86ha`,T=`virtualList-row-dragging_6T5tQ`,E=`virtualList-row-drop-inside_Uhi9n`,D=`virtualList-drop-line_EM-g4`,O=`virtualList-drop-line-before_n-0iZ`,k=`virtualList-drop-line-after_2dld-`,A=`virtualList-reordering_Rt9E3`,j=`virtualList-cell_H0zBv`,M=`virtualList-loading-full_wzZNM`,N=`virtualList-loading-indicator_EJced`,P=`virtualList-spinner_apClW`,F={virtualList:e,"virtualList-drag-clone":`virtualList-drag-clone_artnC`,virtualListDragClone:t,"virtualList-header":`virtualList-header_0Ellb`,virtualListHeader:n,"virtualList-header-cell":`virtualList-header-cell_c8NGV`,virtualListHeaderCell:r,"virtualList-header-resize":`virtualList-header-resize_cbYFc`,virtualListHeaderResize:i,"virtualList-header-sort":`virtualList-header-sort_Cdpe3`,virtualListHeaderSort:a,"virtualList-header-sort-label":`virtualList-header-sort-label_6MaZ3`,virtualListHeaderSortLabel:o,"virtualList-header-sort-icon":`virtualList-header-sort-icon_Z-Nrd`,virtualListHeaderSortIcon:s,"virtualList-header-sort-icon-active":`virtualList-header-sort-icon-active_g7qrb`,virtualListHeaderSortIconActive:c,"virtualList-header-toggle":`virtualList-header-toggle_pYFxD`,virtualListHeaderToggle:l,"virtualList-toggle-panel":`virtualList-toggle-panel_Uksmk`,virtualListTogglePanel:u,"virtualList-toggle-wrapper":`virtualList-toggle-wrapper_JP32M`,virtualListToggleWrapper:d,"virtualList-toggle-popover":`virtualList-toggle-popover_gbpd7`,virtualListTogglePopover:f,"virtualList-toggle-item":`virtualList-toggle-item_5gu5d`,virtualListToggleItem:p,"virtualList-toggle-reset":`virtualList-toggle-reset_3UANJ`,virtualListToggleReset:m,"virtualList-column-chip":`virtualList-column-chip_nOqr6`,virtualListColumnChip:h,"virtualList-select-cell":`virtualList-select-cell_s9kAy`,virtualListSelectCell:g,"virtualList-body":`virtualList-body_k-fRr`,virtualListBody:_,"virtualList-row-active":`virtualList-row-active_H5r5-`,virtualListRowActive:v,"virtualList-resizing":`virtualList-resizing_28Mn4`,virtualListResizing:y,"virtualList-row":`virtualList-row_TTY50`,virtualListRow:b,"virtualList-row-no-divider":`virtualList-row-no-divider_Ct0gV`,virtualListRowNoDivider:x,"virtualList-row-no-hover":`virtualList-row-no-hover_2d3mH`,virtualListRowNoHover:S,"virtualList-row-selected":`virtualList-row-selected_hwEN-`,virtualListRowSelected:C,"virtualList-row-draggable":`virtualList-row-draggable_I86ha`,virtualListRowDraggable:w,"virtualList-row-dragging":`virtualList-row-dragging_6T5tQ`,virtualListRowDragging:T,"virtualList-row-drop-inside":`virtualList-row-drop-inside_Uhi9n`,virtualListRowDropInside:E,"virtualList-drop-line":`virtualList-drop-line_EM-g4`,virtualListDropLine:D,"virtualList-drop-line-before":`virtualList-drop-line-before_n-0iZ`,virtualListDropLineBefore:O,"virtualList-drop-line-after":`virtualList-drop-line-after_2dld-`,virtualListDropLineAfter:k,"virtualList-reordering":`virtualList-reordering_Rt9E3`,virtualListReordering:A,"virtualList-cell":`virtualList-cell_H0zBv`,virtualListCell:j,"virtualList-loading-full":`virtualList-loading-full_wzZNM`,virtualListLoadingFull:M,"virtualList-loading-indicator":`virtualList-loading-indicator_EJced`,virtualListLoadingIndicator:N,"virtualList-spinner":`virtualList-spinner_apClW`,virtualListSpinner:P};export{F as default,e as virtualList,_ as virtualListBody,j as virtualListCell,h as virtualListColumnChip,t as virtualListDragClone,D as virtualListDropLine,k as virtualListDropLineAfter,O as virtualListDropLineBefore,n as virtualListHeader,r as virtualListHeaderCell,i as virtualListHeaderResize,a as virtualListHeaderSort,s as virtualListHeaderSortIcon,c as virtualListHeaderSortIconActive,o as virtualListHeaderSortLabel,l as virtualListHeaderToggle,M as virtualListLoadingFull,N as virtualListLoadingIndicator,A as virtualListReordering,y as virtualListResizing,b as virtualListRow,v as virtualListRowActive,w as virtualListRowDraggable,T as virtualListRowDragging,E as virtualListRowDropInside,x as virtualListRowNoDivider,S as virtualListRowNoHover,C as virtualListRowSelected,g as virtualListSelectCell,P as virtualListSpinner,p as virtualListToggleItem,u as virtualListTogglePanel,f as virtualListTogglePopover,m as virtualListToggleReset,d as virtualListToggleWrapper};
|
|
2
2
|
//# sourceMappingURL=virtualList.module.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"virtualList.module.mjs","names":[],"sources":["../../../../package/common/virtualList/virtualList.module.pcss"],"sourcesContent":[".virtualList {\n overflow-y: auto;\n box-sizing: border-box;\n color: var(--text-color);\n font-family: var(--default-font);\n\n /* Disable the browser's own scroll anchoring — the component does its own\n scroll-position correction when row heights change, and the two fighting\n each other causes the thumb to desync while dragging. */\n overflow-anchor: none;\n\n /* Reserve the scrollbar gutter so rows don't re-wrap (and re-measure) when the\n vertical scrollbar appears/disappears as content grows. */\n scrollbar-gutter: stable;\n\n /* Establish a stacking context so every z-index inside the list (sticky\n header, toggle popover, drag clone) stays scoped to this component and\n can't paint over outside content like a modal. */\n isolation: isolate;\n\n &-drag-clone {\n box-sizing: border-box;\n contain: layout paint style;\n cursor: grabbing;\n\n /* It tracks the finger via transform — never animate that. */\n transition: none;\n }\n\n &-header {\n display: grid;\n position: sticky;\n top: 0;\n\n /* Frozen layouts are exact pixels and may total more than the viewport, so\n the header and the row canvas below both take that total and the list\n scrolls sideways. `--vl-total` is only set once a column has been\n resized; until then this resolves to 100% and nothing changes. */\n width: max(100%, var(--vl-total, 0px));\n\n /* Above focused rows (z-index 1) so a focused row scrolled under the header\n never paints over it; the drag clone (z-index 3) still floats above both. */\n z-index: 2;\n background: var(--background-accent);\n border-bottom: 1px solid var(--border-color);\n box-sizing: border-box;\n\n &-cell {\n padding: 8px 12px;\n font-weight: 600;\n font-size: 13px;\n color: var(--text-dark);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n box-sizing: border-box;\n\n /* Anchors the resize handle to the cell's trailing edge. */\n position: relative;\n\n /* The cell, not the button inside it, carries the header's tab stop, so\n this is the ring a keyboard user follows. Inset because the cell clips\n its overflow and an outward outline would be cut off. */\n &:focus-visible {\n outline: 1px solid var(--focus-border-color, var(--primary-color));\n outline-offset: -1px;\n }\n }\n\n /* Resize handle: a grab strip on the column's trailing edge, wider than the\n line it sits on because a 1px target is unhittable. It stays inside the\n cell rather than straddling the edge, since the cell clips its overflow\n to keep a long header out of its neighbour. */\n &-resize {\n position: absolute;\n top: 0;\n bottom: 0;\n right: 0;\n width: 10px;\n cursor: col-resize;\n -webkit-tap-highlight-color: transparent;\n touch-action: none;\n\n /* The line itself, drawn on the trailing edge and revealed on hover. */\n &::after {\n content: '';\n position: absolute;\n top: 4px;\n bottom: 4px;\n right: 0;\n width: 2px;\n border-radius: 1px;\n background: var(--primary-color);\n opacity: 0;\n transition: opacity 0.12s;\n }\n\n &:hover::after,\n &:active::after {\n opacity: 1;\n }\n }\n\n /* The clickable part of a sortable header cell. Strips the button chrome and\n inherits the cell's typography, so a sortable header looks identical to a\n plain one until it's hovered. */\n &-sort {\n font: inherit;\n color: inherit;\n background: none;\n border: none;\n margin: 0;\n padding: 0;\n display: flex;\n align-items: center;\n gap: 6px;\n min-width: 0;\n max-width: 100%;\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n\n &:focus-visible {\n outline: 1px solid var(--focus-border-color, var(--primary-color));\n outline-offset: 2px;\n }\n\n /* The cell's own ellipsis can't apply once its content is a flex button,\n so the truncation moves onto the label. */\n &-label {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n &-icon {\n flex: none;\n font-size: 11px;\n opacity: 0.35;\n transition:\n opacity 0.15s,\n color 0.15s;\n\n &-active {\n opacity: 1;\n color: var(--primary-color);\n }\n }\n\n &:hover &-icon {\n opacity: 0.75;\n }\n\n &:hover &-icon-active {\n opacity: 1;\n }\n }\n\n &-toggle {\n background: none;\n border: none;\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n padding: 4px 8px;\n color: var(--text-dark);\n display: flex;\n align-items: center;\n border-radius: var(--default-border-radius);\n transition: background 0.15s;\n\n &:hover {\n background: var(--background-accent-light);\n color: var(--text-color);\n }\n }\n }\n\n &-toggle {\n &-wrapper {\n position: absolute;\n right: 0;\n top: 0;\n bottom: 0;\n display: flex;\n align-items: center;\n padding: 0 4px;\n }\n\n /* Chrome (background, shadow, radius, positioning) is provided by the\n FloatingMenu container this renders inside — keep only sizing here. */\n &-popover {\n display: flex;\n flex-direction: column;\n min-width: 160px;\n }\n\n &-item {\n padding: 4px 12px;\n white-space: nowrap;\n transition: background 0.1s;\n font-size: 14px;\n\n &:hover {\n background: var(--background-accent-light);\n }\n }\n\n /* Only rendered once a column has actually been resized, so it reads as an\n undo for something the user just did rather than a permanent option. */\n &-reset {\n margin-top: 4px;\n padding: 6px 12px;\n border: none;\n border-top: 1px solid var(--border-color);\n background: none;\n font: inherit;\n font-size: 13px;\n color: var(--text-color);\n text-align: left;\n white-space: nowrap;\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n transition: background 0.1s;\n\n &:hover {\n background: var(--background-accent-light);\n }\n }\n }\n\n /* Count badge on the column-toggle cog: how many columns the user has hidden.\n Positioned at the cog's upper-right corner; non-interactive. */\n &-column-chip {\n position: absolute;\n top: 0;\n right: 0;\n min-width: 16px;\n height: 16px;\n padding: 0 4px;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n background: var(--primary-color);\n color: var(--text-on-primary);\n font-size: 10px;\n font-weight: 600;\n line-height: 1;\n border-radius: 8px;\n pointer-events: none;\n }\n\n &-select-cell {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0 4px;\n box-sizing: border-box;\n\n /* Only the header's select-all cell is focusable; the ones in rows are not. */\n &:focus-visible {\n outline: 1px solid var(--focus-border-color, var(--primary-color));\n outline-offset: -1px;\n }\n }\n\n &-body {\n position: relative;\n box-sizing: border-box;\n\n /* Rows are absolute with left/right 0, so they inherit this width and stay\n aligned with the header when the table is wider than the viewport. */\n width: max(100%, var(--vl-total, 0px));\n }\n\n /* The list itself holds the tab stop, so the active row cannot use a\n `:focus-visible` of its own. Ringing the list instead would mark the whole\n table rather than the row the arrow keys are on, so the list drops its own\n outline and lends it to that row. Scoped to `:focus-visible`, a mouse user\n never sees it. */\n &:focus-visible {\n outline: none;\n\n & .virtualList-row-active {\n outline: 2px solid var(--focus-border-color, var(--primary-color));\n outline-offset: -2px;\n }\n }\n\n /* A resize drag travels over the rows, and their hover highlight following the\n pointer is noise. Inert rather than a `:hover` override, which would have to\n out-specify the selected-row rule to work. The drag itself is unaffected:\n pointer capture bypasses hit testing. */\n &-resizing &-body {\n pointer-events: none;\n }\n\n &-row {\n border-bottom: 1px solid var(--border-color);\n box-sizing: border-box;\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n transition: background 0.1s;\n\n /* Isolate each row's layout/style so measuring or restyling one row can't force\n the whole list to re-layout — keeps fast scrolling smooth. */\n contain: layout style;\n\n &-no-divider {\n border-bottom: none;\n }\n\n &:hover {\n background: var(--background-accent-light);\n }\n\n /* Opt out of the hover highlight (e.g. when each row is a Card that handles\n its own hover). Declared before the `-selected` rule below, so a selected\n row's highlight still wins on hover. */\n &-no-hover:hover {\n background: transparent;\n }\n\n &-selected {\n background: var(--primary-lighter);\n\n &:hover {\n background: var(--primary-lighter);\n }\n }\n\n &-draggable {\n cursor: grab;\n\n /* Stop the mobile long-press from selecting text or showing the callout. */\n user-select: none;\n -webkit-touch-callout: none;\n\n &:active {\n cursor: grabbing;\n }\n }\n\n &-dragging {\n opacity: 0.4;\n }\n\n /* Tree-reorder `inside` drop: the dragged node becomes a child of this row,\n so highlight the whole row instead of drawing a between-rows line. */\n &-drop-inside {\n background: var(--primary-lighter);\n box-shadow: inset 0 0 0 2px var(--primary-color);\n }\n }\n\n /* Tree-reorder `before`/`after` drop line. Positioned inside the (relatively\n positioned absolute) row; `left` is set inline to the target's indent so it\n starts where the dropped content will. */\n &-drop-line {\n position: absolute;\n right: 0;\n height: 2px;\n background: var(--primary-color);\n pointer-events: none;\n z-index: 1;\n\n /* A small knob at the line's start, the usual tree drop-indicator look. */\n &::before {\n content: '';\n position: absolute;\n left: 0;\n top: 50%;\n width: 6px;\n height: 6px;\n border-radius: 50%;\n background: var(--primary-color);\n transform: translate(-50%, -50%);\n }\n\n &-before {\n top: -1px;\n }\n\n &-after {\n bottom: -1px;\n }\n }\n\n /* While a row is being dragged, suppress hover backgrounds so the pointer\n moving across rows doesn't light up the wrong one, and stop text selection.\n `touch-action: none` stops the touch drag from also scrolling the list\n (only active once the long-press has armed the drag). */\n &-reordering {\n touch-action: none;\n\n .virtualList-row {\n user-select: none;\n\n &:hover {\n background: transparent;\n }\n\n &.virtualList-row-selected:hover {\n background: var(--primary-lighter);\n }\n\n &.virtualList-row-dragging {\n background: transparent;\n }\n }\n }\n\n &-cell {\n padding: 8px 12px;\n overflow: hidden;\n text-overflow: ellipsis;\n font-size: 14px;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n min-width: 0;\n\n /* `fit` columns are content-sized — keep their cells on a single line so the\n content can't wrap, and so the width measurement reads the true intrinsic\n width. (Other cells are free to wrap for variable-height rows.) */\n &[data-fit-key] {\n white-space: nowrap;\n }\n }\n\n &-loading {\n &-full {\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100%;\n }\n\n &-indicator {\n display: flex;\n justify-content: center;\n align-items: center;\n padding: 8px 0;\n }\n }\n\n &-spinner {\n width: 32px;\n height: 32px;\n }\n}\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"virtualList.module.mjs","names":[],"sources":["../../../../package/common/virtualList/virtualList.module.pcss"],"sourcesContent":[".virtualList {\n overflow-y: auto;\n box-sizing: border-box;\n color: var(--text-color);\n font-family: var(--default-font);\n\n /* Disable the browser's own scroll anchoring — the component does its own\n scroll-position correction when row heights change, and the two fighting\n each other causes the thumb to desync while dragging. */\n overflow-anchor: none;\n\n /* Reserve the scrollbar gutter so rows don't re-wrap (and re-measure) when the\n vertical scrollbar appears/disappears as content grows. */\n scrollbar-gutter: stable;\n\n /* Establish a stacking context so every z-index inside the list (sticky\n header, toggle popover, drag clone) stays scoped to this component and\n can't paint over outside content like a modal. */\n isolation: isolate;\n\n &-drag-clone {\n box-sizing: border-box;\n contain: layout paint style;\n cursor: grabbing;\n\n /* It tracks the finger via transform — never animate that. */\n transition: none;\n }\n\n &-header {\n display: grid;\n position: sticky;\n top: 0;\n\n /* Frozen layouts are exact pixels and may total more than the viewport, so\n the header and the row canvas below both take that total and the list\n scrolls sideways. `--vl-total` is only set once a column has been\n resized; until then this resolves to 100% and nothing changes. */\n width: max(100%, var(--vl-total, 0px));\n\n /* Above focused rows (z-index 1) so a focused row scrolled under the header\n never paints over it; the drag clone (z-index 3) still floats above both. */\n z-index: 2;\n background: var(--background-accent);\n border-bottom: 1px solid var(--border-color);\n box-sizing: border-box;\n\n &-cell {\n padding: 8px 12px;\n font-weight: 600;\n font-size: 13px;\n color: var(--text-dark);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n box-sizing: border-box;\n\n /* Anchors the resize handle to the cell's trailing edge. */\n position: relative;\n\n /* The cell, not the button inside it, carries the header's tab stop, so\n this is the ring a keyboard user follows. Inset because the cell clips\n its overflow and an outward outline would be cut off. */\n &:focus-visible {\n outline: 1px solid var(--focus-border-color, var(--primary-color));\n outline-offset: -1px;\n }\n }\n\n /* Resize handle: a grab strip on the column's trailing edge, wider than the\n line it sits on because a 1px target is unhittable. It stays inside the\n cell rather than straddling the edge, since the cell clips its overflow\n to keep a long header out of its neighbour. */\n &-resize {\n position: absolute;\n top: 0;\n bottom: 0;\n right: 0;\n width: 10px;\n cursor: col-resize;\n -webkit-tap-highlight-color: transparent;\n touch-action: none;\n\n /* The line itself, drawn on the trailing edge and revealed on hover. */\n &::after {\n content: '';\n position: absolute;\n top: 4px;\n bottom: 4px;\n right: 0;\n width: 2px;\n border-radius: 1px;\n background: var(--primary-color);\n opacity: 0;\n transition: opacity 0.12s;\n }\n\n &:hover::after,\n &:active::after {\n opacity: 1;\n }\n }\n\n /* The clickable part of a sortable header cell. Strips the button chrome and\n inherits the cell's typography, so a sortable header looks identical to a\n plain one until it's hovered. */\n &-sort {\n font: inherit;\n color: inherit;\n background: none;\n border: none;\n margin: 0;\n padding: 0;\n display: flex;\n align-items: center;\n gap: 6px;\n min-width: 0;\n max-width: 100%;\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n\n &:focus-visible {\n outline: 1px solid var(--focus-border-color, var(--primary-color));\n outline-offset: 2px;\n }\n\n /* The cell's own ellipsis can't apply once its content is a flex button,\n so the truncation moves onto the label. */\n &-label {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n &-icon {\n flex: none;\n font-size: 11px;\n opacity: 0.35;\n transition:\n opacity 0.15s,\n color 0.15s;\n\n &-active {\n opacity: 1;\n color: var(--primary-color);\n }\n }\n\n &:hover &-icon {\n opacity: 0.75;\n }\n\n &:hover &-icon-active {\n opacity: 1;\n }\n }\n\n &-toggle {\n background: none;\n border: none;\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n padding: 4px 8px;\n color: var(--text-dark);\n display: flex;\n align-items: center;\n border-radius: var(--default-border-radius);\n transition: background 0.15s;\n\n &:hover {\n background: var(--background-accent-light);\n color: var(--text-color);\n }\n }\n }\n\n /* The entries pad themselves so a hover highlight reaches the panel edge. */\n &-toggle-panel {\n padding: 4px 0;\n }\n\n &-toggle {\n &-wrapper {\n position: absolute;\n right: 0;\n top: 0;\n bottom: 0;\n display: flex;\n align-items: center;\n padding: 0 4px;\n }\n\n /* Chrome (background, shadow, radius, positioning) is provided by the\n Popover panel this renders inside — keep only sizing here. */\n &-popover {\n display: flex;\n flex-direction: column;\n min-width: 160px;\n }\n\n &-item {\n padding: 4px 12px;\n white-space: nowrap;\n transition: background 0.1s;\n font-size: 14px;\n\n /* `:focus` as well, because the panel takes the focus when the keyboard\n opens it, and the checkbox itself is the focusable element. Not\n `--background-accent-light`: it is the same colour as that panel in the\n default theme. */\n &:hover,\n &:focus {\n background: var(--background-accent);\n }\n }\n\n /* Only rendered once a column has actually been resized, so it reads as an\n undo for something the user just did rather than a permanent option. */\n &-reset {\n margin-top: 4px;\n padding: 6px 12px;\n border: none;\n border-top: 1px solid var(--border-color);\n background: none;\n font: inherit;\n font-size: 13px;\n color: var(--text-color);\n text-align: left;\n white-space: nowrap;\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n transition: background 0.1s;\n\n &:hover,\n &:focus {\n background: var(--background-accent);\n }\n }\n }\n\n /* Count badge on the column-toggle cog: how many columns the user has hidden.\n Positioned at the cog's upper-right corner; non-interactive. */\n &-column-chip {\n position: absolute;\n top: 0;\n right: 0;\n min-width: 16px;\n height: 16px;\n padding: 0 4px;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n background: var(--primary-color);\n color: var(--text-on-primary);\n font-size: 10px;\n font-weight: 600;\n line-height: 1;\n border-radius: 8px;\n pointer-events: none;\n }\n\n &-select-cell {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0 4px;\n box-sizing: border-box;\n\n /* Only the header's select-all cell is focusable; the ones in rows are not. */\n &:focus-visible {\n outline: 1px solid var(--focus-border-color, var(--primary-color));\n outline-offset: -1px;\n }\n }\n\n &-body {\n position: relative;\n box-sizing: border-box;\n\n /* Rows are absolute with left/right 0, so they inherit this width and stay\n aligned with the header when the table is wider than the viewport. */\n width: max(100%, var(--vl-total, 0px));\n }\n\n /* The list itself holds the tab stop, so the active row cannot use a\n `:focus-visible` of its own. Ringing the list instead would mark the whole\n table rather than the row the arrow keys are on, so the list drops its own\n outline and lends it to that row. Scoped to `:focus-visible`, a mouse user\n never sees it. */\n &:focus-visible {\n outline: none;\n\n & .virtualList-row-active {\n outline: 2px solid var(--focus-border-color, var(--primary-color));\n outline-offset: -2px;\n }\n }\n\n /* A resize drag travels over the rows, and their hover highlight following the\n pointer is noise. Inert rather than a `:hover` override, which would have to\n out-specify the selected-row rule to work. The drag itself is unaffected:\n pointer capture bypasses hit testing. */\n &-resizing &-body {\n pointer-events: none;\n }\n\n &-row {\n border-bottom: 1px solid var(--border-color);\n box-sizing: border-box;\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n transition: background 0.1s;\n\n /* Isolate each row's layout/style so measuring or restyling one row can't force\n the whole list to re-layout — keeps fast scrolling smooth. */\n contain: layout style;\n\n &-no-divider {\n border-bottom: none;\n }\n\n &:hover {\n background: var(--background-accent-light);\n }\n\n /* Opt out of the hover highlight (e.g. when each row is a Card that handles\n its own hover). Declared before the `-selected` rule below, so a selected\n row's highlight still wins on hover. */\n &-no-hover:hover {\n background: transparent;\n }\n\n &-selected {\n background: var(--primary-lighter);\n\n &:hover {\n background: var(--primary-lighter);\n }\n }\n\n &-draggable {\n cursor: grab;\n\n /* Stop the mobile long-press from selecting text or showing the callout. */\n user-select: none;\n -webkit-touch-callout: none;\n\n &:active {\n cursor: grabbing;\n }\n }\n\n &-dragging {\n opacity: 0.4;\n }\n\n /* Tree-reorder `inside` drop: the dragged node becomes a child of this row,\n so highlight the whole row instead of drawing a between-rows line. */\n &-drop-inside {\n background: var(--primary-lighter);\n box-shadow: inset 0 0 0 2px var(--primary-color);\n }\n }\n\n /* Tree-reorder `before`/`after` drop line. Positioned inside the (relatively\n positioned absolute) row; `left` is set inline to the target's indent so it\n starts where the dropped content will. */\n &-drop-line {\n position: absolute;\n right: 0;\n height: 2px;\n background: var(--primary-color);\n pointer-events: none;\n z-index: 1;\n\n /* A small knob at the line's start, the usual tree drop-indicator look. */\n &::before {\n content: '';\n position: absolute;\n left: 0;\n top: 50%;\n width: 6px;\n height: 6px;\n border-radius: 50%;\n background: var(--primary-color);\n transform: translate(-50%, -50%);\n }\n\n &-before {\n top: -1px;\n }\n\n &-after {\n bottom: -1px;\n }\n }\n\n /* While a row is being dragged, suppress hover backgrounds so the pointer\n moving across rows doesn't light up the wrong one, and stop text selection.\n `touch-action: none` stops the touch drag from also scrolling the list\n (only active once the long-press has armed the drag). */\n &-reordering {\n touch-action: none;\n\n .virtualList-row {\n user-select: none;\n\n &:hover {\n background: transparent;\n }\n\n &.virtualList-row-selected:hover {\n background: var(--primary-lighter);\n }\n\n &.virtualList-row-dragging {\n background: transparent;\n }\n }\n }\n\n &-cell {\n padding: 8px 12px;\n overflow: hidden;\n text-overflow: ellipsis;\n font-size: 14px;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n min-width: 0;\n\n /* `fit` columns are content-sized — keep their cells on a single line so the\n content can't wrap, and so the width measurement reads the true intrinsic\n width. (Other cells are free to wrap for variable-height rows.) */\n &[data-fit-key] {\n white-space: nowrap;\n }\n }\n\n &-loading {\n &-full {\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100%;\n }\n\n &-indicator {\n display: flex;\n justify-content: center;\n align-items: center;\n padding: 8px 0;\n }\n }\n\n &-spinner {\n width: 32px;\n height: 32px;\n }\n}\n"],"mappings":""}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{
|
|
1
|
+
import{PopoverAlign as e,PopoverPlacement as t}from"../popover/popover.types.mjs";import n from"../popover/popover.mjs";import r from"../checkbox/checkbox.mjs";import i from"./virtualList.module.mjs";import{isColumnSortable as a}from"./virtualList.utils.mjs";import{useHeaderNavigation as o}from"./useHeaderNavigation.mjs";import"react";import s from"classnames";import{FontAwesomeIcon as c}from"@fortawesome/react-fontawesome";import{faGear as l,faSort as u,faSortDown as d,faSortUp as f}from"@fortawesome/free-solid-svg-icons";import{jsx as p,jsxs as m}from"react/jsx-runtime";var h=10;function g({headerRef:e,columns:t,cols:n,resize:l,sort:g,onSort:v,multiSelect:y,allSelected:b,someSelected:x,onSelectAll:S,labels:C,classNames:w,styles:T}){let E=+!!y,D=E+n.visibleColumns.length+ +!!n.shouldShowToggle,O=o(D);return m(`div`,{ref:e,className:s(i.virtualListHeader,w?.header),style:{gridTemplateColumns:n.columnTemplate,...n.shouldShowToggle?{paddingRight:32}:{},...T?.header},role:`row`,"aria-rowindex":1,children:[y&&p(`div`,{...O.getStationProps(0),className:s(i.virtualListSelectCell,w?.selectCell),style:T?.selectCell,role:`columnheader`,onKeyDown:e=>{O.handleNavigationKey(e,0)||e.target===e.currentTarget&&(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),S())},children:p(r,{selected:b||x,onToggle:S,"aria-label":C.selectAllRows,tabIndex:-1})}),n.visibleColumns.map((e,t)=>{let n=a(e),r=g&&g.key===e.key?g.direction:null,o=l.getHandleProps(e),_=E+t;return m(`div`,{...O.getStationProps(_),onKeyDown:t=>{if(!O.handleNavigationKey(t,_)){if(t.altKey&&l.isResizable(e)){let n=t.shiftKey?1:h;if(t.key===`ArrowRight`)l.resizeBy(e.key,n);else if(t.key===`ArrowLeft`)l.resizeBy(e.key,-n);else if(t.key===`Home`)l.resizeToMin(e.key);else if(t.key===`End`)l.autoFit(e.key);else return;t.preventDefault();return}n&&t.target===t.currentTarget&&(t.key===`Enter`||t.key===` `)&&(t.preventDefault(),v(e.key))}},className:s(i.virtualListHeaderCell,w?.headerCell),style:T?.headerCell,role:`columnheader`,"data-col-key":e.key,"aria-sort":n?r===`asc`?`ascending`:r===`desc`?`descending`:`none`:void 0,"data-fit-key":e.width.type===`fit`?e.key:void 0,children:[n?m(`button`,{type:`button`,className:s(i.virtualListHeaderSort,w?.headerSort),style:T?.headerSort,onClick:()=>v(e.key),tabIndex:-1,children:[p(`span`,{className:i.virtualListHeaderSortLabel,children:e.label}),p(c,{className:s(i.virtualListHeaderSortIcon,r&&i.virtualListHeaderSortIconActive,w?.sortIcon),style:T?.sortIcon,icon:r===`asc`?f:r===`desc`?d:u})]}):e.label,o&&p(`div`,{...o,className:s(i.virtualListHeaderResize,w?.resizeHandle),style:T?.resizeHandle})]},e.key)}),n.shouldShowToggle&&p(_,{station:D-1,nav:O,columns:t,cols:n,resize:l,labels:C,classNames:w,styles:T})]})}function _({station:a,nav:o,columns:u,cols:d,resize:f,labels:h,classNames:g,styles:_}){return m(`div`,{className:i.virtualListToggleWrapper,children:[p(n,{isOpen:d.toggleOpen,onOpenChange:d.setToggleOpen,placement:t.Bottom,align:e.End,constrainWidth:!1,classNames:{panel:i.virtualListTogglePanel},content:m(`div`,{className:s(i.virtualListTogglePopover,g?.togglePopover),style:_?.togglePopover,children:[u.filter(e=>!e.hideFromToggle).map(e=>p(r,{className:s(i.virtualListToggleItem,g?.toggleItem),style:_?.toggleItem,selected:d.effectiveVisible.has(e.key),onToggle:()=>d.handleToggleColumn(e.key),disabled:e.lockVisible,cursorDefault:!1,children:e.toggleLabel??e.label},e.key)),f.isFrozen&&p(`button`,{type:`button`,className:s(i.virtualListToggleReset,g?.toggleReset),style:_?.toggleReset,onClick:()=>{f.reset(),d.setToggleOpen(!1)},children:h.resetColumnWidths})]}),children:p(`button`,{...o.getStationProps(a),type:`button`,className:s(i.virtualListHeaderToggle,g?.headerToggle),style:_?.headerToggle,"aria-label":h.toggleColumns,onKeyDown:e=>o.handleNavigationKey(e,a),children:p(c,{icon:l,style:_?.headerToggle})})}),d.manuallyHiddenCount>0&&p(`span`,{className:s(i.virtualListColumnChip,g?.columnChip),style:_?.columnChip,"data-column-hidden-count":d.manuallyHiddenCount,"aria-label":h.columnsHidden(d.manuallyHiddenCount),children:d.manuallyHiddenCount})]})}export{g as default};
|
|
2
2
|
//# sourceMappingURL=virtualListHeader.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"virtualListHeader.mjs","names":[],"sources":["../../../../package/common/virtualList/virtualListHeader.tsx"],"sourcesContent":["import React from 'react';\nimport cx from 'classnames';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faGear, faSort, faSortDown, faSortUp } from '@fortawesome/free-solid-svg-icons';\n\nimport styles from './virtualList.module.pcss';\nimport Checkbox from '../checkbox';\nimport FloatingMenu, { Align } from '../floatingMenu';\nimport { isColumnSortable } from './virtualList.utils';\nimport { useHeaderNavigation } from './useHeaderNavigation';\nimport type { UseColumnsResult } from './useColumns';\nimport type { UseColumnResizeResult } from './useColumnResize';\nimport type { SlotClassNames, SlotStyles } from '../types/slots.types';\nimport type { VirtualListColumn, VirtualListLabels, VirtualListSlots, VirtualListSort } from './virtualList.types';\n\n/** Width change of one Alt+arrow press, in px. Alt+Shift steps by one instead. */\nconst KEYBOARD_RESIZE_STEP = 10;\n\n/** FontAwesome's own style type, which carries the `--fa-font-*` custom properties. */\ntype FaStyle = React.CSSProperties & Record<`--fa-font-${string}`, string>;\n\ninterface VirtualListHeaderProps<T> {\n headerRef: React.RefObject<HTMLDivElement | null>;\n /** Every column, including hidden ones: the toggle menu lists them all. */\n columns: VirtualListColumn<T>[];\n cols: UseColumnsResult<T>;\n resize: UseColumnResizeResult<T>;\n sort: VirtualListSort | null;\n onSort: (key: string) => void;\n multiSelect: boolean;\n allSelected: boolean;\n someSelected: boolean;\n onSelectAll: () => void;\n labels: Required<VirtualListLabels>;\n classNames?: SlotClassNames<VirtualListSlots>;\n styles?: SlotStyles<VirtualListSlots>;\n}\n\n/**\n * The table-mode header row: one cell per visible column, each optionally a sort\n * button and a resize handle, plus the column-visibility menu pinned to the\n * right. It is a grid with the same template as every row, which is what keeps\n * the columns aligned across the separate grids.\n *\n * The whole header is a single tab stop (see `useHeaderNavigation`). Focus lands\n * on a header cell rather than on the button inside it, so every key a column\n * understands is handled in one place: Enter or Space sorts, Alt plus the arrow\n * keys resizes, Alt+Home and Alt+End take the column to its minimum or to its\n * content width.\n */\nfunction VirtualListHeader<T>({\n headerRef,\n columns,\n cols,\n resize,\n sort,\n onSort,\n multiSelect,\n allSelected,\n someSelected,\n onSelectAll,\n labels,\n classNames,\n styles: slotStyles,\n}: VirtualListHeaderProps<T>) {\n // Station order is the reading order: the select-all box, the columns, the menu.\n const columnOffset = multiSelect ? 1 : 0;\n const stationCount = columnOffset + cols.visibleColumns.length + (cols.shouldShowToggle ? 1 : 0);\n const nav = useHeaderNavigation(stationCount);\n\n return (\n <div\n ref={headerRef}\n className={cx(styles.virtualListHeader, classNames?.header)}\n style={{\n gridTemplateColumns: cols.columnTemplate,\n ...(cols.shouldShowToggle ? { paddingRight: 32 } : {}),\n ...slotStyles?.header,\n }}\n role='row'\n aria-rowindex={1}\n >\n {multiSelect && (\n <div\n {...nav.getStationProps(0)}\n className={cx(styles.virtualListSelectCell, classNames?.selectCell)}\n style={slotStyles?.selectCell}\n role='columnheader'\n onKeyDown={(event) => {\n if (nav.handleNavigationKey(event, 0)) return;\n if (event.target !== event.currentTarget) return;\n if (event.key !== 'Enter' && event.key !== ' ') return;\n event.preventDefault();\n onSelectAll();\n }}\n >\n <Checkbox\n selected={allSelected || someSelected}\n onToggle={onSelectAll}\n aria-label={labels.selectAllRows}\n tabIndex={-1}\n />\n </div>\n )}\n\n {cols.visibleColumns.map((col, columnIndex) => {\n const sortable = isColumnSortable(col);\n const direction = sort && sort.key === col.key ? sort.direction : null;\n const handleProps = resize.getHandleProps(col);\n const station = columnOffset + columnIndex;\n return (\n <div\n key={col.key}\n {...nav.getStationProps(station)}\n onKeyDown={(event) => {\n if (nav.handleNavigationKey(event, station)) return;\n if (event.altKey && resize.isResizable(col)) {\n const step = event.shiftKey ? 1 : KEYBOARD_RESIZE_STEP;\n if (event.key === 'ArrowRight') resize.resizeBy(col.key, step);\n else if (event.key === 'ArrowLeft') resize.resizeBy(col.key, -step);\n else if (event.key === 'Home') resize.resizeToMin(col.key);\n else if (event.key === 'End') resize.autoFit(col.key);\n else return;\n event.preventDefault();\n return;\n }\n // Only when the cell itself holds the focus: after a mouse click\n // the focus sits on the sort button, which activates on its own.\n if (!sortable || event.target !== event.currentTarget) return;\n if (event.key !== 'Enter' && event.key !== ' ') return;\n event.preventDefault();\n onSort(col.key);\n }}\n className={cx(styles.virtualListHeaderCell, classNames?.headerCell)}\n style={slotStyles?.headerCell}\n role='columnheader'\n data-col-key={col.key}\n aria-sort={\n sortable ? (direction === 'asc' ? 'ascending' : direction === 'desc' ? 'descending' : 'none') : undefined\n }\n data-fit-key={col.width.type === 'fit' ? col.key : undefined}\n >\n {sortable ? (\n <button\n type='button'\n className={cx(styles.virtualListHeaderSort, classNames?.headerSort)}\n style={slotStyles?.headerSort}\n onClick={() => onSort(col.key)}\n tabIndex={-1}\n >\n <span className={styles.virtualListHeaderSortLabel}>{col.label}</span>\n {/* Rendered in every state, inactive included: the header cell is\n measured for `fit` columns and those pins only ever grow, so an\n icon that appears on click would widen the column for good. */}\n <FontAwesomeIcon\n className={cx(\n styles.virtualListHeaderSortIcon,\n direction && styles.virtualListHeaderSortIconActive,\n classNames?.sortIcon,\n )}\n style={slotStyles?.sortIcon as FaStyle}\n icon={direction === 'asc' ? faSortUp : direction === 'desc' ? faSortDown : faSort}\n />\n </button>\n ) : (\n col.label\n )}\n {handleProps && (\n <div\n {...handleProps}\n className={cx(styles.virtualListHeaderResize, classNames?.resizeHandle)}\n style={slotStyles?.resizeHandle}\n />\n )}\n </div>\n );\n })}\n\n {cols.shouldShowToggle && (\n <ColumnToggle\n station={stationCount - 1}\n nav={nav}\n columns={columns}\n cols={cols}\n resize={resize}\n labels={labels}\n classNames={classNames}\n styles={slotStyles}\n />\n )}\n </div>\n );\n}\n\ntype ColumnToggleProps<T> = Pick<\n VirtualListHeaderProps<T>,\n 'columns' | 'cols' | 'resize' | 'labels' | 'classNames' | 'styles'\n> & {\n station: number;\n nav: ReturnType<typeof useHeaderNavigation>;\n};\n\n/**\n * The gear at the header's trailing edge: one checkbox per column, the reset for\n * user-set widths, and a badge counting the columns the user has hidden.\n */\nfunction ColumnToggle<T>({\n station,\n nav,\n columns,\n cols,\n resize,\n labels,\n classNames,\n styles: slotStyles,\n}: ColumnToggleProps<T>) {\n return (\n <div className={styles.virtualListToggleWrapper}>\n <FloatingMenu\n isOpen={cols.toggleOpen}\n onOpenChange={cols.setToggleOpen}\n align={Align.Right}\n dontCloseOnChildClick\n content={\n <div\n className={cx(styles.virtualListTogglePopover, classNames?.togglePopover)}\n style={slotStyles?.togglePopover}\n >\n {columns\n .filter((col) => !col.hideFromToggle)\n .map((col) => (\n <Checkbox\n key={col.key}\n className={cx(styles.virtualListToggleItem, classNames?.toggleItem)}\n style={slotStyles?.toggleItem}\n selected={cols.effectiveVisible.has(col.key)}\n onToggle={() => cols.handleToggleColumn(col.key)}\n disabled={col.lockVisible}\n cursorDefault={false}\n >\n {col.toggleLabel ?? col.label}\n </Checkbox>\n ))}\n {resize.isFrozen && (\n <button\n type='button'\n className={cx(styles.virtualListToggleReset, classNames?.toggleReset)}\n style={slotStyles?.toggleReset}\n onClick={() => {\n resize.reset();\n cols.setToggleOpen(false);\n }}\n >\n {labels.resetColumnWidths}\n </button>\n )}\n </div>\n }\n >\n <button\n {...nav.getStationProps(station)}\n type='button'\n className={cx(styles.virtualListHeaderToggle, classNames?.headerToggle)}\n style={slotStyles?.headerToggle}\n aria-label={labels.toggleColumns}\n // Enter and Space are the button's own; only the arrows are ours.\n onKeyDown={(event) => nav.handleNavigationKey(event, station)}\n >\n <FontAwesomeIcon icon={faGear} style={slotStyles?.headerToggle as FaStyle} />\n </button>\n </FloatingMenu>\n {cols.manuallyHiddenCount > 0 && (\n <span\n className={cx(styles.virtualListColumnChip, classNames?.columnChip)}\n style={slotStyles?.columnChip}\n data-column-hidden-count={cols.manuallyHiddenCount}\n aria-label={labels.columnsHidden(cols.manuallyHiddenCount)}\n >\n {cols.manuallyHiddenCount}\n </span>\n )}\n </div>\n );\n}\n\nexport default VirtualListHeader;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"virtualListHeader.mjs","names":[],"sources":["../../../../package/common/virtualList/virtualListHeader.tsx"],"sourcesContent":["import React from 'react';\nimport cx from 'classnames';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faGear, faSort, faSortDown, faSortUp } from '@fortawesome/free-solid-svg-icons';\n\nimport styles from './virtualList.module.pcss';\nimport Checkbox from '../checkbox';\nimport Popover from '../popover';\nimport { PopoverAlign, PopoverPlacement } from '../popover/popover.types';\nimport { isColumnSortable } from './virtualList.utils';\nimport { useHeaderNavigation } from './useHeaderNavigation';\nimport type { UseColumnsResult } from './useColumns';\nimport type { UseColumnResizeResult } from './useColumnResize';\nimport type { SlotClassNames, SlotStyles } from '../types/slots.types';\nimport type { VirtualListColumn, VirtualListLabels, VirtualListSlots, VirtualListSort } from './virtualList.types';\n\n/** Width change of one Alt+arrow press, in px. Alt+Shift steps by one instead. */\nconst KEYBOARD_RESIZE_STEP = 10;\n\n/** FontAwesome's own style type, which carries the `--fa-font-*` custom properties. */\ntype FaStyle = React.CSSProperties & Record<`--fa-font-${string}`, string>;\n\ninterface VirtualListHeaderProps<T> {\n headerRef: React.RefObject<HTMLDivElement | null>;\n /** Every column, including hidden ones: the toggle menu lists them all. */\n columns: VirtualListColumn<T>[];\n cols: UseColumnsResult<T>;\n resize: UseColumnResizeResult<T>;\n sort: VirtualListSort | null;\n onSort: (key: string) => void;\n multiSelect: boolean;\n allSelected: boolean;\n someSelected: boolean;\n onSelectAll: () => void;\n labels: Required<VirtualListLabels>;\n classNames?: SlotClassNames<VirtualListSlots>;\n styles?: SlotStyles<VirtualListSlots>;\n}\n\n/**\n * The table-mode header row: one cell per visible column, each optionally a sort\n * button and a resize handle, plus the column-visibility menu pinned to the\n * right. It is a grid with the same template as every row, which is what keeps\n * the columns aligned across the separate grids.\n *\n * The whole header is a single tab stop (see `useHeaderNavigation`). Focus lands\n * on a header cell rather than on the button inside it, so every key a column\n * understands is handled in one place: Enter or Space sorts, Alt plus the arrow\n * keys resizes, Alt+Home and Alt+End take the column to its minimum or to its\n * content width.\n */\nfunction VirtualListHeader<T>({\n headerRef,\n columns,\n cols,\n resize,\n sort,\n onSort,\n multiSelect,\n allSelected,\n someSelected,\n onSelectAll,\n labels,\n classNames,\n styles: slotStyles,\n}: VirtualListHeaderProps<T>) {\n // Station order is the reading order: the select-all box, the columns, the menu.\n const columnOffset = multiSelect ? 1 : 0;\n const stationCount = columnOffset + cols.visibleColumns.length + (cols.shouldShowToggle ? 1 : 0);\n const nav = useHeaderNavigation(stationCount);\n\n return (\n <div\n ref={headerRef}\n className={cx(styles.virtualListHeader, classNames?.header)}\n style={{\n gridTemplateColumns: cols.columnTemplate,\n ...(cols.shouldShowToggle ? { paddingRight: 32 } : {}),\n ...slotStyles?.header,\n }}\n role='row'\n aria-rowindex={1}\n >\n {multiSelect && (\n <div\n {...nav.getStationProps(0)}\n className={cx(styles.virtualListSelectCell, classNames?.selectCell)}\n style={slotStyles?.selectCell}\n role='columnheader'\n onKeyDown={(event) => {\n if (nav.handleNavigationKey(event, 0)) return;\n if (event.target !== event.currentTarget) return;\n if (event.key !== 'Enter' && event.key !== ' ') return;\n event.preventDefault();\n onSelectAll();\n }}\n >\n <Checkbox\n selected={allSelected || someSelected}\n onToggle={onSelectAll}\n aria-label={labels.selectAllRows}\n tabIndex={-1}\n />\n </div>\n )}\n\n {cols.visibleColumns.map((col, columnIndex) => {\n const sortable = isColumnSortable(col);\n const direction = sort && sort.key === col.key ? sort.direction : null;\n const handleProps = resize.getHandleProps(col);\n const station = columnOffset + columnIndex;\n return (\n <div\n key={col.key}\n {...nav.getStationProps(station)}\n onKeyDown={(event) => {\n if (nav.handleNavigationKey(event, station)) return;\n if (event.altKey && resize.isResizable(col)) {\n const step = event.shiftKey ? 1 : KEYBOARD_RESIZE_STEP;\n if (event.key === 'ArrowRight') resize.resizeBy(col.key, step);\n else if (event.key === 'ArrowLeft') resize.resizeBy(col.key, -step);\n else if (event.key === 'Home') resize.resizeToMin(col.key);\n else if (event.key === 'End') resize.autoFit(col.key);\n else return;\n event.preventDefault();\n return;\n }\n // Only when the cell itself holds the focus: after a mouse click\n // the focus sits on the sort button, which activates on its own.\n if (!sortable || event.target !== event.currentTarget) return;\n if (event.key !== 'Enter' && event.key !== ' ') return;\n event.preventDefault();\n onSort(col.key);\n }}\n className={cx(styles.virtualListHeaderCell, classNames?.headerCell)}\n style={slotStyles?.headerCell}\n role='columnheader'\n data-col-key={col.key}\n aria-sort={\n sortable ? (direction === 'asc' ? 'ascending' : direction === 'desc' ? 'descending' : 'none') : undefined\n }\n data-fit-key={col.width.type === 'fit' ? col.key : undefined}\n >\n {sortable ? (\n <button\n type='button'\n className={cx(styles.virtualListHeaderSort, classNames?.headerSort)}\n style={slotStyles?.headerSort}\n onClick={() => onSort(col.key)}\n tabIndex={-1}\n >\n <span className={styles.virtualListHeaderSortLabel}>{col.label}</span>\n {/* Rendered in every state, inactive included: the header cell is\n measured for `fit` columns and those pins only ever grow, so an\n icon that appears on click would widen the column for good. */}\n <FontAwesomeIcon\n className={cx(\n styles.virtualListHeaderSortIcon,\n direction && styles.virtualListHeaderSortIconActive,\n classNames?.sortIcon,\n )}\n style={slotStyles?.sortIcon as FaStyle}\n icon={direction === 'asc' ? faSortUp : direction === 'desc' ? faSortDown : faSort}\n />\n </button>\n ) : (\n col.label\n )}\n {handleProps && (\n <div\n {...handleProps}\n className={cx(styles.virtualListHeaderResize, classNames?.resizeHandle)}\n style={slotStyles?.resizeHandle}\n />\n )}\n </div>\n );\n })}\n\n {cols.shouldShowToggle && (\n <ColumnToggle\n station={stationCount - 1}\n nav={nav}\n columns={columns}\n cols={cols}\n resize={resize}\n labels={labels}\n classNames={classNames}\n styles={slotStyles}\n />\n )}\n </div>\n );\n}\n\ntype ColumnToggleProps<T> = Pick<\n VirtualListHeaderProps<T>,\n 'columns' | 'cols' | 'resize' | 'labels' | 'classNames' | 'styles'\n> & {\n station: number;\n nav: ReturnType<typeof useHeaderNavigation>;\n};\n\n/**\n * The gear at the header's trailing edge: one checkbox per column, the reset for\n * user-set widths, and a badge counting the columns the user has hidden.\n */\nfunction ColumnToggle<T>({\n station,\n nav,\n columns,\n cols,\n resize,\n labels,\n classNames,\n styles: slotStyles,\n}: ColumnToggleProps<T>) {\n return (\n <div className={styles.virtualListToggleWrapper}>\n <Popover\n isOpen={cols.toggleOpen}\n onOpenChange={cols.setToggleOpen}\n placement={PopoverPlacement.Bottom}\n align={PopoverAlign.End}\n constrainWidth={false}\n classNames={{ panel: styles.virtualListTogglePanel }}\n content={\n <div\n className={cx(styles.virtualListTogglePopover, classNames?.togglePopover)}\n style={slotStyles?.togglePopover}\n >\n {columns\n .filter((col) => !col.hideFromToggle)\n .map((col) => (\n <Checkbox\n key={col.key}\n className={cx(styles.virtualListToggleItem, classNames?.toggleItem)}\n style={slotStyles?.toggleItem}\n selected={cols.effectiveVisible.has(col.key)}\n onToggle={() => cols.handleToggleColumn(col.key)}\n disabled={col.lockVisible}\n cursorDefault={false}\n >\n {col.toggleLabel ?? col.label}\n </Checkbox>\n ))}\n {resize.isFrozen && (\n <button\n type='button'\n className={cx(styles.virtualListToggleReset, classNames?.toggleReset)}\n style={slotStyles?.toggleReset}\n onClick={() => {\n resize.reset();\n cols.setToggleOpen(false);\n }}\n >\n {labels.resetColumnWidths}\n </button>\n )}\n </div>\n }\n >\n <button\n {...nav.getStationProps(station)}\n type='button'\n className={cx(styles.virtualListHeaderToggle, classNames?.headerToggle)}\n style={slotStyles?.headerToggle}\n aria-label={labels.toggleColumns}\n // Enter and Space are the button's own; only the arrows are ours.\n onKeyDown={(event) => nav.handleNavigationKey(event, station)}\n >\n <FontAwesomeIcon icon={faGear} style={slotStyles?.headerToggle as FaStyle} />\n </button>\n </Popover>\n {cols.manuallyHiddenCount > 0 && (\n <span\n className={cx(styles.virtualListColumnChip, classNames?.columnChip)}\n style={slotStyles?.columnChip}\n data-column-hidden-count={cols.manuallyHiddenCount}\n aria-label={labels.columnsHidden(cols.manuallyHiddenCount)}\n >\n {cols.manuallyHiddenCount}\n </span>\n )}\n </div>\n );\n}\n\nexport default VirtualListHeader;\n"],"mappings":"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"}
|
package/dist/esm/index.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{AccordionStyleType as e}from"./common/accordion/accordion.types.mjs";import t from"./common/configProvider/configProvider.mjs";import{useComponentDefaults as n}from"./common/configProvider/useComponentDefaults.mjs";import{useLabels as r}from"./common/configProvider/useLabels.mjs";import{usePresentationDefault as i}from"./common/configProvider/usePresentationDefault.mjs";import a from"./common/accordion/accordion.mjs";import o from"./common/loading/spinnerLoading/index.mjs";import{ButtonSize as s,ButtonStyleType as c,ButtonType as l}from"./common/button/button.types.mjs";import u from"./common/ripple/ripple.mjs";import d from"./common/button/button.mjs";import f from"./common/actionButtons/actionButtons.mjs";import p from"./common/interactableDiv/index.mjs";import m from"./common/actionIcon/actionIcon.mjs";import{AlertStyleType as h}from"./common/alert/alert.types.mjs";import g from"./common/alert/alert.mjs";import _ from"./common/animatedLogo/animatedLogo.mjs";import{AnimatedTextUnit as v,AnimatedTextVariant as y}from"./common/animatedText/animatedText.types.mjs";import b from"./common/animatedText/animatedText.mjs";import{BadgePosition as x,BadgeStyleType as S}from"./common/badge/badge.types.mjs";import C from"./common/badge/badge.mjs";import w from"./common/avatar/avatar.mjs";import T from"./common/avatar/avatarGroup.mjs";import E from"./common/bodyEnd/bodyEnd.mjs";import{Align as D,Presentation as O}from"./common/floatingMenu/floatingMenu.types.mjs";import k from"./common/floatingMenu/floatingMenu.mjs";import A from"./common/breadcrumb/breadcrumb.mjs";import{ButtonGroupOrientation as j}from"./common/buttonGroup/buttonGroup.types.mjs";import M from"./common/buttonGroup/buttonGroup.mjs";import{CardStyleType as N}from"./common/card/card.types.mjs";import P from"./common/card/Card.mjs";import F from"./common/card/CardHeader.mjs";import I from"./common/card/CardMedia.mjs";import L from"./common/card/CardContent.mjs";import R from"./common/card/CardActions.mjs";import z from"./common/carousel/carousel.mjs";import B from"./common/checkbox/checkbox.mjs";import{ChipStyleType as V}from"./common/chip/chip.types.mjs";import H from"./common/chip/chip.mjs";import U from"./common/chip/chipContainer.mjs";import W from"./common/tooltip/tooltip.mjs";import{InputIconPosition as G,InputType as K}from"./common/input/input.types.mjs";import q from"./common/input/input.mjs";import J from"./common/colorPicker/colorPicker.mjs";import Y from"./common/modal/modal.mjs";import X from"./common/confirmModal/confirmModal.mjs";import{getLocale as Z,mapLocale as Q,setLocale as $}from"./services/localization.mjs";import ee from"./common/infiniteBlock/infiniteBlock.mjs";import te from"./common/dropdown/dropdown.mjs";import ne from"./common/datePicker/datePicker.mjs";import{DividerOrientation as re,DividerTextPosition as ie}from"./common/divider/divider.types.mjs";import ae from"./common/divider/divider.mjs";import oe from"./common/drawer/drawer.mjs";import{DropZoneReturnType as se,DropZoneStatus as ce}from"./common/dropZone/dropZone.types.mjs";import le from"./common/dropZone/dropZone.mjs";import ue from"./common/emptyState/emptyState.mjs";import{showToast as de}from"./common/toast/toastService.mjs";import fe from"./common/toast/toastProvider.mjs";import pe from"./common/errorBoundary/errorBoundary.mjs";import me from"./common/fab/fab.mjs";import he from"./common/flip/flip.mjs";import{DoorSwing as ge,OpeningKind as _e,PlanIssueKind as ve,PlanUnitSystem as ye,WallType as be}from"./common/floorPlan/floorPlan.types.mjs";import{MIN_OPENING_WIDTH as xe,MIN_WALL_LENGTH as Se}from"./common/floorPlan/floorPlan.geometry.mjs";import{DEFAULT_WALL_ATTRS as Ce,addOpening as we,addRect as Te,addWall as Ee,cleanupPlan as De,detachWall as Oe,dissolveNode as ke,mergeNodes as Ae,moveNode as je,removeOpening as Me,removeWall as Ne,scalePlan as Pe,splitWall as Fe,transformPlan as Ie,updateOpening as Le,validatePlan as Re,wallLength as ze,weldShortWalls as Be}from"./common/floorPlan/floorPlan.graph.mjs";import{MIN_FLOOR_HEIGHT as Ve,addFloor as He,duplicateFloor as Ue,emptyFloor as We,emptyFloorPlan as Ge,floorBelow as Ke,floorBounds as qe,floorIndex as Je,getFloor as Ye,moveFloor as Xe,removeFloor as Ze,renameFloor as Qe,setFloor as $e,setFloorHeight as et,updateFloor as tt}from"./common/floorPlan/floorPlan.plan.mjs";import{deriveFaces as nt,nodeDegrees as rt}from"./common/floorPlan/floorPlan.faces.mjs";import{commitDerivation as it,derivePlan as at,pruneUnmatchedRooms as ot,roomAtPoint as st}from"./common/floorPlan/floorPlan.rooms.mjs";import{buildWallPaths as ct,openingGeometry as lt,wallCentrelineSpans as ut}from"./common/floorPlan/floorPlan.path.mjs";import{HIT_PX as dt,HIT_PX_COARSE as ft,hitTest as pt,selectionsEqual as mt,worldTolerances as ht}from"./common/floorPlan/floorPlan.hit.mjs";import{DEFAULT_SNAP_OPTIONS as gt,SnapKind as _t,clientToWorld as vt,resolveSnap as yt,screenScale as bt}from"./common/floorPlan/floorPlan.snap.mjs";import{PLAN_FORMAT_VERSION as xt,planFromJson as St,planToJson as Ct}from"./common/floorPlan/floorPlan.json.mjs";import{buildPlanMesh as wt}from"./common/floorPlan/floorPlan.mesh.mjs";import{planFromLegacySvg as Tt}from"./common/floorPlan/legacySvg.mjs";import Et from"./common/iconPicker/iconPicker.mjs";import Dt from"./common/idleManager/idleManager.mjs";import Ot from"./common/inputDropdown/inputDropdown.mjs";import kt from"./common/kanbanBoard/KanbanColumn.mjs";import At from"./common/kanbanBoard/KanbanBoard.mjs";import jt from"./common/searchInput/searchInput.mjs";import Mt from"./common/klipyPicker/klipyPicker.mjs";import Nt from"./common/loading/iconLoading/index.mjs";import{PopoverAlign as Pt,PopoverPlacement as Ft,PopoverTrigger as It}from"./common/popover/popover.types.mjs";import Lt from"./common/popover/popover.mjs";import Rt from"./common/multiSelect/multiSelect.mjs";import zt from"./common/numberInput/index.mjs";import Bt from"./common/optionPicker/optionPicker.mjs";import{OtpInputCharset as Vt}from"./common/otpInput/otpInput.types.mjs";import Ht from"./common/otpInput/otpInput.mjs";import Ut from"./common/overscroll/overscroll.mjs";import Wt from"./common/pagination/pagination.mjs";import Gt from"./common/progressBar/progressBar.mjs";import{RadioGroupOrientation as Kt}from"./common/radioGroup/radioGroup.types.mjs";import qt from"./common/radioGroup/radioGroup.mjs";import Jt from"./common/rating/rating.mjs";import Yt from"./common/revealLens/revealLens.mjs";import Xt from"./common/roomDrawer/roomDrawer.mjs";import Zt from"./common/roomViewer/roomViewer.mjs";import Qt from"./common/scrollbarProvider/index.mjs";import{SectionHeaderSize as $t}from"./common/sectionHeader/sectionHeader.types.mjs";import en from"./common/sectionHeader/sectionHeader.mjs";import{SkeletonAnimation as tn,SkeletonVariant as nn}from"./common/skeleton/skeleton.types.mjs";import rn from"./common/skeleton/skeleton.mjs";import an from"./common/slider/slider.mjs";import on from"./common/splitButton/splitButton.mjs";import{StepperAlignment as sn,StepperCollapse as cn,StepperLabelPlacement as ln,StepperStyleType as un}from"./common/stepper/stepper.types.mjs";import dn from"./common/stepper/stepper.mjs";import fn from"./common/sticky/sticky.mjs";import pn from"./common/switch/switch.mjs";import mn from"./common/tabHeader/tabHeader.mjs";import hn from"./common/textarea/textarea.mjs";import{defaultTheme as gn}from"./common/themeProvider/defaultTheme.mjs";import _n from"./common/themeProvider/themeProvider.mjs";import{useTheme as vn}from"./common/themeProvider/useTheme.mjs";import yn,{TiltGroupContext as bn,useTiltGroup as xn}from"./common/tiltGroup/tiltGroup.mjs";import{defaultTiltEasing as Sn}from"./common/tilt/tiltMath.mjs";import Cn from"./common/tilt/tilt.mjs";import wn from"./common/timeInput/timeInput.mjs";import{TimelineAlignment as Tn,TimelineItemStatus as En}from"./common/timeline/timeline.types.mjs";import Dn from"./common/timeline/timeline.mjs";import On from"./common/timer/timer.mjs";import kn from"./common/virtualList/virtualList.mjs";import{flattenTree as An}from"./common/tree/flattenTree.mjs";import jn from"./common/tree/tree.mjs";import Mn from"./common/wizard/wizard.mjs";import Nn from"./services/formValidation/FormValidatorGroupWithForm.mjs";import Pn from"./services/formValidation/validatableComponent.mjs";import{useFormValidatorGroup as Fn}from"./services/formValidation/useFormValidatorGroup.mjs";import{FormValidator as In,Validators as Ln,useFormValidator as Rn}from"./services/formValidation/index.mjs";import{hasEightPasswordChars as zn,hasOnePasswordDigit as Bn,hasOnePasswordLetter as Vn,isBic as Hn,isDate as Un,isEmail as Wn,isISODate as Gn,isNumber as Kn,isPassword as qn,isURL as Jn}from"@ahrowe/form-validation";export{a as Accordion,e as AccordionStyleType,f as ActionButtons,m as ActionIcon,g as Alert,h as AlertStyleType,D as Align,_ as AnimatedLogo,b as AnimatedText,v as AnimatedTextUnit,y as AnimatedTextVariant,w as Avatar,T as AvatarGroup,C as Badge,x as BadgePosition,S as BadgeStyleType,E as BodyEnd,A as Breadcrumb,d as Button,M as ButtonGroup,j as ButtonGroupOrientation,s as ButtonSize,c as ButtonStyleType,l as ButtonType,P as Card,R as CardActions,L as CardContent,F as CardHeader,I as CardMedia,N as CardStyleType,z as Carousel,B as Checkbox,H as Chip,U as ChipContainer,V as ChipStyleType,J as ColorPicker,t as ConfigProvider,X as ConfirmModal,gt as DEFAULT_SNAP_OPTIONS,Ce as DEFAULT_WALL_ATTRS,ne as DatePicker,ae as Divider,re as DividerOrientation,ie as DividerTextPosition,ge as DoorSwing,oe as Drawer,le as DropZone,se as DropZoneReturnType,ce as DropZoneStatus,te as Dropdown,ue as EmptyState,pe as ErrorBoundary,me as Fab,he as Flip,k as FloatingMenu,In as FormValidator,Nn as FormValidatorGroup,dt as HIT_PX,ft as HIT_PX_COARSE,Nt as IconLoading,Et as IconPicker,Dt as IdleManager,ee as InfiniteBlock,q as Input,Ot as InputDropdown,G as InputIconPosition,K as InputType,p as InteractableDiv,At as KanbanBoard,kt as KanbanColumn,Mt as KlipyPicker,Ve as MIN_FLOOR_HEIGHT,xe as MIN_OPENING_WIDTH,Se as MIN_WALL_LENGTH,Y as Modal,Rt as MultiSelect,zt as NumberInput,_e as OpeningKind,Bt as OptionPicker,Ht as OtpInput,Vt as OtpInputCharset,Ut as Overscroll,xt as PLAN_FORMAT_VERSION,Wt as Pagination,ve as PlanIssueKind,ye as PlanUnitSystem,Lt as Popover,Pt as PopoverAlign,Ft as PopoverPlacement,It as PopoverTrigger,O as Presentation,Gt as ProgressBar,qt as RadioGroup,Kt as RadioGroupOrientation,Jt as Rating,Yt as RevealLens,u as Ripple,Xt as RoomDrawer,Zt as RoomViewer,Qt as ScrollbarProvider,jt as SearchInput,en as SectionHeader,$t as SectionHeaderSize,rn as Skeleton,tn as SkeletonAnimation,nn as SkeletonVariant,an as Slider,_t as SnapKind,o as SpinnerLoading,on as SplitButton,dn as Stepper,sn as StepperAlignment,cn as StepperCollapse,ln as StepperLabelPlacement,un as StepperStyleType,fn as Sticky,pn as Switch,mn as TabHeader,hn as Textarea,_n as ThemeProvider,Cn as Tilt,yn as TiltGroup,bn as TiltGroupContext,wn as TimeInput,Dn as Timeline,Tn as TimelineAlignment,En as TimelineItemStatus,On as Timer,fe as ToastProvider,W as Tooltip,jn as Tree,Pn as ValidatableComponent,Ln as Validators,kn as VirtualList,be as WallType,Mn as Wizard,He as addFloor,we as addOpening,Te as addRect,Ee as addWall,wt as buildPlanMesh,ct as buildWallPaths,De as cleanupPlan,vt as clientToWorld,it as commitDerivation,gn as defaultTheme,Sn as defaultTiltEasing,nt as deriveFaces,at as derivePlan,Oe as detachWall,ke as dissolveNode,Ue as duplicateFloor,We as emptyFloor,Ge as emptyFloorPlan,An as flattenTree,Ke as floorBelow,qe as floorBounds,Je as floorIndex,Ye as getFloor,Z as getLocale,zn as hasEightPasswordChars,Bn as hasOnePasswordDigit,Vn as hasOnePasswordLetter,pt as hitTest,Hn as isBic,Un as isDate,Wn as isEmail,Gn as isISODate,Kn as isNumber,qn as isPassword,Jn as isURL,Q as mapLocale,Ae as mergeNodes,Xe as moveFloor,je as moveNode,rt as nodeDegrees,lt as openingGeometry,St as planFromJson,Tt as planFromLegacySvg,Ct as planToJson,ot as pruneUnmatchedRooms,Ze as removeFloor,Me as removeOpening,Ne as removeWall,Qe as renameFloor,yt as resolveSnap,st as roomAtPoint,Pe as scalePlan,bt as screenScale,mt as selectionsEqual,$e as setFloor,et as setFloorHeight,$ as setLocale,de as showToast,Fe as splitWall,Ie as transformPlan,tt as updateFloor,Le as updateOpening,n as useComponentDefaults,Rn as useFormValidator,Fn as useFormValidatorGroup,r as useLabels,i as usePresentationDefault,vn as useTheme,xn as useTiltGroup,Re as validatePlan,ut as wallCentrelineSpans,ze as wallLength,Be as weldShortWalls,ht as worldTolerances};
|
|
1
|
+
import{AccordionStyleType as e}from"./common/accordion/accordion.types.mjs";import t from"./common/configProvider/configProvider.mjs";import{useComponentDefaults as n}from"./common/configProvider/useComponentDefaults.mjs";import{useLabels as r}from"./common/configProvider/useLabels.mjs";import{usePresentationDefault as i}from"./common/configProvider/usePresentationDefault.mjs";import{Presentation as a}from"./common/configProvider/presentation.types.mjs";import o from"./common/accordion/accordion.mjs";import s from"./common/loading/spinnerLoading/index.mjs";import{ButtonSize as c,ButtonStyleType as l,ButtonType as u}from"./common/button/button.types.mjs";import d from"./common/ripple/ripple.mjs";import f from"./common/button/button.mjs";import p from"./common/actionButtons/actionButtons.mjs";import m from"./common/interactableDiv/index.mjs";import h from"./common/actionIcon/actionIcon.mjs";import{AlertStyleType as g}from"./common/alert/alert.types.mjs";import _ from"./common/alert/alert.mjs";import v from"./common/animatedLogo/animatedLogo.mjs";import{AnimatedTextUnit as y,AnimatedTextVariant as b}from"./common/animatedText/animatedText.types.mjs";import x from"./common/animatedText/animatedText.mjs";import{BadgePosition as S,BadgeStyleType as C}from"./common/badge/badge.types.mjs";import w from"./common/badge/badge.mjs";import T from"./common/avatar/avatar.mjs";import E from"./common/avatar/avatarGroup.mjs";import D from"./common/bodyEnd/bodyEnd.mjs";import{PopoverAlign as O,PopoverPlacement as k,PopoverTrigger as A}from"./common/popover/popover.types.mjs";import j from"./common/popover/popover.mjs";import M from"./common/breadcrumb/breadcrumb.mjs";import{ButtonGroupOrientation as N}from"./common/buttonGroup/buttonGroup.types.mjs";import P from"./common/buttonGroup/buttonGroup.mjs";import{CardStyleType as F}from"./common/card/card.types.mjs";import I from"./common/card/Card.mjs";import L from"./common/card/CardHeader.mjs";import R from"./common/card/CardMedia.mjs";import z from"./common/card/CardContent.mjs";import B from"./common/card/CardActions.mjs";import V from"./common/carousel/carousel.mjs";import H from"./common/checkbox/checkbox.mjs";import{ChipStyleType as U}from"./common/chip/chip.types.mjs";import W from"./common/chip/chip.mjs";import G from"./common/chip/chipContainer.mjs";import K from"./common/tooltip/tooltip.mjs";import{InputIconPosition as q,InputType as J}from"./common/input/input.types.mjs";import Y from"./common/input/input.mjs";import X from"./common/colorPicker/colorPicker.mjs";import Z from"./common/modal/modal.mjs";import Q from"./common/confirmModal/confirmModal.mjs";import{getLocale as $,mapLocale as ee,setLocale as te}from"./services/localization.mjs";import ne from"./common/infiniteBlock/infiniteBlock.mjs";import re from"./common/dropdown/dropdown.mjs";import ie from"./common/datePicker/datePicker.mjs";import{DividerOrientation as ae,DividerTextPosition as oe}from"./common/divider/divider.types.mjs";import se from"./common/divider/divider.mjs";import ce from"./common/drawer/drawer.mjs";import{DropZoneReturnType as le,DropZoneStatus as ue}from"./common/dropZone/dropZone.types.mjs";import de from"./common/dropZone/dropZone.mjs";import fe from"./common/emptyState/emptyState.mjs";import{showToast as pe}from"./common/toast/toastService.mjs";import me from"./common/toast/toastProvider.mjs";import he from"./common/errorBoundary/errorBoundary.mjs";import ge from"./common/fab/fab.mjs";import _e from"./common/flip/flip.mjs";import{DoorSwing as ve,OpeningKind as ye,PlanIssueKind as be,PlanUnitSystem as xe,WallType as Se}from"./common/floorPlan/floorPlan.types.mjs";import{MIN_OPENING_WIDTH as Ce,MIN_WALL_LENGTH as we}from"./common/floorPlan/floorPlan.geometry.mjs";import{DEFAULT_WALL_ATTRS as Te,addOpening as Ee,addRect as De,addWall as Oe,cleanupPlan as ke,detachWall as Ae,dissolveNode as je,mergeNodes as Me,moveNode as Ne,removeOpening as Pe,removeWall as Fe,scalePlan as Ie,splitWall as Le,transformPlan as Re,updateOpening as ze,validatePlan as Be,wallLength as Ve,weldShortWalls as He}from"./common/floorPlan/floorPlan.graph.mjs";import{MIN_FLOOR_HEIGHT as Ue,addFloor as We,duplicateFloor as Ge,emptyFloor as Ke,emptyFloorPlan as qe,floorBelow as Je,floorBounds as Ye,floorIndex as Xe,getFloor as Ze,moveFloor as Qe,removeFloor as $e,renameFloor as et,setFloor as tt,setFloorHeight as nt,updateFloor as rt}from"./common/floorPlan/floorPlan.plan.mjs";import{deriveFaces as it,nodeDegrees as at}from"./common/floorPlan/floorPlan.faces.mjs";import{commitDerivation as ot,derivePlan as st,pruneUnmatchedRooms as ct,roomAtPoint as lt}from"./common/floorPlan/floorPlan.rooms.mjs";import{buildWallPaths as ut,openingGeometry as dt,wallCentrelineSpans as ft}from"./common/floorPlan/floorPlan.path.mjs";import{HIT_PX as pt,HIT_PX_COARSE as mt,hitTest as ht,selectionsEqual as gt,worldTolerances as _t}from"./common/floorPlan/floorPlan.hit.mjs";import{DEFAULT_SNAP_OPTIONS as vt,SnapKind as yt,clientToWorld as bt,resolveSnap as xt,screenScale as St}from"./common/floorPlan/floorPlan.snap.mjs";import{PLAN_FORMAT_VERSION as Ct,planFromJson as wt,planToJson as Tt}from"./common/floorPlan/floorPlan.json.mjs";import{buildPlanMesh as Et}from"./common/floorPlan/floorPlan.mesh.mjs";import{planFromLegacySvg as Dt}from"./common/floorPlan/legacySvg.mjs";import Ot from"./common/iconPicker/iconPicker.mjs";import kt from"./common/idleManager/idleManager.mjs";import At from"./common/inputDropdown/inputDropdown.mjs";import jt from"./common/kanbanBoard/KanbanColumn.mjs";import Mt from"./common/kanbanBoard/KanbanBoard.mjs";import Nt from"./common/searchInput/searchInput.mjs";import Pt from"./common/klipyPicker/klipyPicker.mjs";import Ft from"./common/loading/iconLoading/index.mjs";import{isMenuAction as It,isMenuHeading as Lt,isMenuSeparator as Rt}from"./common/menu/menu.types.mjs";import zt from"./common/menu/menu.mjs";import Bt from"./common/multiSelect/multiSelect.mjs";import Vt from"./common/numberInput/index.mjs";import Ht from"./common/optionPicker/optionPicker.mjs";import{OtpInputCharset as Ut}from"./common/otpInput/otpInput.types.mjs";import Wt from"./common/otpInput/otpInput.mjs";import Gt from"./common/overscroll/overscroll.mjs";import Kt from"./common/pagination/pagination.mjs";import qt from"./common/progressBar/progressBar.mjs";import{RadioGroupOrientation as Jt}from"./common/radioGroup/radioGroup.types.mjs";import Yt from"./common/radioGroup/radioGroup.mjs";import Xt from"./common/rating/rating.mjs";import Zt from"./common/revealLens/revealLens.mjs";import Qt from"./common/roomDrawer/roomDrawer.mjs";import $t from"./common/roomViewer/roomViewer.mjs";import en from"./common/scrollbarProvider/index.mjs";import{SectionHeaderSize as tn}from"./common/sectionHeader/sectionHeader.types.mjs";import nn from"./common/sectionHeader/sectionHeader.mjs";import{SkeletonAnimation as rn,SkeletonVariant as an}from"./common/skeleton/skeleton.types.mjs";import on from"./common/skeleton/skeleton.mjs";import sn from"./common/slider/slider.mjs";import cn from"./common/splitButton/splitButton.mjs";import{StepperAlignment as ln,StepperCollapse as un,StepperLabelPlacement as dn,StepperStyleType as fn}from"./common/stepper/stepper.types.mjs";import pn from"./common/stepper/stepper.mjs";import mn from"./common/sticky/sticky.mjs";import hn from"./common/switch/switch.mjs";import gn from"./common/tabHeader/tabHeader.mjs";import _n from"./common/textarea/textarea.mjs";import{defaultTheme as vn}from"./common/themeProvider/defaultTheme.mjs";import yn from"./common/themeProvider/themeProvider.mjs";import{useTheme as bn}from"./common/themeProvider/useTheme.mjs";import xn,{TiltGroupContext as Sn,useTiltGroup as Cn}from"./common/tiltGroup/tiltGroup.mjs";import{defaultTiltEasing as wn}from"./common/tilt/tiltMath.mjs";import Tn from"./common/tilt/tilt.mjs";import En from"./common/timeInput/timeInput.mjs";import{TimelineAlignment as Dn,TimelineItemStatus as On}from"./common/timeline/timeline.types.mjs";import kn from"./common/timeline/timeline.mjs";import An from"./common/timer/timer.mjs";import jn from"./common/virtualList/virtualList.mjs";import{flattenTree as Mn}from"./common/tree/flattenTree.mjs";import Nn from"./common/tree/tree.mjs";import Pn from"./common/wizard/wizard.mjs";import Fn from"./services/formValidation/FormValidatorGroupWithForm.mjs";import In from"./services/formValidation/validatableComponent.mjs";import{useFormValidatorGroup as Ln}from"./services/formValidation/useFormValidatorGroup.mjs";import{FormValidator as Rn,Validators as zn,useFormValidator as Bn}from"./services/formValidation/index.mjs";import{hasEightPasswordChars as Vn,hasOnePasswordDigit as Hn,hasOnePasswordLetter as Un,isBic as Wn,isDate as Gn,isEmail as Kn,isISODate as qn,isNumber as Jn,isPassword as Yn,isURL as Xn}from"@ahrowe/form-validation";export{o as Accordion,e as AccordionStyleType,p as ActionButtons,h as ActionIcon,_ as Alert,g as AlertStyleType,v as AnimatedLogo,x as AnimatedText,y as AnimatedTextUnit,b as AnimatedTextVariant,T as Avatar,E as AvatarGroup,w as Badge,S as BadgePosition,C as BadgeStyleType,D as BodyEnd,M as Breadcrumb,f as Button,P as ButtonGroup,N as ButtonGroupOrientation,c as ButtonSize,l as ButtonStyleType,u as ButtonType,I as Card,B as CardActions,z as CardContent,L as CardHeader,R as CardMedia,F as CardStyleType,V as Carousel,H as Checkbox,W as Chip,G as ChipContainer,U as ChipStyleType,X as ColorPicker,t as ConfigProvider,Q as ConfirmModal,vt as DEFAULT_SNAP_OPTIONS,Te as DEFAULT_WALL_ATTRS,ie as DatePicker,se as Divider,ae as DividerOrientation,oe as DividerTextPosition,ve as DoorSwing,ce as Drawer,de as DropZone,le as DropZoneReturnType,ue as DropZoneStatus,re as Dropdown,fe as EmptyState,he as ErrorBoundary,ge as Fab,_e as Flip,Rn as FormValidator,Fn as FormValidatorGroup,pt as HIT_PX,mt as HIT_PX_COARSE,Ft as IconLoading,Ot as IconPicker,kt as IdleManager,ne as InfiniteBlock,Y as Input,At as InputDropdown,q as InputIconPosition,J as InputType,m as InteractableDiv,Mt as KanbanBoard,jt as KanbanColumn,Pt as KlipyPicker,Ue as MIN_FLOOR_HEIGHT,Ce as MIN_OPENING_WIDTH,we as MIN_WALL_LENGTH,zt as Menu,Z as Modal,Bt as MultiSelect,Vt as NumberInput,ye as OpeningKind,Ht as OptionPicker,Wt as OtpInput,Ut as OtpInputCharset,Gt as Overscroll,Ct as PLAN_FORMAT_VERSION,Kt as Pagination,be as PlanIssueKind,xe as PlanUnitSystem,j as Popover,O as PopoverAlign,k as PopoverPlacement,A as PopoverTrigger,a as Presentation,qt as ProgressBar,Yt as RadioGroup,Jt as RadioGroupOrientation,Xt as Rating,Zt as RevealLens,d as Ripple,Qt as RoomDrawer,$t as RoomViewer,en as ScrollbarProvider,Nt as SearchInput,nn as SectionHeader,tn as SectionHeaderSize,on as Skeleton,rn as SkeletonAnimation,an as SkeletonVariant,sn as Slider,yt as SnapKind,s as SpinnerLoading,cn as SplitButton,pn as Stepper,ln as StepperAlignment,un as StepperCollapse,dn as StepperLabelPlacement,fn as StepperStyleType,mn as Sticky,hn as Switch,gn as TabHeader,_n as Textarea,yn as ThemeProvider,Tn as Tilt,xn as TiltGroup,Sn as TiltGroupContext,En as TimeInput,kn as Timeline,Dn as TimelineAlignment,On as TimelineItemStatus,An as Timer,me as ToastProvider,K as Tooltip,Nn as Tree,In as ValidatableComponent,zn as Validators,jn as VirtualList,Se as WallType,Pn as Wizard,We as addFloor,Ee as addOpening,De as addRect,Oe as addWall,Et as buildPlanMesh,ut as buildWallPaths,ke as cleanupPlan,bt as clientToWorld,ot as commitDerivation,vn as defaultTheme,wn as defaultTiltEasing,it as deriveFaces,st as derivePlan,Ae as detachWall,je as dissolveNode,Ge as duplicateFloor,Ke as emptyFloor,qe as emptyFloorPlan,Mn as flattenTree,Je as floorBelow,Ye as floorBounds,Xe as floorIndex,Ze as getFloor,$ as getLocale,Vn as hasEightPasswordChars,Hn as hasOnePasswordDigit,Un as hasOnePasswordLetter,ht as hitTest,Wn as isBic,Gn as isDate,Kn as isEmail,qn as isISODate,It as isMenuAction,Lt as isMenuHeading,Rt as isMenuSeparator,Jn as isNumber,Yn as isPassword,Xn as isURL,ee as mapLocale,Me as mergeNodes,Qe as moveFloor,Ne as moveNode,at as nodeDegrees,dt as openingGeometry,wt as planFromJson,Dt as planFromLegacySvg,Tt as planToJson,ct as pruneUnmatchedRooms,$e as removeFloor,Pe as removeOpening,Fe as removeWall,et as renameFloor,xt as resolveSnap,lt as roomAtPoint,Ie as scalePlan,St as screenScale,gt as selectionsEqual,tt as setFloor,nt as setFloorHeight,te as setLocale,pe as showToast,Le as splitWall,Re as transformPlan,rt as updateFloor,ze as updateOpening,n as useComponentDefaults,Bn as useFormValidator,Ln as useFormValidatorGroup,r as useLabels,i as usePresentationDefault,bn as useTheme,Cn as useTiltGroup,Be as validatePlan,ft as wallCentrelineSpans,Ve as wallLength,He as weldShortWalls,_t as worldTolerances};
|