@economic/taco 1.1.13-alpha.0 → 1.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Group/Group.d.ts +11 -1
- package/dist/components/Icon/components/ChevronLeftSolid.d.ts +3 -0
- package/dist/components/Icon/components/ChevronRightSolid.d.ts +3 -0
- package/dist/components/Icon/components/index.d.ts +1 -1
- package/dist/components/Input/Input.d.ts +1 -1
- package/dist/components/Menu/Menu.d.ts +2 -2
- package/dist/components/Menu/components/Item.d.ts +1 -1
- package/dist/components/Menu/components/Link.d.ts +1 -1
- package/dist/components/Toast/Toast.d.ts +2 -2
- package/dist/components/Toast/Toaster.d.ts +2 -2
- package/dist/esm/components/Accordion/Accordion.js +31 -34
- package/dist/esm/components/Accordion/Accordion.js.map +1 -1
- package/dist/esm/components/Backdrop/Backdrop.js +2 -2
- package/dist/esm/components/Backdrop/Backdrop.js.map +1 -1
- package/dist/esm/components/Badge/Badge.js +14 -14
- package/dist/esm/components/Badge/Badge.js.map +1 -1
- package/dist/esm/components/Banner/Banner.js +7 -5
- package/dist/esm/components/Banner/Banner.js.map +1 -1
- package/dist/esm/components/Banner/util.js +1 -1
- package/dist/esm/components/Banner/util.js.map +1 -1
- package/dist/esm/components/Button/Button.js +12 -13
- package/dist/esm/components/Button/Button.js.map +1 -1
- package/dist/esm/components/Button/util.js +18 -23
- package/dist/esm/components/Button/util.js.map +1 -1
- package/dist/esm/components/Calendar/Calendar.js +56 -71
- package/dist/esm/components/Calendar/Calendar.js.map +1 -1
- package/dist/esm/components/Card/Card.js +13 -12
- package/dist/esm/components/Card/Card.js.map +1 -1
- package/dist/esm/components/Checkbox/Checkbox.js +15 -18
- package/dist/esm/components/Checkbox/Checkbox.js.map +1 -1
- package/dist/esm/components/Combobox/Combobox.js +23 -25
- package/dist/esm/components/Combobox/Combobox.js.map +1 -1
- package/dist/esm/components/Combobox/useCombobox.js +78 -99
- package/dist/esm/components/Combobox/useCombobox.js.map +1 -1
- package/dist/esm/components/Datepicker/Datepicker.js +48 -52
- package/dist/esm/components/Datepicker/Datepicker.js.map +1 -1
- package/dist/esm/components/Datepicker/useDatepicker.js +27 -34
- package/dist/esm/components/Datepicker/useDatepicker.js.map +1 -1
- package/dist/esm/components/Dialog/Context.js +4 -4
- package/dist/esm/components/Dialog/Context.js.map +1 -1
- package/dist/esm/components/Dialog/Dialog.js +39 -58
- package/dist/esm/components/Dialog/Dialog.js.map +1 -1
- package/dist/esm/components/Dialog/components/Content.js +39 -44
- package/dist/esm/components/Dialog/components/Content.js.map +1 -1
- package/dist/esm/components/Dialog/components/Drawer.js +3 -3
- package/dist/esm/components/Dialog/components/Drawer.js.map +1 -1
- package/dist/esm/components/Dialog/components/Extra.js +2 -2
- package/dist/esm/components/Dialog/components/Extra.js.map +1 -1
- package/dist/esm/components/Dialog/components/Trigger.js +2 -2
- package/dist/esm/components/Dialog/components/Trigger.js.map +1 -1
- package/dist/esm/components/Field/Field.js +10 -12
- package/dist/esm/components/Field/Field.js.map +1 -1
- package/dist/esm/components/Form/Form.js +6 -8
- package/dist/esm/components/Form/Form.js.map +1 -1
- package/dist/esm/components/Group/Group.js +9 -8
- package/dist/esm/components/Group/Group.js.map +1 -1
- package/dist/esm/components/Hanger/Hanger.js +27 -35
- package/dist/esm/components/Hanger/Hanger.js.map +1 -1
- package/dist/esm/components/HoverCard/HoverCard.js +8 -9
- package/dist/esm/components/HoverCard/HoverCard.js.map +1 -1
- package/dist/esm/components/Icon/Icon.js +7 -8
- package/dist/esm/components/Icon/Icon.js.map +1 -1
- package/dist/esm/components/Icon/components/ChevronLeftSolid.js +20 -0
- package/dist/esm/components/Icon/components/ChevronLeftSolid.js.map +1 -0
- package/dist/esm/components/Icon/components/ChevronRightSolid.js +20 -0
- package/dist/esm/components/Icon/components/ChevronRightSolid.js.map +1 -0
- package/dist/esm/components/Icon/components/index.js +8 -4
- package/dist/esm/components/Icon/components/index.js.map +1 -1
- package/dist/esm/components/IconButton/IconButton.js +9 -11
- package/dist/esm/components/IconButton/IconButton.js.map +1 -1
- package/dist/esm/components/Input/Input.js +25 -25
- package/dist/esm/components/Input/Input.js.map +1 -1
- package/dist/esm/components/Input/util.js +2 -2
- package/dist/esm/components/Input/util.js.map +1 -1
- package/dist/esm/components/Listbox/Listbox.js +24 -25
- package/dist/esm/components/Listbox/Listbox.js.map +1 -1
- package/dist/esm/components/Listbox/ScrollableList.js +65 -84
- package/dist/esm/components/Listbox/ScrollableList.js.map +1 -1
- package/dist/esm/components/Listbox/useListbox.js +53 -61
- package/dist/esm/components/Listbox/useListbox.js.map +1 -1
- package/dist/esm/components/Listbox/useMultiListbox.js +69 -96
- package/dist/esm/components/Listbox/useMultiListbox.js.map +1 -1
- package/dist/esm/components/Listbox/useTypeahead.js +10 -9
- package/dist/esm/components/Listbox/useTypeahead.js.map +1 -1
- package/dist/esm/components/Listbox/util.js +48 -85
- package/dist/esm/components/Listbox/util.js.map +1 -1
- package/dist/esm/components/Menu/Context.js +2 -2
- package/dist/esm/components/Menu/Context.js.map +1 -1
- package/dist/esm/components/Menu/Menu.js +16 -34
- package/dist/esm/components/Menu/Menu.js.map +1 -1
- package/dist/esm/components/Menu/components/Checkbox.js +9 -10
- package/dist/esm/components/Menu/components/Checkbox.js.map +1 -1
- package/dist/esm/components/Menu/components/Content.js +9 -11
- package/dist/esm/components/Menu/components/Content.js.map +1 -1
- package/dist/esm/components/Menu/components/Header.js +3 -3
- package/dist/esm/components/Menu/components/Header.js.map +1 -1
- package/dist/esm/components/Menu/components/Item.js +30 -31
- package/dist/esm/components/Menu/components/Item.js.map +1 -1
- package/dist/esm/components/Menu/components/Link.js +10 -11
- package/dist/esm/components/Menu/components/Link.js.map +1 -1
- package/dist/esm/components/Menu/components/RadioGroup.js +17 -19
- package/dist/esm/components/Menu/components/RadioGroup.js.map +1 -1
- package/dist/esm/components/Menu/components/Separator.js +1 -1
- package/dist/esm/components/Menu/components/Separator.js.map +1 -1
- package/dist/esm/components/Menu/components/Trigger.js +4 -4
- package/dist/esm/components/Menu/components/Trigger.js.map +1 -1
- package/dist/esm/components/Navigation/Navigation.js +35 -44
- package/dist/esm/components/Navigation/Navigation.js.map +1 -1
- package/dist/esm/components/Pagination/PageNumbers.js +23 -28
- package/dist/esm/components/Pagination/PageNumbers.js.map +1 -1
- package/dist/esm/components/Pagination/Pagination.js +39 -56
- package/dist/esm/components/Pagination/Pagination.js.map +1 -1
- package/dist/esm/components/Pagination/usePagination.js +7 -21
- package/dist/esm/components/Pagination/usePagination.js.map +1 -1
- package/dist/esm/components/Pagination/usePaginationShortcuts.js +13 -14
- package/dist/esm/components/Pagination/usePaginationShortcuts.js.map +1 -1
- package/dist/esm/components/Popover/Popover.js +29 -34
- package/dist/esm/components/Popover/Popover.js.map +1 -1
- package/dist/esm/components/Popover/Primitives.js +7 -8
- package/dist/esm/components/Popover/Primitives.js.map +1 -1
- package/dist/esm/components/Progress/Progress.js +11 -15
- package/dist/esm/components/Progress/Progress.js.map +1 -1
- package/dist/esm/components/Provider/Provider.js +13 -18
- package/dist/esm/components/Provider/Provider.js.map +1 -1
- package/dist/esm/components/RadioGroup/RadioGroup.js +45 -57
- package/dist/esm/components/RadioGroup/RadioGroup.js.map +1 -1
- package/dist/esm/components/SearchInput/SearchInput.js +10 -12
- package/dist/esm/components/SearchInput/SearchInput.js.map +1 -1
- package/dist/esm/components/Select/Select.js +30 -31
- package/dist/esm/components/Select/Select.js.map +1 -1
- package/dist/esm/components/Select/useSelect.js +69 -88
- package/dist/esm/components/Select/useSelect.js.map +1 -1
- package/dist/esm/components/Spinner/Spinner.js +12 -19
- package/dist/esm/components/Spinner/Spinner.js.map +1 -1
- package/dist/esm/components/Switch/Switch.js +9 -10
- package/dist/esm/components/Switch/Switch.js.map +1 -1
- package/dist/esm/components/Table/components/BaseTable.js +23 -30
- package/dist/esm/components/Table/components/BaseTable.js.map +1 -1
- package/dist/esm/components/Table/components/PaginatedTable.js +3 -7
- package/dist/esm/components/Table/components/PaginatedTable.js.map +1 -1
- package/dist/esm/components/Table/components/Table.js +18 -25
- package/dist/esm/components/Table/components/Table.js.map +1 -1
- package/dist/esm/components/Table/components/WindowedTable.js +89 -109
- package/dist/esm/components/Table/components/WindowedTable.js.map +1 -1
- package/dist/esm/components/Table/hooks/plugins/useRowActions.js +123 -148
- package/dist/esm/components/Table/hooks/plugins/useRowActions.js.map +1 -1
- package/dist/esm/components/Table/hooks/plugins/useRowDraggable.js +57 -61
- package/dist/esm/components/Table/hooks/plugins/useRowDraggable.js.map +1 -1
- package/dist/esm/components/Table/hooks/plugins/useRowEditing.js +39 -36
- package/dist/esm/components/Table/hooks/plugins/useRowEditing.js.map +1 -1
- package/dist/esm/components/Table/hooks/plugins/useRowSelect.js +79 -89
- package/dist/esm/components/Table/hooks/plugins/useRowSelect.js.map +1 -1
- package/dist/esm/components/Table/hooks/useRowCreation.js +29 -64
- package/dist/esm/components/Table/hooks/useRowCreation.js.map +1 -1
- package/dist/esm/components/Table/hooks/useTable.js +123 -141
- package/dist/esm/components/Table/hooks/useTable.js.map +1 -1
- package/dist/esm/components/Table/hooks/useTableKeyboardNavigation.js +23 -27
- package/dist/esm/components/Table/hooks/useTableKeyboardNavigation.js.map +1 -1
- package/dist/esm/components/Table/util/renderColumn.js +10 -10
- package/dist/esm/components/Table/util/renderColumn.js.map +1 -1
- package/dist/esm/components/Table/util/renderRow.js +37 -46
- package/dist/esm/components/Table/util/renderRow.js.map +1 -1
- package/dist/esm/components/Table/util/rowIndexPath.js +14 -16
- package/dist/esm/components/Table/util/rowIndexPath.js.map +1 -1
- package/dist/esm/components/Table/util/sortTypes.js +23 -31
- package/dist/esm/components/Table/util/sortTypes.js.map +1 -1
- package/dist/esm/components/Table/util.js +29 -41
- package/dist/esm/components/Table/util.js.map +1 -1
- package/dist/esm/components/Tabs/Tabs.js +25 -27
- package/dist/esm/components/Tabs/Tabs.js.map +1 -1
- package/dist/esm/components/Textarea/Textarea.js +11 -9
- package/dist/esm/components/Textarea/Textarea.js.map +1 -1
- package/dist/esm/components/Toast/Toast.js +27 -23
- package/dist/esm/components/Toast/Toast.js.map +1 -1
- package/dist/esm/components/Toast/Toaster.js +88 -118
- package/dist/esm/components/Toast/Toaster.js.map +1 -1
- package/dist/esm/components/Toast/util.js +2 -2
- package/dist/esm/components/Toast/util.js.map +1 -1
- package/dist/esm/components/Tooltip/Tooltip.js +7 -8
- package/dist/esm/components/Tooltip/Tooltip.js.map +1 -1
- package/dist/esm/components/Tour/Tour.js +46 -53
- package/dist/esm/components/Tour/Tour.js.map +1 -1
- package/dist/esm/components/Treeview/Treeview.js +26 -36
- package/dist/esm/components/Treeview/Treeview.js.map +1 -1
- package/dist/esm/components/VisuallyHidden/VisuallyHidden.js +1 -1
- package/dist/esm/components/VisuallyHidden/VisuallyHidden.js.map +1 -1
- package/dist/esm/index.css +1 -9
- package/dist/esm/index.js +1 -1
- package/dist/esm/primitives/Button.js +9 -13
- package/dist/esm/primitives/Button.js.map +1 -1
- package/dist/esm/utils/date.js +20 -40
- package/dist/esm/utils/date.js.map +1 -1
- package/dist/esm/utils/hooks/useBoundingClientRectListener.js +12 -20
- package/dist/esm/utils/hooks/useBoundingClientRectListener.js.map +1 -1
- package/dist/esm/utils/hooks/useDraggable.js +16 -17
- package/dist/esm/utils/hooks/useDraggable.js.map +1 -1
- package/dist/esm/utils/hooks/useDropTarget.js +7 -10
- package/dist/esm/utils/hooks/useDropTarget.js.map +1 -1
- package/dist/esm/utils/hooks/useListKeyboardNavigation.js +15 -30
- package/dist/esm/utils/hooks/useListKeyboardNavigation.js.map +1 -1
- package/dist/esm/utils/hooks/useListScrollTo.js +9 -9
- package/dist/esm/utils/hooks/useListScrollTo.js.map +1 -1
- package/dist/esm/utils/hooks/useOnClickOutside.js +6 -8
- package/dist/esm/utils/hooks/useOnClickOutside.js.map +1 -1
- package/dist/esm/utils/hooks/useProxiedRef.js +3 -3
- package/dist/esm/utils/hooks/useProxiedRef.js.map +1 -1
- package/dist/esm/utils/hooks/useTimer.js +9 -17
- package/dist/esm/utils/hooks/useTimer.js.map +1 -1
- package/dist/esm/utils/input.js +8 -12
- package/dist/esm/utils/input.js.map +1 -1
- package/dist/esm/utils/mergeRefs.js +2 -2
- package/dist/esm/utils/mergeRefs.js.map +1 -1
- package/dist/esm/utils/taillwind.js +2 -2
- package/dist/esm/utils/taillwind.js.map +1 -1
- package/dist/index.css +1 -9
- package/dist/taco.cjs.development.js +2368 -2883
- package/dist/taco.cjs.development.js.map +1 -1
- package/dist/taco.cjs.production.min.js +1 -1
- package/dist/taco.cjs.production.min.js.map +1 -1
- package/dist/utils/hooks/useListKeyboardNavigation.d.ts +1 -1
- package/package.json +4 -5
- package/types.json +13 -4
- package/dist/esm/_virtual/_rollupPluginBabelHelpers.js +0 -34
- package/dist/esm/_virtual/_rollupPluginBabelHelpers.js.map +0 -1
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"util.js","sources":["../../../../src/components/Table/util.ts"],"sourcesContent":["import React from 'react';\nimport { TableRow, TableCell, TableChildren, InternalTableRow, InternalTableColumn, SortRule } from './types';\nimport { SortingRule } from 'react-table';\n\nexport const sanitizeRowProps = (row: InternalTableRow, rowExpansionRenderer: any): TableRow<any> => {\n const props: TableRow<any> = {\n index: row.index,\n indexPath: row.id,\n values: row.original,\n };\n\n if (row.subRows?.length > 0) {\n props.isExpanded = !!row.isExpanded;\n props.depth = row.depth;\n props.toggleRowExpanded = () => row.toggleRowExpanded(!props.isExpanded);\n } else if (rowExpansionRenderer) {\n props.isExpanded = !!row.isExpanded;\n props.toggleRowExpanded = () => row.toggleRowExpanded(!props.isExpanded);\n }\n\n if (row.toggleRowEditing) {\n props.isEditing = !!row.isEditing;\n props.toggleRowEditing = row.toggleRowEditing;\n }\n\n return props;\n};\n\nexport const getColumnsFromChildren = (children: TableChildren<any>, rowExpansionRenderer: any) => {\n const sortRules: SortingRule<any>[] = [];\n\n const columns = React.Children.toArray(children)\n .filter((child: any) => !!child && !child.props.hidden) // skip falsey or hidden columns\n .map(({ props: { children: groupChildren, ...props } }: any) => {\n const column: InternalTableColumn & { disableSortBy: boolean | undefined } = { ...props };\n\n column.sortType = column.sortType || 'auto';\n column.disableSortBy = column.disableSorting;\n\n // this is a Table.Group - TODO: Find a better way to determine the child type\n if (props.title && groupChildren) {\n column.Header = props.title;\n\n const { columns: groupColumns, sortRules: groupSortRules } = getColumnsFromChildren(\n groupChildren,\n rowExpansionRenderer\n );\n column.columns = groupColumns;\n groupSortRules.forEach(sort => sortRules.push(sort));\n } else {\n column.accessor = props.accessor;\n column.Header = props.headRenderer || '';\n column.Cell = (columnProps: any) => {\n const cell: TableCell<any> = {\n accessor: columnProps.cell.column.id,\n row: sanitizeRowProps(columnProps.cell.row, rowExpansionRenderer),\n value: columnProps.cell.value,\n };\n\n if (cell.row.isEditing && typeof props.editRenderer === 'function') {\n return props.editRenderer(cell);\n }\n\n return typeof props.cellRenderer === 'function' ? props.cellRenderer(cell) ?? null : cell.value ?? null;\n };\n\n // custom props\n column.align = props.align;\n column.flex = props.flex;\n\n if (props.sort && !props.disableSorting) {\n sortRules.push({\n id: props.accessor,\n desc: props.sort === 'desc',\n });\n }\n }\n\n return column;\n });\n\n return { columns, sortRules };\n};\n\nexport const getInternalSortRules = <T>(sortRules: SortRule<T>[] | undefined): SortingRule<T>[] | undefined => {\n return sortRules?.map<SortingRule<T>>(rule => ({ id: rule.accessor, desc: rule.desc }));\n};\n"],"names":["sanitizeRowProps","row","rowExpansionRenderer","props","index","indexPath","id","values","original","subRows","length","isExpanded","depth","toggleRowExpanded","toggleRowEditing","isEditing","getColumnsFromChildren","children","sortRules","columns","React","Children","toArray","filter","child","hidden","map","groupChildren","column","sortType","disableSortBy","disableSorting","title","Header","groupColumns","groupSortRules","forEach","sort","push","accessor","headRenderer","Cell","columnProps","cell","value","editRenderer","cellRenderer","align","flex","desc","getInternalSortRules","rule"],"mappings":"
|
1
|
+
{"version":3,"file":"util.js","sources":["../../../../src/components/Table/util.ts"],"sourcesContent":["import React from 'react';\nimport { TableRow, TableCell, TableChildren, InternalTableRow, InternalTableColumn, SortRule } from './types';\nimport { SortingRule } from 'react-table';\n\nexport const sanitizeRowProps = (row: InternalTableRow, rowExpansionRenderer: any): TableRow<any> => {\n const props: TableRow<any> = {\n index: row.index,\n indexPath: row.id,\n values: row.original,\n };\n\n if (row.subRows?.length > 0) {\n props.isExpanded = !!row.isExpanded;\n props.depth = row.depth;\n props.toggleRowExpanded = () => row.toggleRowExpanded(!props.isExpanded);\n } else if (rowExpansionRenderer) {\n props.isExpanded = !!row.isExpanded;\n props.toggleRowExpanded = () => row.toggleRowExpanded(!props.isExpanded);\n }\n\n if (row.toggleRowEditing) {\n props.isEditing = !!row.isEditing;\n props.toggleRowEditing = row.toggleRowEditing;\n }\n\n return props;\n};\n\nexport const getColumnsFromChildren = (children: TableChildren<any>, rowExpansionRenderer: any) => {\n const sortRules: SortingRule<any>[] = [];\n\n const columns = React.Children.toArray(children)\n .filter((child: any) => !!child && !child.props.hidden) // skip falsey or hidden columns\n .map(({ props: { children: groupChildren, ...props } }: any) => {\n const column: InternalTableColumn & { disableSortBy: boolean | undefined } = { ...props };\n\n column.sortType = column.sortType || 'auto';\n column.disableSortBy = column.disableSorting;\n\n // this is a Table.Group - TODO: Find a better way to determine the child type\n if (props.title && groupChildren) {\n column.Header = props.title;\n\n const { columns: groupColumns, sortRules: groupSortRules } = getColumnsFromChildren(\n groupChildren,\n rowExpansionRenderer\n );\n column.columns = groupColumns;\n groupSortRules.forEach(sort => sortRules.push(sort));\n } else {\n column.accessor = props.accessor;\n column.Header = props.headRenderer || '';\n column.Cell = (columnProps: any) => {\n const cell: TableCell<any> = {\n accessor: columnProps.cell.column.id,\n row: sanitizeRowProps(columnProps.cell.row, rowExpansionRenderer),\n value: columnProps.cell.value,\n };\n\n if (cell.row.isEditing && typeof props.editRenderer === 'function') {\n return props.editRenderer(cell);\n }\n\n return typeof props.cellRenderer === 'function' ? props.cellRenderer(cell) ?? null : cell.value ?? null;\n };\n\n // custom props\n column.align = props.align;\n column.flex = props.flex;\n\n if (props.sort && !props.disableSorting) {\n sortRules.push({\n id: props.accessor,\n desc: props.sort === 'desc',\n });\n }\n }\n\n return column;\n });\n\n return { columns, sortRules };\n};\n\nexport const getInternalSortRules = <T>(sortRules: SortRule<T>[] | undefined): SortingRule<T>[] | undefined => {\n return sortRules?.map<SortingRule<T>>(rule => ({ id: rule.accessor, desc: rule.desc }));\n};\n"],"names":["sanitizeRowProps","row","rowExpansionRenderer","props","index","indexPath","id","values","original","subRows","length","isExpanded","depth","toggleRowExpanded","toggleRowEditing","isEditing","getColumnsFromChildren","children","sortRules","columns","React","Children","toArray","filter","child","hidden","map","groupChildren","column","sortType","disableSortBy","disableSorting","title","Header","groupColumns","groupSortRules","forEach","sort","push","accessor","headRenderer","Cell","columnProps","cell","value","editRenderer","cellRenderer","align","flex","desc","getInternalSortRules","rule"],"mappings":"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"}
|
@@ -1,21 +1,17 @@
|
|
1
|
-
import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
|
2
1
|
import { forwardRef, createElement } from 'react';
|
3
2
|
import cn from 'classnames';
|
4
3
|
import { Root, List, Trigger, Content } from '@radix-ui/react-tabs';
|
5
4
|
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
otherProps = _objectWithoutPropertiesLoose(props, _excluded);
|
17
|
-
|
18
|
-
var className = cn('yt-tabs', "yt-tabs--" + orientation, {
|
5
|
+
const Tabs = /*#__PURE__*/forwardRef(function Tabs(props, ref) {
|
6
|
+
const {
|
7
|
+
id,
|
8
|
+
defaultId,
|
9
|
+
children,
|
10
|
+
onChange,
|
11
|
+
orientation = 'horizontal',
|
12
|
+
...otherProps
|
13
|
+
} = props;
|
14
|
+
const className = cn('yt-tabs', `yt-tabs--${orientation}`, {
|
19
15
|
'flex w-full': orientation === 'vertical'
|
20
16
|
}, props.className);
|
21
17
|
return createElement(Root, Object.assign({}, otherProps, {
|
@@ -29,19 +25,20 @@ var Tabs = /*#__PURE__*/forwardRef(function Tabs(props, ref) {
|
|
29
25
|
value: id
|
30
26
|
}), children);
|
31
27
|
});
|
32
|
-
|
33
|
-
|
28
|
+
const TabList = /*#__PURE__*/forwardRef(function Tab(props, ref) {
|
29
|
+
const className = cn('yt-tab__list border-b border-grey-light flex flex-row m-0 mb-4', props.className);
|
34
30
|
return createElement(List, Object.assign({}, props, {
|
35
31
|
className: className,
|
36
32
|
ref: ref
|
37
33
|
}));
|
38
34
|
});
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
35
|
+
const TabTrigger = /*#__PURE__*/forwardRef(function Tab(props, ref) {
|
36
|
+
const {
|
37
|
+
id,
|
38
|
+
disabled,
|
39
|
+
...otherProps
|
40
|
+
} = props;
|
41
|
+
const className = cn('yt-tab bg-transparent border-b-2 border-transparent text-grey-darkest m-0 py-2 px-4', disabled ? 'cursor-not-allowed !text-grey-darker' : 'cursor-pointer rounded-t hover:border-grey-dark aria-selected:border-blue aria-selected:text-black aria-selected:hover:border-blue-light hover:text-black active:yt-focus active:border-blue focus:yt-focus focus:border-blue', props.className);
|
45
42
|
return createElement(Trigger, Object.assign({}, otherProps, {
|
46
43
|
className: className,
|
47
44
|
disabled: disabled,
|
@@ -52,11 +49,12 @@ var TabTrigger = /*#__PURE__*/forwardRef(function Tab(props, ref) {
|
|
52
49
|
value: id
|
53
50
|
}));
|
54
51
|
});
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
52
|
+
const TabContent = /*#__PURE__*/forwardRef(function Tab(props, ref) {
|
53
|
+
const {
|
54
|
+
id,
|
55
|
+
...otherProps
|
56
|
+
} = props;
|
57
|
+
const className = cn('yt-tab__panel outline-none', props.className);
|
60
58
|
return createElement(Content, Object.assign({}, otherProps, {
|
61
59
|
className: className,
|
62
60
|
ref: ref,
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Tabs.js","sources":["../../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as TabsPrimitive from '@radix-ui/react-tabs';\n\nimport { Orientation } from '../../types';\nimport './Tabs.css';\n\nexport type TabsProps = React.HTMLAttributes<HTMLDivElement> & {\n /**\n * The controlled value of the tab to activate. Should be used in conjunction with `onChange`.\n */\n id?: string;\n /**\n * Set which tab is selected on mount.\n * This has to be one of the existing ids provided for tabs\n */\n defaultId?: string;\n /**\n * Content should be one or an array of `Tabs.Trigger` components inside `Tabs.List` and then\n * followed by one or an array of `Tabs.Content`.\n * *Note* that there can also be tabs that are rendered conditionally.\n */\n children: React.ReactNode;\n /**\n * Define orientation of tabs.\n * @defaultValue horizontal\n */\n orientation?: Orientation;\n /**\n * Callback that is called when tab is changed.\n */\n onChange?: (id: string) => void;\n};\n\nexport type TabListProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport type TabTriggerProps = React.HTMLAttributes<HTMLButtonElement> & {\n /**\n * A unique value that associates the trigger with a content.\n */\n id: string;\n /**\n * When true, prevents the user from interacting with the tab.\n */\n disabled?: boolean;\n};\n\nexport type TabContentProps = React.HTMLAttributes<HTMLDivElement> & {\n /**\n * A unique value that associates the content with a trigger.\n */\n id: string;\n};\n\nexport type ForwardedTabsWithStatics = React.ForwardRefExoticComponent<TabsProps & React.RefAttributes<HTMLDivElement>> & {\n /** Tab list component containing all tab triggers, rendered in a `Tabs` group component */\n List: React.ForwardRefExoticComponent<TabListProps & React.RefAttributes<HTMLDivElement>>;\n /** Tab trigger component rendered in a `Tabs.List` component */\n Trigger: React.ForwardRefExoticComponent<TabTriggerProps & React.RefAttributes<HTMLButtonElement>>;\n /** Tab content component rendered in a `Tabs` group component */\n Content: React.ForwardRefExoticComponent<TabContentProps & React.RefAttributes<HTMLDivElement>>;\n};\n\nexport const Tabs = React.forwardRef(function Tabs(props: TabsProps, ref: React.Ref<HTMLDivElement>) {\n const { id, defaultId, children, onChange, orientation = 'horizontal', ...otherProps } = props;\n const className = cn(\n 'yt-tabs',\n `yt-tabs--${orientation}`,\n {\n 'flex w-full': orientation === 'vertical',\n },\n props.className\n );\n\n return (\n <TabsPrimitive.Root\n {...otherProps}\n className={className}\n data-taco=\"tabs\"\n defaultValue={defaultId}\n dir=\"ltr\"\n onValueChange={onChange}\n orientation={orientation}\n ref={ref}\n value={id}\n >\n {children}\n </TabsPrimitive.Root>\n );\n}) as ForwardedTabsWithStatics;\n\nconst TabList = React.forwardRef(function Tab(props: TabListProps, ref: React.Ref<HTMLDivElement>) {\n const className = cn('yt-tab__list border-b border-grey-light flex flex-row m-0 mb-4', props.className);\n\n return <TabsPrimitive.List {...props} className={className} ref={ref} />;\n});\n\nconst TabTrigger = React.forwardRef(function Tab(props: TabTriggerProps, ref: React.Ref<HTMLButtonElement>) {\n const { id, disabled, ...otherProps } = props;\n const className = cn(\n 'yt-tab bg-transparent border-b-2 border-transparent text-grey-darkest m-0 py-2 px-4',\n disabled\n ? 'cursor-not-allowed !text-grey-darker'\n : 'cursor-pointer rounded-t hover:border-grey-dark aria-selected:border-blue aria-selected:text-black aria-selected:hover:border-blue-light hover:text-black active:yt-focus active:border-blue focus:yt-focus focus:border-blue',\n props.className\n );\n\n return (\n <TabsPrimitive.Trigger\n {...otherProps}\n className={className}\n disabled={disabled}\n ref={ref}\n style={{\n transition: 'border 0.2s ease-in',\n }}\n value={id}\n />\n );\n});\n\nconst TabContent = React.forwardRef(function Tab(props: TabContentProps, ref: React.Ref<HTMLDivElement>) {\n const { id, ...otherProps } = props;\n const className = cn('yt-tab__panel outline-none', props.className);\n\n return <TabsPrimitive.Content {...otherProps} className={className} ref={ref} value={id} />;\n});\n\nTabs.List = TabList;\nTabs.Trigger = TabTrigger;\nTabs.Content = TabContent;\n"],"names":["Tabs","React","props","ref","id","defaultId","children","onChange","orientation","otherProps","className","cn","TabsPrimitive","defaultValue","dir","onValueChange","value","TabList","Tab","TabTrigger","disabled","style","transition","TabContent","List","Trigger","Content"],"mappings":"
|
1
|
+
{"version":3,"file":"Tabs.js","sources":["../../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as TabsPrimitive from '@radix-ui/react-tabs';\n\nimport { Orientation } from '../../types';\nimport './Tabs.css';\n\nexport type TabsProps = React.HTMLAttributes<HTMLDivElement> & {\n /**\n * The controlled value of the tab to activate. Should be used in conjunction with `onChange`.\n */\n id?: string;\n /**\n * Set which tab is selected on mount.\n * This has to be one of the existing ids provided for tabs\n */\n defaultId?: string;\n /**\n * Content should be one or an array of `Tabs.Trigger` components inside `Tabs.List` and then\n * followed by one or an array of `Tabs.Content`.\n * *Note* that there can also be tabs that are rendered conditionally.\n */\n children: React.ReactNode;\n /**\n * Define orientation of tabs.\n * @defaultValue horizontal\n */\n orientation?: Orientation;\n /**\n * Callback that is called when tab is changed.\n */\n onChange?: (id: string) => void;\n};\n\nexport type TabListProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport type TabTriggerProps = React.HTMLAttributes<HTMLButtonElement> & {\n /**\n * A unique value that associates the trigger with a content.\n */\n id: string;\n /**\n * When true, prevents the user from interacting with the tab.\n */\n disabled?: boolean;\n};\n\nexport type TabContentProps = React.HTMLAttributes<HTMLDivElement> & {\n /**\n * A unique value that associates the content with a trigger.\n */\n id: string;\n};\n\nexport type ForwardedTabsWithStatics = React.ForwardRefExoticComponent<TabsProps & React.RefAttributes<HTMLDivElement>> & {\n /** Tab list component containing all tab triggers, rendered in a `Tabs` group component */\n List: React.ForwardRefExoticComponent<TabListProps & React.RefAttributes<HTMLDivElement>>;\n /** Tab trigger component rendered in a `Tabs.List` component */\n Trigger: React.ForwardRefExoticComponent<TabTriggerProps & React.RefAttributes<HTMLButtonElement>>;\n /** Tab content component rendered in a `Tabs` group component */\n Content: React.ForwardRefExoticComponent<TabContentProps & React.RefAttributes<HTMLDivElement>>;\n};\n\nexport const Tabs = React.forwardRef(function Tabs(props: TabsProps, ref: React.Ref<HTMLDivElement>) {\n const { id, defaultId, children, onChange, orientation = 'horizontal', ...otherProps } = props;\n const className = cn(\n 'yt-tabs',\n `yt-tabs--${orientation}`,\n {\n 'flex w-full': orientation === 'vertical',\n },\n props.className\n );\n\n return (\n <TabsPrimitive.Root\n {...otherProps}\n className={className}\n data-taco=\"tabs\"\n defaultValue={defaultId}\n dir=\"ltr\"\n onValueChange={onChange}\n orientation={orientation}\n ref={ref}\n value={id}\n >\n {children}\n </TabsPrimitive.Root>\n );\n}) as ForwardedTabsWithStatics;\n\nconst TabList = React.forwardRef(function Tab(props: TabListProps, ref: React.Ref<HTMLDivElement>) {\n const className = cn('yt-tab__list border-b border-grey-light flex flex-row m-0 mb-4', props.className);\n\n return <TabsPrimitive.List {...props} className={className} ref={ref} />;\n});\n\nconst TabTrigger = React.forwardRef(function Tab(props: TabTriggerProps, ref: React.Ref<HTMLButtonElement>) {\n const { id, disabled, ...otherProps } = props;\n const className = cn(\n 'yt-tab bg-transparent border-b-2 border-transparent text-grey-darkest m-0 py-2 px-4',\n disabled\n ? 'cursor-not-allowed !text-grey-darker'\n : 'cursor-pointer rounded-t hover:border-grey-dark aria-selected:border-blue aria-selected:text-black aria-selected:hover:border-blue-light hover:text-black active:yt-focus active:border-blue focus:yt-focus focus:border-blue',\n props.className\n );\n\n return (\n <TabsPrimitive.Trigger\n {...otherProps}\n className={className}\n disabled={disabled}\n ref={ref}\n style={{\n transition: 'border 0.2s ease-in',\n }}\n value={id}\n />\n );\n});\n\nconst TabContent = React.forwardRef(function Tab(props: TabContentProps, ref: React.Ref<HTMLDivElement>) {\n const { id, ...otherProps } = props;\n const className = cn('yt-tab__panel outline-none', props.className);\n\n return <TabsPrimitive.Content {...otherProps} className={className} ref={ref} value={id} />;\n});\n\nTabs.List = TabList;\nTabs.Trigger = TabTrigger;\nTabs.Content = TabContent;\n"],"names":["Tabs","React","props","ref","id","defaultId","children","onChange","orientation","otherProps","className","cn","TabsPrimitive","defaultValue","dir","onValueChange","value","TabList","Tab","TabTrigger","disabled","style","transition","TabContent","List","Trigger","Content"],"mappings":";;;;MA+DaA,IAAI,gBAAGC,UAAA,CAAiB,SAASD,IAAT,CAAcE,KAAd,EAAgCC,GAAhC;EACjC,MAAM;IAAEC,EAAF;IAAMC,SAAN;IAAiBC,QAAjB;IAA2BC,QAA3B;IAAqCC,WAAW,GAAG,YAAnD;IAAiE,GAAGC;MAAeP,KAAzF;EACA,MAAMQ,SAAS,GAAGC,EAAE,CAChB,SADgB,cAEJH,aAFI,EAGhB;IACI,eAAeA,WAAW,KAAK;GAJnB,EAMhBN,KAAK,CAACQ,SANU,CAApB;EASA,OACIT,aAAA,CAACW,IAAD,oBACQH;IACJC,SAAS,EAAEA;iBACD;IACVG,YAAY,EAAER;IACdS,GAAG,EAAC;IACJC,aAAa,EAAER;IACfC,WAAW,EAAEA;IACbL,GAAG,EAAEA;IACLa,KAAK,EAAEZ;IATX,EAWKE,QAXL,CADJ;AAeH,CA1BmB;AA4BpB,MAAMW,OAAO,gBAAGhB,UAAA,CAAiB,SAASiB,GAAT,CAAahB,KAAb,EAAkCC,GAAlC;EAC7B,MAAMO,SAAS,GAAGC,EAAE,CAAC,gEAAD,EAAmET,KAAK,CAACQ,SAAzE,CAApB;EAEA,OAAOT,aAAA,CAACW,IAAD,oBAAwBV;IAAOQ,SAAS,EAAEA;IAAWP,GAAG,EAAEA;IAA1D,CAAP;AACH,CAJe,CAAhB;AAMA,MAAMgB,UAAU,gBAAGlB,UAAA,CAAiB,SAASiB,GAAT,CAAahB,KAAb,EAAqCC,GAArC;EAChC,MAAM;IAAEC,EAAF;IAAMgB,QAAN;IAAgB,GAAGX;MAAeP,KAAxC;EACA,MAAMQ,SAAS,GAAGC,EAAE,CAChB,qFADgB,EAEhBS,QAAQ,GACF,sCADE,GAEF,+NAJU,EAKhBlB,KAAK,CAACQ,SALU,CAApB;EAQA,OACIT,aAAA,CAACW,OAAD,oBACQH;IACJC,SAAS,EAAEA;IACXU,QAAQ,EAAEA;IACVjB,GAAG,EAAEA;IACLkB,KAAK,EAAE;MACHC,UAAU,EAAE;;IAEhBN,KAAK,EAAEZ;IARX,CADJ;AAYH,CAtBkB,CAAnB;AAwBA,MAAMmB,UAAU,gBAAGtB,UAAA,CAAiB,SAASiB,GAAT,CAAahB,KAAb,EAAqCC,GAArC;EAChC,MAAM;IAAEC,EAAF;IAAM,GAAGK;MAAeP,KAA9B;EACA,MAAMQ,SAAS,GAAGC,EAAE,CAAC,4BAAD,EAA+BT,KAAK,CAACQ,SAArC,CAApB;EAEA,OAAOT,aAAA,CAACW,OAAD,oBAA2BH;IAAYC,SAAS,EAAEA;IAAWP,GAAG,EAAEA;IAAKa,KAAK,EAAEZ;IAA9E,CAAP;AACH,CALkB,CAAnB;AAOAJ,IAAI,CAACwB,IAAL,GAAYP,OAAZ;AACAjB,IAAI,CAACyB,OAAL,GAAeN,UAAf;AACAnB,IAAI,CAAC0B,OAAL,GAAeH,UAAf;;;;"}
|
@@ -1,21 +1,23 @@
|
|
1
|
-
import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
|
2
1
|
import { forwardRef, createElement } from 'react';
|
3
2
|
import cn from 'classnames';
|
4
3
|
import { getInputClasses } from '../Input/util.js';
|
5
4
|
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
5
|
+
const Textarea = /*#__PURE__*/forwardRef(function Textarea(props, ref) {
|
6
|
+
const {
|
7
|
+
defaultValue: _,
|
8
|
+
highlighted,
|
9
|
+
invalid,
|
10
|
+
onKeyDown,
|
11
|
+
...otherProps
|
12
|
+
} = props;
|
13
|
+
const classNames = cn(getInputClasses(props), 'py-1 min-h-[75px] disabled:resize-none', props.className); // home and end keys only navigate to the start/end of textarea value if the textarea container does not scroll
|
12
14
|
// if it has scroll height then the browser reverts to native scrolling behaviour only
|
13
15
|
// so we manually override it to ensure _our_ desired behaviour remains intact
|
14
16
|
|
15
|
-
|
17
|
+
const handleKeyDown = event => {
|
16
18
|
if (event.key === 'Home' || event.key === 'End') {
|
17
19
|
event.preventDefault();
|
18
|
-
|
20
|
+
const position = event.key === 'End' ? event.currentTarget.value.length : 0;
|
19
21
|
event.currentTarget.setSelectionRange(position, position);
|
20
22
|
event.currentTarget.scrollTop = event.key === 'End' ? event.currentTarget.scrollHeight : 0;
|
21
23
|
}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Textarea.js","sources":["../../../../src/components/Textarea/Textarea.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport { getInputClasses } from '../Input/util';\n\nexport type TextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement> & {\n /** Draws attention to the textarea by changing its style and making it visually prominent */\n highlighted?: boolean;\n /* Whether the input is in an invalid state */\n invalid?: boolean;\n /** Value of the textarea */\n value?: string;\n};\n\nexport const Textarea = React.forwardRef(function Textarea(props: TextareaProps, ref: React.Ref<HTMLTextAreaElement>) {\n const { defaultValue: _, highlighted, invalid, onKeyDown, ...otherProps } = props;\n const classNames = cn(getInputClasses(props), 'py-1 min-h-[75px] disabled:resize-none', props.className);\n\n // home and end keys only navigate to the start/end of textarea value if the textarea container does not scroll\n // if it has scroll height then the browser reverts to native scrolling behaviour only\n // so we manually override it to ensure _our_ desired behaviour remains intact\n const handleKeyDown = (event: React.KeyboardEvent<HTMLTextAreaElement>) => {\n if (event.key === 'Home' || event.key === 'End') {\n event.preventDefault();\n const position = event.key === 'End' ? event.currentTarget.value.length : 0;\n event.currentTarget.setSelectionRange(position, position);\n event.currentTarget.scrollTop = event.key === 'End' ? event.currentTarget.scrollHeight : 0;\n }\n\n if (onKeyDown) {\n onKeyDown(event);\n }\n };\n\n return <textarea {...otherProps} className={classNames} data-taco=\"textarea\" onKeyDown={handleKeyDown} ref={ref} />;\n});\n"],"names":["Textarea","React","props","ref","onKeyDown","otherProps","classNames","cn","getInputClasses","className","handleKeyDown","event","key","preventDefault","position","currentTarget","value","length","setSelectionRange","scrollTop","scrollHeight"],"mappings":"
|
1
|
+
{"version":3,"file":"Textarea.js","sources":["../../../../src/components/Textarea/Textarea.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport { getInputClasses } from '../Input/util';\n\nexport type TextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement> & {\n /** Draws attention to the textarea by changing its style and making it visually prominent */\n highlighted?: boolean;\n /* Whether the input is in an invalid state */\n invalid?: boolean;\n /** Value of the textarea */\n value?: string;\n};\n\nexport const Textarea = React.forwardRef(function Textarea(props: TextareaProps, ref: React.Ref<HTMLTextAreaElement>) {\n const { defaultValue: _, highlighted, invalid, onKeyDown, ...otherProps } = props;\n const classNames = cn(getInputClasses(props), 'py-1 min-h-[75px] disabled:resize-none', props.className);\n\n // home and end keys only navigate to the start/end of textarea value if the textarea container does not scroll\n // if it has scroll height then the browser reverts to native scrolling behaviour only\n // so we manually override it to ensure _our_ desired behaviour remains intact\n const handleKeyDown = (event: React.KeyboardEvent<HTMLTextAreaElement>) => {\n if (event.key === 'Home' || event.key === 'End') {\n event.preventDefault();\n const position = event.key === 'End' ? event.currentTarget.value.length : 0;\n event.currentTarget.setSelectionRange(position, position);\n event.currentTarget.scrollTop = event.key === 'End' ? event.currentTarget.scrollHeight : 0;\n }\n\n if (onKeyDown) {\n onKeyDown(event);\n }\n };\n\n return <textarea {...otherProps} className={classNames} data-taco=\"textarea\" onKeyDown={handleKeyDown} ref={ref} />;\n});\n"],"names":["Textarea","React","props","ref","defaultValue","_","highlighted","invalid","onKeyDown","otherProps","classNames","cn","getInputClasses","className","handleKeyDown","event","key","preventDefault","position","currentTarget","value","length","setSelectionRange","scrollTop","scrollHeight"],"mappings":";;;;MAaaA,QAAQ,gBAAGC,UAAA,CAAiB,SAASD,QAAT,CAAkBE,KAAlB,EAAwCC,GAAxC;EACrC,MAAM;IAAEC,YAAY,EAAEC,CAAhB;IAAmBC,WAAnB;IAAgCC,OAAhC;IAAyCC,SAAzC;IAAoD,GAAGC;MAAeP,KAA5E;EACA,MAAMQ,UAAU,GAAGC,EAAE,CAACC,eAAe,CAACV,KAAD,CAAhB,EAAyB,wCAAzB,EAAmEA,KAAK,CAACW,SAAzE,CAArB;;;;EAKA,MAAMC,aAAa,GAAIC,KAAD;IAClB,IAAIA,KAAK,CAACC,GAAN,KAAc,MAAd,IAAwBD,KAAK,CAACC,GAAN,KAAc,KAA1C,EAAiD;MAC7CD,KAAK,CAACE,cAAN;MACA,MAAMC,QAAQ,GAAGH,KAAK,CAACC,GAAN,KAAc,KAAd,GAAsBD,KAAK,CAACI,aAAN,CAAoBC,KAApB,CAA0BC,MAAhD,GAAyD,CAA1E;MACAN,KAAK,CAACI,aAAN,CAAoBG,iBAApB,CAAsCJ,QAAtC,EAAgDA,QAAhD;MACAH,KAAK,CAACI,aAAN,CAAoBI,SAApB,GAAgCR,KAAK,CAACC,GAAN,KAAc,KAAd,GAAsBD,KAAK,CAACI,aAAN,CAAoBK,YAA1C,GAAyD,CAAzF;;;IAGJ,IAAIhB,SAAJ,EAAe;MACXA,SAAS,CAACO,KAAD,CAAT;;GATR;;EAaA,OAAOd,aAAA,WAAA,oBAAcQ;IAAYI,SAAS,EAAEH;iBAAsB;IAAWF,SAAS,EAAEM;IAAeX,GAAG,EAAEA;IAArG,CAAP;AACH,CArBuB;;;;"}
|
@@ -1,4 +1,3 @@
|
|
1
|
-
import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
|
2
1
|
import React__default from 'react';
|
3
2
|
import cn from 'classnames';
|
4
3
|
import { IconButton } from '../IconButton/IconButton.js';
|
@@ -7,36 +6,41 @@ import useTimer from '../../utils/hooks/useTimer.js';
|
|
7
6
|
import { getBadgeIcon } from './util.js';
|
8
7
|
import { useLocalization } from '../Provider/Provider.js';
|
9
8
|
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
9
|
+
const Toast = ({
|
10
|
+
content,
|
11
|
+
lastUpdated,
|
12
|
+
onClose: handleClose,
|
13
|
+
options,
|
14
|
+
...props
|
15
|
+
}) => {
|
16
|
+
const {
|
17
|
+
texts
|
18
|
+
} = useLocalization();
|
19
|
+
const {
|
20
|
+
autoClose,
|
21
|
+
type = 'default'
|
22
|
+
} = options;
|
23
|
+
const className = cn('bg-white relative flex items-center py-1 px-2 mt-3 w-full rounded yt-shadow', {
|
25
24
|
'border border-grey': type === 'default' || type === 'loading' || !type,
|
26
25
|
'border border-grey-darker': type === 'success',
|
27
26
|
'border border-blue': type === 'information',
|
28
27
|
'border border-yellow-dark': type === 'warning',
|
29
28
|
'border border-red': type === 'error'
|
30
29
|
});
|
31
|
-
|
32
|
-
|
33
|
-
|
30
|
+
const timer = useTimer(autoClose, handleClose);
|
31
|
+
const controls = useAnimation();
|
32
|
+
|
33
|
+
if (!content) {
|
34
|
+
console.warn(`Toast requires 'content' property, which can't be empty string, null or undefined. Current content value is set to ${content === '' ? 'empty string' : content}.`);
|
35
|
+
}
|
36
|
+
|
37
|
+
React__default.useEffect(() => {
|
34
38
|
if (autoClose) {
|
35
39
|
timer.start();
|
36
40
|
}
|
37
41
|
}, [autoClose]);
|
38
42
|
|
39
|
-
|
43
|
+
const triggerUpdateAnimation = function () {
|
40
44
|
try {
|
41
45
|
return Promise.resolve(controls.start({
|
42
46
|
scale: 1.05
|
@@ -50,7 +54,7 @@ var Toast = function Toast(_ref) {
|
|
50
54
|
}
|
51
55
|
};
|
52
56
|
|
53
|
-
React__default.useEffect(
|
57
|
+
React__default.useEffect(() => {
|
54
58
|
if (lastUpdated) {
|
55
59
|
triggerUpdateAnimation();
|
56
60
|
|
@@ -65,11 +69,11 @@ var Toast = function Toast(_ref) {
|
|
65
69
|
"data-taco": "toast",
|
66
70
|
onMouseEnter: timer.pause,
|
67
71
|
onMouseLeave: timer.resume
|
68
|
-
}), getBadgeIcon(type),
|
72
|
+
}), getBadgeIcon(type), React__default.createElement("div", {
|
69
73
|
className: "flex-grow"
|
70
74
|
}, content), React__default.createElement(IconButton, {
|
71
75
|
appearance: "discrete",
|
72
|
-
className: "text-grey-darkest
|
76
|
+
className: "text-grey-darkest -mr-2 cursor-pointer !px-0",
|
73
77
|
icon: "close",
|
74
78
|
"aria-label": texts.toasts.dismiss,
|
75
79
|
onClick: handleClose
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Toast.js","sources":["../../../../src/components/Toast/Toast.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { motion, useAnimation } from 'framer-motion';\nimport useTimer from '../../utils/hooks/useTimer';\nimport { getBadgeIcon } from './util';\nimport { State } from '../../types';\nimport { useLocalization } from '../Provider/Provider';\nimport { IconButton } from '../IconButton/IconButton';\n\nexport type ToastsTexts = {\n /** Aria-label for the close icon button of toast */\n dismiss: string;\n};\n\nexport type ToastType = Omit<State, 'default'> | 'loading';\nexport type ToastOptions = {\n /** Provide time in milliseconds after which the toast should autoclose */\n autoClose?: number;\n /**\n * State will change the icon displayed in toast and other characteristics,\n * for e.g. `loading` state will display a progress animation.\n * Default value is `default`\n */\n type?: ToastType;\n};\nexport type ToastProps = {\n /** Provide a unique id for toast */\n id: string;\n /**\n * Content can be any valid react node, for e.g. a `div`, or a simple text.\n
|
1
|
+
{"version":3,"file":"Toast.js","sources":["../../../../src/components/Toast/Toast.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { motion, useAnimation } from 'framer-motion';\nimport useTimer from '../../utils/hooks/useTimer';\nimport { getBadgeIcon } from './util';\nimport { State } from '../../types';\nimport { useLocalization } from '../Provider/Provider';\nimport { IconButton } from '../IconButton/IconButton';\n\nexport type ToastsTexts = {\n /** Aria-label for the close icon button of toast */\n dismiss: string;\n};\n\nexport type ToastType = Omit<State, 'default'> | 'loading';\nexport type ToastOptions = {\n /** Provide time in milliseconds after which the toast should autoclose */\n autoClose?: number;\n /**\n * State will change the icon displayed in toast and other characteristics,\n * for e.g. `loading` state will display a progress animation.\n * Default value is `default`\n */\n type?: ToastType;\n};\nexport type ToastContent = Omit<React.ReactNode, 'null' | 'undefined'>;\nexport type ToastProps = {\n /** Provide a unique id for toast */\n id: string;\n /**\n * Content can be any valid react node, for e.g. a `div`, or a simple text.\n */\n content: ToastContent;\n /** Additional options to define your toast */\n options: ToastOptions;\n /**\n * Handler called when toast closes.\n * To read more about how to provide the text, see [Provider](component:provider) component\n */\n onClose: () => void;\n lastUpdated?: number;\n lastDuplicateId?: string;\n};\n\nexport const Toast = ({ content, lastUpdated, onClose: handleClose, options, ...props }: ToastProps): JSX.Element => {\n const { texts } = useLocalization();\n const { autoClose, type = 'default' } = options;\n const className = cn('bg-white relative flex items-center py-1 px-2 mt-3 w-full rounded yt-shadow', {\n 'border border-grey': type === 'default' || type === 'loading' || !type,\n 'border border-grey-darker': type === 'success',\n 'border border-blue': type === 'information',\n 'border border-yellow-dark': type === 'warning',\n 'border border-red': type === 'error',\n });\n const timer = useTimer(autoClose, handleClose);\n const controls = useAnimation();\n\n if (!content) {\n console.warn(\n `Toast requires 'content' property, which can't be empty string, null or undefined. Current content value is set to ${\n content === '' ? 'empty string' : content\n }.`\n );\n }\n\n React.useEffect(() => {\n if (autoClose) {\n timer.start();\n }\n }, [autoClose]);\n\n const triggerUpdateAnimation = async () => {\n await controls.start({ scale: 1.05 });\n await controls.start({ scale: 1 });\n };\n\n React.useEffect(() => {\n if (lastUpdated) {\n triggerUpdateAnimation();\n\n if (timer.running) {\n timer.start();\n }\n }\n }, [lastUpdated]);\n\n return (\n <motion.div\n {...props}\n animate={controls}\n className={className}\n data-taco=\"toast\"\n onMouseEnter={timer.pause}\n onMouseLeave={timer.resume}>\n {getBadgeIcon(type)}\n <div className=\"flex-grow\">{content}</div>\n <IconButton\n appearance=\"discrete\"\n className=\"text-grey-darkest -mr-2 cursor-pointer !px-0\"\n icon=\"close\"\n aria-label={texts.toasts.dismiss}\n onClick={handleClose}\n />\n </motion.div>\n );\n};\n"],"names":["Toast","content","lastUpdated","onClose","handleClose","options","props","texts","useLocalization","autoClose","type","className","cn","timer","useTimer","controls","useAnimation","console","warn","React","useEffect","start","triggerUpdateAnimation","scale","running","motion","div","animate","onMouseEnter","pause","onMouseLeave","resume","getBadgeIcon","IconButton","appearance","icon","toasts","dismiss","onClick"],"mappings":";;;;;;;;MA4CaA,KAAK,GAAG,CAAC;EAAEC,OAAF;EAAWC,WAAX;EAAwBC,OAAO,EAAEC,WAAjC;EAA8CC,OAA9C;EAAuD,GAAGC;AAA1D,CAAD;EACjB,MAAM;IAAEC;MAAUC,eAAe,EAAjC;EACA,MAAM;IAAEC,SAAF;IAAaC,IAAI,GAAG;MAAcL,OAAxC;EACA,MAAMM,SAAS,GAAGC,EAAE,CAAC,6EAAD,EAAgF;IAChG,sBAAsBF,IAAI,KAAK,SAAT,IAAsBA,IAAI,KAAK,SAA/B,IAA4C,CAACA,IAD6B;IAEhG,6BAA6BA,IAAI,KAAK,SAF0D;IAGhG,sBAAsBA,IAAI,KAAK,aAHiE;IAIhG,6BAA6BA,IAAI,KAAK,SAJ0D;IAKhG,qBAAqBA,IAAI,KAAK;GALd,CAApB;EAOA,MAAMG,KAAK,GAAGC,QAAQ,CAACL,SAAD,EAAYL,WAAZ,CAAtB;EACA,MAAMW,QAAQ,GAAGC,YAAY,EAA7B;;EAEA,IAAI,CAACf,OAAL,EAAc;IACVgB,OAAO,CAACC,IAAR,uHAEQjB,OAAO,KAAK,EAAZ,GAAiB,cAAjB,GAAkCA,UAF1C;;;EAOJkB,cAAK,CAACC,SAAN,CAAgB;IACZ,IAAIX,SAAJ,EAAe;MACXI,KAAK,CAACQ,KAAN;;GAFR,EAIG,CAACZ,SAAD,CAJH;;EAMA,MAAMa,sBAAsB;IAAA;6BAClBP,QAAQ,CAACM,KAAT,CAAe;QAAEE,KAAK,EAAE;OAAxB;+BACAR,QAAQ,CAACM,KAAT,CAAe;UAAEE,KAAK,EAAE;SAAxB;;KAFkB;MAAA;;GAA5B;;EAKAJ,cAAK,CAACC,SAAN,CAAgB;IACZ,IAAIlB,WAAJ,EAAiB;MACboB,sBAAsB;;MAEtB,IAAIT,KAAK,CAACW,OAAV,EAAmB;QACfX,KAAK,CAACQ,KAAN;;;GALZ,EAQG,CAACnB,WAAD,CARH;EAUA,OACIiB,4BAAA,CAACM,MAAM,CAACC,GAAR,oBACQpB;IACJqB,OAAO,EAAEZ;IACTJ,SAAS,EAAEA;iBACD;IACViB,YAAY,EAAEf,KAAK,CAACgB;IACpBC,YAAY,EAAEjB,KAAK,CAACkB;IANxB,EAOKC,YAAY,CAACtB,IAAD,CAPjB,EAQIS,4BAAA,MAAA;IAAKR,SAAS,EAAC;GAAf,EAA4BV,OAA5B,CARJ,EASIkB,4BAAA,CAACc,UAAD;IACIC,UAAU,EAAC;IACXvB,SAAS,EAAC;IACVwB,IAAI,EAAC;kBACO5B,KAAK,CAAC6B,MAAN,CAAaC;IACzBC,OAAO,EAAElC;GALb,CATJ,CADJ;AAmBH;;;;"}
|
@@ -1,65 +1,51 @@
|
|
1
|
-
import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
|
2
1
|
import { useState, useCallback, useEffect, createElement, useContext, createContext } from 'react';
|
3
2
|
import { v4 } from 'uuid';
|
4
3
|
import { AnimatePresence, motion } from 'framer-motion';
|
5
4
|
import { Toast } from './Toast.js';
|
6
5
|
|
7
|
-
|
8
|
-
|
9
|
-
var ToastContext = /*#__PURE__*/createContext({});
|
6
|
+
const DEFAULT_AUTO_CLOSE_TIMEOUT = 7500;
|
7
|
+
const ToastContext = /*#__PURE__*/createContext({});
|
10
8
|
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
return JSON.stringify(toast.content) === JSON.stringify(content);
|
15
|
-
});
|
9
|
+
const insertToastWithoutDuplicates = (currentToasts, id, content, options, close) => {
|
10
|
+
const nextToasts = [...currentToasts];
|
11
|
+
const existingToastIndex = currentToasts.findIndex(toast => JSON.stringify(toast.content) === JSON.stringify(content));
|
16
12
|
|
17
13
|
if (existingToastIndex > -1) {
|
18
14
|
nextToasts[existingToastIndex].lastDuplicateId = id;
|
19
15
|
nextToasts[existingToastIndex].lastUpdated = Date.now();
|
20
16
|
} else {
|
21
17
|
nextToasts.push({
|
22
|
-
id
|
18
|
+
id,
|
23
19
|
content: typeof content === 'function' ? content(close) : content,
|
24
|
-
options
|
20
|
+
options
|
25
21
|
});
|
26
22
|
}
|
27
23
|
|
28
24
|
return nextToasts;
|
29
25
|
};
|
30
26
|
|
31
|
-
|
32
|
-
|
33
|
-
|
27
|
+
const ToastProvider = ({
|
28
|
+
children,
|
29
|
+
...props
|
30
|
+
}) => {
|
31
|
+
const [toasts, setToasts] = useState([]);
|
34
32
|
|
35
|
-
|
36
|
-
|
37
|
-
setToasts = _React$useState[1];
|
38
|
-
|
39
|
-
var handleClose = function handleClose(id) {
|
40
|
-
setToasts(function (currentToasts) {
|
41
|
-
return currentToasts.filter(function (toast) {
|
42
|
-
return toast.id !== id;
|
43
|
-
});
|
44
|
-
});
|
33
|
+
const handleClose = id => {
|
34
|
+
setToasts(currentToasts => currentToasts.filter(toast => toast.id !== id));
|
45
35
|
}; // memoize (useCallback) this function,
|
46
36
|
// it is the value of the context provider and we don't want it to trigger state tree re-renders on provider children
|
47
37
|
|
48
38
|
|
49
|
-
|
50
|
-
|
39
|
+
const toaster = useCallback((content, options) => {
|
40
|
+
const id = v4();
|
51
41
|
|
52
|
-
|
53
|
-
return handleClose(id);
|
54
|
-
};
|
42
|
+
const close = () => handleClose(id);
|
55
43
|
|
56
|
-
setToasts(
|
57
|
-
return insertToastWithoutDuplicates(currentToasts, id, content, options, close);
|
58
|
-
});
|
44
|
+
setToasts(currentToasts => insertToastWithoutDuplicates(currentToasts, id, content, options, close));
|
59
45
|
|
60
|
-
|
61
|
-
setToasts(
|
62
|
-
|
46
|
+
const update = (content, options) => {
|
47
|
+
setToasts(currentToasts => {
|
48
|
+
const nextToasts = currentToasts.filter(toast => {
|
63
49
|
if (toast.lastDuplicateId) {
|
64
50
|
return toast.lastDuplicateId !== id;
|
65
51
|
}
|
@@ -70,80 +56,70 @@ var ToastProvider = function ToastProvider(_ref) {
|
|
70
56
|
});
|
71
57
|
};
|
72
58
|
|
73
|
-
|
74
|
-
update(content,
|
75
|
-
autoClose: DEFAULT_AUTO_CLOSE_TIMEOUT
|
76
|
-
|
59
|
+
const success = (content, options) => {
|
60
|
+
update(content, {
|
61
|
+
autoClose: DEFAULT_AUTO_CLOSE_TIMEOUT,
|
62
|
+
...options,
|
77
63
|
type: 'success'
|
78
|
-
})
|
64
|
+
});
|
79
65
|
};
|
80
66
|
|
81
|
-
|
82
|
-
update(content,
|
67
|
+
const error = (content, options) => {
|
68
|
+
update(content, { ...options,
|
83
69
|
type: 'error'
|
84
|
-
})
|
70
|
+
});
|
85
71
|
};
|
86
72
|
|
87
|
-
|
88
|
-
update(content,
|
73
|
+
const warning = (content, options) => {
|
74
|
+
update(content, { ...options,
|
89
75
|
type: 'warning'
|
90
|
-
})
|
76
|
+
});
|
91
77
|
};
|
92
78
|
|
93
|
-
|
94
|
-
update(content,
|
79
|
+
const information = (content, options) => {
|
80
|
+
update(content, { ...options,
|
95
81
|
type: 'information'
|
96
|
-
})
|
82
|
+
});
|
97
83
|
};
|
98
84
|
|
99
|
-
|
100
|
-
update(content,
|
85
|
+
const loading = (content, options) => {
|
86
|
+
update(content, { ...options,
|
101
87
|
type: 'loading'
|
102
|
-
})
|
88
|
+
});
|
103
89
|
};
|
104
90
|
|
105
91
|
return {
|
106
|
-
success
|
107
|
-
error
|
108
|
-
warning
|
109
|
-
information
|
110
|
-
loading
|
111
|
-
close
|
92
|
+
success,
|
93
|
+
error,
|
94
|
+
warning,
|
95
|
+
information,
|
96
|
+
loading,
|
97
|
+
close
|
112
98
|
};
|
113
99
|
}, []); // no need to rebind these every render, do them once in an effect
|
114
100
|
|
115
|
-
useEffect(
|
116
|
-
toaster.success =
|
117
|
-
|
118
|
-
|
119
|
-
|
120
|
-
|
121
|
-
}));
|
122
|
-
};
|
101
|
+
useEffect(() => {
|
102
|
+
toaster.success = (content, options) => toaster(content, {
|
103
|
+
autoClose: DEFAULT_AUTO_CLOSE_TIMEOUT,
|
104
|
+
...options,
|
105
|
+
type: 'success'
|
106
|
+
});
|
123
107
|
|
124
|
-
toaster.error =
|
125
|
-
|
126
|
-
|
127
|
-
}));
|
128
|
-
};
|
108
|
+
toaster.error = (content, options) => toaster(content, { ...options,
|
109
|
+
type: 'error'
|
110
|
+
});
|
129
111
|
|
130
|
-
toaster.warning =
|
131
|
-
|
132
|
-
|
133
|
-
}));
|
134
|
-
};
|
112
|
+
toaster.warning = (content, options) => toaster(content, { ...options,
|
113
|
+
type: 'warning'
|
114
|
+
});
|
135
115
|
|
136
|
-
toaster.information =
|
137
|
-
|
138
|
-
|
139
|
-
}));
|
140
|
-
};
|
116
|
+
toaster.information = (content, options) => toaster(content, { ...options,
|
117
|
+
type: 'information'
|
118
|
+
});
|
141
119
|
|
142
|
-
toaster.loading =
|
143
|
-
|
144
|
-
|
145
|
-
}));
|
146
|
-
};
|
120
|
+
toaster.loading = (content, options) => toaster(content, { ...options,
|
121
|
+
type: 'loading'
|
122
|
+
});
|
147
123
|
}, []);
|
148
124
|
return createElement(ToastContext.Provider, Object.assign({}, props, {
|
149
125
|
value: toaster
|
@@ -153,41 +129,35 @@ var ToastProvider = function ToastProvider(_ref) {
|
|
153
129
|
role: "log"
|
154
130
|
}, createElement(AnimatePresence, {
|
155
131
|
initial: false
|
156
|
-
}, toasts.map(
|
157
|
-
|
158
|
-
|
132
|
+
}, toasts.map(toast => createElement(motion.div, {
|
133
|
+
key: toast.id,
|
134
|
+
transition: {
|
135
|
+
type: 'spring',
|
136
|
+
damping: 20,
|
137
|
+
stiffness: 300
|
138
|
+
},
|
139
|
+
initial: {
|
140
|
+
opacity: 0,
|
141
|
+
y: 10,
|
142
|
+
scale: 0.5
|
143
|
+
},
|
144
|
+
animate: {
|
145
|
+
opacity: 1,
|
146
|
+
y: 0,
|
147
|
+
scale: 1
|
148
|
+
},
|
149
|
+
exit: {
|
150
|
+
opacity: 0,
|
151
|
+
scale: 0.5,
|
159
152
|
transition: {
|
160
|
-
|
161
|
-
damping: 20,
|
162
|
-
stiffness: 300
|
163
|
-
},
|
164
|
-
initial: {
|
165
|
-
opacity: 0,
|
166
|
-
y: 10,
|
167
|
-
scale: 0.5
|
168
|
-
},
|
169
|
-
animate: {
|
170
|
-
opacity: 1,
|
171
|
-
y: 0,
|
172
|
-
scale: 1
|
173
|
-
},
|
174
|
-
exit: {
|
175
|
-
opacity: 0,
|
176
|
-
scale: 0.5,
|
177
|
-
transition: {
|
178
|
-
duration: 0.2
|
179
|
-
}
|
180
|
-
}
|
181
|
-
}, createElement(Toast, Object.assign({}, toast, {
|
182
|
-
onClose: function onClose() {
|
183
|
-
return handleClose(toast.id);
|
153
|
+
duration: 0.2
|
184
154
|
}
|
185
|
-
}
|
186
|
-
}
|
187
|
-
|
188
|
-
|
189
|
-
return useContext(ToastContext);
|
155
|
+
}
|
156
|
+
}, createElement(Toast, Object.assign({}, toast, {
|
157
|
+
onClose: () => handleClose(toast.id)
|
158
|
+
})))))));
|
190
159
|
};
|
160
|
+
const useToast = () => useContext(ToastContext);
|
191
161
|
|
192
162
|
export { ToastProvider, useToast };
|
193
163
|
//# sourceMappingURL=Toaster.js.map
|