@backstage/ui 0.0.0-nightly-20250814024559 → 0.0.0-nightly-20250815024739
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/CHANGELOG.md +1 -1
- package/css/styles.css +1 -1
- package/dist/components/Avatar/Avatar.esm.js.map +1 -1
- package/dist/components/Box/Box.esm.js.map +1 -1
- package/dist/components/Box/Box.props.esm.js.map +1 -1
- package/dist/components/Button/Button.esm.js.map +1 -1
- package/dist/components/ButtonIcon/ButtonIcon.esm.js.map +1 -1
- package/dist/components/ButtonLink/ButtonLink.esm.js.map +1 -1
- package/dist/components/Card/Card.esm.js.map +1 -1
- package/dist/components/Checkbox/Checkbox.esm.js.map +1 -1
- package/dist/components/Collapsible/Collapsible.esm.js.map +1 -1
- package/dist/components/Container/Container.esm.js.map +1 -1
- package/dist/components/FieldError/FieldError.esm.js.map +1 -1
- package/dist/components/FieldLabel/FieldLabel.esm.js.map +1 -1
- package/dist/components/Flex/Flex.esm.js.map +1 -1
- package/dist/components/Flex/Flex.props.esm.js.map +1 -1
- package/dist/components/Grid/Grid.esm.js.map +1 -1
- package/dist/components/Grid/Grid.props.esm.js.map +1 -1
- package/dist/components/Header/Header.esm.js.map +1 -1
- package/dist/components/Header/HeaderToolbar.esm.js.map +1 -1
- package/dist/components/HeaderPage/HeaderPage.esm.js +1 -1
- package/dist/components/HeaderPage/HeaderPage.esm.js.map +1 -1
- package/dist/components/Icon/Icon.esm.js.map +1 -1
- package/dist/components/Icon/context.esm.js.map +1 -1
- package/dist/components/Icon/icons.esm.js +1 -1
- package/dist/components/Icon/icons.esm.js.map +1 -1
- package/dist/components/Icon/provider.esm.js.map +1 -1
- package/dist/components/Link/Link.esm.js.map +1 -1
- package/dist/components/Menu/Combobox.esm.js.map +1 -1
- package/dist/components/Menu/Menu.esm.js.map +1 -1
- package/dist/components/RadioGroup/RadioGroup.esm.js.map +1 -1
- package/dist/components/ScrollArea/ScrollArea.esm.js.map +1 -1
- package/dist/components/SearchField/SearchField.esm.js.map +1 -1
- package/dist/components/Select/Select.esm.js.map +1 -1
- package/dist/components/Skeleton/Skeleton.esm.js.map +1 -1
- package/dist/components/Switch/Switch.esm.js.map +1 -1
- package/dist/components/Table/components/Cell.esm.js.map +1 -1
- package/dist/components/Table/components/CellProfile.esm.js.map +1 -1
- package/dist/components/Table/components/Column.esm.js.map +1 -1
- package/dist/components/Table/components/Row.esm.js.map +1 -1
- package/dist/components/Table/components/Table.esm.js.map +1 -1
- package/dist/components/Table/components/TableBody.esm.js.map +1 -1
- package/dist/components/Table/components/TableHeader.esm.js.map +1 -1
- package/dist/components/Table/hooks/useTable.esm.js.map +1 -1
- package/dist/components/TablePagination/TablePagination.esm.js.map +1 -1
- package/dist/components/Tabs/Tabs.esm.js.map +1 -1
- package/dist/components/Tabs/TabsIndicators.esm.js.map +1 -1
- package/dist/components/Text/Text.esm.js.map +1 -1
- package/dist/components/TextField/TextField.esm.js.map +1 -1
- package/dist/components/Tooltip/Tooltip.esm.js.map +1 -1
- package/dist/hooks/useBreakpoint.esm.js.map +1 -1
- package/dist/hooks/useIsomorphicLayoutEffect.esm.js.map +1 -1
- package/dist/hooks/useMediaQuery.esm.js.map +1 -1
- package/dist/hooks/useStyles.esm.js.map +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/props/display.props.esm.js.map +1 -1
- package/dist/props/gap-props.esm.js.map +1 -1
- package/dist/props/height.props.esm.js.map +1 -1
- package/dist/props/margin.props.esm.js.map +1 -1
- package/dist/props/padding.props.esm.js.map +1 -1
- package/dist/props/position.props.esm.js.map +1 -1
- package/dist/props/prop-def.esm.js.map +1 -1
- package/dist/props/spacing.props.esm.js.map +1 -1
- package/dist/props/width.props.esm.js.map +1 -1
- package/dist/utils/componentDefinitions.esm.js.map +1 -1
- package/dist/utils/extractProps.esm.js.map +1 -1
- package/dist/utils/isExternalLink.esm.js.map +1 -1
- package/package.json +3 -13
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Combobox.esm.js","sources":["../../../src/components/Menu/Combobox.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n forwardRef,\n useState,\n useMemo,\n useCallback,\n ChangeEvent,\n KeyboardEvent,\n useRef,\n useEffect,\n} from 'react';\nimport clsx from 'clsx';\nimport { MenuComboboxOption, MenuComboboxProps } from './types';\nimport { Icon } from '../..';\nimport { useId } from 'react-aria';\n\nconst getListboxItemId = (listboxId: string, optionValue: string): string =>\n `${listboxId}-option-${optionValue}`;\n\n// Internal component for rendering individual items\nfunction ComboboxItem({\n option,\n optionIndex,\n value,\n activeOptionIndex,\n onItemActive,\n onItemSelect,\n listboxId,\n}: {\n option: MenuComboboxOption;\n optionIndex: number;\n value?: string[];\n activeOptionIndex: number;\n onItemActive: (index: number) => void;\n onItemSelect: (value: string) => void;\n listboxId: string;\n}) {\n const isSelected = value?.includes(option.value) ?? false;\n const isHighlighted = optionIndex === activeOptionIndex;\n const itemId = getListboxItemId(listboxId, option.value);\n\n const itemRef = useRef<HTMLDivElement>(null);\n\n // Scroll the item into view when it becomes highlighted\n useEffect(() => {\n if (isHighlighted && itemRef.current) {\n itemRef.current.scrollIntoView({ block: 'nearest' });\n }\n }, [isHighlighted]);\n\n return (\n <div\n ref={itemRef}\n className=\"bui-SubmenuComboboxItem\"\n id={itemId}\n role=\"option\"\n aria-selected={isSelected}\n data-highlighted={isHighlighted ? true : undefined}\n data-selected={isSelected ? true : undefined}\n data-disabled={option.disabled ? true : undefined}\n onMouseOver={() => !option.disabled && onItemActive(optionIndex)}\n onClick={() => !option.disabled && onItemSelect(option.value)}\n >\n <div className=\"bui-SubmenuComboboxItemCheckbox\">\n {isSelected && <Icon aria-hidden=\"true\" name=\"check\" size={12} />}\n </div>\n <div className=\"bui-SubmenuComboboxItemLabel\">{option.label}</div>\n </div>\n );\n}\n\n/** @public */\nexport const Combobox = forwardRef<HTMLDivElement, MenuComboboxProps>(\n (props, ref) => {\n const {\n options,\n value,\n onValueChange,\n multiselect = false,\n className,\n ...rest\n } = props;\n\n const triggerId = useId();\n const listboxId = `${triggerId}-listbox`;\n\n // State management\n const [filterString, setFilterString] = useState<string>('');\n const [activeOptionIndex, setActiveOptionIndex] = useState<number>(0);\n\n // Filter options based on input\n const filteredOptions = useMemo(() => {\n if (!filterString) return options;\n const lowerFilterString = filterString.toLocaleLowerCase('en-US');\n return options.filter(option =>\n option.label.toLocaleLowerCase('en-US').includes(lowerFilterString),\n );\n }, [filterString, options]);\n\n // Get the active descendant ID for accessibility\n const activeDescendantId =\n activeOptionIndex >= 0 && filteredOptions.length > 0\n ? getListboxItemId(listboxId, filteredOptions[activeOptionIndex].value)\n : undefined;\n\n const handleValueChange = useCallback(\n (toggledValue: string) => {\n let newValue: string[];\n if (multiselect) {\n newValue = value?.includes(toggledValue)\n ? value.filter(v => v !== toggledValue)\n : [...(value ?? []), toggledValue];\n } else {\n newValue = value?.includes(toggledValue) ? [] : [toggledValue];\n }\n\n onValueChange?.(newValue);\n },\n [multiselect, onValueChange, value],\n );\n\n const handleSearchChange = useCallback(\n (e: ChangeEvent<HTMLInputElement>) => {\n setFilterString(e.target.value);\n setActiveOptionIndex(0);\n e.preventDefault();\n },\n [],\n );\n\n const handleKeyDown = useCallback(\n (e: KeyboardEvent) => {\n let wasEscapeKey = false;\n switch (e.key) {\n case 'ArrowDown':\n e.preventDefault();\n setActiveOptionIndex(prev =>\n Math.min(prev + 1, filteredOptions.length - 1),\n );\n break;\n case 'ArrowUp':\n e.preventDefault();\n setActiveOptionIndex(prev => Math.max(prev - 1, 0));\n break;\n case 'Home':\n e.preventDefault();\n setActiveOptionIndex(0);\n break;\n case 'End':\n e.preventDefault();\n setActiveOptionIndex(Math.max(filteredOptions.length - 1, 0));\n break;\n case 'Enter':\n e.preventDefault();\n if (\n activeOptionIndex >= 0 &&\n !filteredOptions[activeOptionIndex].disabled\n ) {\n handleValueChange(filteredOptions[activeOptionIndex].value);\n }\n break;\n case 'Escape':\n // The Menu component should handle this\n wasEscapeKey = true;\n break;\n default:\n break;\n }\n\n if (!wasEscapeKey) {\n // Stop propagation so Menu components don't prevent the input from updating\n e.stopPropagation();\n }\n },\n [filteredOptions, activeOptionIndex, handleValueChange],\n );\n\n return (\n <div\n ref={ref}\n role=\"combobox\"\n className={clsx('bui-MenuCombobox', className)}\n {...rest}\n >\n <input\n className=\"bui-SubmenuComboboxSearch\"\n type=\"text\"\n role=\"combobox\"\n placeholder=\"Filter...\"\n aria-labelledby={triggerId}\n aria-controls={listboxId}\n aria-autocomplete=\"list\"\n aria-activedescendant={activeDescendantId}\n aria-expanded=\"true\"\n aria-haspopup=\"listbox\"\n value={filterString}\n onKeyDown={handleKeyDown}\n onChange={handleSearchChange}\n />\n <div\n role=\"listbox\"\n id={listboxId}\n tabIndex={-1}\n aria-multiselectable={multiselect ? true : undefined}\n className=\"bui-SubmenuComboboxItems\"\n >\n {filteredOptions.length === 0 ? (\n <div className=\"bui-SubmenuComboboxNoResults\">No results found</div>\n ) : (\n filteredOptions.map((option, index) => (\n <ComboboxItem\n key={option.value}\n option={option}\n optionIndex={index}\n value={value}\n activeOptionIndex={activeOptionIndex}\n onItemActive={setActiveOptionIndex}\n onItemSelect={handleValueChange}\n listboxId={listboxId}\n />\n ))\n )}\n </div>\n </div>\n );\n },\n);\nCombobox.displayName = 'Combobox';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Combobox.esm.js","sources":["../../../src/components/Menu/Combobox.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n forwardRef,\n useState,\n useMemo,\n useCallback,\n ChangeEvent,\n KeyboardEvent,\n useRef,\n useEffect,\n} from 'react';\nimport clsx from 'clsx';\nimport { MenuComboboxOption, MenuComboboxProps } from './types';\nimport { Icon } from '../..';\nimport { useId } from 'react-aria';\n\nconst getListboxItemId = (listboxId: string, optionValue: string): string =>\n `${listboxId}-option-${optionValue}`;\n\n// Internal component for rendering individual items\nfunction ComboboxItem({\n option,\n optionIndex,\n value,\n activeOptionIndex,\n onItemActive,\n onItemSelect,\n listboxId,\n}: {\n option: MenuComboboxOption;\n optionIndex: number;\n value?: string[];\n activeOptionIndex: number;\n onItemActive: (index: number) => void;\n onItemSelect: (value: string) => void;\n listboxId: string;\n}) {\n const isSelected = value?.includes(option.value) ?? false;\n const isHighlighted = optionIndex === activeOptionIndex;\n const itemId = getListboxItemId(listboxId, option.value);\n\n const itemRef = useRef<HTMLDivElement>(null);\n\n // Scroll the item into view when it becomes highlighted\n useEffect(() => {\n if (isHighlighted && itemRef.current) {\n itemRef.current.scrollIntoView({ block: 'nearest' });\n }\n }, [isHighlighted]);\n\n return (\n <div\n ref={itemRef}\n className=\"bui-SubmenuComboboxItem\"\n id={itemId}\n role=\"option\"\n aria-selected={isSelected}\n data-highlighted={isHighlighted ? true : undefined}\n data-selected={isSelected ? true : undefined}\n data-disabled={option.disabled ? true : undefined}\n onMouseOver={() => !option.disabled && onItemActive(optionIndex)}\n onClick={() => !option.disabled && onItemSelect(option.value)}\n >\n <div className=\"bui-SubmenuComboboxItemCheckbox\">\n {isSelected && <Icon aria-hidden=\"true\" name=\"check\" size={12} />}\n </div>\n <div className=\"bui-SubmenuComboboxItemLabel\">{option.label}</div>\n </div>\n );\n}\n\n/** @public */\nexport const Combobox = forwardRef<HTMLDivElement, MenuComboboxProps>(\n (props, ref) => {\n const {\n options,\n value,\n onValueChange,\n multiselect = false,\n className,\n ...rest\n } = props;\n\n const triggerId = useId();\n const listboxId = `${triggerId}-listbox`;\n\n // State management\n const [filterString, setFilterString] = useState<string>('');\n const [activeOptionIndex, setActiveOptionIndex] = useState<number>(0);\n\n // Filter options based on input\n const filteredOptions = useMemo(() => {\n if (!filterString) return options;\n const lowerFilterString = filterString.toLocaleLowerCase('en-US');\n return options.filter(option =>\n option.label.toLocaleLowerCase('en-US').includes(lowerFilterString),\n );\n }, [filterString, options]);\n\n // Get the active descendant ID for accessibility\n const activeDescendantId =\n activeOptionIndex >= 0 && filteredOptions.length > 0\n ? getListboxItemId(listboxId, filteredOptions[activeOptionIndex].value)\n : undefined;\n\n const handleValueChange = useCallback(\n (toggledValue: string) => {\n let newValue: string[];\n if (multiselect) {\n newValue = value?.includes(toggledValue)\n ? value.filter(v => v !== toggledValue)\n : [...(value ?? []), toggledValue];\n } else {\n newValue = value?.includes(toggledValue) ? [] : [toggledValue];\n }\n\n onValueChange?.(newValue);\n },\n [multiselect, onValueChange, value],\n );\n\n const handleSearchChange = useCallback(\n (e: ChangeEvent<HTMLInputElement>) => {\n setFilterString(e.target.value);\n setActiveOptionIndex(0);\n e.preventDefault();\n },\n [],\n );\n\n const handleKeyDown = useCallback(\n (e: KeyboardEvent) => {\n let wasEscapeKey = false;\n switch (e.key) {\n case 'ArrowDown':\n e.preventDefault();\n setActiveOptionIndex(prev =>\n Math.min(prev + 1, filteredOptions.length - 1),\n );\n break;\n case 'ArrowUp':\n e.preventDefault();\n setActiveOptionIndex(prev => Math.max(prev - 1, 0));\n break;\n case 'Home':\n e.preventDefault();\n setActiveOptionIndex(0);\n break;\n case 'End':\n e.preventDefault();\n setActiveOptionIndex(Math.max(filteredOptions.length - 1, 0));\n break;\n case 'Enter':\n e.preventDefault();\n if (\n activeOptionIndex >= 0 &&\n !filteredOptions[activeOptionIndex].disabled\n ) {\n handleValueChange(filteredOptions[activeOptionIndex].value);\n }\n break;\n case 'Escape':\n // The Menu component should handle this\n wasEscapeKey = true;\n break;\n default:\n break;\n }\n\n if (!wasEscapeKey) {\n // Stop propagation so Menu components don't prevent the input from updating\n e.stopPropagation();\n }\n },\n [filteredOptions, activeOptionIndex, handleValueChange],\n );\n\n return (\n <div\n ref={ref}\n role=\"combobox\"\n className={clsx('bui-MenuCombobox', className)}\n {...rest}\n >\n <input\n className=\"bui-SubmenuComboboxSearch\"\n type=\"text\"\n role=\"combobox\"\n placeholder=\"Filter...\"\n aria-labelledby={triggerId}\n aria-controls={listboxId}\n aria-autocomplete=\"list\"\n aria-activedescendant={activeDescendantId}\n aria-expanded=\"true\"\n aria-haspopup=\"listbox\"\n value={filterString}\n onKeyDown={handleKeyDown}\n onChange={handleSearchChange}\n />\n <div\n role=\"listbox\"\n id={listboxId}\n tabIndex={-1}\n aria-multiselectable={multiselect ? true : undefined}\n className=\"bui-SubmenuComboboxItems\"\n >\n {filteredOptions.length === 0 ? (\n <div className=\"bui-SubmenuComboboxNoResults\">No results found</div>\n ) : (\n filteredOptions.map((option, index) => (\n <ComboboxItem\n key={option.value}\n option={option}\n optionIndex={index}\n value={value}\n activeOptionIndex={activeOptionIndex}\n onItemActive={setActiveOptionIndex}\n onItemSelect={handleValueChange}\n listboxId={listboxId}\n />\n ))\n )}\n </div>\n </div>\n );\n },\n);\nCombobox.displayName = 'Combobox';\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Menu.esm.js","sources":["../../../src/components/Menu/Menu.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef } from 'react';\nimport { Menu as MenuPrimitive } from '@base-ui-components/react/menu';\nimport clsx from 'clsx';\nimport { MenuComponent } from './types';\nimport { Combobox } from './Combobox';\nimport { Icon } from '../Icon';\nimport { useStyles } from '../../hooks/useStyles';\n\nconst MenuTrigger = forwardRef<\n React.ElementRef<typeof MenuPrimitive.Trigger>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.Trigger>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.Trigger\n ref={ref}\n className={clsx(classNames.trigger, className)}\n {...props}\n />\n );\n});\nMenuTrigger.displayName = MenuPrimitive.Trigger.displayName;\n\nconst MenuBackdrop = forwardRef<\n React.ElementRef<typeof MenuPrimitive.Backdrop>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.Backdrop>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.Backdrop\n ref={ref}\n className={clsx(classNames.backdrop, className)}\n {...props}\n />\n );\n});\nMenuBackdrop.displayName = MenuPrimitive.Backdrop.displayName;\n\nconst MenuPositioner = forwardRef<\n React.ElementRef<typeof MenuPrimitive.Positioner>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.Positioner>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.Positioner\n ref={ref}\n className={clsx(classNames.positioner, className)}\n {...props}\n />\n );\n});\nMenuPositioner.displayName = MenuPrimitive.Positioner.displayName;\n\nconst MenuPopup = forwardRef<\n React.ElementRef<typeof MenuPrimitive.Popup>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.Popup>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.Popup\n ref={ref}\n className={clsx(classNames.popup, className)}\n {...props}\n />\n );\n});\nMenuPopup.displayName = MenuPrimitive.Popup.displayName;\n\nconst MenuArrow = forwardRef<\n React.ElementRef<typeof MenuPrimitive.Arrow>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.Arrow>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.Arrow\n ref={ref}\n className={clsx(classNames.arrow, className)}\n {...props}\n />\n );\n});\nMenuArrow.displayName = MenuPrimitive.Arrow.displayName;\n\nconst MenuItem = forwardRef<\n React.ElementRef<typeof MenuPrimitive.Item>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.Item>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.Item\n ref={ref}\n className={clsx(classNames.item, className)}\n {...props}\n />\n );\n});\nMenuItem.displayName = MenuPrimitive.Item.displayName;\n\nconst MenuGroup = forwardRef<\n React.ElementRef<typeof MenuPrimitive.Group>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.Group>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.Group\n ref={ref}\n className={clsx(classNames.group, className)}\n {...props}\n />\n );\n});\nMenuGroup.displayName = MenuPrimitive.Group.displayName;\n\nconst MenuGroupLabel = forwardRef<\n React.ElementRef<typeof MenuPrimitive.GroupLabel>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.GroupLabel>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.GroupLabel\n ref={ref}\n className={clsx(classNames.groupLabel, className)}\n {...props}\n />\n );\n});\nMenuGroupLabel.displayName = MenuPrimitive.GroupLabel.displayName;\n\nconst MenuRadioGroup = forwardRef<\n React.ElementRef<typeof MenuPrimitive.RadioGroup>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.RadioGroup>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.RadioGroup\n ref={ref}\n className={clsx(classNames.radioGroup, className)}\n {...props}\n />\n );\n});\nMenuRadioGroup.displayName = MenuPrimitive.RadioGroup.displayName;\n\nconst MenuRadioItem = forwardRef<\n React.ElementRef<typeof MenuPrimitive.RadioItem>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.RadioItem>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.RadioItem\n ref={ref}\n className={clsx(classNames.radioItem, className)}\n {...props}\n />\n );\n});\nMenuRadioItem.displayName = MenuPrimitive.RadioItem.displayName;\n\nconst MenuRadioItemIndicator = forwardRef<\n React.ElementRef<typeof MenuPrimitive.RadioItemIndicator>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.RadioItemIndicator>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.RadioItemIndicator\n ref={ref}\n className={clsx(classNames.radioItemIndicator, className)}\n {...props}\n />\n );\n});\nMenuRadioItemIndicator.displayName =\n MenuPrimitive.RadioItemIndicator.displayName;\n\nconst MenuCheckboxItem = forwardRef<\n React.ElementRef<typeof MenuPrimitive.CheckboxItem>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.CheckboxItem>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.CheckboxItem\n ref={ref}\n className={clsx(classNames.checkboxItem, className)}\n {...props}\n />\n );\n});\nMenuCheckboxItem.displayName = MenuPrimitive.CheckboxItem.displayName;\n\nconst MenuCheckboxItemIndicator = forwardRef<\n React.ElementRef<typeof MenuPrimitive.CheckboxItemIndicator>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.CheckboxItemIndicator>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.CheckboxItemIndicator\n ref={ref}\n className={clsx(classNames.checkboxItemIndicator, className)}\n {...props}\n />\n );\n});\nMenuCheckboxItemIndicator.displayName =\n MenuPrimitive.CheckboxItemIndicator.displayName;\n\nconst MenuSubmenuTrigger = forwardRef<\n React.ElementRef<typeof MenuPrimitive.SubmenuTrigger>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.SubmenuTrigger>\n>(({ className, children, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.SubmenuTrigger\n ref={ref}\n className={clsx(classNames.submenuTrigger, className)}\n {...props}\n >\n <div>{children}</div>\n <Icon\n aria-label=\"Submenu indicator icon\"\n name=\"chevron-right\"\n size={20}\n />\n </MenuPrimitive.SubmenuTrigger>\n );\n});\nMenuSubmenuTrigger.displayName = MenuPrimitive.SubmenuTrigger.displayName;\n\nconst MenuSeparator = forwardRef<\n React.ElementRef<typeof MenuPrimitive.Separator>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.Separator>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.Separator\n ref={ref}\n className={clsx(classNames.separator, className)}\n {...props}\n />\n );\n});\nMenuSeparator.displayName = MenuPrimitive.Separator.displayName;\n\n/** @public */\nexport const Menu: MenuComponent = {\n Root: MenuPrimitive.Root,\n Trigger: MenuTrigger,\n Portal: MenuPrimitive.Portal,\n Backdrop: MenuBackdrop,\n Positioner: MenuPositioner,\n Popup: MenuPopup,\n Arrow: MenuArrow,\n Item: MenuItem,\n Group: MenuGroup,\n GroupLabel: MenuGroupLabel,\n RadioGroup: MenuRadioGroup,\n RadioItem: MenuRadioItem,\n RadioItemIndicator: MenuRadioItemIndicator,\n CheckboxItem: MenuCheckboxItem,\n CheckboxItemIndicator: MenuCheckboxItemIndicator,\n SubmenuTrigger: MenuSubmenuTrigger,\n Separator: MenuSeparator,\n Combobox,\n};\n"],"names":["MenuPrimitive"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Menu.esm.js","sources":["../../../src/components/Menu/Menu.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef } from 'react';\nimport { Menu as MenuPrimitive } from '@base-ui-components/react/menu';\nimport clsx from 'clsx';\nimport { MenuComponent } from './types';\nimport { Combobox } from './Combobox';\nimport { Icon } from '../Icon';\nimport { useStyles } from '../../hooks/useStyles';\n\nconst MenuTrigger = forwardRef<\n React.ElementRef<typeof MenuPrimitive.Trigger>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.Trigger>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.Trigger\n ref={ref}\n className={clsx(classNames.trigger, className)}\n {...props}\n />\n );\n});\nMenuTrigger.displayName = MenuPrimitive.Trigger.displayName;\n\nconst MenuBackdrop = forwardRef<\n React.ElementRef<typeof MenuPrimitive.Backdrop>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.Backdrop>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.Backdrop\n ref={ref}\n className={clsx(classNames.backdrop, className)}\n {...props}\n />\n );\n});\nMenuBackdrop.displayName = MenuPrimitive.Backdrop.displayName;\n\nconst MenuPositioner = forwardRef<\n React.ElementRef<typeof MenuPrimitive.Positioner>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.Positioner>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.Positioner\n ref={ref}\n className={clsx(classNames.positioner, className)}\n {...props}\n />\n );\n});\nMenuPositioner.displayName = MenuPrimitive.Positioner.displayName;\n\nconst MenuPopup = forwardRef<\n React.ElementRef<typeof MenuPrimitive.Popup>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.Popup>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.Popup\n ref={ref}\n className={clsx(classNames.popup, className)}\n {...props}\n />\n );\n});\nMenuPopup.displayName = MenuPrimitive.Popup.displayName;\n\nconst MenuArrow = forwardRef<\n React.ElementRef<typeof MenuPrimitive.Arrow>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.Arrow>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.Arrow\n ref={ref}\n className={clsx(classNames.arrow, className)}\n {...props}\n />\n );\n});\nMenuArrow.displayName = MenuPrimitive.Arrow.displayName;\n\nconst MenuItem = forwardRef<\n React.ElementRef<typeof MenuPrimitive.Item>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.Item>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.Item\n ref={ref}\n className={clsx(classNames.item, className)}\n {...props}\n />\n );\n});\nMenuItem.displayName = MenuPrimitive.Item.displayName;\n\nconst MenuGroup = forwardRef<\n React.ElementRef<typeof MenuPrimitive.Group>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.Group>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.Group\n ref={ref}\n className={clsx(classNames.group, className)}\n {...props}\n />\n );\n});\nMenuGroup.displayName = MenuPrimitive.Group.displayName;\n\nconst MenuGroupLabel = forwardRef<\n React.ElementRef<typeof MenuPrimitive.GroupLabel>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.GroupLabel>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.GroupLabel\n ref={ref}\n className={clsx(classNames.groupLabel, className)}\n {...props}\n />\n );\n});\nMenuGroupLabel.displayName = MenuPrimitive.GroupLabel.displayName;\n\nconst MenuRadioGroup = forwardRef<\n React.ElementRef<typeof MenuPrimitive.RadioGroup>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.RadioGroup>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.RadioGroup\n ref={ref}\n className={clsx(classNames.radioGroup, className)}\n {...props}\n />\n );\n});\nMenuRadioGroup.displayName = MenuPrimitive.RadioGroup.displayName;\n\nconst MenuRadioItem = forwardRef<\n React.ElementRef<typeof MenuPrimitive.RadioItem>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.RadioItem>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.RadioItem\n ref={ref}\n className={clsx(classNames.radioItem, className)}\n {...props}\n />\n );\n});\nMenuRadioItem.displayName = MenuPrimitive.RadioItem.displayName;\n\nconst MenuRadioItemIndicator = forwardRef<\n React.ElementRef<typeof MenuPrimitive.RadioItemIndicator>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.RadioItemIndicator>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.RadioItemIndicator\n ref={ref}\n className={clsx(classNames.radioItemIndicator, className)}\n {...props}\n />\n );\n});\nMenuRadioItemIndicator.displayName =\n MenuPrimitive.RadioItemIndicator.displayName;\n\nconst MenuCheckboxItem = forwardRef<\n React.ElementRef<typeof MenuPrimitive.CheckboxItem>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.CheckboxItem>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.CheckboxItem\n ref={ref}\n className={clsx(classNames.checkboxItem, className)}\n {...props}\n />\n );\n});\nMenuCheckboxItem.displayName = MenuPrimitive.CheckboxItem.displayName;\n\nconst MenuCheckboxItemIndicator = forwardRef<\n React.ElementRef<typeof MenuPrimitive.CheckboxItemIndicator>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.CheckboxItemIndicator>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.CheckboxItemIndicator\n ref={ref}\n className={clsx(classNames.checkboxItemIndicator, className)}\n {...props}\n />\n );\n});\nMenuCheckboxItemIndicator.displayName =\n MenuPrimitive.CheckboxItemIndicator.displayName;\n\nconst MenuSubmenuTrigger = forwardRef<\n React.ElementRef<typeof MenuPrimitive.SubmenuTrigger>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.SubmenuTrigger>\n>(({ className, children, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.SubmenuTrigger\n ref={ref}\n className={clsx(classNames.submenuTrigger, className)}\n {...props}\n >\n <div>{children}</div>\n <Icon\n aria-label=\"Submenu indicator icon\"\n name=\"chevron-right\"\n size={20}\n />\n </MenuPrimitive.SubmenuTrigger>\n );\n});\nMenuSubmenuTrigger.displayName = MenuPrimitive.SubmenuTrigger.displayName;\n\nconst MenuSeparator = forwardRef<\n React.ElementRef<typeof MenuPrimitive.Separator>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.Separator>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('Menu');\n\n return (\n <MenuPrimitive.Separator\n ref={ref}\n className={clsx(classNames.separator, className)}\n {...props}\n />\n );\n});\nMenuSeparator.displayName = MenuPrimitive.Separator.displayName;\n\n/** @public */\nexport const Menu: MenuComponent = {\n Root: MenuPrimitive.Root,\n Trigger: MenuTrigger,\n Portal: MenuPrimitive.Portal,\n Backdrop: MenuBackdrop,\n Positioner: MenuPositioner,\n Popup: MenuPopup,\n Arrow: MenuArrow,\n Item: MenuItem,\n Group: MenuGroup,\n GroupLabel: MenuGroupLabel,\n RadioGroup: MenuRadioGroup,\n RadioItem: MenuRadioItem,\n RadioItemIndicator: MenuRadioItemIndicator,\n CheckboxItem: MenuCheckboxItem,\n CheckboxItemIndicator: MenuCheckboxItemIndicator,\n SubmenuTrigger: MenuSubmenuTrigger,\n Separator: MenuSeparator,\n Combobox,\n};\n"],"names":["MenuPrimitive"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RadioGroup.esm.js","sources":["../../../src/components/RadioGroup/RadioGroup.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef, useEffect } from 'react';\nimport {\n RadioGroup as AriaRadioGroup,\n Radio as AriaRadio,\n} from 'react-aria-components';\nimport clsx from 'clsx';\nimport { FieldLabel } from '../FieldLabel';\nimport { FieldError } from '../FieldError';\nimport { useStyles } from '../../hooks/useStyles';\n\nimport type { RadioGroupProps, RadioProps } from './types';\n\n/** @public */\nexport const RadioGroup = forwardRef<HTMLDivElement, RadioGroupProps>(\n (props, ref) => {\n const {\n className,\n label,\n secondaryLabel,\n description,\n isRequired,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n children,\n ...rest\n } = props;\n\n const { classNames } = useStyles('RadioGroup');\n\n useEffect(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn(\n 'RadioGroup requires either a visible label, aria-label, or aria-labelledby for accessibility',\n );\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n // If a secondary label is provided, use it. Otherwise, use 'Required' if the field is required.\n const secondaryLabelText =\n secondaryLabel || (isRequired ? 'Required' : null);\n\n return (\n <AriaRadioGroup\n className={clsx(classNames.root, className)}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n {...rest}\n ref={ref}\n >\n <FieldLabel\n label={label}\n secondaryLabel={secondaryLabelText}\n description={description}\n />\n <div className={classNames.content}>{children}</div>\n <FieldError />\n </AriaRadioGroup>\n );\n },\n);\n\nRadioGroup.displayName = 'RadioGroup';\n\n/** @public */\nexport const Radio = forwardRef<HTMLLabelElement, RadioProps>((props, ref) => {\n const { className, ...rest } = props;\n\n const { classNames } = useStyles('RadioGroup');\n\n return (\n <AriaRadio\n className={clsx(classNames.radio, className)}\n {...rest}\n ref={ref}\n />\n );\n});\n\nRadioGroup.displayName = 'RadioGroup';\n"],"names":["AriaRadioGroup","AriaRadio"],"mappings":";;;;;;;;AA6BO,MAAM,
|
|
1
|
+
{"version":3,"file":"RadioGroup.esm.js","sources":["../../../src/components/RadioGroup/RadioGroup.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef, useEffect } from 'react';\nimport {\n RadioGroup as AriaRadioGroup,\n Radio as AriaRadio,\n} from 'react-aria-components';\nimport clsx from 'clsx';\nimport { FieldLabel } from '../FieldLabel';\nimport { FieldError } from '../FieldError';\nimport { useStyles } from '../../hooks/useStyles';\n\nimport type { RadioGroupProps, RadioProps } from './types';\n\n/** @public */\nexport const RadioGroup = forwardRef<HTMLDivElement, RadioGroupProps>(\n (props, ref) => {\n const {\n className,\n label,\n secondaryLabel,\n description,\n isRequired,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n children,\n ...rest\n } = props;\n\n const { classNames } = useStyles('RadioGroup');\n\n useEffect(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn(\n 'RadioGroup requires either a visible label, aria-label, or aria-labelledby for accessibility',\n );\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n // If a secondary label is provided, use it. Otherwise, use 'Required' if the field is required.\n const secondaryLabelText =\n secondaryLabel || (isRequired ? 'Required' : null);\n\n return (\n <AriaRadioGroup\n className={clsx(classNames.root, className)}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n {...rest}\n ref={ref}\n >\n <FieldLabel\n label={label}\n secondaryLabel={secondaryLabelText}\n description={description}\n />\n <div className={classNames.content}>{children}</div>\n <FieldError />\n </AriaRadioGroup>\n );\n },\n);\n\nRadioGroup.displayName = 'RadioGroup';\n\n/** @public */\nexport const Radio = forwardRef<HTMLLabelElement, RadioProps>((props, ref) => {\n const { className, ...rest } = props;\n\n const { classNames } = useStyles('RadioGroup');\n\n return (\n <AriaRadio\n className={clsx(classNames.radio, className)}\n {...rest}\n ref={ref}\n />\n );\n});\n\nRadioGroup.displayName = 'RadioGroup';\n"],"names":["AriaRadioGroup","AriaRadio"],"mappings":";;;;;;;;AA6BO,MAAM,UAAA,GAAa,UAAA;AAAA,EACxB,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM;AAAA,MACJ,SAAA;AAAA,MACA,KAAA;AAAA,MACA,cAAA;AAAA,MACA,WAAA;AAAA,MACA,UAAA;AAAA,MACA,YAAA,EAAc,SAAA;AAAA,MACd,iBAAA,EAAmB,cAAA;AAAA,MACnB,QAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAU,YAAY,CAAA;AAE7C,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,CAAC,KAAA,IAAS,CAAC,SAAA,IAAa,CAAC,cAAA,EAAgB;AAC3C,QAAA,OAAA,CAAQ,IAAA;AAAA,UACN;AAAA,SACF;AAAA,MACF;AAAA,IACF,CAAA,EAAG,CAAC,KAAA,EAAO,SAAA,EAAW,cAAc,CAAC,CAAA;AAGrC,IAAA,MAAM,kBAAA,GACJ,cAAA,KAAmB,UAAA,GAAa,UAAA,GAAa,IAAA,CAAA;AAE/C,IAAA,uBACE,IAAA;AAAA,MAACA,YAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,IAAA,CAAK,UAAA,CAAW,IAAA,EAAM,SAAS,CAAA;AAAA,QAC1C,YAAA,EAAY,SAAA;AAAA,QACZ,iBAAA,EAAiB,cAAA;AAAA,QAChB,GAAG,IAAA;AAAA,QACJ,GAAA;AAAA,QAEA,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAC,UAAA;AAAA,YAAA;AAAA,cACC,KAAA;AAAA,cACA,cAAA,EAAgB,kBAAA;AAAA,cAChB;AAAA;AAAA,WACF;AAAA,0BACA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,UAAA,CAAW,SAAU,QAAA,EAAS,CAAA;AAAA,8BAC7C,UAAA,EAAA,EAAW;AAAA;AAAA;AAAA,KACd;AAAA,EAEJ;AACF;AAEA,UAAA,CAAW,WAAA,GAAc,YAAA;AAGlB,MAAM,KAAA,GAAQ,UAAA,CAAyC,CAAC,KAAA,EAAO,GAAA,KAAQ;AAC5E,EAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAK,GAAI,KAAA;AAE/B,EAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAU,YAAY,CAAA;AAE7C,EAAA,uBACE,GAAA;AAAA,IAACC,OAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,IAAA,CAAK,UAAA,CAAW,KAAA,EAAO,SAAS,CAAA;AAAA,MAC1C,GAAG,IAAA;AAAA,MACJ;AAAA;AAAA,GACF;AAEJ,CAAC;AAED,UAAA,CAAW,WAAA,GAAc,YAAA;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScrollArea.esm.js","sources":["../../../src/components/ScrollArea/ScrollArea.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef } from 'react';\nimport { ScrollArea as ScrollAreaPrimitive } from '@base-ui-components/react/scroll-area';\nimport clsx from 'clsx';\nimport { useStyles } from '../../hooks/useStyles';\n\nconst ScrollAreaRoot = forwardRef<\n React.ElementRef<typeof ScrollAreaPrimitive.Root>,\n React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Root>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('ScrollArea');\n\n return (\n <ScrollAreaPrimitive.Root\n ref={ref}\n className={clsx(classNames.root, className)}\n {...props}\n />\n );\n});\nScrollAreaRoot.displayName = ScrollAreaPrimitive.Root.displayName;\n\nconst ScrollAreaViewport = forwardRef<\n React.ElementRef<typeof ScrollAreaPrimitive.Viewport>,\n React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Viewport>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('ScrollArea');\n\n return (\n <ScrollAreaPrimitive.Viewport\n ref={ref}\n className={clsx(classNames.viewport, className)}\n {...props}\n />\n );\n});\nScrollAreaViewport.displayName = ScrollAreaPrimitive.Viewport.displayName;\n\nconst ScrollAreaScrollbar = forwardRef<\n React.ElementRef<typeof ScrollAreaPrimitive.Scrollbar>,\n React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Scrollbar>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('ScrollArea');\n\n return (\n <ScrollAreaPrimitive.Scrollbar\n ref={ref}\n className={clsx(classNames.scrollbar, className)}\n {...props}\n />\n );\n});\nScrollAreaScrollbar.displayName = ScrollAreaPrimitive.Scrollbar.displayName;\n\nconst ScrollAreaThumb = forwardRef<\n React.ElementRef<typeof ScrollAreaPrimitive.Thumb>,\n React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Thumb>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('ScrollArea');\n\n return (\n <ScrollAreaPrimitive.Thumb\n ref={ref}\n className={clsx(classNames.thumb, className)}\n {...props}\n />\n );\n});\nScrollAreaThumb.displayName = ScrollAreaPrimitive.Thumb.displayName;\n\n/** @public */\nexport const ScrollArea = {\n Root: ScrollAreaRoot,\n Viewport: ScrollAreaViewport,\n Scrollbar: ScrollAreaScrollbar,\n Thumb: ScrollAreaThumb,\n};\n"],"names":["ScrollAreaPrimitive"],"mappings":";;;;;;AAqBA,MAAM,cAAA,GAAiB,WAGrB,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,
|
|
1
|
+
{"version":3,"file":"ScrollArea.esm.js","sources":["../../../src/components/ScrollArea/ScrollArea.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef } from 'react';\nimport { ScrollArea as ScrollAreaPrimitive } from '@base-ui-components/react/scroll-area';\nimport clsx from 'clsx';\nimport { useStyles } from '../../hooks/useStyles';\n\nconst ScrollAreaRoot = forwardRef<\n React.ElementRef<typeof ScrollAreaPrimitive.Root>,\n React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Root>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('ScrollArea');\n\n return (\n <ScrollAreaPrimitive.Root\n ref={ref}\n className={clsx(classNames.root, className)}\n {...props}\n />\n );\n});\nScrollAreaRoot.displayName = ScrollAreaPrimitive.Root.displayName;\n\nconst ScrollAreaViewport = forwardRef<\n React.ElementRef<typeof ScrollAreaPrimitive.Viewport>,\n React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Viewport>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('ScrollArea');\n\n return (\n <ScrollAreaPrimitive.Viewport\n ref={ref}\n className={clsx(classNames.viewport, className)}\n {...props}\n />\n );\n});\nScrollAreaViewport.displayName = ScrollAreaPrimitive.Viewport.displayName;\n\nconst ScrollAreaScrollbar = forwardRef<\n React.ElementRef<typeof ScrollAreaPrimitive.Scrollbar>,\n React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Scrollbar>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('ScrollArea');\n\n return (\n <ScrollAreaPrimitive.Scrollbar\n ref={ref}\n className={clsx(classNames.scrollbar, className)}\n {...props}\n />\n );\n});\nScrollAreaScrollbar.displayName = ScrollAreaPrimitive.Scrollbar.displayName;\n\nconst ScrollAreaThumb = forwardRef<\n React.ElementRef<typeof ScrollAreaPrimitive.Thumb>,\n React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Thumb>\n>(({ className, ...props }, ref) => {\n const { classNames } = useStyles('ScrollArea');\n\n return (\n <ScrollAreaPrimitive.Thumb\n ref={ref}\n className={clsx(classNames.thumb, className)}\n {...props}\n />\n );\n});\nScrollAreaThumb.displayName = ScrollAreaPrimitive.Thumb.displayName;\n\n/** @public */\nexport const ScrollArea = {\n Root: ScrollAreaRoot,\n Viewport: ScrollAreaViewport,\n Scrollbar: ScrollAreaScrollbar,\n Thumb: ScrollAreaThumb,\n};\n"],"names":["ScrollAreaPrimitive"],"mappings":";;;;;;AAqBA,MAAM,cAAA,GAAiB,WAGrB,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAA,KAAQ;AAClC,EAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAU,YAAY,CAAA;AAE7C,EAAA,uBACE,GAAA;AAAA,IAACA,YAAA,CAAoB,IAAA;AAAA,IAApB;AAAA,MACC,GAAA;AAAA,MACA,SAAA,EAAW,IAAA,CAAK,UAAA,CAAW,IAAA,EAAM,SAAS,CAAA;AAAA,MACzC,GAAG;AAAA;AAAA,GACN;AAEJ,CAAC,CAAA;AACD,cAAA,CAAe,WAAA,GAAcA,aAAoB,IAAA,CAAK,WAAA;AAEtD,MAAM,kBAAA,GAAqB,WAGzB,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAA,KAAQ;AAClC,EAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAU,YAAY,CAAA;AAE7C,EAAA,uBACE,GAAA;AAAA,IAACA,YAAA,CAAoB,QAAA;AAAA,IAApB;AAAA,MACC,GAAA;AAAA,MACA,SAAA,EAAW,IAAA,CAAK,UAAA,CAAW,QAAA,EAAU,SAAS,CAAA;AAAA,MAC7C,GAAG;AAAA;AAAA,GACN;AAEJ,CAAC,CAAA;AACD,kBAAA,CAAmB,WAAA,GAAcA,aAAoB,QAAA,CAAS,WAAA;AAE9D,MAAM,mBAAA,GAAsB,WAG1B,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAA,KAAQ;AAClC,EAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAU,YAAY,CAAA;AAE7C,EAAA,uBACE,GAAA;AAAA,IAACA,YAAA,CAAoB,SAAA;AAAA,IAApB;AAAA,MACC,GAAA;AAAA,MACA,SAAA,EAAW,IAAA,CAAK,UAAA,CAAW,SAAA,EAAW,SAAS,CAAA;AAAA,MAC9C,GAAG;AAAA;AAAA,GACN;AAEJ,CAAC,CAAA;AACD,mBAAA,CAAoB,WAAA,GAAcA,aAAoB,SAAA,CAAU,WAAA;AAEhE,MAAM,eAAA,GAAkB,WAGtB,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAA,KAAQ;AAClC,EAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAU,YAAY,CAAA;AAE7C,EAAA,uBACE,GAAA;AAAA,IAACA,YAAA,CAAoB,KAAA;AAAA,IAApB;AAAA,MACC,GAAA;AAAA,MACA,SAAA,EAAW,IAAA,CAAK,UAAA,CAAW,KAAA,EAAO,SAAS,CAAA;AAAA,MAC1C,GAAG;AAAA;AAAA,GACN;AAEJ,CAAC,CAAA;AACD,eAAA,CAAgB,WAAA,GAAcA,aAAoB,KAAA,CAAM,WAAA;AAGjD,MAAM,UAAA,GAAa;AAAA,EACxB,IAAA,EAAM,cAAA;AAAA,EACN,QAAA,EAAU,kBAAA;AAAA,EACV,SAAA,EAAW,mBAAA;AAAA,EACX,KAAA,EAAO;AACT;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SearchField.esm.js","sources":["../../../src/components/SearchField/SearchField.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef, useEffect, useState } from 'react';\nimport {\n Input,\n SearchField as AriaSearchField,\n Button,\n} from 'react-aria-components';\nimport clsx from 'clsx';\nimport { FieldLabel } from '../FieldLabel';\nimport { FieldError } from '../FieldError';\nimport { RiSearch2Line, RiCloseCircleLine } from '@remixicon/react';\nimport { useStyles } from '../../hooks/useStyles';\n\nimport type { SearchFieldProps } from './types';\n\n/** @public */\nexport const SearchField = forwardRef<HTMLDivElement, SearchFieldProps>(\n (props, ref) => {\n const {\n className,\n icon,\n size = 'small',\n label,\n secondaryLabel,\n description,\n isRequired,\n placeholder = 'Search',\n startCollapsed = false,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n ...rest\n } = props;\n\n const [isCollapsed, setIsCollapsed] = useState(false);\n const [shouldCollapse, setShouldCollapse] = useState(true);\n\n useEffect(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn(\n 'SearchField requires either a visible label, aria-label, or aria-labelledby for accessibility',\n );\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n const { classNames: textFieldClassNames, dataAttributes } = useStyles(\n 'TextField',\n {\n size,\n },\n );\n\n const { classNames: searchFieldClassNames } = useStyles('SearchField', {});\n\n // If a secondary label is provided, use it. Otherwise, use 'Required' if the field is required.\n const secondaryLabelText =\n secondaryLabel || (isRequired ? 'Required' : null);\n\n const handleClick = (isFocused: boolean) => {\n props.onFocusChange?.(isFocused);\n if (shouldCollapse) {\n if (isFocused) {\n setIsCollapsed(true);\n } else {\n setIsCollapsed(false);\n }\n }\n };\n\n const handleChange = (value: string) => {\n props.onChange?.(value);\n if (value.length > 0) {\n setShouldCollapse(false);\n } else {\n setShouldCollapse(true);\n }\n };\n\n return (\n <AriaSearchField\n className={clsx(\n textFieldClassNames.root,\n searchFieldClassNames.root,\n className,\n )}\n {...dataAttributes}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n data-start-collapsed={startCollapsed}\n data-collapsed={isCollapsed}\n onFocusChange={handleClick}\n onChange={handleChange}\n {...rest}\n ref={ref}\n >\n <FieldLabel\n label={label}\n secondaryLabel={secondaryLabelText}\n description={description}\n />\n <div\n className={textFieldClassNames.inputWrapper}\n data-size={dataAttributes['data-size']}\n >\n {icon !== false && (\n <div\n className={textFieldClassNames.inputIcon}\n data-size={dataAttributes['data-size']}\n aria-hidden=\"true\"\n >\n {icon || <RiSearch2Line />}\n </div>\n )}\n <Input\n className={textFieldClassNames.input}\n {...(icon !== false && { 'data-icon': true })}\n placeholder={placeholder}\n />\n <Button\n className={searchFieldClassNames.clear}\n data-size={dataAttributes['data-size']}\n >\n <RiCloseCircleLine />\n </Button>\n </div>\n <FieldError />\n </AriaSearchField>\n );\n },\n);\n\nSearchField.displayName = 'searchField';\n"],"names":["AriaSearchField"],"mappings":";;;;;;;;;AA+BO,MAAM,
|
|
1
|
+
{"version":3,"file":"SearchField.esm.js","sources":["../../../src/components/SearchField/SearchField.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef, useEffect, useState } from 'react';\nimport {\n Input,\n SearchField as AriaSearchField,\n Button,\n} from 'react-aria-components';\nimport clsx from 'clsx';\nimport { FieldLabel } from '../FieldLabel';\nimport { FieldError } from '../FieldError';\nimport { RiSearch2Line, RiCloseCircleLine } from '@remixicon/react';\nimport { useStyles } from '../../hooks/useStyles';\n\nimport type { SearchFieldProps } from './types';\n\n/** @public */\nexport const SearchField = forwardRef<HTMLDivElement, SearchFieldProps>(\n (props, ref) => {\n const {\n className,\n icon,\n size = 'small',\n label,\n secondaryLabel,\n description,\n isRequired,\n placeholder = 'Search',\n startCollapsed = false,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n ...rest\n } = props;\n\n const [isCollapsed, setIsCollapsed] = useState(false);\n const [shouldCollapse, setShouldCollapse] = useState(true);\n\n useEffect(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn(\n 'SearchField requires either a visible label, aria-label, or aria-labelledby for accessibility',\n );\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n const { classNames: textFieldClassNames, dataAttributes } = useStyles(\n 'TextField',\n {\n size,\n },\n );\n\n const { classNames: searchFieldClassNames } = useStyles('SearchField', {});\n\n // If a secondary label is provided, use it. Otherwise, use 'Required' if the field is required.\n const secondaryLabelText =\n secondaryLabel || (isRequired ? 'Required' : null);\n\n const handleClick = (isFocused: boolean) => {\n props.onFocusChange?.(isFocused);\n if (shouldCollapse) {\n if (isFocused) {\n setIsCollapsed(true);\n } else {\n setIsCollapsed(false);\n }\n }\n };\n\n const handleChange = (value: string) => {\n props.onChange?.(value);\n if (value.length > 0) {\n setShouldCollapse(false);\n } else {\n setShouldCollapse(true);\n }\n };\n\n return (\n <AriaSearchField\n className={clsx(\n textFieldClassNames.root,\n searchFieldClassNames.root,\n className,\n )}\n {...dataAttributes}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n data-start-collapsed={startCollapsed}\n data-collapsed={isCollapsed}\n onFocusChange={handleClick}\n onChange={handleChange}\n {...rest}\n ref={ref}\n >\n <FieldLabel\n label={label}\n secondaryLabel={secondaryLabelText}\n description={description}\n />\n <div\n className={textFieldClassNames.inputWrapper}\n data-size={dataAttributes['data-size']}\n >\n {icon !== false && (\n <div\n className={textFieldClassNames.inputIcon}\n data-size={dataAttributes['data-size']}\n aria-hidden=\"true\"\n >\n {icon || <RiSearch2Line />}\n </div>\n )}\n <Input\n className={textFieldClassNames.input}\n {...(icon !== false && { 'data-icon': true })}\n placeholder={placeholder}\n />\n <Button\n className={searchFieldClassNames.clear}\n data-size={dataAttributes['data-size']}\n >\n <RiCloseCircleLine />\n </Button>\n </div>\n <FieldError />\n </AriaSearchField>\n );\n },\n);\n\nSearchField.displayName = 'searchField';\n"],"names":["AriaSearchField"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.esm.js","sources":["../../../src/components/Select/Select.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef, useEffect } from 'react';\nimport {\n Select as AriaSelect,\n SelectValue,\n Button,\n Popover,\n ListBox,\n ListBoxItem,\n Text,\n} from 'react-aria-components';\nimport clsx from 'clsx';\nimport { SelectProps } from './types';\nimport { useStyles } from '../../hooks/useStyles';\nimport { FieldLabel } from '../FieldLabel';\nimport { Icon } from '../Icon';\nimport { FieldError } from '../FieldError';\n\n/** @public */\nexport const Select = forwardRef<HTMLDivElement, SelectProps>((props, ref) => {\n const {\n className,\n label,\n description,\n options,\n placeholder = 'Select an option',\n size = 'small',\n icon,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n isRequired,\n secondaryLabel,\n style,\n ...rest\n } = props;\n\n const { classNames: popoverClassNames } = useStyles('Popover');\n const { classNames, dataAttributes } = useStyles('Select', {\n size,\n });\n\n useEffect(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn(\n 'Select requires either a visible label, aria-label, or aria-labelledby for accessibility',\n );\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n // If a secondary label is provided, use it. Otherwise, use 'Required' if the field is required.\n const secondaryLabelText = secondaryLabel || (isRequired ? 'Required' : null);\n\n return (\n <AriaSelect\n className={clsx(classNames.root, className)}\n {...dataAttributes}\n ref={ref}\n {...rest}\n >\n <FieldLabel\n label={label}\n secondaryLabel={secondaryLabelText}\n description={description}\n />\n <Button\n className={classNames.trigger}\n data-size={dataAttributes['data-size']}\n >\n {icon}\n <SelectValue className={classNames.value} />\n <Icon aria-hidden=\"true\" name=\"chevron-down\" />\n </Button>\n <FieldError />\n <Popover className={popoverClassNames.root}>\n <ListBox className={classNames.list}>\n {options?.map(option => (\n <ListBoxItem\n key={option.value}\n id={option.value}\n className={classNames.item}\n >\n <div className={classNames.itemIndicator}>\n <Icon name=\"check\" />\n </div>\n <Text slot=\"label\" className={classNames.itemLabel}>\n {option.label}\n </Text>\n </ListBoxItem>\n ))}\n </ListBox>\n </Popover>\n </AriaSelect>\n );\n});\n\nSelect.displayName = 'Select';\n"],"names":["AriaSelect"],"mappings":";;;;;;;;;;;AAkCO,MAAM,
|
|
1
|
+
{"version":3,"file":"Select.esm.js","sources":["../../../src/components/Select/Select.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef, useEffect } from 'react';\nimport {\n Select as AriaSelect,\n SelectValue,\n Button,\n Popover,\n ListBox,\n ListBoxItem,\n Text,\n} from 'react-aria-components';\nimport clsx from 'clsx';\nimport { SelectProps } from './types';\nimport { useStyles } from '../../hooks/useStyles';\nimport { FieldLabel } from '../FieldLabel';\nimport { Icon } from '../Icon';\nimport { FieldError } from '../FieldError';\n\n/** @public */\nexport const Select = forwardRef<HTMLDivElement, SelectProps>((props, ref) => {\n const {\n className,\n label,\n description,\n options,\n placeholder = 'Select an option',\n size = 'small',\n icon,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n isRequired,\n secondaryLabel,\n style,\n ...rest\n } = props;\n\n const { classNames: popoverClassNames } = useStyles('Popover');\n const { classNames, dataAttributes } = useStyles('Select', {\n size,\n });\n\n useEffect(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn(\n 'Select requires either a visible label, aria-label, or aria-labelledby for accessibility',\n );\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n // If a secondary label is provided, use it. Otherwise, use 'Required' if the field is required.\n const secondaryLabelText = secondaryLabel || (isRequired ? 'Required' : null);\n\n return (\n <AriaSelect\n className={clsx(classNames.root, className)}\n {...dataAttributes}\n ref={ref}\n {...rest}\n >\n <FieldLabel\n label={label}\n secondaryLabel={secondaryLabelText}\n description={description}\n />\n <Button\n className={classNames.trigger}\n data-size={dataAttributes['data-size']}\n >\n {icon}\n <SelectValue className={classNames.value} />\n <Icon aria-hidden=\"true\" name=\"chevron-down\" />\n </Button>\n <FieldError />\n <Popover className={popoverClassNames.root}>\n <ListBox className={classNames.list}>\n {options?.map(option => (\n <ListBoxItem\n key={option.value}\n id={option.value}\n className={classNames.item}\n >\n <div className={classNames.itemIndicator}>\n <Icon name=\"check\" />\n </div>\n <Text slot=\"label\" className={classNames.itemLabel}>\n {option.label}\n </Text>\n </ListBoxItem>\n ))}\n </ListBox>\n </Popover>\n </AriaSelect>\n );\n});\n\nSelect.displayName = 'Select';\n"],"names":["AriaSelect"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Skeleton.esm.js","sources":["../../../src/components/Skeleton/Skeleton.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useStyles } from '../../hooks/useStyles';\nimport { SkeletonProps } from './types';\n\n/** @public */\nexport const Skeleton = (props: SkeletonProps) => {\n const { width = 80, height = 24, rounded = false, ...rest } = props;\n const { classNames } = useStyles('Skeleton');\n\n return (\n <div\n className={classNames.root}\n data-rounded={rounded}\n style={{\n width,\n height,\n }}\n {...rest}\n />\n );\n};\n"],"names":[],"mappings":";;;
|
|
1
|
+
{"version":3,"file":"Skeleton.esm.js","sources":["../../../src/components/Skeleton/Skeleton.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useStyles } from '../../hooks/useStyles';\nimport { SkeletonProps } from './types';\n\n/** @public */\nexport const Skeleton = (props: SkeletonProps) => {\n const { width = 80, height = 24, rounded = false, ...rest } = props;\n const { classNames } = useStyles('Skeleton');\n\n return (\n <div\n className={classNames.root}\n data-rounded={rounded}\n style={{\n width,\n height,\n }}\n {...rest}\n />\n );\n};\n"],"names":[],"mappings":";;;AAoBO,MAAM,QAAA,GAAW,CAAC,KAAA,KAAyB;AAChD,EAAA,MAAM,EAAE,QAAQ,EAAA,EAAI,MAAA,GAAS,IAAI,OAAA,GAAU,KAAA,EAAO,GAAG,IAAA,EAAK,GAAI,KAAA;AAC9D,EAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAU,UAAU,CAAA;AAE3C,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAW,UAAA,CAAW,IAAA;AAAA,MACtB,cAAA,EAAc,OAAA;AAAA,MACd,KAAA,EAAO;AAAA,QACL,KAAA;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG;AAAA;AAAA,GACN;AAEJ;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Switch.esm.js","sources":["../../../src/components/Switch/Switch.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef } from 'react';\nimport { Switch as AriaSwitch } from 'react-aria-components';\nimport type { SwitchProps } from './types';\nimport { useStyles } from '../../hooks/useStyles';\n\n/** @public */\nexport const Switch = forwardRef<HTMLLabelElement, SwitchProps>(\n ({ label, ...props }, ref) => {\n const { classNames } = useStyles('Switch');\n\n return (\n <AriaSwitch className={classNames.root} ref={ref} {...props}>\n <div className={classNames.indicator} />\n {label}\n </AriaSwitch>\n );\n },\n);\n\nSwitch.displayName = 'Switch';\n"],"names":["AriaSwitch"],"mappings":";;;;;AAsBO,MAAM,
|
|
1
|
+
{"version":3,"file":"Switch.esm.js","sources":["../../../src/components/Switch/Switch.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef } from 'react';\nimport { Switch as AriaSwitch } from 'react-aria-components';\nimport type { SwitchProps } from './types';\nimport { useStyles } from '../../hooks/useStyles';\n\n/** @public */\nexport const Switch = forwardRef<HTMLLabelElement, SwitchProps>(\n ({ label, ...props }, ref) => {\n const { classNames } = useStyles('Switch');\n\n return (\n <AriaSwitch className={classNames.root} ref={ref} {...props}>\n <div className={classNames.indicator} />\n {label}\n </AriaSwitch>\n );\n },\n);\n\nSwitch.displayName = 'Switch';\n"],"names":["AriaSwitch"],"mappings":";;;;;AAsBO,MAAM,MAAA,GAAS,UAAA;AAAA,EACpB,CAAC,EAAE,KAAA,EAAO,GAAG,KAAA,IAAS,GAAA,KAAQ;AAC5B,IAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAU,QAAQ,CAAA;AAEzC,IAAA,4BACGA,QAAA,EAAA,EAAW,SAAA,EAAW,WAAW,IAAA,EAAM,GAAA,EAAW,GAAG,KAAA,EACpD,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,UAAA,CAAW,SAAA,EAAW,CAAA;AAAA,MACrC;AAAA,KAAA,EACH,CAAA;AAAA,EAEJ;AACF;AAEA,MAAA,CAAO,WAAA,GAAc,QAAA;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Cell.esm.js","sources":["../../../../src/components/Table/components/Cell.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport clsx from 'clsx';\nimport { Text } from '../../Text';\nimport { Link } from '../../Link';\nimport { Cell as ReactAriaCell } from 'react-aria-components';\nimport type { CellProps } from '../types';\nimport { useStyles } from '../../../hooks/useStyles';\n\n/** @public */\nconst Cell = (props: CellProps) => {\n const {\n className,\n title,\n description,\n color = 'primary',\n leadingIcon,\n href,\n ...rest\n } = props;\n\n const { classNames } = useStyles('Table');\n\n return (\n <ReactAriaCell className={clsx(classNames.cell, className)} {...rest}>\n <div className={classNames.cellContentWrapper}>\n {leadingIcon && (\n <div className={classNames.cellIcon}>{leadingIcon}</div>\n )}\n <div className={classNames.cellContent}>\n {href ? (\n <Link href={href} variant=\"body-medium\" color={color}>\n {title}\n </Link>\n ) : (\n <Text as=\"p\" variant=\"body-medium\" color={color}>\n {title}\n </Text>\n )}\n {description && (\n <Text variant=\"body-medium\" color=\"secondary\">\n {description}\n </Text>\n )}\n </div>\n </div>\n </ReactAriaCell>\n );\n};\n\nCell.displayName = 'Cell';\n\nexport { Cell };\n"],"names":["ReactAriaCell"],"mappings":";;;;;;;
|
|
1
|
+
{"version":3,"file":"Cell.esm.js","sources":["../../../../src/components/Table/components/Cell.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport clsx from 'clsx';\nimport { Text } from '../../Text';\nimport { Link } from '../../Link';\nimport { Cell as ReactAriaCell } from 'react-aria-components';\nimport type { CellProps } from '../types';\nimport { useStyles } from '../../../hooks/useStyles';\n\n/** @public */\nconst Cell = (props: CellProps) => {\n const {\n className,\n title,\n description,\n color = 'primary',\n leadingIcon,\n href,\n ...rest\n } = props;\n\n const { classNames } = useStyles('Table');\n\n return (\n <ReactAriaCell className={clsx(classNames.cell, className)} {...rest}>\n <div className={classNames.cellContentWrapper}>\n {leadingIcon && (\n <div className={classNames.cellIcon}>{leadingIcon}</div>\n )}\n <div className={classNames.cellContent}>\n {href ? (\n <Link href={href} variant=\"body-medium\" color={color}>\n {title}\n </Link>\n ) : (\n <Text as=\"p\" variant=\"body-medium\" color={color}>\n {title}\n </Text>\n )}\n {description && (\n <Text variant=\"body-medium\" color=\"secondary\">\n {description}\n </Text>\n )}\n </div>\n </div>\n </ReactAriaCell>\n );\n};\n\nCell.displayName = 'Cell';\n\nexport { Cell };\n"],"names":["ReactAriaCell"],"mappings":";;;;;;;AAwBA,MAAM,IAAA,GAAO,CAAC,KAAA,KAAqB;AACjC,EAAA,MAAM;AAAA,IACJ,SAAA;AAAA,IACA,KAAA;AAAA,IACA,WAAA;AAAA,IACA,KAAA,GAAQ,SAAA;AAAA,IACR,WAAA;AAAA,IACA,IAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAU,OAAO,CAAA;AAExC,EAAA,uBACE,GAAA,CAACA,MAAA,EAAA,EAAc,SAAA,EAAW,IAAA,CAAK,WAAW,IAAA,EAAM,SAAS,CAAA,EAAI,GAAG,IAAA,EAC9D,QAAA,kBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,WAAW,kBAAA,EACxB,QAAA,EAAA;AAAA,IAAA,WAAA,oBACC,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,UAAA,CAAW,UAAW,QAAA,EAAA,WAAA,EAAY,CAAA;AAAA,oBAEpD,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,UAAA,CAAW,WAAA,EACxB,QAAA,EAAA;AAAA,MAAA,IAAA,mBACC,GAAA,CAAC,IAAA,EAAA,EAAK,IAAA,EAAY,OAAA,EAAQ,eAAc,KAAA,EACrC,QAAA,EAAA,KAAA,EACH,CAAA,mBAEA,GAAA,CAAC,QAAK,EAAA,EAAG,GAAA,EAAI,OAAA,EAAQ,aAAA,EAAc,OAChC,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,MAED,+BACC,GAAA,CAAC,IAAA,EAAA,EAAK,SAAQ,aAAA,EAAc,KAAA,EAAM,aAC/B,QAAA,EAAA,WAAA,EACH;AAAA,KAAA,EAEJ;AAAA,GAAA,EACF,CAAA,EACF,CAAA;AAEJ;AAEA,IAAA,CAAK,WAAA,GAAc,MAAA;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CellProfile.esm.js","sources":["../../../../src/components/Table/components/CellProfile.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport clsx from 'clsx';\nimport { CellProfileProps } from '../types';\nimport { Text } from '../../Text/Text';\nimport { Link } from '../../Link/Link';\nimport { Avatar } from '@base-ui-components/react/avatar';\nimport { useStyles } from '../../../hooks/useStyles';\nimport { Cell as ReactAriaCell } from 'react-aria-components';\n\n/** @public */\nexport const CellProfile = (props: CellProfileProps) => {\n const {\n className,\n src,\n name,\n href,\n description,\n color = 'primary',\n ...rest\n } = props;\n const { classNames } = useStyles('Table');\n\n return (\n <ReactAriaCell className={clsx(classNames.cell, className)} {...rest}>\n <div className={classNames.cellContentWrapper}>\n <div className={classNames.cellIcon}>\n {src && (\n <Avatar.Root className={classNames.cellProfileAvatar}>\n <Avatar.Image\n src={src}\n width=\"20\"\n height=\"20\"\n className={classNames.cellProfileAvatarImage}\n />\n <Avatar.Fallback className={classNames.cellProfileAvatarFallback}>\n {(name || '')\n .split(' ')\n .map(word => word[0])\n .join('')\n .toLocaleUpperCase('en-US')\n .slice(0, 1)}\n </Avatar.Fallback>\n </Avatar.Root>\n )}\n </div>\n <div className={classNames.cellContent}>\n {name && href ? (\n <Link href={href}>{name}</Link>\n ) : (\n <Text as=\"p\" variant=\"body-medium\" color={color}>\n {name}\n </Text>\n )}\n {description && (\n <Text variant=\"body-medium\" color=\"secondary\">\n {description}\n </Text>\n )}\n </div>\n </div>\n </ReactAriaCell>\n );\n};\n"],"names":["ReactAriaCell"],"mappings":";;;;;;;;
|
|
1
|
+
{"version":3,"file":"CellProfile.esm.js","sources":["../../../../src/components/Table/components/CellProfile.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport clsx from 'clsx';\nimport { CellProfileProps } from '../types';\nimport { Text } from '../../Text/Text';\nimport { Link } from '../../Link/Link';\nimport { Avatar } from '@base-ui-components/react/avatar';\nimport { useStyles } from '../../../hooks/useStyles';\nimport { Cell as ReactAriaCell } from 'react-aria-components';\n\n/** @public */\nexport const CellProfile = (props: CellProfileProps) => {\n const {\n className,\n src,\n name,\n href,\n description,\n color = 'primary',\n ...rest\n } = props;\n const { classNames } = useStyles('Table');\n\n return (\n <ReactAriaCell className={clsx(classNames.cell, className)} {...rest}>\n <div className={classNames.cellContentWrapper}>\n <div className={classNames.cellIcon}>\n {src && (\n <Avatar.Root className={classNames.cellProfileAvatar}>\n <Avatar.Image\n src={src}\n width=\"20\"\n height=\"20\"\n className={classNames.cellProfileAvatarImage}\n />\n <Avatar.Fallback className={classNames.cellProfileAvatarFallback}>\n {(name || '')\n .split(' ')\n .map(word => word[0])\n .join('')\n .toLocaleUpperCase('en-US')\n .slice(0, 1)}\n </Avatar.Fallback>\n </Avatar.Root>\n )}\n </div>\n <div className={classNames.cellContent}>\n {name && href ? (\n <Link href={href}>{name}</Link>\n ) : (\n <Text as=\"p\" variant=\"body-medium\" color={color}>\n {name}\n </Text>\n )}\n {description && (\n <Text variant=\"body-medium\" color=\"secondary\">\n {description}\n </Text>\n )}\n </div>\n </div>\n </ReactAriaCell>\n );\n};\n"],"names":["ReactAriaCell"],"mappings":";;;;;;;;AAyBO,MAAM,WAAA,GAAc,CAAC,KAAA,KAA4B;AACtD,EAAA,MAAM;AAAA,IACJ,SAAA;AAAA,IACA,GAAA;AAAA,IACA,IAAA;AAAA,IACA,IAAA;AAAA,IACA,WAAA;AAAA,IACA,KAAA,GAAQ,SAAA;AAAA,IACR,GAAG;AAAA,GACL,GAAI,KAAA;AACJ,EAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAU,OAAO,CAAA;AAExC,EAAA,uBACE,GAAA,CAACA,IAAA,EAAA,EAAc,SAAA,EAAW,IAAA,CAAK,WAAW,IAAA,EAAM,SAAS,CAAA,EAAI,GAAG,IAAA,EAC9D,QAAA,kBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,WAAW,kBAAA,EACzB,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,UAAA,CAAW,QAAA,EACxB,QAAA,EAAA,GAAA,oBACC,IAAA,CAAC,MAAA,CAAO,IAAA,EAAP,EAAY,SAAA,EAAW,UAAA,CAAW,iBAAA,EACjC,QAAA,EAAA;AAAA,sBAAA,GAAA;AAAA,QAAC,MAAA,CAAO,KAAA;AAAA,QAAP;AAAA,UACC,GAAA;AAAA,UACA,KAAA,EAAM,IAAA;AAAA,UACN,MAAA,EAAO,IAAA;AAAA,UACP,WAAW,UAAA,CAAW;AAAA;AAAA,OACxB;AAAA,sBACA,GAAA,CAAC,MAAA,CAAO,QAAA,EAAP,EAAgB,SAAA,EAAW,UAAA,CAAW,yBAAA,EACnC,QAAA,EAAA,CAAA,IAAA,IAAQ,EAAA,EACP,KAAA,CAAM,GAAG,CAAA,CACT,GAAA,CAAI,CAAA,IAAA,KAAQ,IAAA,CAAK,CAAC,CAAC,CAAA,CACnB,IAAA,CAAK,EAAE,CAAA,CACP,iBAAA,CAAkB,OAAO,CAAA,CACzB,KAAA,CAAM,CAAA,EAAG,CAAC,CAAA,EACf;AAAA,KAAA,EACF,CAAA,EAEJ,CAAA;AAAA,oBACA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,UAAA,CAAW,WAAA,EACxB,QAAA,EAAA;AAAA,MAAA,IAAA,IAAQ,IAAA,mBACP,GAAA,CAAC,IAAA,EAAA,EAAK,IAAA,EAAa,QAAA,EAAA,IAAA,EAAK,CAAA,mBAExB,GAAA,CAAC,IAAA,EAAA,EAAK,EAAA,EAAG,GAAA,EAAI,OAAA,EAAQ,aAAA,EAAc,OAChC,QAAA,EAAA,IAAA,EACH,CAAA;AAAA,MAED,+BACC,GAAA,CAAC,IAAA,EAAA,EAAK,SAAQ,aAAA,EAAc,KAAA,EAAM,aAC/B,QAAA,EAAA,WAAA,EACH;AAAA,KAAA,EAEJ;AAAA,GAAA,EACF,CAAA,EACF,CAAA;AAEJ;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Column.esm.js","sources":["../../../../src/components/Table/components/Column.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n Column as ReactAriaColumn,\n type ColumnProps,\n} from 'react-aria-components';\nimport { Icon } from '../../Icon';\nimport { useStyles } from '../../../hooks/useStyles';\n\n/** @public */\nexport const Column = (\n props: Omit<ColumnProps, 'children'> & { children?: React.ReactNode },\n) => {\n const { classNames } = useStyles('Table');\n\n return (\n <ReactAriaColumn className={classNames.head} {...props}>\n {({ allowsSorting, sortDirection }) => (\n <>\n {props.children}\n {allowsSorting && (\n <span aria-hidden=\"true\" className={classNames.headSortButton}>\n {sortDirection === 'ascending' ? (\n <Icon name=\"arrow-up\" size={16} />\n ) : (\n <Icon name=\"arrow-down\" size={16} />\n )}\n </span>\n )}\n </>\n )}\n </ReactAriaColumn>\n );\n};\n"],"names":["ReactAriaColumn"],"mappings":";;;;;;;
|
|
1
|
+
{"version":3,"file":"Column.esm.js","sources":["../../../../src/components/Table/components/Column.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n Column as ReactAriaColumn,\n type ColumnProps,\n} from 'react-aria-components';\nimport { Icon } from '../../Icon';\nimport { useStyles } from '../../../hooks/useStyles';\n\n/** @public */\nexport const Column = (\n props: Omit<ColumnProps, 'children'> & { children?: React.ReactNode },\n) => {\n const { classNames } = useStyles('Table');\n\n return (\n <ReactAriaColumn className={classNames.head} {...props}>\n {({ allowsSorting, sortDirection }) => (\n <>\n {props.children}\n {allowsSorting && (\n <span aria-hidden=\"true\" className={classNames.headSortButton}>\n {sortDirection === 'ascending' ? (\n <Icon name=\"arrow-up\" size={16} />\n ) : (\n <Icon name=\"arrow-down\" size={16} />\n )}\n </span>\n )}\n </>\n )}\n </ReactAriaColumn>\n );\n};\n"],"names":["ReactAriaColumn"],"mappings":";;;;;;;AAwBO,MAAM,MAAA,GAAS,CACpB,KAAA,KACG;AACH,EAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAU,OAAO,CAAA;AAExC,EAAA,uBACE,GAAA,CAACA,QAAA,EAAA,EAAgB,SAAA,EAAW,UAAA,CAAW,IAAA,EAAO,GAAG,KAAA,EAC9C,QAAA,EAAA,CAAC,EAAE,aAAA,EAAe,aAAA,EAAc,qBAC/B,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,IAAA,KAAA,CAAM,QAAA;AAAA,IACN,aAAA,wBACE,MAAA,EAAA,EAAK,aAAA,EAAY,QAAO,SAAA,EAAW,UAAA,CAAW,cAAA,EAC5C,QAAA,EAAA,aAAA,KAAkB,WAAA,mBACjB,GAAA,CAAC,QAAK,IAAA,EAAK,UAAA,EAAW,IAAA,EAAM,EAAA,EAAI,CAAA,mBAEhC,GAAA,CAAC,QAAK,IAAA,EAAK,YAAA,EAAa,IAAA,EAAM,EAAA,EAAI,CAAA,EAEtC;AAAA,GAAA,EAEJ,CAAA,EAEJ,CAAA;AAEJ;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Row.esm.js","sources":["../../../../src/components/Table/components/Row.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n Row as ReactAriaRow,\n RowProps,\n useTableOptions,\n Cell,\n Collection,\n Checkbox,\n RouterProvider,\n} from 'react-aria-components';\nimport { useStyles } from '../../../hooks/useStyles';\nimport { useNavigate } from 'react-router-dom';\nimport { useHref } from 'react-router-dom';\nimport { isExternalLink } from '../../../utils/isExternalLink';\n\n/** @public */\nexport function Row<T extends object>({\n id,\n columns,\n children,\n href,\n ...otherProps\n}: RowProps<T>) {\n const { classNames } = useStyles('Table');\n const navigate = useNavigate();\n const isExternal = isExternalLink(href);\n\n let { selectionBehavior } = useTableOptions();\n\n const content = (\n <>\n {selectionBehavior === 'toggle' && (\n <Cell>\n <Checkbox slot=\"selection\" />\n </Cell>\n )}\n <Collection items={columns}>{children}</Collection>\n </>\n );\n\n if (isExternal) {\n return (\n <ReactAriaRow id={id} className={classNames.row} {...otherProps}>\n {content}\n </ReactAriaRow>\n );\n }\n\n return (\n <RouterProvider navigate={navigate} useHref={useHref}>\n <ReactAriaRow\n id={id}\n className={classNames.row}\n data-react-aria-pressable=\"true\"\n {...otherProps}\n >\n {content}\n </ReactAriaRow>\n </RouterProvider>\n );\n}\n"],"names":["ReactAriaRow"],"mappings":";;;;;;AA+BO,SAAS,
|
|
1
|
+
{"version":3,"file":"Row.esm.js","sources":["../../../../src/components/Table/components/Row.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n Row as ReactAriaRow,\n RowProps,\n useTableOptions,\n Cell,\n Collection,\n Checkbox,\n RouterProvider,\n} from 'react-aria-components';\nimport { useStyles } from '../../../hooks/useStyles';\nimport { useNavigate } from 'react-router-dom';\nimport { useHref } from 'react-router-dom';\nimport { isExternalLink } from '../../../utils/isExternalLink';\n\n/** @public */\nexport function Row<T extends object>({\n id,\n columns,\n children,\n href,\n ...otherProps\n}: RowProps<T>) {\n const { classNames } = useStyles('Table');\n const navigate = useNavigate();\n const isExternal = isExternalLink(href);\n\n let { selectionBehavior } = useTableOptions();\n\n const content = (\n <>\n {selectionBehavior === 'toggle' && (\n <Cell>\n <Checkbox slot=\"selection\" />\n </Cell>\n )}\n <Collection items={columns}>{children}</Collection>\n </>\n );\n\n if (isExternal) {\n return (\n <ReactAriaRow id={id} className={classNames.row} {...otherProps}>\n {content}\n </ReactAriaRow>\n );\n }\n\n return (\n <RouterProvider navigate={navigate} useHref={useHref}>\n <ReactAriaRow\n id={id}\n className={classNames.row}\n data-react-aria-pressable=\"true\"\n {...otherProps}\n >\n {content}\n </ReactAriaRow>\n </RouterProvider>\n );\n}\n"],"names":["ReactAriaRow"],"mappings":";;;;;;AA+BO,SAAS,GAAA,CAAsB;AAAA,EACpC,EAAA;AAAA,EACA,OAAA;AAAA,EACA,QAAA;AAAA,EACA,IAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAgB;AACd,EAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAU,OAAO,CAAA;AACxC,EAAA,MAAM,WAAW,WAAA,EAAY;AAC7B,EAAA,MAAM,UAAA,GAAa,eAAe,IAAI,CAAA;AAEtC,EAAA,IAAI,EAAE,iBAAA,EAAkB,GAAI,eAAA,EAAgB;AAE5C,EAAA,MAAM,0BACJ,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,IAAA,iBAAA,KAAsB,4BACrB,GAAA,CAAC,IAAA,EAAA,EACC,8BAAC,QAAA,EAAA,EAAS,IAAA,EAAK,aAAY,CAAA,EAC7B,CAAA;AAAA,oBAEF,GAAA,CAAC,UAAA,EAAA,EAAW,KAAA,EAAO,OAAA,EAAU,QAAA,EAAS;AAAA,GAAA,EACxC,CAAA;AAGF,EAAA,IAAI,UAAA,EAAY;AACd,IAAA,uBACE,GAAA,CAACA,SAAa,EAAA,EAAQ,SAAA,EAAW,WAAW,GAAA,EAAM,GAAG,YAClD,QAAA,EAAA,OAAA,EACH,CAAA;AAAA,EAEJ;AAEA,EAAA,uBACE,GAAA,CAAC,cAAA,EAAA,EAAe,QAAA,EAAoB,OAAA,EAClC,QAAA,kBAAA,GAAA;AAAA,IAACA,KAAA;AAAA,IAAA;AAAA,MACC,EAAA;AAAA,MACA,WAAW,UAAA,CAAW,GAAA;AAAA,MACtB,2BAAA,EAA0B,MAAA;AAAA,MACzB,GAAG,UAAA;AAAA,MAEH,QAAA,EAAA;AAAA;AAAA,GACH,EACF,CAAA;AAEJ;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Table.esm.js","sources":["../../../../src/components/Table/components/Table.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useStyles } from '../../../hooks/useStyles';\nimport {\n Table as ReactAriaTable,\n type TableProps,\n} from 'react-aria-components';\n\n/** @public */\nexport const Table = (props: TableProps) => {\n const { classNames } = useStyles('Table');\n\n return (\n <ReactAriaTable\n className={classNames.table}\n aria-label=\"Data table\"\n {...props}\n />\n );\n};\n"],"names":["ReactAriaTable"],"mappings":";;;;
|
|
1
|
+
{"version":3,"file":"Table.esm.js","sources":["../../../../src/components/Table/components/Table.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useStyles } from '../../../hooks/useStyles';\nimport {\n Table as ReactAriaTable,\n type TableProps,\n} from 'react-aria-components';\n\n/** @public */\nexport const Table = (props: TableProps) => {\n const { classNames } = useStyles('Table');\n\n return (\n <ReactAriaTable\n className={classNames.table}\n aria-label=\"Data table\"\n {...props}\n />\n );\n};\n"],"names":["ReactAriaTable"],"mappings":";;;;AAuBO,MAAM,KAAA,GAAQ,CAAC,KAAA,KAAsB;AAC1C,EAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAU,OAAO,CAAA;AAExC,EAAA,uBACE,GAAA;AAAA,IAACA,OAAA;AAAA,IAAA;AAAA,MACC,WAAW,UAAA,CAAW,KAAA;AAAA,MACtB,YAAA,EAAW,YAAA;AAAA,MACV,GAAG;AAAA;AAAA,GACN;AAEJ;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TableBody.esm.js","sources":["../../../../src/components/Table/components/TableBody.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n TableBody as ReactAriaTableBody,\n type TableBodyProps,\n} from 'react-aria-components';\nimport { useStyles } from '../../../hooks/useStyles';\n\n/** @public */\nexport const TableBody = <T extends object>(props: TableBodyProps<T>) => {\n const { classNames } = useStyles('Table');\n\n return <ReactAriaTableBody className={classNames.body} {...props} />;\n};\n"],"names":["ReactAriaTableBody"],"mappings":";;;;
|
|
1
|
+
{"version":3,"file":"TableBody.esm.js","sources":["../../../../src/components/Table/components/TableBody.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n TableBody as ReactAriaTableBody,\n type TableBodyProps,\n} from 'react-aria-components';\nimport { useStyles } from '../../../hooks/useStyles';\n\n/** @public */\nexport const TableBody = <T extends object>(props: TableBodyProps<T>) => {\n const { classNames } = useStyles('Table');\n\n return <ReactAriaTableBody className={classNames.body} {...props} />;\n};\n"],"names":["ReactAriaTableBody"],"mappings":";;;;AAuBO,MAAM,SAAA,GAAY,CAAmB,KAAA,KAA6B;AACvE,EAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAU,OAAO,CAAA;AAExC,EAAA,2BAAQA,WAAA,EAAA,EAAmB,SAAA,EAAW,UAAA,CAAW,IAAA,EAAO,GAAG,KAAA,EAAO,CAAA;AACpE;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TableHeader.esm.js","sources":["../../../../src/components/Table/components/TableHeader.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n TableHeader as ReactAriaTableHeader,\n type TableHeaderProps,\n Checkbox,\n} from 'react-aria-components';\nimport { Collection, useTableOptions } from 'react-aria-components';\nimport { Column } from './Column';\nimport { useStyles } from '../../../hooks/useStyles';\n\n/** @public */\nexport const TableHeader = <T extends object>({\n columns,\n children,\n}: TableHeaderProps<T>) => {\n let { selectionBehavior, selectionMode, allowsDragging } = useTableOptions();\n\n const { classNames } = useStyles('Table');\n\n return (\n <ReactAriaTableHeader className={classNames.header}>\n {/* Add extra columns for drag and drop and selection. */}\n {allowsDragging && <Column />}\n {selectionBehavior === 'toggle' && (\n <Column>\n {selectionMode === 'multiple' && <Checkbox slot=\"selection\" />}\n </Column>\n )}\n <Collection items={columns}>{children}</Collection>\n </ReactAriaTableHeader>\n );\n};\n"],"names":["ReactAriaTableHeader"],"mappings":";;;;;AA0BO,MAAM,cAAc,CAAmB;AAAA,EAC5C,OAAA;AAAA,EACA;AACF,
|
|
1
|
+
{"version":3,"file":"TableHeader.esm.js","sources":["../../../../src/components/Table/components/TableHeader.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n TableHeader as ReactAriaTableHeader,\n type TableHeaderProps,\n Checkbox,\n} from 'react-aria-components';\nimport { Collection, useTableOptions } from 'react-aria-components';\nimport { Column } from './Column';\nimport { useStyles } from '../../../hooks/useStyles';\n\n/** @public */\nexport const TableHeader = <T extends object>({\n columns,\n children,\n}: TableHeaderProps<T>) => {\n let { selectionBehavior, selectionMode, allowsDragging } = useTableOptions();\n\n const { classNames } = useStyles('Table');\n\n return (\n <ReactAriaTableHeader className={classNames.header}>\n {/* Add extra columns for drag and drop and selection. */}\n {allowsDragging && <Column />}\n {selectionBehavior === 'toggle' && (\n <Column>\n {selectionMode === 'multiple' && <Checkbox slot=\"selection\" />}\n </Column>\n )}\n <Collection items={columns}>{children}</Collection>\n </ReactAriaTableHeader>\n );\n};\n"],"names":["ReactAriaTableHeader"],"mappings":";;;;;AA0BO,MAAM,cAAc,CAAmB;AAAA,EAC5C,OAAA;AAAA,EACA;AACF,CAAA,KAA2B;AACzB,EAAA,IAAI,EAAE,iBAAA,EAAmB,aAAA,EAAe,cAAA,KAAmB,eAAA,EAAgB;AAE3E,EAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAU,OAAO,CAAA;AAExC,EAAA,uBACE,IAAA,CAACA,aAAA,EAAA,EAAqB,SAAA,EAAW,UAAA,CAAW,MAAA,EAEzC,QAAA,EAAA;AAAA,IAAA,cAAA,wBAAmB,MAAA,EAAA,EAAO,CAAA;AAAA,IAC1B,iBAAA,KAAsB,QAAA,oBACrB,GAAA,CAAC,MAAA,EAAA,EACE,QAAA,EAAA,aAAA,KAAkB,8BAAc,GAAA,CAAC,QAAA,EAAA,EAAS,IAAA,EAAK,WAAA,EAAY,CAAA,EAC9D,CAAA;AAAA,oBAEF,GAAA,CAAC,UAAA,EAAA,EAAW,KAAA,EAAO,OAAA,EAAU,QAAA,EAAS;AAAA,GAAA,EACxC,CAAA;AAEJ;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTable.esm.js","sources":["../../../../src/components/Table/hooks/useTable.ts"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useState, useMemo, useCallback } from 'react';\nimport type { TablePaginationProps } from '../../TablePagination/types';\nimport type {\n UseTableConfig,\n UseTableResult,\n UseTablePagination,\n} from './types';\n\n/**\n * Hook for managing table state including pagination and future features like sorting.\n * Supports both controlled and uncontrolled modes using offset/pageSize pattern (Backstage style).\n *\n * @public\n */\nexport function useTable<T = any>(\n config: UseTableConfig<T> = {},\n): UseTableResult<T> {\n const { data, pagination: paginationConfig = {} } = config;\n\n const {\n rowCount: providedRowCount,\n offset: controlledOffset,\n pageSize: controlledPageSize,\n onOffsetChange,\n onPageSizeChange,\n defaultPageSize = 10,\n defaultOffset = 0,\n onNextPage,\n onPreviousPage,\n showPageSizeOptions = true,\n } = paginationConfig;\n\n // Determine if we're in controlled mode\n const isControlled =\n controlledOffset !== undefined || controlledPageSize !== undefined;\n\n // Calculate row count from data or use provided value\n const rowCount = data?.length ?? providedRowCount ?? 0;\n\n // Internal state for uncontrolled mode\n const [internalOffset, setInternalOffset] = useState(defaultOffset);\n const [internalPageSize, setInternalPageSize] = useState(defaultPageSize);\n\n // Calculate current values\n const currentOffset = controlledOffset ?? internalOffset;\n const currentPageSize = controlledPageSize ?? internalPageSize;\n\n // Calculate sliced data if data array is provided\n const currentData = useMemo(() => {\n if (!data) return undefined;\n return data.slice(currentOffset, currentOffset + currentPageSize);\n }, [data, currentOffset, currentPageSize]);\n\n // Update functions\n const setOffset = useCallback(\n (newOffset: number) => {\n if (isControlled) {\n onOffsetChange?.(newOffset);\n } else {\n setInternalOffset(newOffset);\n }\n },\n [isControlled, onOffsetChange],\n );\n\n const setPageSize = useCallback(\n (newPageSize: number) => {\n // When changing page size, reset to first page to avoid showing empty results\n const newOffset = 0;\n\n if (isControlled) {\n onPageSizeChange?.(newPageSize);\n onOffsetChange?.(newOffset);\n } else {\n setInternalPageSize(newPageSize);\n setInternalOffset(newOffset);\n }\n },\n [isControlled, onPageSizeChange, onOffsetChange],\n );\n\n const nextPage = useCallback(() => {\n const nextOffset = currentOffset + currentPageSize;\n if (nextOffset < rowCount) {\n onNextPage?.();\n setOffset(nextOffset);\n }\n }, [currentOffset, currentPageSize, rowCount, onNextPage, setOffset]);\n\n const previousPage = useCallback(() => {\n if (currentOffset > 0) {\n onPreviousPage?.();\n const prevOffset = Math.max(0, currentOffset - currentPageSize);\n setOffset(prevOffset);\n }\n }, [currentOffset, currentPageSize, onPreviousPage, setOffset]);\n\n // Pagination props for TablePagination component\n const paginationProps: TablePaginationProps = useMemo(\n () => ({\n offset: currentOffset,\n pageSize: currentPageSize,\n rowCount,\n setOffset,\n setPageSize,\n onNextPage,\n onPreviousPage,\n showPageSizeOptions,\n }),\n [\n currentOffset,\n currentPageSize,\n rowCount,\n setOffset,\n setPageSize,\n onNextPage,\n onPreviousPage,\n showPageSizeOptions,\n ],\n );\n\n const pagination: UseTablePagination<T> = useMemo(\n () => ({\n paginationProps,\n offset: currentOffset,\n pageSize: currentPageSize,\n data: currentData,\n nextPage,\n previousPage,\n setOffset,\n setPageSize,\n }),\n [\n paginationProps,\n currentOffset,\n currentPageSize,\n currentData,\n nextPage,\n previousPage,\n setOffset,\n setPageSize,\n ],\n );\n\n return {\n data: currentData,\n paginationProps,\n pagination,\n };\n}\n"],"names":[],"mappings":";;
|
|
1
|
+
{"version":3,"file":"useTable.esm.js","sources":["../../../../src/components/Table/hooks/useTable.ts"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useState, useMemo, useCallback } from 'react';\nimport type { TablePaginationProps } from '../../TablePagination/types';\nimport type {\n UseTableConfig,\n UseTableResult,\n UseTablePagination,\n} from './types';\n\n/**\n * Hook for managing table state including pagination and future features like sorting.\n * Supports both controlled and uncontrolled modes using offset/pageSize pattern (Backstage style).\n *\n * @public\n */\nexport function useTable<T = any>(\n config: UseTableConfig<T> = {},\n): UseTableResult<T> {\n const { data, pagination: paginationConfig = {} } = config;\n\n const {\n rowCount: providedRowCount,\n offset: controlledOffset,\n pageSize: controlledPageSize,\n onOffsetChange,\n onPageSizeChange,\n defaultPageSize = 10,\n defaultOffset = 0,\n onNextPage,\n onPreviousPage,\n showPageSizeOptions = true,\n } = paginationConfig;\n\n // Determine if we're in controlled mode\n const isControlled =\n controlledOffset !== undefined || controlledPageSize !== undefined;\n\n // Calculate row count from data or use provided value\n const rowCount = data?.length ?? providedRowCount ?? 0;\n\n // Internal state for uncontrolled mode\n const [internalOffset, setInternalOffset] = useState(defaultOffset);\n const [internalPageSize, setInternalPageSize] = useState(defaultPageSize);\n\n // Calculate current values\n const currentOffset = controlledOffset ?? internalOffset;\n const currentPageSize = controlledPageSize ?? internalPageSize;\n\n // Calculate sliced data if data array is provided\n const currentData = useMemo(() => {\n if (!data) return undefined;\n return data.slice(currentOffset, currentOffset + currentPageSize);\n }, [data, currentOffset, currentPageSize]);\n\n // Update functions\n const setOffset = useCallback(\n (newOffset: number) => {\n if (isControlled) {\n onOffsetChange?.(newOffset);\n } else {\n setInternalOffset(newOffset);\n }\n },\n [isControlled, onOffsetChange],\n );\n\n const setPageSize = useCallback(\n (newPageSize: number) => {\n // When changing page size, reset to first page to avoid showing empty results\n const newOffset = 0;\n\n if (isControlled) {\n onPageSizeChange?.(newPageSize);\n onOffsetChange?.(newOffset);\n } else {\n setInternalPageSize(newPageSize);\n setInternalOffset(newOffset);\n }\n },\n [isControlled, onPageSizeChange, onOffsetChange],\n );\n\n const nextPage = useCallback(() => {\n const nextOffset = currentOffset + currentPageSize;\n if (nextOffset < rowCount) {\n onNextPage?.();\n setOffset(nextOffset);\n }\n }, [currentOffset, currentPageSize, rowCount, onNextPage, setOffset]);\n\n const previousPage = useCallback(() => {\n if (currentOffset > 0) {\n onPreviousPage?.();\n const prevOffset = Math.max(0, currentOffset - currentPageSize);\n setOffset(prevOffset);\n }\n }, [currentOffset, currentPageSize, onPreviousPage, setOffset]);\n\n // Pagination props for TablePagination component\n const paginationProps: TablePaginationProps = useMemo(\n () => ({\n offset: currentOffset,\n pageSize: currentPageSize,\n rowCount,\n setOffset,\n setPageSize,\n onNextPage,\n onPreviousPage,\n showPageSizeOptions,\n }),\n [\n currentOffset,\n currentPageSize,\n rowCount,\n setOffset,\n setPageSize,\n onNextPage,\n onPreviousPage,\n showPageSizeOptions,\n ],\n );\n\n const pagination: UseTablePagination<T> = useMemo(\n () => ({\n paginationProps,\n offset: currentOffset,\n pageSize: currentPageSize,\n data: currentData,\n nextPage,\n previousPage,\n setOffset,\n setPageSize,\n }),\n [\n paginationProps,\n currentOffset,\n currentPageSize,\n currentData,\n nextPage,\n previousPage,\n setOffset,\n setPageSize,\n ],\n );\n\n return {\n data: currentData,\n paginationProps,\n pagination,\n };\n}\n"],"names":[],"mappings":";;AA8BO,SAAS,QAAA,CACd,MAAA,GAA4B,EAAC,EACV;AACnB,EAAA,MAAM,EAAE,IAAA,EAAM,UAAA,EAAY,gBAAA,GAAmB,IAAG,GAAI,MAAA;AAEpD,EAAA,MAAM;AAAA,IACJ,QAAA,EAAU,gBAAA;AAAA,IACV,MAAA,EAAQ,gBAAA;AAAA,IACR,QAAA,EAAU,kBAAA;AAAA,IACV,cAAA;AAAA,IACA,gBAAA;AAAA,IACA,eAAA,GAAkB,EAAA;AAAA,IAClB,aAAA,GAAgB,CAAA;AAAA,IAChB,UAAA;AAAA,IACA,cAAA;AAAA,IACA,mBAAA,GAAsB;AAAA,GACxB,GAAI,gBAAA;AAGJ,EAAA,MAAM,YAAA,GACJ,gBAAA,KAAqB,MAAA,IAAa,kBAAA,KAAuB,MAAA;AAG3D,EAAA,MAAM,QAAA,GAAW,IAAA,EAAM,MAAA,IAAU,gBAAA,IAAoB,CAAA;AAGrD,EAAA,MAAM,CAAC,cAAA,EAAgB,iBAAiB,CAAA,GAAI,SAAS,aAAa,CAAA;AAClE,EAAA,MAAM,CAAC,gBAAA,EAAkB,mBAAmB,CAAA,GAAI,SAAS,eAAe,CAAA;AAGxE,EAAA,MAAM,gBAAgB,gBAAA,IAAoB,cAAA;AAC1C,EAAA,MAAM,kBAAkB,kBAAA,IAAsB,gBAAA;AAG9C,EAAA,MAAM,WAAA,GAAc,QAAQ,MAAM;AAChC,IAAA,IAAI,CAAC,MAAM,OAAO,MAAA;AAClB,IAAA,OAAO,IAAA,CAAK,KAAA,CAAM,aAAA,EAAe,aAAA,GAAgB,eAAe,CAAA;AAAA,EAClE,CAAA,EAAG,CAAC,IAAA,EAAM,aAAA,EAAe,eAAe,CAAC,CAAA;AAGzC,EAAA,MAAM,SAAA,GAAY,WAAA;AAAA,IAChB,CAAC,SAAA,KAAsB;AACrB,MAAA,IAAI,YAAA,EAAc;AAChB,QAAA,cAAA,GAAiB,SAAS,CAAA;AAAA,MAC5B,CAAA,MAAO;AACL,QAAA,iBAAA,CAAkB,SAAS,CAAA;AAAA,MAC7B;AAAA,IACF,CAAA;AAAA,IACA,CAAC,cAAc,cAAc;AAAA,GAC/B;AAEA,EAAA,MAAM,WAAA,GAAc,WAAA;AAAA,IAClB,CAAC,WAAA,KAAwB;AAEvB,MAAA,MAAM,SAAA,GAAY,CAAA;AAElB,MAAA,IAAI,YAAA,EAAc;AAChB,QAAA,gBAAA,GAAmB,WAAW,CAAA;AAC9B,QAAA,cAAA,GAAiB,SAAS,CAAA;AAAA,MAC5B,CAAA,MAAO;AACL,QAAA,mBAAA,CAAoB,WAAW,CAAA;AAC/B,QAAA,iBAAA,CAAkB,SAAS,CAAA;AAAA,MAC7B;AAAA,IACF,CAAA;AAAA,IACA,CAAC,YAAA,EAAc,gBAAA,EAAkB,cAAc;AAAA,GACjD;AAEA,EAAA,MAAM,QAAA,GAAW,YAAY,MAAM;AACjC,IAAA,MAAM,aAAa,aAAA,GAAgB,eAAA;AACnC,IAAA,IAAI,aAAa,QAAA,EAAU;AACzB,MAAA,UAAA,IAAa;AACb,MAAA,SAAA,CAAU,UAAU,CAAA;AAAA,IACtB;AAAA,EACF,GAAG,CAAC,aAAA,EAAe,iBAAiB,QAAA,EAAU,UAAA,EAAY,SAAS,CAAC,CAAA;AAEpE,EAAA,MAAM,YAAA,GAAe,YAAY,MAAM;AACrC,IAAA,IAAI,gBAAgB,CAAA,EAAG;AACrB,MAAA,cAAA,IAAiB;AACjB,MAAA,MAAM,UAAA,GAAa,IAAA,CAAK,GAAA,CAAI,CAAA,EAAG,gBAAgB,eAAe,CAAA;AAC9D,MAAA,SAAA,CAAU,UAAU,CAAA;AAAA,IACtB;AAAA,EACF,GAAG,CAAC,aAAA,EAAe,eAAA,EAAiB,cAAA,EAAgB,SAAS,CAAC,CAAA;AAG9D,EAAA,MAAM,eAAA,GAAwC,OAAA;AAAA,IAC5C,OAAO;AAAA,MACL,MAAA,EAAQ,aAAA;AAAA,MACR,QAAA,EAAU,eAAA;AAAA,MACV,QAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA;AAAA,MACA,UAAA;AAAA,MACA,cAAA;AAAA,MACA;AAAA,KACF,CAAA;AAAA,IACA;AAAA,MACE,aAAA;AAAA,MACA,eAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA;AAAA,MACA,UAAA;AAAA,MACA,cAAA;AAAA,MACA;AAAA;AACF,GACF;AAEA,EAAA,MAAM,UAAA,GAAoC,OAAA;AAAA,IACxC,OAAO;AAAA,MACL,eAAA;AAAA,MACA,MAAA,EAAQ,aAAA;AAAA,MACR,QAAA,EAAU,eAAA;AAAA,MACV,IAAA,EAAM,WAAA;AAAA,MACN,QAAA;AAAA,MACA,YAAA;AAAA,MACA,SAAA;AAAA,MACA;AAAA,KACF,CAAA;AAAA,IACA;AAAA,MACE,eAAA;AAAA,MACA,aAAA;AAAA,MACA,eAAA;AAAA,MACA,WAAA;AAAA,MACA,QAAA;AAAA,MACA,YAAA;AAAA,MACA,SAAA;AAAA,MACA;AAAA;AACF,GACF;AAEA,EAAA,OAAO;AAAA,IACL,IAAA,EAAM,WAAA;AAAA,IACN,eAAA;AAAA,IACA;AAAA,GACF;AACF;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TablePagination.esm.js","sources":["../../../src/components/TablePagination/TablePagination.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport clsx from 'clsx';\nimport { Text, ButtonIcon, Select, Icon } from '../..';\nimport type { TablePaginationProps } from './types';\n\n/**\n * Pagination controls for Table components with page navigation and size selection.\n *\n * @public\n */\nexport function TablePagination(props: TablePaginationProps) {\n const {\n className,\n offset,\n pageSize,\n rowCount,\n onNextPage,\n onPreviousPage,\n onPageSizeChange,\n setOffset,\n setPageSize,\n showPageSizeOptions = true,\n ...rest\n } = props;\n\n const currentOffset = offset ?? 0;\n const currentPageSize = pageSize ?? 10;\n\n const fromCount = currentOffset + 1;\n const toCount = Math.min(currentOffset + currentPageSize, rowCount ?? 0);\n\n const nextPage = () => {\n const totalRows = rowCount ?? 0;\n const nextOffset = currentOffset + currentPageSize;\n\n // Check if there are more items to navigate to\n if (nextOffset < totalRows) {\n onNextPage?.(); // Analytics tracking\n setOffset?.(nextOffset); // Navigate to next page\n }\n };\n\n const previousPage = () => {\n // Check if we can go to previous page\n if (currentOffset > 0) {\n onPreviousPage?.(); // Analytics tracking\n const prevOffset = Math.max(0, currentOffset - currentPageSize);\n setOffset?.(prevOffset); // Navigate to previous page\n }\n };\n\n return (\n <div className={clsx('bui-DataTablePagination', className)} {...rest}>\n <div className=\"bui-DataTablePagination--left\">\n {showPageSizeOptions && (\n <Select\n name=\"pageSize\"\n size=\"small\"\n placeholder=\"Show 10 results\"\n options={[\n { label: 'Show 5 results', value: '5' },\n { label: 'Show 10 results', value: '10' },\n { label: 'Show 20 results', value: '20' },\n { label: 'Show 30 results', value: '30' },\n { label: 'Show 40 results', value: '40' },\n { label: 'Show 50 results', value: '50' },\n ]}\n selectedKey={pageSize?.toString()}\n onSelectionChange={value => {\n const newPageSize = Number(value);\n setPageSize?.(newPageSize);\n onPageSizeChange?.(newPageSize);\n }}\n className=\"bui-DataTablePagination--select\"\n />\n )}\n </div>\n <div className=\"bui-DataTablePagination--right\">\n <Text\n as=\"p\"\n variant=\"body-medium\"\n >{`${fromCount} - ${toCount} of ${rowCount}`}</Text>\n <ButtonIcon\n variant=\"secondary\"\n size=\"small\"\n onClick={previousPage}\n isDisabled={currentOffset === 0}\n icon={<Icon name=\"chevron-left\" />}\n aria-label=\"Previous\"\n />\n <ButtonIcon\n variant=\"secondary\"\n size=\"small\"\n onClick={nextPage}\n isDisabled={\n rowCount !== undefined &&\n currentOffset + currentPageSize >= rowCount\n }\n icon={<Icon name=\"chevron-right\" />}\n aria-label=\"Next\"\n />\n </div>\n </div>\n );\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyBO,SAAS,gBAAgB,
|
|
1
|
+
{"version":3,"file":"TablePagination.esm.js","sources":["../../../src/components/TablePagination/TablePagination.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport clsx from 'clsx';\nimport { Text, ButtonIcon, Select, Icon } from '../..';\nimport type { TablePaginationProps } from './types';\n\n/**\n * Pagination controls for Table components with page navigation and size selection.\n *\n * @public\n */\nexport function TablePagination(props: TablePaginationProps) {\n const {\n className,\n offset,\n pageSize,\n rowCount,\n onNextPage,\n onPreviousPage,\n onPageSizeChange,\n setOffset,\n setPageSize,\n showPageSizeOptions = true,\n ...rest\n } = props;\n\n const currentOffset = offset ?? 0;\n const currentPageSize = pageSize ?? 10;\n\n const fromCount = currentOffset + 1;\n const toCount = Math.min(currentOffset + currentPageSize, rowCount ?? 0);\n\n const nextPage = () => {\n const totalRows = rowCount ?? 0;\n const nextOffset = currentOffset + currentPageSize;\n\n // Check if there are more items to navigate to\n if (nextOffset < totalRows) {\n onNextPage?.(); // Analytics tracking\n setOffset?.(nextOffset); // Navigate to next page\n }\n };\n\n const previousPage = () => {\n // Check if we can go to previous page\n if (currentOffset > 0) {\n onPreviousPage?.(); // Analytics tracking\n const prevOffset = Math.max(0, currentOffset - currentPageSize);\n setOffset?.(prevOffset); // Navigate to previous page\n }\n };\n\n return (\n <div className={clsx('bui-DataTablePagination', className)} {...rest}>\n <div className=\"bui-DataTablePagination--left\">\n {showPageSizeOptions && (\n <Select\n name=\"pageSize\"\n size=\"small\"\n placeholder=\"Show 10 results\"\n options={[\n { label: 'Show 5 results', value: '5' },\n { label: 'Show 10 results', value: '10' },\n { label: 'Show 20 results', value: '20' },\n { label: 'Show 30 results', value: '30' },\n { label: 'Show 40 results', value: '40' },\n { label: 'Show 50 results', value: '50' },\n ]}\n selectedKey={pageSize?.toString()}\n onSelectionChange={value => {\n const newPageSize = Number(value);\n setPageSize?.(newPageSize);\n onPageSizeChange?.(newPageSize);\n }}\n className=\"bui-DataTablePagination--select\"\n />\n )}\n </div>\n <div className=\"bui-DataTablePagination--right\">\n <Text\n as=\"p\"\n variant=\"body-medium\"\n >{`${fromCount} - ${toCount} of ${rowCount}`}</Text>\n <ButtonIcon\n variant=\"secondary\"\n size=\"small\"\n onClick={previousPage}\n isDisabled={currentOffset === 0}\n icon={<Icon name=\"chevron-left\" />}\n aria-label=\"Previous\"\n />\n <ButtonIcon\n variant=\"secondary\"\n size=\"small\"\n onClick={nextPage}\n isDisabled={\n rowCount !== undefined &&\n currentOffset + currentPageSize >= rowCount\n }\n icon={<Icon name=\"chevron-right\" />}\n aria-label=\"Next\"\n />\n </div>\n </div>\n );\n}\n"],"names":[],"mappings":"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"}
|