@mirai/ui 1.0.182 → 1.0.184
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 +3 -0
- package/build/components/Button/Button.js +5 -2
- package/build/components/Button/Button.js.map +1 -1
- package/build/components/Table/Table.Row.js +2 -2
- package/build/components/Table/Table.Row.js.map +1 -1
- package/build/components/Table/Table.js +6 -6
- package/build/components/Table/Table.js.map +1 -1
- package/build/components/Table/Table.module.css +7 -1
- package/build/components/Table/Table.stories.js +90 -47
- package/build/components/Table/Table.stories.js.map +1 -1
- package/build/components/Table/Table.stories.module.css +5 -1
- package/build/components/Table/__tests__/__snapshots__/Table.test.js.snap +4804 -4772
- package/build/components/Table/helpers/index.js +11 -0
- package/build/components/Table/helpers/index.js.map +1 -1
- package/build/components/Table/helpers/isChecked.js +33 -0
- package/build/components/Table/helpers/isChecked.js.map +1 -0
- package/build/primitives/Layer/Layer.js +4 -2
- package/build/primitives/Layer/Layer.js.map +1 -1
- package/build/primitives/Layer/Layer.module.css +8 -1
- package/build/primitives/Layer/Layer.stories.js +1 -0
- package/build/primitives/Layer/Layer.stories.js.map +1 -1
- package/build/primitives/Layer/__tests__/__snapshots__/Layer.test.js.snap +22 -0
- package/build/theme/default.theme.css +1 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -107,6 +107,7 @@ This primitive returns an element that displays with relative position to other
|
|
|
107
107
|
- `bottom:bool` if you want open the content below the reference component.
|
|
108
108
|
- `centered:bool` if you want center the content using screen as parent.
|
|
109
109
|
- `children:node` two children elements are accepted, the first one is the element to be displayed and the second one is the LayerContent that wraps the element to be displayed if the visible prop is true
|
|
110
|
+
- `fixed:bool` if you want use a fixed position instead of an absolute one, by default is `false`.
|
|
110
111
|
- `forceRender:bool` if you want render content children even if `visible` is _falsy_, by default is `true`.
|
|
111
112
|
- `left:bool` if you want open the content on the left of the reference component.
|
|
112
113
|
- `right:bool` if you want open the content on the right of the reference component.
|
|
@@ -141,6 +142,7 @@ const MyComponent = () => {
|
|
|
141
142
|
```css
|
|
142
143
|
--mirai-ui-layer-content: var(--mirai-ui-layer-XL);
|
|
143
144
|
/* position (z-index) */
|
|
145
|
+
--mirai-ui-layer-XS: -1;
|
|
144
146
|
--mirai-ui-layer-S: 0;
|
|
145
147
|
--mirai-ui-layer-M: 1;
|
|
146
148
|
--mirai-ui-layer-L: 10;
|
|
@@ -410,6 +412,7 @@ A button component that receives the following props:
|
|
|
410
412
|
- `busy:bool` if `true` will disable button and give feedback as something is processing.
|
|
411
413
|
- `children:node|string`
|
|
412
414
|
- `disabled:boolean` applying 'disabled' attribute
|
|
415
|
+
- `fixed:bool` if you want use a fixed position for your tooltip, by default is `false`.
|
|
413
416
|
- `large:boolean` modifying the button size
|
|
414
417
|
- `secondary:boolean` modifying the button appearance using a secondary _variant_.
|
|
415
418
|
- `rounded:boolean` if true will use the theme border-radius variable for round the corners
|
|
@@ -11,7 +11,7 @@ var _helpers = require("../../helpers");
|
|
|
11
11
|
var _primitives = require("../../primitives");
|
|
12
12
|
var _Tooltip = require("../Tooltip");
|
|
13
13
|
var _ButtonModule = _interopRequireDefault(require("./Button.module.css"));
|
|
14
|
-
var _excluded = ["busy", "children", "disabled", "large", "rounded", "secondary", "small", "squared", "tag", "transparent", "tooltip", "wide", "onPress"];
|
|
14
|
+
var _excluded = ["busy", "children", "disabled", "fixed", "large", "rounded", "secondary", "small", "squared", "tag", "transparent", "tooltip", "wide", "onPress"];
|
|
15
15
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
16
16
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
17
17
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
@@ -24,6 +24,7 @@ var Button = function Button(_ref) {
|
|
|
24
24
|
var busy = _ref.busy,
|
|
25
25
|
children = _ref.children,
|
|
26
26
|
disabled = _ref.disabled,
|
|
27
|
+
fixed = _ref.fixed,
|
|
27
28
|
large = _ref.large,
|
|
28
29
|
rounded = _ref.rounded,
|
|
29
30
|
secondary = _ref.secondary,
|
|
@@ -39,7 +40,8 @@ var Button = function Button(_ref) {
|
|
|
39
40
|
onPress = _ref.onPress,
|
|
40
41
|
others = _objectWithoutProperties(_ref, _excluded);
|
|
41
42
|
return /*#__PURE__*/_react.default.createElement(tooltip ? _Tooltip.Tooltip : _react.default.Fragment, tooltip ? {
|
|
42
|
-
text: tooltip
|
|
43
|
+
text: tooltip,
|
|
44
|
+
fixed: fixed
|
|
43
45
|
} : undefined, /*#__PURE__*/_react.default.createElement(_primitives.Pressable, _objectSpread(_objectSpread({}, others), {}, {
|
|
44
46
|
disabled: disabled || busy,
|
|
45
47
|
role: others.role || 'button',
|
|
@@ -61,6 +63,7 @@ Button.propTypes = {
|
|
|
61
63
|
busy: _propTypes.default.bool,
|
|
62
64
|
children: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.node]),
|
|
63
65
|
disabled: _propTypes.default.bool,
|
|
66
|
+
fixed: _propTypes.default.bool,
|
|
64
67
|
large: _propTypes.default.bool,
|
|
65
68
|
rounded: _propTypes.default.bool,
|
|
66
69
|
secondary: _propTypes.default.bool,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","names":["Button","busy","children","disabled","large","rounded","secondary","small","squared","tag","transparent","tooltip","wide","onPress","others","React","createElement","Tooltip","Fragment","text","undefined","Pressable","role","className","styles","style","button","busyContainer","active","spinner","displayName","propTypes","PropTypes","bool","oneOfType","string","node","onEnter","func","onLeave"],"sources":["../../../src/components/Button/Button.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../helpers';\nimport { Pressable, View } from '../../primitives';\nimport { Tooltip } from '../Tooltip';\nimport style from './Button.module.css';\n\nconst Button = ({\n busy,\n children,\n disabled,\n large,\n rounded,\n secondary,\n small,\n squared = false,\n tag = 'button',\n transparent = false,\n tooltip,\n wide,\n onPress,\n ...others\n}) =>\n React.createElement(\n tooltip ? Tooltip : React.Fragment,\n tooltip ? { text: tooltip } : undefined,\n React.createElement(\n Pressable,\n {\n ...others,\n disabled: disabled || busy,\n role: others.role || 'button',\n tag,\n onPress,\n className: styles(\n style.button,\n busy && !disabled && style.busy,\n large && style.large,\n small && style.small,\n rounded && style.rounded,\n squared && style.squared,\n secondary && !transparent && !disabled && style.secondary,\n transparent && style.transparent,\n (disabled || busy) && style.disabled,\n wide && style.wide,\n others.className,\n ),\n },\n busy === undefined ? (\n children\n ) : (\n <>\n <View className={styles(style.busyContainer, busy && style.active)}>\n <View className={style.spinner} />\n </View>\n <View row className={style.children}>\n {children}\n </View>\n </>\n ),\n ),\n );\n\nButton.displayName = 'Component:Button';\n\nButton.propTypes = {\n busy: PropTypes.bool,\n children: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n disabled: PropTypes.bool,\n large: PropTypes.bool,\n rounded: PropTypes.bool,\n secondary: PropTypes.bool,\n small: PropTypes.bool,\n squared: PropTypes.bool,\n tag: PropTypes.string,\n tooltip: PropTypes.string,\n transparent: PropTypes.bool,\n wide: PropTypes.bool,\n onEnter: PropTypes.func,\n onLeave: PropTypes.func,\n onPress: PropTypes.func,\n};\n\nexport { Button };\n"],"mappings":";;;;;;;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAwC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAExC,IAAMA,MAAM,GAAG,SAATA,MAAM;EAAA,IACVC,IAAI,QAAJA,IAAI;IACJC,QAAQ,QAARA,QAAQ;IACRC,QAAQ,QAARA,QAAQ;IACRC,KAAK,QAALA,KAAK;IACLC,OAAO,QAAPA,OAAO;IACPC,SAAS,QAATA,SAAS;IACTC,KAAK,QAALA,KAAK;IAAA,oBACLC,OAAO;IAAPA,OAAO,6BAAG,KAAK;IAAA,gBACfC,GAAG;IAAHA,GAAG,yBAAG,QAAQ;IAAA,wBACdC,WAAW;IAAXA,WAAW,iCAAG,KAAK;IACnBC,OAAO,QAAPA,OAAO;IACPC,IAAI,QAAJA,IAAI;IACJC,OAAO,QAAPA,OAAO;IACJC,MAAM;EAAA,oBAETC,cAAK,CAACC,aAAa,CACjBL,OAAO,GAAGM,gBAAO,GAAGF,cAAK,CAACG,QAAQ,EAClCP,OAAO,GAAG;IAAEQ,IAAI,EAAER;
|
|
1
|
+
{"version":3,"file":"Button.js","names":["Button","busy","children","disabled","fixed","large","rounded","secondary","small","squared","tag","transparent","tooltip","wide","onPress","others","React","createElement","Tooltip","Fragment","text","undefined","Pressable","role","className","styles","style","button","busyContainer","active","spinner","displayName","propTypes","PropTypes","bool","oneOfType","string","node","onEnter","func","onLeave"],"sources":["../../../src/components/Button/Button.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../helpers';\nimport { Pressable, View } from '../../primitives';\nimport { Tooltip } from '../Tooltip';\nimport style from './Button.module.css';\n\nconst Button = ({\n busy,\n children,\n disabled,\n fixed,\n large,\n rounded,\n secondary,\n small,\n squared = false,\n tag = 'button',\n transparent = false,\n tooltip,\n wide,\n onPress,\n ...others\n}) =>\n React.createElement(\n tooltip ? Tooltip : React.Fragment,\n tooltip ? { text: tooltip, fixed } : undefined,\n React.createElement(\n Pressable,\n {\n ...others,\n disabled: disabled || busy,\n role: others.role || 'button',\n tag,\n onPress,\n className: styles(\n style.button,\n busy && !disabled && style.busy,\n large && style.large,\n small && style.small,\n rounded && style.rounded,\n squared && style.squared,\n secondary && !transparent && !disabled && style.secondary,\n transparent && style.transparent,\n (disabled || busy) && style.disabled,\n wide && style.wide,\n others.className,\n ),\n },\n busy === undefined ? (\n children\n ) : (\n <>\n <View className={styles(style.busyContainer, busy && style.active)}>\n <View className={style.spinner} />\n </View>\n <View row className={style.children}>\n {children}\n </View>\n </>\n ),\n ),\n );\n\nButton.displayName = 'Component:Button';\n\nButton.propTypes = {\n busy: PropTypes.bool,\n children: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n disabled: PropTypes.bool,\n fixed: PropTypes.bool,\n large: PropTypes.bool,\n rounded: PropTypes.bool,\n secondary: PropTypes.bool,\n small: PropTypes.bool,\n squared: PropTypes.bool,\n tag: PropTypes.string,\n tooltip: PropTypes.string,\n transparent: PropTypes.bool,\n wide: PropTypes.bool,\n onEnter: PropTypes.func,\n onLeave: PropTypes.func,\n onPress: PropTypes.func,\n};\n\nexport { Button };\n"],"mappings":"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"}
|
|
@@ -51,7 +51,7 @@ var Row = function Row(_ref) {
|
|
|
51
51
|
_event$target = _event$target === void 0 ? {} : _event$target;
|
|
52
52
|
var type = _event$target.type;
|
|
53
53
|
if (CUSTOM_EVENT_TYPES.includes(type)) return;
|
|
54
|
-
isHead ? onSort(field) : onPress
|
|
54
|
+
isHead ? onSort(field) : onPress ? onPress(dataSource, event) : undefined;
|
|
55
55
|
};
|
|
56
56
|
var handleFocus = function handleFocus(field) {
|
|
57
57
|
setFocus(field);
|
|
@@ -83,7 +83,7 @@ var Row = function Row(_ref) {
|
|
|
83
83
|
},
|
|
84
84
|
className: _TableModule.default.checkbox,
|
|
85
85
|
testId: testId ? "".concat(testId, "-checkbox") : undefined
|
|
86
|
-
}), isHead ? schema[field].label : dataSource[field], isHead && onSort && /*#__PURE__*/_react.default.createElement(_primitives.View, {
|
|
86
|
+
}), isHead ? schema[field].label : dataSource[field], isHead && (onSort || onFilter) && /*#__PURE__*/_react.default.createElement(_primitives.View, {
|
|
87
87
|
row: true,
|
|
88
88
|
className: _TableModule.default.icons
|
|
89
89
|
}, onSort && /*#__PURE__*/_react.default.createElement(_primitives.Icon, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Table.Row.js","names":["CUSTOM_EVENT_TYPES","Row","checked","dataSource","indeterminate","l10n","schema","sort","onFilter","onPress","onSelect","onSort","others","useState","focus","setFocus","isHead","undefined","testId","handlePress","field","event","target","type","includes","handleFocus","styles","style","selected","Object","keys","filter","map","index","React","createElement","Primitive","tag","key","onClick","column","selectable","checkbox","label","icons","ICON","UP","DOWN","icon","disabled","displayName","propTypes","PropTypes","bool","shape","L10N_SHAPE","isRequired","func"],"sources":["../../../src/components/Table/Table.Row.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React, { useState } from 'react';\n\nimport { styles } from '../../helpers';\nimport { Icon, ICON, Primitive, View } from '../../primitives';\nimport { InputOption } from '../InputOption';\nimport { ColumnFilter } from './Table.ColumnFilter';\nimport { L10N_SHAPE } from './Table.constants';\nimport style from './Table.module.css';\n\nconst CUSTOM_EVENT_TYPES = ['button', 'checkbox', 'input', 'radio', 'submit'];\n\nconst Row = ({\n checked,\n dataSource,\n indeterminate,\n l10n,\n schema,\n sort = {},\n onFilter,\n onPress,\n onSelect,\n onSort,\n ...others\n}) => {\n const [focus, setFocus] = useState();\n\n const isHead = dataSource === undefined;\n const { testId } = others;\n\n const handlePress = (field, event) => {\n const { target: { type } = {} } = event;\n if (CUSTOM_EVENT_TYPES.includes(type)) return;\n\n isHead ? onSort(field) : onPress
|
|
1
|
+
{"version":3,"file":"Table.Row.js","names":["CUSTOM_EVENT_TYPES","Row","checked","dataSource","indeterminate","l10n","schema","sort","onFilter","onPress","onSelect","onSort","others","useState","focus","setFocus","isHead","undefined","testId","handlePress","field","event","target","type","includes","handleFocus","styles","style","selected","Object","keys","filter","map","index","React","createElement","Primitive","tag","key","onClick","column","selectable","checkbox","label","icons","ICON","UP","DOWN","icon","disabled","displayName","propTypes","PropTypes","bool","shape","L10N_SHAPE","isRequired","func"],"sources":["../../../src/components/Table/Table.Row.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React, { useState } from 'react';\n\nimport { styles } from '../../helpers';\nimport { Icon, ICON, Primitive, View } from '../../primitives';\nimport { InputOption } from '../InputOption';\nimport { ColumnFilter } from './Table.ColumnFilter';\nimport { L10N_SHAPE } from './Table.constants';\nimport style from './Table.module.css';\n\nconst CUSTOM_EVENT_TYPES = ['button', 'checkbox', 'input', 'radio', 'submit'];\n\nconst Row = ({\n checked,\n dataSource,\n indeterminate,\n l10n,\n schema,\n sort = {},\n onFilter,\n onPress,\n onSelect,\n onSort,\n ...others\n}) => {\n const [focus, setFocus] = useState();\n\n const isHead = dataSource === undefined;\n const { testId } = others;\n\n const handlePress = (field, event) => {\n const { target: { type } = {} } = event;\n if (CUSTOM_EVENT_TYPES.includes(type)) return;\n\n isHead ? onSort(field) : onPress ? onPress(dataSource, event) : undefined;\n };\n\n const handleFocus = (field) => {\n setFocus(field);\n };\n\n return (\n <Primitive tag=\"tr\" {...others} className={styles(checked && style.selected, onPress && style.onPress)}>\n {Object.keys(schema)\n .filter((field) => schema[field].type !== 'hidden')\n .map((field, index) =>\n React.createElement(\n Primitive,\n {\n tag: isHead ? 'th' : 'td',\n testId: testId ? `${testId}-${field}` : undefined,\n key: field,\n onClick: (event) => handlePress(field, event),\n },\n <View\n forceRow\n tag=\"span\"\n className={styles(\n style.column,\n onSelect && index === 0 && style.selectable,\n !isHead && !(onSelect && index === 0) && style[schema[field].type || 'text'],\n )}\n >\n {onSelect && index === 0 && (\n <InputOption\n checked={checked}\n indeterminate={indeterminate}\n name=\"checkbox\"\n onChange={(event) => onSelect(dataSource, event)}\n className={style.checkbox}\n testId={testId ? `${testId}-checkbox` : undefined}\n />\n )}\n\n {isHead ? schema[field].label : dataSource[field]}\n\n {isHead && (onSort || onFilter) && (\n <View row className={style.icons}>\n {onSort && (\n <Icon\n value={sort[field] === false ? ICON.UP : ICON.DOWN}\n className={styles(style.icon, sort[field] === undefined && style.disabled)}\n />\n )}\n {onFilter && (\n <ColumnFilter\n field={field}\n l10n={l10n}\n schema={schema[field]}\n visible={field === focus}\n onFocus={handleFocus}\n onSubmit={onFilter}\n />\n )}\n </View>\n )}\n </View>,\n ),\n )}\n </Primitive>\n );\n};\n\nRow.displayName = 'Component:Table:Row';\n\nRow.propTypes = {\n checked: PropTypes.bool,\n dataSource: PropTypes.shape({}),\n indeterminate: PropTypes.bool,\n l10n: L10N_SHAPE,\n schema: PropTypes.shape({}).isRequired,\n sort: PropTypes.shape({}),\n onFilter: PropTypes.func,\n onPress: PropTypes.func,\n onSelect: PropTypes.func,\n onSort: PropTypes.func,\n};\n\nexport { Row };\n"],"mappings":"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"}
|
|
@@ -107,11 +107,13 @@ var Table = function Table(_ref) {
|
|
|
107
107
|
setSort(sort[field] === undefined ? _defineProperty({}, field, true) : sort[field] ? _defineProperty({}, field, false) : {});
|
|
108
108
|
};
|
|
109
109
|
var testId = others.testId;
|
|
110
|
-
return /*#__PURE__*/_react.default.createElement(onScroll ? _primitives.ScrollView :
|
|
110
|
+
return /*#__PURE__*/_react.default.createElement(onScroll ? _primitives.ScrollView : _primitives.View, onScroll || !inline ? _objectSpread(_objectSpread({}, others), {}, {
|
|
111
111
|
role: others.role || 'table',
|
|
112
112
|
onScroll: onScroll,
|
|
113
113
|
className: (0, _helpers.styles)(!inline && _TableModule.default.outlined, others.className)
|
|
114
|
-
}) :
|
|
114
|
+
}) : {
|
|
115
|
+
className: others.className
|
|
116
|
+
}, /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (filter === null || filter === void 0 ? void 0 : filter.length) > 0 && /*#__PURE__*/_react.default.createElement(_Table2.Filter, {
|
|
115
117
|
filter: filter,
|
|
116
118
|
schema: schema,
|
|
117
119
|
role: "table-filter",
|
|
@@ -126,7 +128,7 @@ var Table = function Table(_ref) {
|
|
|
126
128
|
}), /*#__PURE__*/_react.default.createElement(_primitives.Primitive, {
|
|
127
129
|
tag: "thead"
|
|
128
130
|
}, /*#__PURE__*/_react.default.createElement(_Table3.Row, {
|
|
129
|
-
checked: selected.length === dataSource.length,
|
|
131
|
+
checked: dataSource.length > 0 ? selected.length === dataSource.length : undefined,
|
|
130
132
|
indeterminate: selected.length > 0,
|
|
131
133
|
l10n: l10n,
|
|
132
134
|
schema: schema,
|
|
@@ -147,9 +149,7 @@ var Table = function Table(_ref) {
|
|
|
147
149
|
});
|
|
148
150
|
}, [dataSource, filter, schema, search, sort]).map(function (row, index) {
|
|
149
151
|
return /*#__PURE__*/_react.default.createElement(_Table3.Row, {
|
|
150
|
-
checked:
|
|
151
|
-
return JSON.stringify(item) === JSON.stringify(row);
|
|
152
|
-
}),
|
|
152
|
+
checked: (0, _helpers2.isChecked)(row, selected),
|
|
153
153
|
dataSource: row,
|
|
154
154
|
key: index,
|
|
155
155
|
schema: schema,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Table.js","names":["Table","dataSource","filter","propFilter","inline","l10n","schema","search","selected","propSelected","store","onPress","onScroll","onSelect","others","useState","setFilter","setSelected","sort","setSort","useEffect","nextFilter","storeFilter","Storage","get","length","set","handleAddFilter","item","handleRemoveFilter","index","splice","handleHeadSelect","row","event","next","handleSelect","exists","includes","push","handleSort","field","undefined","testId","React","createElement","ScrollView","View","Fragment","role","className","styles","style","outlined","table","useMemo","select","map","find","JSON","stringify","displayName","propTypes","PropTypes","arrayOf","shape","bool","L10N_SHAPE","isRequired","string","func"],"sources":["../../../src/components/Table/Table.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React, { Fragment, useEffect, useMemo, useState } from 'react';\n\nimport { styles } from '../../helpers';\nimport { Primitive, ScrollView, View } from '../../primitives';\nimport { select, Storage } from './helpers';\nimport { L10N_SHAPE } from './Table.constants';\nimport { Filter } from './Table.Filter';\nimport style from './Table.module.css';\nimport { Row } from './Table.Row';\n\nexport const Table = ({\n dataSource = [],\n filter: propFilter = [],\n inline = true,\n l10n,\n schema,\n search,\n selected: propSelected = [],\n store,\n onPress,\n onScroll,\n onSelect,\n ...others\n}) => {\n const [filter, setFilter] = useState([]);\n const [selected, setSelected] = useState(propSelected);\n const [sort, setSort] = useState({});\n\n useEffect(() => {\n let nextFilter = propFilter;\n if (store) {\n const storeFilter = Storage.get(`${store}:filter`);\n if (storeFilter?.length) nextFilter = storeFilter;\n }\n\n setFilter(nextFilter);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n useEffect(() => {\n if (!store) return;\n Storage.set(`${store}:filter`, filter);\n }, [filter, store]);\n\n const handleAddFilter = (item) => {\n setFilter([...filter, item]);\n };\n\n const handleRemoveFilter = (index) => {\n filter?.splice(index, 1);\n setFilter([...filter]);\n };\n\n const handleHeadSelect = (row, event) => {\n setSelected(() => {\n const next = selected.length !== dataSource.length ? dataSource : [];\n onSelect(next, event);\n\n return next;\n });\n };\n\n const handleSelect = (row, event) => {\n setSelected(() => {\n const exists = selected.includes(row);\n const next = selected.filter((item) => item !== row);\n if (!exists) next.push(row);\n onSelect(next, event);\n\n return next;\n });\n };\n\n const handleSort = (field) => {\n setSort(sort[field] === undefined ? { [field]: true } : sort[field] ? { [field]: false } : {});\n };\n\n const { testId } = others;\n\n return React.createElement(\n onScroll ? ScrollView : !inline ? View : Fragment,\n onScroll || !inline\n ? {\n ...others,\n role: others.role || 'table',\n onScroll,\n className: styles(!inline && style.outlined, others.className),\n }\n : undefined,\n <>\n {filter?.length > 0 && (\n <Filter filter={filter} schema={schema} role=\"table-filter\" onRemove={(index) => handleRemoveFilter(index)} />\n )}\n <Primitive\n role=\"table\"\n tag=\"table\"\n {...(!onScroll ? others : undefined)}\n className={styles(style.table, !onScroll && !inline && others.className)}\n >\n <Primitive tag=\"thead\">\n <Row\n checked={selected.length === dataSource.length}\n indeterminate={selected.length > 0}\n l10n={l10n}\n schema={schema}\n sort={sort}\n onFilter={handleAddFilter}\n onSelect={onSelect ? handleHeadSelect : undefined}\n onSort={handleSort}\n testId={testId ? `${testId}-head` : undefined}\n />\n </Primitive>\n <Primitive tag=\"tbody\">\n {useMemo(\n () => select({ dataSource, filter, schema, search, sort }),\n [dataSource, filter, schema, search, sort],\n ).map((row, index) => (\n <Row\n checked={!!selected.find((item) => JSON.stringify(item) === JSON.stringify(row))}\n dataSource={row}\n key={index}\n schema={schema}\n onPress={onPress}\n onSelect={onSelect ? handleSelect : undefined}\n testId={testId ? `${testId}-${index}` : undefined}\n />\n ))}\n </Primitive>\n </Primitive>\n </>,\n );\n};\n\nTable.displayName = 'Component:Table';\n\nTable.propTypes = {\n dataSource: PropTypes.arrayOf(PropTypes.shape({})),\n filter: PropTypes.arrayOf(PropTypes.shape({})),\n inline: PropTypes.bool,\n l10n: L10N_SHAPE,\n schema: PropTypes.shape({}).isRequired,\n search: PropTypes.string,\n store: PropTypes.string,\n selected: PropTypes.arrayOf(PropTypes.shape()),\n onPress: PropTypes.func,\n onScroll: PropTypes.func,\n onSelect: PropTypes.func,\n};\n"],"mappings":";;;;;;;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAkC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAE3B,IAAMA,KAAK,GAAG,SAARA,KAAK,OAaZ;EAAA,2BAZJC,UAAU;IAAVA,UAAU,gCAAG,EAAE;IAAA,mBACfC,MAAM;IAAEC,UAAU,4BAAG,EAAE;IAAA,mBACvBC,MAAM;IAANA,MAAM,4BAAG,IAAI;IACbC,IAAI,QAAJA,IAAI;IACJC,MAAM,QAANA,MAAM;IACNC,MAAM,QAANA,MAAM;IAAA,qBACNC,QAAQ;IAAEC,YAAY,8BAAG,EAAE;IAC3BC,KAAK,QAALA,KAAK;IACLC,OAAO,QAAPA,OAAO;IACPC,QAAQ,QAARA,QAAQ;IACRC,QAAQ,QAARA,QAAQ;IACLC,MAAM;EAET,gBAA4B,IAAAC,eAAQ,EAAC,EAAE,CAAC;IAAA;IAAjCb,MAAM;IAAEc,SAAS;EACxB,iBAAgC,IAAAD,eAAQ,EAACN,YAAY,CAAC;IAAA;IAA/CD,QAAQ;IAAES,WAAW;EAC5B,iBAAwB,IAAAF,eAAQ,EAAC,CAAC,CAAC,CAAC;IAAA;IAA7BG,IAAI;IAAEC,OAAO;EAEpB,IAAAC,gBAAS,EAAC,YAAM;IACd,IAAIC,UAAU,GAAGlB,UAAU;IAC3B,IAAIO,KAAK,EAAE;MACT,IAAMY,WAAW,GAAGC,iBAAO,CAACC,GAAG,WAAId,KAAK,aAAU;MAClD,IAAIY,WAAW,aAAXA,WAAW,eAAXA,WAAW,CAAEG,MAAM,EAAEJ,UAAU,GAAGC,WAAW;IACnD;IAEAN,SAAS,CAACK,UAAU,CAAC;IACrB;EACF,CAAC,EAAE,EAAE,CAAC;EAEN,IAAAD,gBAAS,EAAC,YAAM;IACd,IAAI,CAACV,KAAK,EAAE;IACZa,iBAAO,CAACG,GAAG,WAAIhB,KAAK,cAAWR,MAAM,CAAC;EACxC,CAAC,EAAE,CAACA,MAAM,EAAEQ,KAAK,CAAC,CAAC;EAEnB,IAAMiB,eAAe,GAAG,SAAlBA,eAAe,CAAIC,IAAI,EAAK;IAChCZ,SAAS,8BAAKd,MAAM,IAAE0B,IAAI,GAAE;EAC9B,CAAC;EAED,IAAMC,kBAAkB,GAAG,SAArBA,kBAAkB,CAAIC,KAAK,EAAK;IACpC5B,MAAM,aAANA,MAAM,uBAANA,MAAM,CAAE6B,MAAM,CAACD,KAAK,EAAE,CAAC,CAAC;IACxBd,SAAS,oBAAKd,MAAM,EAAE;EACxB,CAAC;EAED,IAAM8B,gBAAgB,GAAG,SAAnBA,gBAAgB,CAAIC,GAAG,EAAEC,KAAK,EAAK;IACvCjB,WAAW,CAAC,YAAM;MAChB,IAAMkB,IAAI,GAAG3B,QAAQ,CAACiB,MAAM,KAAKxB,UAAU,CAACwB,MAAM,GAAGxB,UAAU,GAAG,EAAE;MACpEY,QAAQ,CAACsB,IAAI,EAAED,KAAK,CAAC;MAErB,OAAOC,IAAI;IACb,CAAC,CAAC;EACJ,CAAC;EAED,IAAMC,YAAY,GAAG,SAAfA,YAAY,CAAIH,GAAG,EAAEC,KAAK,EAAK;IACnCjB,WAAW,CAAC,YAAM;MAChB,IAAMoB,MAAM,GAAG7B,QAAQ,CAAC8B,QAAQ,CAACL,GAAG,CAAC;MACrC,IAAME,IAAI,GAAG3B,QAAQ,CAACN,MAAM,CAAC,UAAC0B,IAAI;QAAA,OAAKA,IAAI,KAAKK,GAAG;MAAA,EAAC;MACpD,IAAI,CAACI,MAAM,EAAEF,IAAI,CAACI,IAAI,CAACN,GAAG,CAAC;MAC3BpB,QAAQ,CAACsB,IAAI,EAAED,KAAK,CAAC;MAErB,OAAOC,IAAI;IACb,CAAC,CAAC;EACJ,CAAC;EAED,IAAMK,UAAU,GAAG,SAAbA,UAAU,CAAIC,KAAK,EAAK;IAC5BtB,OAAO,CAACD,IAAI,CAACuB,KAAK,CAAC,KAAKC,SAAS,uBAAMD,KAAK,EAAG,IAAI,IAAKvB,IAAI,CAACuB,KAAK,CAAC,uBAAMA,KAAK,EAAG,KAAK,IAAK,CAAC,CAAC,CAAC;EAChG,CAAC;EAED,IAAQE,MAAM,GAAK7B,MAAM,CAAjB6B,MAAM;EAEd,oBAAOC,cAAK,CAACC,aAAa,CACxBjC,QAAQ,GAAGkC,sBAAU,GAAG,CAAC1C,MAAM,GAAG2C,gBAAI,GAAGC,eAAQ,EACjDpC,QAAQ,IAAI,CAACR,MAAM,mCAEVU,MAAM;IACTmC,IAAI,EAAEnC,MAAM,CAACmC,IAAI,IAAI,OAAO;IAC5BrC,QAAQ,EAARA,QAAQ;IACRsC,SAAS,EAAE,IAAAC,eAAM,EAAC,CAAC/C,MAAM,IAAIgD,oBAAK,CAACC,QAAQ,EAAEvC,MAAM,CAACoC,SAAS;EAAC,KAEhER,SAAS,eACb,4DACG,CAAAxC,MAAM,aAANA,MAAM,uBAANA,MAAM,CAAEuB,MAAM,IAAG,CAAC,iBACjB,6BAAC,cAAM;IAAC,MAAM,EAAEvB,MAAO;IAAC,MAAM,EAAEI,MAAO;IAAC,IAAI,EAAC,cAAc;IAAC,QAAQ,EAAE,kBAACwB,KAAK;MAAA,OAAKD,kBAAkB,CAACC,KAAK,CAAC;IAAA;EAAC,EAC5G,eACD,6BAAC,qBAAS;IACR,IAAI,EAAC,OAAO;IACZ,GAAG,EAAC;EAAO,GACN,CAAClB,QAAQ,GAAGE,MAAM,GAAG4B,SAAS;IACnC,SAAS,EAAE,IAAAS,eAAM,EAACC,oBAAK,CAACE,KAAK,EAAE,CAAC1C,QAAQ,IAAI,CAACR,MAAM,IAAIU,MAAM,CAACoC,SAAS;EAAE,iBAEzE,6BAAC,qBAAS;IAAC,GAAG,EAAC;EAAO,gBACpB,6BAAC,WAAG;IACF,OAAO,EAAE1C,QAAQ,CAACiB,MAAM,KAAKxB,UAAU,CAACwB,MAAO;IAC/C,aAAa,EAAEjB,QAAQ,CAACiB,MAAM,GAAG,CAAE;IACnC,IAAI,EAAEpB,IAAK;IACX,MAAM,EAAEC,MAAO;IACf,IAAI,EAAEY,IAAK;IACX,QAAQ,EAAES,eAAgB;IAC1B,QAAQ,EAAEd,QAAQ,GAAGmB,gBAAgB,GAAGU,SAAU;IAClD,MAAM,EAAEF,UAAW;IACnB,MAAM,EAAEG,MAAM,aAAMA,MAAM,aAAUD;EAAU,EAC9C,CACQ,eACZ,6BAAC,qBAAS;IAAC,GAAG,EAAC;EAAO,GACnB,IAAAa,cAAO,EACN;IAAA,OAAM,IAAAC,gBAAM,EAAC;MAAEvD,UAAU,EAAVA,UAAU;MAAEC,MAAM,EAANA,MAAM;MAAEI,MAAM,EAANA,MAAM;MAAEC,MAAM,EAANA,MAAM;MAAEW,IAAI,EAAJA;IAAK,CAAC,CAAC;EAAA,GAC1D,CAACjB,UAAU,EAAEC,MAAM,EAAEI,MAAM,EAAEC,MAAM,EAAEW,IAAI,CAAC,CAC3C,CAACuC,GAAG,CAAC,UAACxB,GAAG,EAAEH,KAAK;IAAA,oBACf,6BAAC,WAAG;MACF,OAAO,EAAE,CAAC,CAACtB,QAAQ,CAACkD,IAAI,CAAC,UAAC9B,IAAI;QAAA,OAAK+B,IAAI,CAACC,SAAS,CAAChC,IAAI,CAAC,KAAK+B,IAAI,CAACC,SAAS,CAAC3B,GAAG,CAAC;MAAA,EAAE;MACjF,UAAU,EAAEA,GAAI;MAChB,GAAG,EAAEH,KAAM;MACX,MAAM,EAAExB,MAAO;MACf,OAAO,EAAEK,OAAQ;MACjB,QAAQ,EAAEE,QAAQ,GAAGuB,YAAY,GAAGM,SAAU;MAC9C,MAAM,EAAEC,MAAM,aAAMA,MAAM,cAAIb,KAAK,IAAKY;IAAU,EAClD;EAAA,CACH,CAAC,CACQ,CACF,CACX,CACJ;AACH,CAAC;AAAC;AAEF1C,KAAK,CAAC6D,WAAW,GAAG,iBAAiB;AAErC7D,KAAK,CAAC8D,SAAS,GAAG;EAChB7D,UAAU,EAAE8D,kBAAS,CAACC,OAAO,CAACD,kBAAS,CAACE,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;EAClD/D,MAAM,EAAE6D,kBAAS,CAACC,OAAO,CAACD,kBAAS,CAACE,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;EAC9C7D,MAAM,EAAE2D,kBAAS,CAACG,IAAI;EACtB7D,IAAI,EAAE8D,iBAAU;EAChB7D,MAAM,EAAEyD,kBAAS,CAACE,KAAK,CAAC,CAAC,CAAC,CAAC,CAACG,UAAU;EACtC7D,MAAM,EAAEwD,kBAAS,CAACM,MAAM;EACxB3D,KAAK,EAAEqD,kBAAS,CAACM,MAAM;EACvB7D,QAAQ,EAAEuD,kBAAS,CAACC,OAAO,CAACD,kBAAS,CAACE,KAAK,EAAE,CAAC;EAC9CtD,OAAO,EAAEoD,kBAAS,CAACO,IAAI;EACvB1D,QAAQ,EAAEmD,kBAAS,CAACO,IAAI;EACxBzD,QAAQ,EAAEkD,kBAAS,CAACO;AACtB,CAAC"}
|
|
1
|
+
{"version":3,"file":"Table.js","names":["Table","dataSource","filter","propFilter","inline","l10n","schema","search","selected","propSelected","store","onPress","onScroll","onSelect","others","useState","setFilter","setSelected","sort","setSort","useEffect","nextFilter","storeFilter","Storage","get","length","set","handleAddFilter","item","handleRemoveFilter","index","splice","handleHeadSelect","row","event","next","handleSelect","exists","includes","push","handleSort","field","undefined","testId","React","createElement","ScrollView","View","role","className","styles","style","outlined","table","useMemo","select","map","isChecked","displayName","propTypes","PropTypes","arrayOf","shape","bool","L10N_SHAPE","isRequired","string","func"],"sources":["../../../src/components/Table/Table.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React, { Fragment, useEffect, useMemo, useState } from 'react';\n\nimport { styles } from '../../helpers';\nimport { Primitive, ScrollView, View } from '../../primitives';\nimport { isChecked, select, Storage } from './helpers';\nimport { L10N_SHAPE } from './Table.constants';\nimport { Filter } from './Table.Filter';\nimport style from './Table.module.css';\nimport { Row } from './Table.Row';\n\nexport const Table = ({\n dataSource = [],\n filter: propFilter = [],\n inline = true,\n l10n,\n schema,\n search,\n selected: propSelected = [],\n store,\n onPress,\n onScroll,\n onSelect,\n ...others\n}) => {\n const [filter, setFilter] = useState([]);\n const [selected, setSelected] = useState(propSelected);\n const [sort, setSort] = useState({});\n\n useEffect(() => {\n let nextFilter = propFilter;\n if (store) {\n const storeFilter = Storage.get(`${store}:filter`);\n if (storeFilter?.length) nextFilter = storeFilter;\n }\n\n setFilter(nextFilter);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n useEffect(() => {\n if (!store) return;\n Storage.set(`${store}:filter`, filter);\n }, [filter, store]);\n\n const handleAddFilter = (item) => {\n setFilter([...filter, item]);\n };\n\n const handleRemoveFilter = (index) => {\n filter?.splice(index, 1);\n setFilter([...filter]);\n };\n\n const handleHeadSelect = (row, event) => {\n setSelected(() => {\n const next = selected.length !== dataSource.length ? dataSource : [];\n onSelect(next, event);\n\n return next;\n });\n };\n\n const handleSelect = (row, event) => {\n setSelected(() => {\n const exists = selected.includes(row);\n const next = selected.filter((item) => item !== row);\n if (!exists) next.push(row);\n onSelect(next, event);\n\n return next;\n });\n };\n\n const handleSort = (field) => {\n setSort(sort[field] === undefined ? { [field]: true } : sort[field] ? { [field]: false } : {});\n };\n\n const { testId } = others;\n\n return React.createElement(\n onScroll ? ScrollView : View,\n onScroll || !inline\n ? {\n ...others,\n role: others.role || 'table',\n onScroll,\n className: styles(!inline && style.outlined, others.className),\n }\n : { className: others.className },\n <>\n {filter?.length > 0 && (\n <Filter filter={filter} schema={schema} role=\"table-filter\" onRemove={(index) => handleRemoveFilter(index)} />\n )}\n <Primitive\n role=\"table\"\n tag=\"table\"\n {...(!onScroll ? others : undefined)}\n className={styles(style.table, !onScroll && !inline && others.className)}\n >\n <Primitive tag=\"thead\">\n <Row\n checked={dataSource.length > 0 ? selected.length === dataSource.length : undefined}\n indeterminate={selected.length > 0}\n l10n={l10n}\n schema={schema}\n sort={sort}\n onFilter={handleAddFilter}\n onSelect={onSelect ? handleHeadSelect : undefined}\n onSort={handleSort}\n testId={testId ? `${testId}-head` : undefined}\n />\n </Primitive>\n <Primitive tag=\"tbody\">\n {useMemo(\n () => select({ dataSource, filter, schema, search, sort }),\n [dataSource, filter, schema, search, sort],\n ).map((row, index) => (\n <Row\n checked={isChecked(row, selected)}\n dataSource={row}\n key={index}\n schema={schema}\n onPress={onPress}\n onSelect={onSelect ? handleSelect : undefined}\n testId={testId ? `${testId}-${index}` : undefined}\n />\n ))}\n </Primitive>\n </Primitive>\n </>,\n );\n};\n\nTable.displayName = 'Component:Table';\n\nTable.propTypes = {\n dataSource: PropTypes.arrayOf(PropTypes.shape({})),\n filter: PropTypes.arrayOf(PropTypes.shape({})),\n inline: PropTypes.bool,\n l10n: L10N_SHAPE,\n schema: PropTypes.shape({}).isRequired,\n search: PropTypes.string,\n store: PropTypes.string,\n selected: PropTypes.arrayOf(PropTypes.shape()),\n onPress: PropTypes.func,\n onScroll: PropTypes.func,\n onSelect: PropTypes.func,\n};\n"],"mappings":"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"}
|
|
@@ -14,7 +14,7 @@
|
|
|
14
14
|
background-color: var(--mirai-ui-table-background);
|
|
15
15
|
position: sticky;
|
|
16
16
|
top: 0;
|
|
17
|
-
z-index: var(--mirai-ui-layer-
|
|
17
|
+
z-index: var(--mirai-ui-layer-L);
|
|
18
18
|
}
|
|
19
19
|
|
|
20
20
|
.table thead tr {
|
|
@@ -60,6 +60,7 @@
|
|
|
60
60
|
left: 0;
|
|
61
61
|
padding-left: var(--mirai-ui-table-padding-x);
|
|
62
62
|
position: sticky;
|
|
63
|
+
z-index: var(--mirai-ui-layer-M);
|
|
63
64
|
}
|
|
64
65
|
|
|
65
66
|
.table th:last-child,
|
|
@@ -93,8 +94,13 @@
|
|
|
93
94
|
width: fit-content;
|
|
94
95
|
}
|
|
95
96
|
|
|
97
|
+
.table .column.component {
|
|
98
|
+
z-index: var(--mirai-ui-layer-S);
|
|
99
|
+
}
|
|
100
|
+
|
|
96
101
|
.table .checkbox {
|
|
97
102
|
margin: 0;
|
|
103
|
+
max-width: var(--mirai-ui-checkbox-size);
|
|
98
104
|
min-width: var(--mirai-ui-checkbox-size);
|
|
99
105
|
}
|
|
100
106
|
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
4
3
|
Object.defineProperty(exports, "__esModule", {
|
|
5
4
|
value: true
|
|
6
5
|
});
|
|
@@ -13,9 +12,7 @@ var _ref;
|
|
|
13
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
14
13
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
15
14
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
16
|
-
function
|
|
17
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
18
|
-
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
15
|
+
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
19
16
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
20
17
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
21
18
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
@@ -23,6 +20,9 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
|
|
|
23
20
|
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
24
21
|
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) { ; } } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
25
22
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
23
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
24
|
+
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
25
|
+
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
26
26
|
var _default = {
|
|
27
27
|
title: 'Components'
|
|
28
28
|
};
|
|
@@ -37,6 +37,82 @@ var tags = function tags(value) {
|
|
|
37
37
|
}, language);
|
|
38
38
|
});
|
|
39
39
|
};
|
|
40
|
+
var handleSwitch = function handleSwitch(value, event) {
|
|
41
|
+
event.stopPropagation();
|
|
42
|
+
console.log('::switch::', value);
|
|
43
|
+
};
|
|
44
|
+
var dataSource = [{
|
|
45
|
+
username: 'jose',
|
|
46
|
+
email: 'jose@mirai.com',
|
|
47
|
+
active: true,
|
|
48
|
+
activeSwitch: /*#__PURE__*/_react.default.createElement(_.Switch, {
|
|
49
|
+
name: "active",
|
|
50
|
+
checked: true,
|
|
51
|
+
onChange: handleSwitch
|
|
52
|
+
}),
|
|
53
|
+
year: 1,
|
|
54
|
+
languages: ['ES', 'EN'],
|
|
55
|
+
tags: tags(['ES', 'EN']),
|
|
56
|
+
action: null
|
|
57
|
+
}, {
|
|
58
|
+
username: 'mario/1',
|
|
59
|
+
email: 'mario.1@mirai.com',
|
|
60
|
+
active: true,
|
|
61
|
+
activeSwitch: /*#__PURE__*/_react.default.createElement(_.Switch, {
|
|
62
|
+
name: "active",
|
|
63
|
+
checked: true,
|
|
64
|
+
onChange: handleSwitch
|
|
65
|
+
}),
|
|
66
|
+
languages: ['ES'],
|
|
67
|
+
tags: null,
|
|
68
|
+
year: 2005
|
|
69
|
+
}, {
|
|
70
|
+
username: 'svet',
|
|
71
|
+
email: 'svet@mirai.com',
|
|
72
|
+
active: true,
|
|
73
|
+
activeSwitch: /*#__PURE__*/_react.default.createElement(_.Switch, {
|
|
74
|
+
name: "active",
|
|
75
|
+
checked: true,
|
|
76
|
+
onChange: handleSwitch
|
|
77
|
+
}),
|
|
78
|
+
tags: tags(['RU', 'ES', 'EN']),
|
|
79
|
+
languages: ['RU', 'ES', 'EN'],
|
|
80
|
+
year: 2021,
|
|
81
|
+
twitter: undefined,
|
|
82
|
+
action: /*#__PURE__*/_react.default.createElement(_.Button, {
|
|
83
|
+
small: true
|
|
84
|
+
}, "Click Me"),
|
|
85
|
+
actionTitle: 'Click Me'
|
|
86
|
+
}, (_ref = {
|
|
87
|
+
username: 'javi',
|
|
88
|
+
email: 'hi@soyjavi.com',
|
|
89
|
+
active: true,
|
|
90
|
+
activeSwitch: null,
|
|
91
|
+
tags: null,
|
|
92
|
+
languages: ['EU', 'ES', 'EN', 'TH']
|
|
93
|
+
}, _defineProperty(_ref, "tags", tags(['EU', 'ES', 'EN', 'TH'])), _defineProperty(_ref, "year", 2022), _defineProperty(_ref, "twitter", 'soyjavi'), _defineProperty(_ref, "bio", "Hi, I'm Javi. For as long as I can remember, I have always loved build software and helping people through it. I strive to design simple, clean, and beautiful products in the hope that they will make a difference in the world."), _ref), {
|
|
94
|
+
username: 'victor',
|
|
95
|
+
email: 'victor@mirai.com',
|
|
96
|
+
active: false,
|
|
97
|
+
activeSwitch: /*#__PURE__*/_react.default.createElement(_.Switch, {
|
|
98
|
+
name: "active",
|
|
99
|
+
onChange: handleSwitch
|
|
100
|
+
}),
|
|
101
|
+
languages: ['ES'],
|
|
102
|
+
tags: tags(['ES']),
|
|
103
|
+
year: 2021
|
|
104
|
+
}, {
|
|
105
|
+
username: 'mario/2',
|
|
106
|
+
email: 'mario.2@mirai.com',
|
|
107
|
+
active: false,
|
|
108
|
+
activeSwitch: /*#__PURE__*/_react.default.createElement(_.Switch, {
|
|
109
|
+
name: "active",
|
|
110
|
+
onChange: handleSwitch
|
|
111
|
+
}),
|
|
112
|
+
languages: ['ES'],
|
|
113
|
+
tags: tags(['ES']),
|
|
114
|
+
year: 2022
|
|
115
|
+
}];
|
|
40
116
|
var Story = function Story(props) {
|
|
41
117
|
var _useState = (0, _react.useState)(),
|
|
42
118
|
_useState2 = _slicedToArray(_useState, 2),
|
|
@@ -87,48 +163,6 @@ var Story = function Story(props) {
|
|
|
87
163
|
})));
|
|
88
164
|
};
|
|
89
165
|
exports.Story = Story;
|
|
90
|
-
var dataSource = [{
|
|
91
|
-
username: 'jose',
|
|
92
|
-
email: 'jose@mirai.com',
|
|
93
|
-
year: 1,
|
|
94
|
-
languages: ['ES', 'EN'],
|
|
95
|
-
tags: tags(['ES', 'EN']),
|
|
96
|
-
action: null
|
|
97
|
-
}, {
|
|
98
|
-
username: 'mario/1',
|
|
99
|
-
email: 'mario.1@mirai.com',
|
|
100
|
-
languages: ['ES'],
|
|
101
|
-
tags: null,
|
|
102
|
-
year: 2005
|
|
103
|
-
}, {
|
|
104
|
-
username: 'svet',
|
|
105
|
-
email: 'svet@mirai.com',
|
|
106
|
-
tags: tags(['RU', 'ES', 'EN']),
|
|
107
|
-
languages: ['RU', 'ES', 'EN'],
|
|
108
|
-
year: 2021,
|
|
109
|
-
twitter: undefined,
|
|
110
|
-
action: /*#__PURE__*/_react.default.createElement(_.Button, {
|
|
111
|
-
small: true
|
|
112
|
-
}, "Click Me"),
|
|
113
|
-
actionTitle: 'Click Me'
|
|
114
|
-
}, (_ref = {
|
|
115
|
-
username: 'javi',
|
|
116
|
-
email: 'hi@soyjavi.com',
|
|
117
|
-
tags: null,
|
|
118
|
-
languages: ['EU', 'ES', 'EN', 'TH']
|
|
119
|
-
}, _defineProperty(_ref, "tags", tags(['EU', 'ES', 'EN', 'TH'])), _defineProperty(_ref, "year", 2022), _defineProperty(_ref, "twitter", 'soyjavi'), _defineProperty(_ref, "bio", "Hi, I'm Javi. For as long as I can remember, I have always loved build software and helping people through it. I strive to design simple, clean, and beautiful products in the hope that they will make a difference in the world."), _ref), {
|
|
120
|
-
username: 'victor',
|
|
121
|
-
email: 'victor@mirai.com',
|
|
122
|
-
languages: ['ES'],
|
|
123
|
-
tags: tags(['ES']),
|
|
124
|
-
year: 2021
|
|
125
|
-
}, {
|
|
126
|
-
username: 'mario/2',
|
|
127
|
-
email: 'mario.2@mirai.com',
|
|
128
|
-
languages: ['ES'],
|
|
129
|
-
tags: tags(['ES']),
|
|
130
|
-
year: 2022
|
|
131
|
-
}];
|
|
132
166
|
Story.storyName = 'Table';
|
|
133
167
|
Story.args = {
|
|
134
168
|
dataSource: dataSource,
|
|
@@ -161,6 +195,15 @@ Story.args = {
|
|
|
161
195
|
email: {
|
|
162
196
|
label: 'Email'
|
|
163
197
|
},
|
|
198
|
+
active: {
|
|
199
|
+
label: 'Active',
|
|
200
|
+
type: 'hidden'
|
|
201
|
+
},
|
|
202
|
+
activeSwitch: {
|
|
203
|
+
label: 'Active',
|
|
204
|
+
type: 'component',
|
|
205
|
+
bind: 'active'
|
|
206
|
+
},
|
|
164
207
|
tags: {
|
|
165
208
|
label: /*#__PURE__*/_react.default.createElement(_.View, {
|
|
166
209
|
row: true,
|
|
@@ -194,9 +237,9 @@ Story.args = {
|
|
|
194
237
|
}
|
|
195
238
|
},
|
|
196
239
|
search: '',
|
|
240
|
+
store: 'mirai',
|
|
197
241
|
// inherited properties
|
|
198
242
|
testId: 'test-story',
|
|
199
|
-
store: 'mirai',
|
|
200
243
|
style: {
|
|
201
244
|
background: 'green'
|
|
202
245
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Table.stories.js","names":["title","tags","value","map","language","style","tag","Story","props","useState","selected","setSelected","search","setSearch","useEffect","handleScroll","others","console","log","handlePress","handleSelect","table","dataSource","username","email","year","languages","action","twitter","undefined","actionTitle","storyName","args","filter","field","min","max","inline","l10n","actionCancel","actionSubmit","labelMax","labelMin","schema","label","type","bind","bio","testId","store","background","argTypes"],"sources":["../../../src/components/Table/Table.stories.jsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\n\nimport { Button, Icon, ICON, InputText, Text, View } from '../../';\nimport { Table } from './Table';\nimport style from './Table.stories.module.css';\n\nexport default { title: 'Components' };\n\nconst tags = (value) =>\n value.map((language) => (\n <Text key={language} bold tiny className={style.tag}>\n {language}\n </Text>\n ));\n\nexport const Story = (props) => {\n const [selected, setSelected] = useState();\n const [search, setSearch] = useState();\n\n useEffect(() => {\n setSearch(props.search);\n }, [props.search]);\n\n const handleScroll = (...others) => console.log('<Table>::onScroll', ...others);\n\n const handlePress = (...others) => console.log('<Table>::onPress', ...others);\n\n const handleSelect = (...others) => {\n console.log('<Table>::onSelect', ...others);\n setSelected(...others);\n };\n\n return (\n <>\n <InputText name=\"search\" placeholder=\"search...\" type=\"search\" value={search} onChange={setSearch} />\n\n <Table\n {...props}\n search={search}\n selected={selected}\n onPress={handlePress}\n onScroll={handleScroll}\n onSelect={handleSelect}\n className={style.table}\n />\n </>\n );\n};\n\nconst dataSource = [\n {\n username: 'jose',\n email: 'jose@mirai.com',\n year: 1,\n languages: ['ES', 'EN'],\n tags: tags(['ES', 'EN']),\n action: null,\n },\n {\n username: 'mario/1',\n email: 'mario.1@mirai.com',\n languages: ['ES'],\n tags: null,\n year: 2005,\n },\n {\n username: 'svet',\n email: 'svet@mirai.com',\n tags: tags(['RU', 'ES', 'EN']),\n languages: ['RU', 'ES', 'EN'],\n year: 2021,\n twitter: undefined,\n action: <Button small>Click Me</Button>,\n actionTitle: 'Click Me',\n },\n {\n username: 'javi',\n email: 'hi@soyjavi.com',\n tags: null,\n languages: ['EU', 'ES', 'EN', 'TH'],\n tags: tags(['EU', 'ES', 'EN', 'TH']),\n year: 2022,\n twitter: 'soyjavi',\n bio: \"Hi, I'm Javi. For as long as I can remember, I have always loved build software and helping people through it. I strive to design simple, clean, and beautiful products in the hope that they will make a difference in the world.\",\n },\n {\n username: 'victor',\n email: 'victor@mirai.com',\n languages: ['ES'],\n tags: tags(['ES']),\n year: 2021,\n },\n {\n username: 'mario/2',\n email: 'mario.2@mirai.com',\n languages: ['ES'],\n tags: tags(['ES']),\n year: 2022,\n },\n];\n\nStory.storyName = 'Table';\n\nStory.args = {\n dataSource,\n filter: [\n { field: 'email', value: '@mirai.com' },\n { field: 'nonExistent', value: '@mirai.com' },\n { field: 'email', value: '@soyjavi.com' },\n { field: 'year', min: 2020, max: 2023 },\n ],\n inline: true,\n l10n: {\n actionCancel: 'Cancel',\n actionSubmit: 'Submit',\n labelMax: 'Max',\n labelMin: 'Min',\n },\n schema: {\n username: { label: 'User Name', type: 'text' },\n email: {\n label: 'Email',\n },\n tags: {\n label: (\n <View row className={style.label}>\n <Text>🏷️</Text>\n Tags\n </View>\n ),\n type: 'component',\n bind: 'languages',\n },\n languages: { label: 'Languages (hidden)', type: 'hidden' },\n year: { label: 'Year', type: 'number' },\n twitter: { label: 'Twitter' },\n bio: { label: 'Biography' },\n action: { label: 'Action', type: 'component', bind: 'actionTitle' },\n actionTitle: { label: 'Action (hidden)', type: 'hidden' },\n },\n search: '',\n // inherited properties\n testId: 'test-story',\n store: 'mirai',\n style: {\n background: 'green',\n },\n};\n\nStory.argTypes = {};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Table.stories.js","names":["title","tags","value","map","language","style","tag","handleSwitch","event","stopPropagation","console","log","dataSource","username","email","active","activeSwitch","year","languages","action","twitter","undefined","actionTitle","Story","props","useState","selected","setSelected","search","setSearch","useEffect","handleScroll","others","handlePress","handleSelect","table","storyName","args","filter","field","min","max","inline","l10n","actionCancel","actionSubmit","labelMax","labelMin","schema","label","type","bind","bio","store","testId","background","argTypes"],"sources":["../../../src/components/Table/Table.stories.jsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\n\nimport { Button, Icon, ICON, InputText, Switch, Text, View } from '../../';\nimport { Table } from './Table';\nimport style from './Table.stories.module.css';\n\nexport default { title: 'Components' };\n\nconst tags = (value) =>\n value.map((language) => (\n <Text key={language} bold tiny className={style.tag}>\n {language}\n </Text>\n ));\n\nconst handleSwitch = (value, event) => {\n event.stopPropagation();\n console.log('::switch::', value);\n};\n\nconst dataSource = [\n {\n username: 'jose',\n email: 'jose@mirai.com',\n active: true,\n activeSwitch: <Switch name=\"active\" checked onChange={handleSwitch} />,\n year: 1,\n languages: ['ES', 'EN'],\n tags: tags(['ES', 'EN']),\n action: null,\n },\n {\n username: 'mario/1',\n email: 'mario.1@mirai.com',\n active: true,\n activeSwitch: <Switch name=\"active\" checked onChange={handleSwitch} />,\n languages: ['ES'],\n tags: null,\n year: 2005,\n },\n {\n username: 'svet',\n email: 'svet@mirai.com',\n active: true,\n activeSwitch: <Switch name=\"active\" checked onChange={handleSwitch} />,\n tags: tags(['RU', 'ES', 'EN']),\n languages: ['RU', 'ES', 'EN'],\n year: 2021,\n twitter: undefined,\n action: <Button small>Click Me</Button>,\n actionTitle: 'Click Me',\n },\n {\n username: 'javi',\n email: 'hi@soyjavi.com',\n active: true,\n activeSwitch: null,\n tags: null,\n languages: ['EU', 'ES', 'EN', 'TH'],\n tags: tags(['EU', 'ES', 'EN', 'TH']),\n year: 2022,\n twitter: 'soyjavi',\n bio: \"Hi, I'm Javi. For as long as I can remember, I have always loved build software and helping people through it. I strive to design simple, clean, and beautiful products in the hope that they will make a difference in the world.\",\n },\n {\n username: 'victor',\n email: 'victor@mirai.com',\n active: false,\n activeSwitch: <Switch name=\"active\" onChange={handleSwitch} />,\n languages: ['ES'],\n tags: tags(['ES']),\n year: 2021,\n },\n {\n username: 'mario/2',\n email: 'mario.2@mirai.com',\n active: false,\n activeSwitch: <Switch name=\"active\" onChange={handleSwitch} />,\n languages: ['ES'],\n tags: tags(['ES']),\n year: 2022,\n },\n];\n\nexport const Story = (props) => {\n const [selected, setSelected] = useState();\n const [search, setSearch] = useState();\n\n useEffect(() => {\n setSearch(props.search);\n }, [props.search]);\n\n const handleScroll = (...others) => console.log('<Table>::onScroll', ...others);\n\n const handlePress = (...others) => console.log('<Table>::onPress', ...others);\n\n const handleSelect = (...others) => {\n console.log('<Table>::onSelect', ...others);\n setSelected(...others);\n };\n\n return (\n <>\n <InputText name=\"search\" placeholder=\"search...\" type=\"search\" value={search} onChange={setSearch} />\n\n <Table\n {...props}\n search={search}\n selected={selected}\n onPress={handlePress}\n onScroll={handleScroll}\n onSelect={handleSelect}\n className={style.table}\n />\n </>\n );\n};\n\nStory.storyName = 'Table';\n\nStory.args = {\n dataSource,\n filter: [\n { field: 'email', value: '@mirai.com' },\n { field: 'nonExistent', value: '@mirai.com' },\n { field: 'email', value: '@soyjavi.com' },\n { field: 'year', min: 2020, max: 2023 },\n ],\n inline: true,\n l10n: {\n actionCancel: 'Cancel',\n actionSubmit: 'Submit',\n labelMax: 'Max',\n labelMin: 'Min',\n },\n schema: {\n username: { label: 'User Name', type: 'text' },\n email: { label: 'Email' },\n active: { label: 'Active', type: 'hidden' },\n activeSwitch: { label: 'Active', type: 'component', bind: 'active' },\n tags: {\n label: (\n <View row className={style.label}>\n <Text>🏷️</Text>\n Tags\n </View>\n ),\n type: 'component',\n bind: 'languages',\n },\n languages: { label: 'Languages (hidden)', type: 'hidden' },\n year: { label: 'Year', type: 'number' },\n twitter: { label: 'Twitter' },\n bio: { label: 'Biography' },\n action: { label: 'Action', type: 'component', bind: 'actionTitle' },\n actionTitle: { label: 'Action (hidden)', type: 'hidden' },\n },\n search: '',\n store: 'mirai',\n // inherited properties\n testId: 'test-story',\n style: {\n background: 'green',\n },\n};\n\nStory.argTypes = {};\n"],"mappings":"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"}
|