@economic/taco 1.1.4 → 1.1.5-alpha.102
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/README.md +82 -82
- package/dist/components/Icon/components/LogOut.d.ts +3 -0
- package/dist/components/Icon/components/Menu.d.ts +3 -0
- package/dist/components/Icon/components/Numbers.d.ts +3 -0
- package/dist/components/Icon/components/Profile.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/Tour/Tour.d.ts +2 -0
- package/dist/esm/components/Banner/util.js +1 -1
- package/dist/esm/components/Banner/util.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/Card/Card.js +3 -0
- package/dist/esm/components/Card/Card.js.map +1 -1
- package/dist/esm/components/Combobox/Combobox.js +1 -0
- package/dist/esm/components/Combobox/Combobox.js.map +1 -1
- package/dist/esm/components/Combobox/useCombobox.js +67 -87
- package/dist/esm/components/Combobox/useCombobox.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/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 +3 -3
- package/dist/esm/components/Dialog/components/Trigger.js.map +1 -1
- package/dist/esm/components/Hanger/Hanger.js +1 -1
- package/dist/esm/components/Hanger/Hanger.js.map +1 -1
- package/dist/esm/components/Icon/components/LogOut.js +20 -0
- package/dist/esm/components/Icon/components/LogOut.js.map +1 -0
- package/dist/esm/components/Icon/components/Menu.js +18 -0
- package/dist/esm/components/Icon/components/Menu.js.map +1 -0
- package/dist/esm/components/Icon/components/Numbers.js +18 -0
- package/dist/esm/components/Icon/components/Numbers.js.map +1 -0
- package/dist/esm/components/Icon/components/Profile.js +20 -0
- package/dist/esm/components/Icon/components/Profile.js.map +1 -0
- package/dist/esm/components/Icon/components/index.js +12 -4
- package/dist/esm/components/Icon/components/index.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/ScrollableList.js +64 -83
- package/dist/esm/components/Listbox/ScrollableList.js.map +1 -1
- package/dist/esm/components/Listbox/useListbox.js +51 -60
- package/dist/esm/components/Listbox/useListbox.js.map +1 -1
- package/dist/esm/components/Listbox/useMultiListbox.js +64 -91
- 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/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/Pagination/PageNumbers.js +23 -28
- package/dist/esm/components/Pagination/PageNumbers.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 +9 -9
- package/dist/esm/components/Pagination/usePaginationShortcuts.js.map +1 -1
- package/dist/esm/components/Popover/Popover.js +1 -1
- 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/SearchInput/SearchInput.js +4 -1
- package/dist/esm/components/SearchInput/SearchInput.js.map +1 -1
- package/dist/esm/components/Select/useSelect.js +63 -81
- package/dist/esm/components/Select/useSelect.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 +122 -146
- 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 +119 -141
- package/dist/esm/components/Table/hooks/useTable.js.map +1 -1
- package/dist/esm/components/Table/hooks/useTableKeyboardNavigation.js +13 -16
- 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/Toast/Toast.js +21 -22
- package/dist/esm/components/Toast/Toast.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/Tour/Tour.js +3 -1
- package/dist/esm/components/Tour/Tour.js.map +1 -1
- package/dist/esm/index.css +661 -661
- package/dist/esm/index.js +4 -1
- package/dist/esm/index.js.map +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.map +1 -1
- 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.map +1 -1
- package/dist/esm/utils/hooks/useListKeyboardNavigation.js.map +1 -1
- package/dist/esm/utils/hooks/useListScrollTo.js.map +1 -1
- package/dist/esm/utils/hooks/useOnClickOutside.js.map +1 -1
- 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 +7 -11
- package/dist/esm/utils/input.js.map +1 -1
- package/dist/esm/utils/mergeRefs.js +1 -1
- 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 +661 -661
- package/dist/index.d.ts +4 -1
- package/dist/taco.cjs.development.js +1566 -1823
- 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/mergeRefs.d.ts +1 -1
- package/package.json +6 -7
- package/plugins/tailwindcss-aria-attributes.js +73 -73
- package/tailwind.config.js +9 -0
- package/types.json +2612 -7006
@@ -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,36 @@ 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
|
-
React__default.useEffect(
|
30
|
+
const timer = useTimer(autoClose, handleClose);
|
31
|
+
const controls = useAnimation();
|
32
|
+
React__default.useEffect(() => {
|
34
33
|
if (autoClose) {
|
35
34
|
timer.start();
|
36
35
|
}
|
37
36
|
}, [autoClose]);
|
38
37
|
|
39
|
-
|
38
|
+
const triggerUpdateAnimation = function () {
|
40
39
|
try {
|
41
40
|
return Promise.resolve(controls.start({
|
42
41
|
scale: 1.05
|
@@ -50,7 +49,7 @@ var Toast = function Toast(_ref) {
|
|
50
49
|
}
|
51
50
|
};
|
52
51
|
|
53
|
-
React__default.useEffect(
|
52
|
+
React__default.useEffect(() => {
|
54
53
|
if (lastUpdated) {
|
55
54
|
triggerUpdateAnimation();
|
56
55
|
|
@@ -69,7 +68,7 @@ var Toast = function Toast(_ref) {
|
|
69
68
|
className: "flex-grow"
|
70
69
|
}, content), React__default.createElement(IconButton, {
|
71
70
|
appearance: "discrete",
|
72
|
-
className: "text-grey-darkest
|
71
|
+
className: "text-grey-darkest -mr-2 cursor-pointer !px-0",
|
73
72
|
icon: "close",
|
74
73
|
"aria-label": texts.toasts.dismiss,
|
75
74
|
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 * Note that content can also be `null`, resulting in a slimmer version of your toast with a vertically centered title\n */\n content: React.ReactNode;\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 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 >\n {getBadgeIcon(type)}\n {content && <div className=\"flex-grow\">{content}</div>}\n <IconButton\n appearance=\"discrete\"\n className=\"text-grey-darkest
|
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 * Note that content can also be `null`, resulting in a slimmer version of your toast with a vertically centered title\n */\n content: React.ReactNode;\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 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 >\n {getBadgeIcon(type)}\n {content && <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","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;EAEAC,cAAK,CAACC,SAAN,CAAgB;IACZ,IAAIT,SAAJ,EAAe;MACXI,KAAK,CAACM,KAAN;;GAFR,EAIG,CAACV,SAAD,CAJH;;EAMA,MAAMW,sBAAsB;IAAA;6BAClBL,QAAQ,CAACI,KAAT,CAAe;QAAEE,KAAK,EAAE;OAAxB;+BACAN,QAAQ,CAACI,KAAT,CAAe;UAAEE,KAAK,EAAE;SAAxB;;KAFkB;MAAA;;GAA5B;;EAKAJ,cAAK,CAACC,SAAN,CAAgB;IACZ,IAAIhB,WAAJ,EAAiB;MACbkB,sBAAsB;;MAEtB,IAAIP,KAAK,CAACS,OAAV,EAAmB;QACfT,KAAK,CAACM,KAAN;;;GALZ,EAQG,CAACjB,WAAD,CARH;EAUA,OACIe,4BAAA,CAACM,MAAM,CAACC,GAAR,oBACQlB;IACJmB,OAAO,EAAEV;IACTJ,SAAS,EAAEA;iBACD;IACVe,YAAY,EAAEb,KAAK,CAACc;IACpBC,YAAY,EAAEf,KAAK,CAACgB;IANxB,EAQKC,YAAY,CAACpB,IAAD,CARjB,EASKT,OAAO,IAAIgB,4BAAA,MAAA;IAAKN,SAAS,EAAC;GAAf,EAA4BV,OAA5B,CAThB,EAUIgB,4BAAA,CAACc,UAAD;IACIC,UAAU,EAAC;IACXrB,SAAS,EAAC;IACVsB,IAAI,EAAC;kBACO1B,KAAK,CAAC2B,MAAN,CAAaC;IACzBC,OAAO,EAAEhC;GALb,CAVJ,CADJ;AAoBH;;;;"}
|
@@ -3,8 +3,8 @@ import cn from 'classnames';
|
|
3
3
|
import { Icon } from '../Icon/Icon.js';
|
4
4
|
import { Spinner } from '../Spinner/Spinner.js';
|
5
5
|
|
6
|
-
|
7
|
-
|
6
|
+
const getBadgeIcon = type => {
|
7
|
+
const css = 'rounded-full flex-shrink-0 mr-2';
|
8
8
|
|
9
9
|
switch (type) {
|
10
10
|
case 'success':
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"util.js","sources":["../../../../src/components/Toast/util.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { Icon } from '../Icon/Icon';\nimport { Spinner } from '../Spinner/Spinner';\nimport { ToastType } from './Toast';\n\nexport const getBadgeIcon = (type: ToastType): JSX.Element | null => {\n const css = 'rounded-full flex-shrink-0 mr-2';\n\n switch (type) {\n case 'success':\n return <Icon name=\"tick\" className={cn(css, 'yt-green-solid')} />;\n\n case 'warning':\n return <Icon name=\"warning\" className={cn(css, 'yt-yellow-solid')} />;\n\n case 'error':\n return <Icon name=\"warning\" className={cn(css, 'yt-red-solid')} />;\n\n case 'information':\n return <Icon name=\"info\" className={cn(css, 'yt-blue-solid')} />;\n\n case 'loading':\n return <Spinner delay={0} className={cn(css, 'h-6 w-6')} />;\n\n default:\n return null;\n }\n};\n"],"names":["getBadgeIcon","type","css","React","Icon","name","className","cn","Spinner","delay"],"mappings":";;;;;
|
1
|
+
{"version":3,"file":"util.js","sources":["../../../../src/components/Toast/util.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { Icon } from '../Icon/Icon';\nimport { Spinner } from '../Spinner/Spinner';\nimport { ToastType } from './Toast';\n\nexport const getBadgeIcon = (type: ToastType): JSX.Element | null => {\n const css = 'rounded-full flex-shrink-0 mr-2';\n\n switch (type) {\n case 'success':\n return <Icon name=\"tick\" className={cn(css, 'yt-green-solid')} />;\n\n case 'warning':\n return <Icon name=\"warning\" className={cn(css, 'yt-yellow-solid')} />;\n\n case 'error':\n return <Icon name=\"warning\" className={cn(css, 'yt-red-solid')} />;\n\n case 'information':\n return <Icon name=\"info\" className={cn(css, 'yt-blue-solid')} />;\n\n case 'loading':\n return <Spinner delay={0} className={cn(css, 'h-6 w-6')} />;\n\n default:\n return null;\n }\n};\n"],"names":["getBadgeIcon","type","css","React","Icon","name","className","cn","Spinner","delay"],"mappings":";;;;;MAMaA,YAAY,GAAIC,IAAD;EACxB,MAAMC,GAAG,GAAG,iCAAZ;;EAEA,QAAQD,IAAR;IACI,KAAK,SAAL;MACI,OAAOE,4BAAA,CAACC,IAAD;QAAMC,IAAI,EAAC;QAAOC,SAAS,EAAEC,EAAE,CAACL,GAAD,EAAM,gBAAN;OAA/B,CAAP;;IAEJ,KAAK,SAAL;MACI,OAAOC,4BAAA,CAACC,IAAD;QAAMC,IAAI,EAAC;QAAUC,SAAS,EAAEC,EAAE,CAACL,GAAD,EAAM,iBAAN;OAAlC,CAAP;;IAEJ,KAAK,OAAL;MACI,OAAOC,4BAAA,CAACC,IAAD;QAAMC,IAAI,EAAC;QAAUC,SAAS,EAAEC,EAAE,CAACL,GAAD,EAAM,cAAN;OAAlC,CAAP;;IAEJ,KAAK,aAAL;MACI,OAAOC,4BAAA,CAACC,IAAD;QAAMC,IAAI,EAAC;QAAOC,SAAS,EAAEC,EAAE,CAACL,GAAD,EAAM,eAAN;OAA/B,CAAP;;IAEJ,KAAK,SAAL;MACI,OAAOC,4BAAA,CAACK,OAAD;QAASC,KAAK,EAAE;QAAGH,SAAS,EAAEC,EAAE,CAACL,GAAD,EAAM,SAAN;OAAhC,CAAP;;IAEJ;MACI,OAAO,IAAP;;AAEX;;;;"}
|
@@ -7,7 +7,7 @@ import keycode from 'keycode';
|
|
7
7
|
import { Group } from '../Group/Group.js';
|
8
8
|
import Joyride, { ACTIONS, LIFECYCLE, EVENTS } from 'react-joyride';
|
9
9
|
|
10
|
-
var _excluded = ["autoStart", "onComplete", "onClose", "onReady", "spotlightClicks", "disableCloseOnEsc", "disableScrollParentFix"];
|
10
|
+
var _excluded = ["autoStart", "onComplete", "onClose", "onReady", "spotlightClicks", "disableCloseOnEsc", "disableScrollParentFix", "scrollOffset"];
|
11
11
|
|
12
12
|
var Tooltip = function Tooltip(_ref) {
|
13
13
|
var continuous = _ref.continuous,
|
@@ -72,6 +72,7 @@ var Tour = function Tour(props) {
|
|
72
72
|
disableTourSkipOnEsc = props.disableCloseOnEsc,
|
73
73
|
_props$disableScrollP = props.disableScrollParentFix,
|
74
74
|
disableScrollParentFix = _props$disableScrollP === void 0 ? false : _props$disableScrollP,
|
75
|
+
scrollOffset = props.scrollOffset,
|
75
76
|
rest = _objectWithoutPropertiesLoose(props, _excluded);
|
76
77
|
|
77
78
|
var steps = useMemo(function () {
|
@@ -132,6 +133,7 @@ var Tour = function Tour(props) {
|
|
132
133
|
spotlightClicks: spotlightClicks,
|
133
134
|
disableScrollParentFix: disableScrollParentFix,
|
134
135
|
callback: callback,
|
136
|
+
scrollOffset: scrollOffset,
|
135
137
|
styles: {
|
136
138
|
/** style beacon */
|
137
139
|
options: {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Tour.js","sources":["../../../../src/components/Tour/Tour.tsx"],"sourcesContent":["import keycode from 'keycode';\nimport * as React from 'react';\nimport Joyride, { Step, CallBackProps, ACTIONS, LIFECYCLE, Placement, EVENTS, TooltipRenderProps } from 'react-joyride';\n\nimport { Button } from '../Button/Button';\nimport { Group } from '../Group/Group';\nimport { IconButton } from '../IconButton/IconButton';\nimport { useLocalization } from '../Provider/Provider';\n\nexport type TourTexts = {\n /** Text for back action button */\n back: string;\n /**\n * Text for close button.\n * This button is displayed if tour is not continuous - replacing the `Next` button.\n * It will pause the flow of the tour and close the tooltip\n */\n close: string;\n /**\n * Aria-label and title for close icon button in each step.\n * This button skips and completes the flow entirely\n */\n skip: string;\n /**\n * Text for last action button.\n * This button is displayed when user is on the last step of the tour\n */\n last: string;\n /**\n * Text for next action button.\n * This button is displayed if tour has more than one steps and is continuous\n */\n next: string;\n /** Aria label and title for beacon that will open the tour step */\n open: string;\n};\n\nexport type TourStepProps = {\n /** Content can be any valid react node, for e.g. a `div` */\n children: React.ReactNode;\n /** Define the position of the tour's popup relative to the element is presenting */\n position?: Placement;\n /** The css selector of the html element you want to include in a tour */\n selector: string;\n /**\n * Show beacon for step.\n * A beacon is a styled component which indicates the current element to be presented.\n * For more informations about how to create a beacon, read [Joyride](https://docs.react-joyride.com) docs\n */\n showBeacon?: boolean;\n /** Text displayed above the children/content of the popup */\n title: string;\n};\n\nconst Tooltip = ({\n continuous,\n index,\n isLastStep,\n step,\n backProps,\n primaryProps,\n skipProps,\n tooltipProps,\n size,\n locale,\n disableTourSkipOnEsc,\n}: TooltipRenderProps & { locale: TourTexts; disableTourSkipOnEsc?: boolean }) => {\n const skipButtonRef = React.useRef<HTMLButtonElement>(null);\n\n React.useEffect(() => {\n const onWindowKeyDown = (event: KeyboardEvent): void => {\n if (!disableTourSkipOnEsc) {\n if (event.keyCode === keycode('esc') && skipButtonRef.current !== null) {\n event.preventDefault();\n skipButtonRef.current.click();\n return;\n }\n }\n };\n\n window.addEventListener('keydown', onWindowKeyDown);\n\n return () => {\n window.removeEventListener('keydown', onWindowKeyDown);\n };\n }, []);\n\n return (\n <div {...tooltipProps} className=\"yt-tour__step w-88 relative rounded bg-white p-4\">\n <IconButton\n {...skipProps}\n ref={skipButtonRef}\n appearance=\"discrete\"\n icon=\"close\"\n title={locale.skip}\n aria-label={locale.skip}\n className=\"absolute top-0 right-0 mt-1 mr-1\"\n />\n {step.title && <h5>{step.title}</h5>}\n {step.content}\n <Group className=\"mt-4 justify-end\">\n {index > 0 && (\n <Button {...backProps} appearance=\"discrete\">\n {locale.back}\n </Button>\n )}\n <Button {...primaryProps} appearance=\"primary\">\n {continuous\n ? isLastStep\n ? `${locale.last} (${index + 1}/${size})`\n : `${locale.next} (${index + 1}/${size})`\n : locale.close}\n </Button>\n </Group>\n </div>\n );\n};\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nexport const TourStep = (_props: TourStepProps): null => null;\n\nexport type TourProps = {\n /** Controls if [Joyride](https://docs.react-joyride.com) is active */\n autoStart?: boolean;\n /** Children should be one or more `Tour.Step` components */\n children: any;\n /** Are there more than one steps and should you be able to navigate between them using `Next` and `Previous` buttons */\n continuous?: boolean;\n /** Disable closing of tour when click on `Escape` */\n disableCloseOnEsc?: boolean;\n /** Don't close the presenting popup of the tour step when clicking outside it */\n disableOverlayClose?: boolean;\n /** Allows user to interact with the presented components (mouse and touch events) when the popup is visible */\n disableScrolling?: boolean;\n /* When user clicks on the close icon button, which will close the tour and complete the flow */\n onClose?: (step: TourStepProps) => void;\n /* When user completes the entire flow */\n onComplete?: Function;\n /** When step is ready */\n onReady?: (step: TourStepProps) => void;\n /* Allow mouse and touch events through the spotlight */\n spotlightClicks?: boolean;\n /* Stops the injection of custom overflow styles on parent container. Can be used to prevent remaining overflow styles after tour is done. */\n disableScrollParentFix?: boolean;\n};\n\nexport const Tour = (props: TourProps) => {\n const {\n texts: { tour },\n } = useLocalization();\n\n const {\n autoStart: run,\n onComplete,\n onClose,\n onReady,\n spotlightClicks,\n disableCloseOnEsc: disableTourSkipOnEsc,\n disableScrollParentFix = false,\n ...rest\n } = props;\n\n const steps = React.useMemo(() => {\n return React.Children.map(props.children, child => {\n const step: Step = {\n disableBeacon: !child.props.showBeacon,\n target: child.props.selector,\n placement: child.props.position,\n title: child.props.title,\n content: child.props.children,\n };\n return step;\n });\n }, [props.children]);\n\n const getStep = React.useCallback(\n (selector: string | HTMLElement) => props.children.find((child: any) => child.props.selector === selector)?.props,\n [props.children]\n );\n\n function callback(state: CallBackProps) {\n if (state.action === ACTIONS.SKIP && state.lifecycle === LIFECYCLE.COMPLETE) {\n if (onClose) {\n onClose(getStep(state.step.target));\n }\n }\n\n if (state.type === EVENTS.TOUR_END) {\n if (onComplete) {\n onComplete();\n }\n }\n\n if (state.lifecycle === LIFECYCLE.READY) {\n if (onReady) {\n onReady(getStep(state.step.target));\n }\n }\n }\n\n return (\n <Joyride\n {...rest}\n run={run}\n steps={steps}\n showProgress\n floaterProps={{\n disableAnimation: true,\n }}\n tooltipComponent={tooltipProps => (\n <Tooltip {...tooltipProps} locale={tour} disableTourSkipOnEsc={disableTourSkipOnEsc} />\n )}\n locale={tour}\n spotlightPadding={8}\n spotlightClicks={spotlightClicks}\n disableScrollParentFix={disableScrollParentFix}\n callback={callback}\n styles={{\n /** style beacon */\n options: {\n // tailwind.theme.colors.blue.light\n primaryColor: '#6ba4ff',\n },\n }}\n disableCloseOnEsc\n />\n );\n};\n\nTour.Step = TourStep;\n"],"names":["Tooltip","continuous","index","isLastStep","step","backProps","primaryProps","skipProps","tooltipProps","size","locale","disableTourSkipOnEsc","skipButtonRef","React","onWindowKeyDown","event","keyCode","keycode","current","preventDefault","click","window","addEventListener","removeEventListener","className","IconButton","ref","appearance","icon","title","skip","content","Group","Button","back","last","next","close","TourStep","_props","Tour","props","useLocalization","tour","texts","run","autoStart","onComplete","onClose","onReady","spotlightClicks","disableCloseOnEsc","disableScrollParentFix","rest","steps","map","children","child","disableBeacon","showBeacon","target","selector","placement","position","getStep","find","callback","state","action","ACTIONS","SKIP","lifecycle","LIFECYCLE","COMPLETE","type","EVENTS","TOUR_END","READY","Joyride","showProgress","floaterProps","disableAnimation","tooltipComponent","spotlightPadding","styles","options","primaryColor","Step"],"mappings":"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"}
|
1
|
+
{"version":3,"file":"Tour.js","sources":["../../../../src/components/Tour/Tour.tsx"],"sourcesContent":["import keycode from 'keycode';\nimport * as React from 'react';\nimport Joyride, { Step, CallBackProps, ACTIONS, LIFECYCLE, Placement, EVENTS, TooltipRenderProps } from 'react-joyride';\n\nimport { Button } from '../Button/Button';\nimport { Group } from '../Group/Group';\nimport { IconButton } from '../IconButton/IconButton';\nimport { useLocalization } from '../Provider/Provider';\n\nexport type TourTexts = {\n /** Text for back action button */\n back: string;\n /**\n * Text for close button.\n * This button is displayed if tour is not continuous - replacing the `Next` button.\n * It will pause the flow of the tour and close the tooltip\n */\n close: string;\n /**\n * Aria-label and title for close icon button in each step.\n * This button skips and completes the flow entirely\n */\n skip: string;\n /**\n * Text for last action button.\n * This button is displayed when user is on the last step of the tour\n */\n last: string;\n /**\n * Text for next action button.\n * This button is displayed if tour has more than one steps and is continuous\n */\n next: string;\n /** Aria label and title for beacon that will open the tour step */\n open: string;\n};\n\nexport type TourStepProps = {\n /** Content can be any valid react node, for e.g. a `div` */\n children: React.ReactNode;\n /** Define the position of the tour's popup relative to the element is presenting */\n position?: Placement;\n /** The css selector of the html element you want to include in a tour */\n selector: string;\n /**\n * Show beacon for step.\n * A beacon is a styled component which indicates the current element to be presented.\n * For more informations about how to create a beacon, read [Joyride](https://docs.react-joyride.com) docs\n */\n showBeacon?: boolean;\n /** Text displayed above the children/content of the popup */\n title: string;\n};\n\nconst Tooltip = ({\n continuous,\n index,\n isLastStep,\n step,\n backProps,\n primaryProps,\n skipProps,\n tooltipProps,\n size,\n locale,\n disableTourSkipOnEsc,\n}: TooltipRenderProps & { locale: TourTexts; disableTourSkipOnEsc?: boolean }) => {\n const skipButtonRef = React.useRef<HTMLButtonElement>(null);\n\n React.useEffect(() => {\n const onWindowKeyDown = (event: KeyboardEvent): void => {\n if (!disableTourSkipOnEsc) {\n if (event.keyCode === keycode('esc') && skipButtonRef.current !== null) {\n event.preventDefault();\n skipButtonRef.current.click();\n return;\n }\n }\n };\n\n window.addEventListener('keydown', onWindowKeyDown);\n\n return () => {\n window.removeEventListener('keydown', onWindowKeyDown);\n };\n }, []);\n\n return (\n <div {...tooltipProps} className=\"yt-tour__step w-88 relative rounded bg-white p-4\">\n <IconButton\n {...skipProps}\n ref={skipButtonRef}\n appearance=\"discrete\"\n icon=\"close\"\n title={locale.skip}\n aria-label={locale.skip}\n className=\"absolute top-0 right-0 mt-1 mr-1\"\n />\n {step.title && <h5>{step.title}</h5>}\n {step.content}\n <Group className=\"mt-4 justify-end\">\n {index > 0 && (\n <Button {...backProps} appearance=\"discrete\">\n {locale.back}\n </Button>\n )}\n <Button {...primaryProps} appearance=\"primary\">\n {continuous\n ? isLastStep\n ? `${locale.last} (${index + 1}/${size})`\n : `${locale.next} (${index + 1}/${size})`\n : locale.close}\n </Button>\n </Group>\n </div>\n );\n};\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nexport const TourStep = (_props: TourStepProps): null => null;\n\nexport type TourProps = {\n /** Controls if [Joyride](https://docs.react-joyride.com) is active */\n autoStart?: boolean;\n /** Children should be one or more `Tour.Step` components */\n children: any;\n /** Are there more than one steps and should you be able to navigate between them using `Next` and `Previous` buttons */\n continuous?: boolean;\n /** Disable closing of tour when click on `Escape` */\n disableCloseOnEsc?: boolean;\n /** Don't close the presenting popup of the tour step when clicking outside it */\n disableOverlayClose?: boolean;\n /** Allows user to interact with the presented components (mouse and touch events) when the popup is visible */\n disableScrolling?: boolean;\n /* When user clicks on the close icon button, which will close the tour and complete the flow */\n onClose?: (step: TourStepProps) => void;\n /* When user completes the entire flow */\n onComplete?: Function;\n /** When step is ready */\n onReady?: (step: TourStepProps) => void;\n /* Allow mouse and touch events through the spotlight */\n spotlightClicks?: boolean;\n /* Stops the injection of custom overflow styles on parent container. Can be used to prevent remaining overflow styles after tour is done. */\n disableScrollParentFix?: boolean;\n /** The scroll distance from the element scrollTop value. */\n scrollOffset?: number;\n};\n\nexport const Tour = (props: TourProps) => {\n const {\n texts: { tour },\n } = useLocalization();\n\n const {\n autoStart: run,\n onComplete,\n onClose,\n onReady,\n spotlightClicks,\n disableCloseOnEsc: disableTourSkipOnEsc,\n disableScrollParentFix = false,\n scrollOffset,\n ...rest\n } = props;\n\n const steps = React.useMemo(() => {\n return React.Children.map(props.children, child => {\n const step: Step = {\n disableBeacon: !child.props.showBeacon,\n target: child.props.selector,\n placement: child.props.position,\n title: child.props.title,\n content: child.props.children,\n };\n return step;\n });\n }, [props.children]);\n\n const getStep = React.useCallback(\n (selector: string | HTMLElement) => props.children.find((child: any) => child.props.selector === selector)?.props,\n [props.children]\n );\n\n function callback(state: CallBackProps) {\n if (state.action === ACTIONS.SKIP && state.lifecycle === LIFECYCLE.COMPLETE) {\n if (onClose) {\n onClose(getStep(state.step.target));\n }\n }\n\n if (state.type === EVENTS.TOUR_END) {\n if (onComplete) {\n onComplete();\n }\n }\n\n if (state.lifecycle === LIFECYCLE.READY) {\n if (onReady) {\n onReady(getStep(state.step.target));\n }\n }\n }\n\n return (\n <Joyride\n {...rest}\n run={run}\n steps={steps}\n showProgress\n floaterProps={{\n disableAnimation: true,\n }}\n tooltipComponent={tooltipProps => (\n <Tooltip {...tooltipProps} locale={tour} disableTourSkipOnEsc={disableTourSkipOnEsc} />\n )}\n locale={tour}\n spotlightPadding={8}\n spotlightClicks={spotlightClicks}\n disableScrollParentFix={disableScrollParentFix}\n callback={callback}\n scrollOffset={scrollOffset}\n styles={{\n /** style beacon */\n options: {\n // tailwind.theme.colors.blue.light\n primaryColor: '#6ba4ff',\n },\n }}\n disableCloseOnEsc\n />\n );\n};\n\nTour.Step = TourStep;\n"],"names":["Tooltip","continuous","index","isLastStep","step","backProps","primaryProps","skipProps","tooltipProps","size","locale","disableTourSkipOnEsc","skipButtonRef","React","onWindowKeyDown","event","keyCode","keycode","current","preventDefault","click","window","addEventListener","removeEventListener","className","IconButton","ref","appearance","icon","title","skip","content","Group","Button","back","last","next","close","TourStep","_props","Tour","props","useLocalization","tour","texts","run","autoStart","onComplete","onClose","onReady","spotlightClicks","disableCloseOnEsc","disableScrollParentFix","scrollOffset","rest","steps","map","children","child","disableBeacon","showBeacon","target","selector","placement","position","getStep","find","callback","state","action","ACTIONS","SKIP","lifecycle","LIFECYCLE","COMPLETE","type","EVENTS","TOUR_END","READY","Joyride","showProgress","floaterProps","disableAnimation","tooltipComponent","spotlightPadding","styles","options","primaryColor","Step"],"mappings":"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"}
|