@wordpress/dataviews 16.0.0 → 16.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +19 -1
- package/build/components/dataviews-layouts/index.cjs +9 -0
- package/build/components/dataviews-layouts/index.cjs.map +3 -3
- package/build/components/dataviews-layouts/picker-activity/index.cjs +304 -0
- package/build/components/dataviews-layouts/picker-activity/index.cjs.map +7 -0
- package/build/components/dataviews-view-config/index.cjs +1 -0
- package/build/components/dataviews-view-config/index.cjs.map +2 -2
- package/build/constants.cjs +3 -0
- package/build/constants.cjs.map +2 -2
- package/build/types/dataviews.cjs.map +1 -1
- package/build-module/components/dataviews-layouts/index.mjs +11 -1
- package/build-module/components/dataviews-layouts/index.mjs.map +2 -2
- package/build-module/components/dataviews-layouts/picker-activity/index.mjs +273 -0
- package/build-module/components/dataviews-layouts/picker-activity/index.mjs.map +7 -0
- package/build-module/components/dataviews-view-config/index.mjs +1 -0
- package/build-module/components/dataviews-view-config/index.mjs.map +2 -2
- package/build-module/constants.mjs +2 -0
- package/build-module/constants.mjs.map +2 -2
- package/build-style/style-rtl.css +199 -13
- package/build-style/style.css +199 -13
- package/build-types/components/dataviews-layouts/index.d.ts +8 -0
- package/build-types/components/dataviews-layouts/index.d.ts.map +1 -1
- package/build-types/components/dataviews-layouts/picker-activity/index.d.ts +3 -0
- package/build-types/components/dataviews-layouts/picker-activity/index.d.ts.map +1 -0
- package/build-types/components/dataviews-view-config/index.d.ts.map +1 -1
- package/build-types/constants.d.ts +1 -0
- package/build-types/constants.d.ts.map +1 -1
- package/build-types/dataform/stories/index.story.d.ts +1 -0
- package/build-types/dataform/stories/index.story.d.ts.map +1 -1
- package/build-types/dataviews/stories/index.story.d.ts.map +1 -1
- package/build-types/dataviews-picker/stories/index.story.d.ts.map +1 -1
- package/build-types/types/dataviews.d.ts +16 -2
- package/build-types/types/dataviews.d.ts.map +1 -1
- package/build-wp/index.js +928 -648
- package/package.json +22 -19
- package/src/components/dataviews-layouts/index.ts +10 -0
- package/src/components/dataviews-layouts/picker-activity/index.tsx +359 -0
- package/src/components/dataviews-layouts/picker-activity/style.scss +227 -0
- package/src/components/dataviews-view-config/index.tsx +1 -0
- package/src/constants.ts +1 -0
- package/src/dataform/stories/content.story.tsx +1 -1
- package/src/dataform/stories/index.story.tsx +1 -0
- package/src/dataviews/stories/index.story.tsx +1 -0
- package/src/dataviews-picker/stories/index.story.tsx +6 -0
- package/src/dataviews-picker/test/dataviews-picker.tsx +5 -0
- package/src/style.scss +1 -0
- package/src/types/dataviews.ts +21 -1
package/CHANGELOG.md
CHANGED
|
@@ -2,12 +2,30 @@
|
|
|
2
2
|
|
|
3
3
|
## Unreleased
|
|
4
4
|
|
|
5
|
-
## 16.0.
|
|
5
|
+
## 16.0.1 (2026-06-16)
|
|
6
|
+
|
|
7
|
+
## 16.0.0 (2026-06-10)
|
|
6
8
|
|
|
7
9
|
### Breaking Changes
|
|
8
10
|
|
|
9
11
|
- Revert React back to v18 [#78940](https://github.com/WordPress/gutenberg/pull/78940).
|
|
10
12
|
|
|
13
|
+
### Enhancements
|
|
14
|
+
|
|
15
|
+
- DataViewsPicker: Add a new `pickerActivity` layout that renders selectable items as a vertical activity timeline. [#78941](https://github.com/WordPress/gutenberg/pull/78941)
|
|
16
|
+
|
|
17
|
+
### Code Quality
|
|
18
|
+
|
|
19
|
+
- Add missing `@types/react` dependency. [#78882](https://github.com/WordPress/gutenberg/pull/78882).
|
|
20
|
+
|
|
21
|
+
### Documentation
|
|
22
|
+
|
|
23
|
+
- Include DataViews components in [WordPress Design System MCP Server](https://github.com/WordPress/gutenberg/tree/trunk/packages/design-system-mcp) documented components ([#78960](https://github.com/WordPress/gutenberg/pull/78960)).
|
|
24
|
+
|
|
25
|
+
### Internal
|
|
26
|
+
|
|
27
|
+
- Dependency updates ([#77954](https://github.com/WordPress/gutenberg/pull/77954)).
|
|
28
|
+
|
|
11
29
|
## 15.0.0 (2026-05-27)
|
|
12
30
|
|
|
13
31
|
### Breaking Changes
|
|
@@ -41,6 +41,7 @@ var import_list = __toESM(require("./list/index.cjs"));
|
|
|
41
41
|
var import_activity = __toESM(require("./activity/index.cjs"));
|
|
42
42
|
var import_picker_grid = __toESM(require("./picker-grid/index.cjs"));
|
|
43
43
|
var import_picker_table = __toESM(require("./picker-table/index.cjs"));
|
|
44
|
+
var import_picker_activity = __toESM(require("./picker-activity/index.cjs"));
|
|
44
45
|
var import_constants = require("../../constants.cjs");
|
|
45
46
|
var import_density_picker = __toESM(require("./utils/density-picker.cjs"));
|
|
46
47
|
var import_grid_config_options = __toESM(require("./utils/grid-config-options.cjs"));
|
|
@@ -88,6 +89,14 @@ var VIEW_LAYOUTS = [
|
|
|
88
89
|
icon: import_icons.blockTable,
|
|
89
90
|
viewConfigOptions: import_density_picker.default,
|
|
90
91
|
isPicker: true
|
|
92
|
+
},
|
|
93
|
+
{
|
|
94
|
+
type: import_constants.LAYOUT_PICKER_ACTIVITY,
|
|
95
|
+
label: (0, import_i18n.__)("Activity"),
|
|
96
|
+
component: import_picker_activity.default,
|
|
97
|
+
icon: import_icons.scheduled,
|
|
98
|
+
viewConfigOptions: import_density_picker.default,
|
|
99
|
+
isPicker: true
|
|
91
100
|
}
|
|
92
101
|
];
|
|
93
102
|
// Annotate the CommonJS export names for ESM import in node:
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/dataviews-layouts/index.ts"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __, isRTL } from '@wordpress/i18n';\nimport {\n\tblockTable,\n\tcategory,\n\tformatListBullets,\n\tformatListBulletsRTL,\n\tscheduled,\n} from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport ViewTable from './table';\nimport ViewGrid from './grid';\nimport ViewList from './list';\nimport ViewActivity from './activity';\nimport ViewPickerGrid from './picker-grid';\nimport ViewPickerTable from './picker-table';\nimport {\n\tLAYOUT_GRID,\n\tLAYOUT_LIST,\n\tLAYOUT_TABLE,\n\tLAYOUT_ACTIVITY,\n\tLAYOUT_PICKER_GRID,\n\tLAYOUT_PICKER_TABLE,\n} from '../../constants';\nimport DensityPicker from './utils/density-picker';\nimport GridConfigOptions from './utils/grid-config-options';\n\nexport const VIEW_LAYOUTS = [\n\t{\n\t\ttype: LAYOUT_TABLE,\n\t\tlabel: __( 'Table' ),\n\t\tcomponent: ViewTable,\n\t\ticon: blockTable,\n\t\tviewConfigOptions: DensityPicker,\n\t},\n\t{\n\t\ttype: LAYOUT_GRID,\n\t\tlabel: __( 'Grid' ),\n\t\tcomponent: ViewGrid,\n\t\ticon: category,\n\t\tviewConfigOptions: GridConfigOptions,\n\t},\n\t{\n\t\ttype: LAYOUT_LIST,\n\t\tlabel: __( 'List' ),\n\t\tcomponent: ViewList,\n\t\ticon: isRTL() ? formatListBulletsRTL : formatListBullets,\n\t\tviewConfigOptions: DensityPicker,\n\t},\n\t{\n\t\ttype: LAYOUT_ACTIVITY,\n\t\tlabel: __( 'Activity' ),\n\t\tcomponent: ViewActivity,\n\t\ticon: scheduled,\n\t\tviewConfigOptions: DensityPicker,\n\t},\n\t{\n\t\ttype: LAYOUT_PICKER_GRID,\n\t\tlabel: __( 'Grid' ),\n\t\tcomponent: ViewPickerGrid,\n\t\ticon: category,\n\t\tviewConfigOptions: GridConfigOptions,\n\t\tisPicker: true,\n\t},\n\t{\n\t\ttype: LAYOUT_PICKER_TABLE,\n\t\tlabel: __( 'Table' ),\n\t\tcomponent: ViewPickerTable,\n\t\ticon: blockTable,\n\t\tviewConfigOptions: DensityPicker,\n\t\tisPicker: true,\n\t},\n];\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAA0B;AAC1B,mBAMO;AAKP,mBAAsB;AACtB,kBAAqB;AACrB,kBAAqB;AACrB,sBAAyB;AACzB,yBAA2B;AAC3B,0BAA4B;AAC5B,
|
|
6
|
-
"names": ["ViewTable", "DensityPicker", "ViewGrid", "GridConfigOptions", "ViewList", "ViewActivity", "ViewPickerGrid", "ViewPickerTable"]
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __, isRTL } from '@wordpress/i18n';\nimport {\n\tblockTable,\n\tcategory,\n\tformatListBullets,\n\tformatListBulletsRTL,\n\tscheduled,\n} from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport ViewTable from './table';\nimport ViewGrid from './grid';\nimport ViewList from './list';\nimport ViewActivity from './activity';\nimport ViewPickerGrid from './picker-grid';\nimport ViewPickerTable from './picker-table';\nimport ViewPickerActivity from './picker-activity';\nimport {\n\tLAYOUT_GRID,\n\tLAYOUT_LIST,\n\tLAYOUT_TABLE,\n\tLAYOUT_ACTIVITY,\n\tLAYOUT_PICKER_GRID,\n\tLAYOUT_PICKER_TABLE,\n\tLAYOUT_PICKER_ACTIVITY,\n} from '../../constants';\nimport DensityPicker from './utils/density-picker';\nimport GridConfigOptions from './utils/grid-config-options';\n\nexport const VIEW_LAYOUTS = [\n\t{\n\t\ttype: LAYOUT_TABLE,\n\t\tlabel: __( 'Table' ),\n\t\tcomponent: ViewTable,\n\t\ticon: blockTable,\n\t\tviewConfigOptions: DensityPicker,\n\t},\n\t{\n\t\ttype: LAYOUT_GRID,\n\t\tlabel: __( 'Grid' ),\n\t\tcomponent: ViewGrid,\n\t\ticon: category,\n\t\tviewConfigOptions: GridConfigOptions,\n\t},\n\t{\n\t\ttype: LAYOUT_LIST,\n\t\tlabel: __( 'List' ),\n\t\tcomponent: ViewList,\n\t\ticon: isRTL() ? formatListBulletsRTL : formatListBullets,\n\t\tviewConfigOptions: DensityPicker,\n\t},\n\t{\n\t\ttype: LAYOUT_ACTIVITY,\n\t\tlabel: __( 'Activity' ),\n\t\tcomponent: ViewActivity,\n\t\ticon: scheduled,\n\t\tviewConfigOptions: DensityPicker,\n\t},\n\t{\n\t\ttype: LAYOUT_PICKER_GRID,\n\t\tlabel: __( 'Grid' ),\n\t\tcomponent: ViewPickerGrid,\n\t\ticon: category,\n\t\tviewConfigOptions: GridConfigOptions,\n\t\tisPicker: true,\n\t},\n\t{\n\t\ttype: LAYOUT_PICKER_TABLE,\n\t\tlabel: __( 'Table' ),\n\t\tcomponent: ViewPickerTable,\n\t\ticon: blockTable,\n\t\tviewConfigOptions: DensityPicker,\n\t\tisPicker: true,\n\t},\n\t{\n\t\ttype: LAYOUT_PICKER_ACTIVITY,\n\t\tlabel: __( 'Activity' ),\n\t\tcomponent: ViewPickerActivity,\n\t\ticon: scheduled,\n\t\tviewConfigOptions: DensityPicker,\n\t\tisPicker: true,\n\t},\n];\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAA0B;AAC1B,mBAMO;AAKP,mBAAsB;AACtB,kBAAqB;AACrB,kBAAqB;AACrB,sBAAyB;AACzB,yBAA2B;AAC3B,0BAA4B;AAC5B,6BAA+B;AAC/B,uBAQO;AACP,4BAA0B;AAC1B,iCAA8B;AAEvB,IAAM,eAAe;AAAA,EAC3B;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,OAAQ;AAAA,IACnB,WAAW,aAAAA;AAAA,IACX,MAAM;AAAA,IACN,mBAAmB,sBAAAC;AAAA,EACpB;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,MAAO;AAAA,IAClB,WAAW,YAAAC;AAAA,IACX,MAAM;AAAA,IACN,mBAAmB,2BAAAC;AAAA,EACpB;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,MAAO;AAAA,IAClB,WAAW,YAAAC;AAAA,IACX,UAAM,mBAAM,IAAI,oCAAuB;AAAA,IACvC,mBAAmB,sBAAAH;AAAA,EACpB;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,UAAW;AAAA,IACtB,WAAW,gBAAAI;AAAA,IACX,MAAM;AAAA,IACN,mBAAmB,sBAAAJ;AAAA,EACpB;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,MAAO;AAAA,IAClB,WAAW,mBAAAK;AAAA,IACX,MAAM;AAAA,IACN,mBAAmB,2BAAAH;AAAA,IACnB,UAAU;AAAA,EACX;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,OAAQ;AAAA,IACnB,WAAW,oBAAAI;AAAA,IACX,MAAM;AAAA,IACN,mBAAmB,sBAAAN;AAAA,IACnB,UAAU;AAAA,EACX;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,UAAW;AAAA,IACtB,WAAW,uBAAAO;AAAA,IACX,MAAM;AAAA,IACN,mBAAmB,sBAAAP;AAAA,IACnB,UAAU;AAAA,EACX;AACD;",
|
|
6
|
+
"names": ["ViewTable", "DensityPicker", "ViewGrid", "GridConfigOptions", "ViewList", "ViewActivity", "ViewPickerGrid", "ViewPickerTable", "ViewPickerActivity"]
|
|
7
7
|
}
|
|
@@ -0,0 +1,304 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
|
|
30
|
+
// packages/dataviews/src/components/dataviews-layouts/picker-activity/index.tsx
|
|
31
|
+
var picker_activity_exports = {};
|
|
32
|
+
__export(picker_activity_exports, {
|
|
33
|
+
default: () => ViewPickerActivity
|
|
34
|
+
});
|
|
35
|
+
module.exports = __toCommonJS(picker_activity_exports);
|
|
36
|
+
var import_clsx = __toESM(require("clsx"));
|
|
37
|
+
var import_components = require("@wordpress/components");
|
|
38
|
+
var import_element = require("@wordpress/element");
|
|
39
|
+
var import_compose = require("@wordpress/compose");
|
|
40
|
+
var import_i18n = require("@wordpress/i18n");
|
|
41
|
+
var import_ui = require("@wordpress/ui");
|
|
42
|
+
var import_dataviews_context = __toESM(require("../../dataviews-context/index.cjs"));
|
|
43
|
+
var import_dataviews_picker_footer = require("../../dataviews-picker-footer/index.cjs");
|
|
44
|
+
var import_get_data_by_group = __toESM(require("../utils/get-data-by-group.cjs"));
|
|
45
|
+
var import_use_infinite_scroll = require("../utils/use-infinite-scroll.cjs");
|
|
46
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
47
|
+
function isDefined(item) {
|
|
48
|
+
return !!item;
|
|
49
|
+
}
|
|
50
|
+
function PickerActivityItem({
|
|
51
|
+
view,
|
|
52
|
+
multiselect,
|
|
53
|
+
selection,
|
|
54
|
+
onChangeSelection,
|
|
55
|
+
getItemId,
|
|
56
|
+
item,
|
|
57
|
+
titleField,
|
|
58
|
+
mediaField,
|
|
59
|
+
descriptionField,
|
|
60
|
+
otherFields,
|
|
61
|
+
posinset,
|
|
62
|
+
setsize
|
|
63
|
+
}) {
|
|
64
|
+
const elementRef = (0, import_element.useRef)(null);
|
|
65
|
+
(0, import_use_infinite_scroll.useIntersectionObserver)(elementRef, posinset);
|
|
66
|
+
const { showTitle = true, showMedia = true, showDescription = true } = view;
|
|
67
|
+
const id = getItemId(item);
|
|
68
|
+
const isSelected = selection.includes(id);
|
|
69
|
+
const density = view.layout?.density ?? "balanced";
|
|
70
|
+
const mediaContent = showMedia && density !== "compact" && mediaField?.render ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
71
|
+
mediaField.render,
|
|
72
|
+
{
|
|
73
|
+
item,
|
|
74
|
+
field: mediaField,
|
|
75
|
+
config: {
|
|
76
|
+
sizes: density === "comfortable" ? "32px" : "24px"
|
|
77
|
+
}
|
|
78
|
+
}
|
|
79
|
+
) : null;
|
|
80
|
+
const renderedMediaField = /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dataviews-view-picker-activity__item-type-icon", children: mediaContent || /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
81
|
+
"span",
|
|
82
|
+
{
|
|
83
|
+
className: "dataviews-view-picker-activity__item-bullet",
|
|
84
|
+
"aria-hidden": "true"
|
|
85
|
+
}
|
|
86
|
+
) });
|
|
87
|
+
const renderedTitleField = showTitle && titleField?.render ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(titleField.render, { item, field: titleField }) : null;
|
|
88
|
+
const renderedDescriptionField = showDescription && descriptionField?.render ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(descriptionField.render, { item, field: descriptionField }) : null;
|
|
89
|
+
const verticalGap = (0, import_element.useMemo)(() => {
|
|
90
|
+
switch (density) {
|
|
91
|
+
case "comfortable":
|
|
92
|
+
return "md";
|
|
93
|
+
default:
|
|
94
|
+
return "sm";
|
|
95
|
+
}
|
|
96
|
+
}, [density]);
|
|
97
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
98
|
+
import_components.Composite.Item,
|
|
99
|
+
{
|
|
100
|
+
ref: elementRef,
|
|
101
|
+
role: "option",
|
|
102
|
+
"aria-label": titleField ? titleField.getValue({ item }) || void 0 : void 0,
|
|
103
|
+
"aria-posinset": posinset,
|
|
104
|
+
"aria-setsize": setsize,
|
|
105
|
+
"aria-selected": isSelected,
|
|
106
|
+
className: (0, import_clsx.default)(
|
|
107
|
+
"dataviews-view-picker-activity__item",
|
|
108
|
+
density === "compact" && "is-compact",
|
|
109
|
+
density === "balanced" && "is-balanced",
|
|
110
|
+
density === "comfortable" && "is-comfortable",
|
|
111
|
+
isSelected && "is-selected"
|
|
112
|
+
),
|
|
113
|
+
onClick: () => {
|
|
114
|
+
if (isSelected) {
|
|
115
|
+
onChangeSelection(
|
|
116
|
+
selection.filter((itemId) => id !== itemId)
|
|
117
|
+
);
|
|
118
|
+
} else {
|
|
119
|
+
const newSelection = multiselect ? [...selection, id] : [id];
|
|
120
|
+
onChangeSelection(newSelection);
|
|
121
|
+
}
|
|
122
|
+
},
|
|
123
|
+
render: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {}),
|
|
124
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ui.Stack, { direction: "row", gap: "lg", justify: "start", align: "flex-start", children: [
|
|
125
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
126
|
+
import_ui.Stack,
|
|
127
|
+
{
|
|
128
|
+
direction: "column",
|
|
129
|
+
gap: "xs",
|
|
130
|
+
align: "center",
|
|
131
|
+
className: "dataviews-view-picker-activity__item-type",
|
|
132
|
+
children: renderedMediaField
|
|
133
|
+
}
|
|
134
|
+
),
|
|
135
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
136
|
+
import_ui.Stack,
|
|
137
|
+
{
|
|
138
|
+
direction: "column",
|
|
139
|
+
gap: verticalGap,
|
|
140
|
+
align: "flex-start",
|
|
141
|
+
className: "dataviews-view-picker-activity__item-content",
|
|
142
|
+
children: [
|
|
143
|
+
renderedTitleField && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dataviews-view-picker-activity__item-title", children: renderedTitleField }),
|
|
144
|
+
renderedDescriptionField && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dataviews-view-picker-activity__item-description", children: renderedDescriptionField }),
|
|
145
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dataviews-view-picker-activity__item-fields", children: otherFields.map((field) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
146
|
+
"div",
|
|
147
|
+
{
|
|
148
|
+
className: "dataviews-view-picker-activity__item-field",
|
|
149
|
+
children: [
|
|
150
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
151
|
+
import_ui.VisuallyHidden,
|
|
152
|
+
{
|
|
153
|
+
render: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {}),
|
|
154
|
+
className: "dataviews-view-picker-activity__item-field-label",
|
|
155
|
+
children: field.label
|
|
156
|
+
}
|
|
157
|
+
),
|
|
158
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "dataviews-view-picker-activity__item-field-value", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
159
|
+
field.render,
|
|
160
|
+
{
|
|
161
|
+
item,
|
|
162
|
+
field
|
|
163
|
+
}
|
|
164
|
+
) })
|
|
165
|
+
]
|
|
166
|
+
},
|
|
167
|
+
field.id
|
|
168
|
+
)) })
|
|
169
|
+
]
|
|
170
|
+
}
|
|
171
|
+
)
|
|
172
|
+
] })
|
|
173
|
+
}
|
|
174
|
+
);
|
|
175
|
+
}
|
|
176
|
+
function PickerActivityGroup({
|
|
177
|
+
groupName,
|
|
178
|
+
groupField,
|
|
179
|
+
showLabel = true,
|
|
180
|
+
children
|
|
181
|
+
}) {
|
|
182
|
+
const headerId = (0, import_compose.useInstanceId)(
|
|
183
|
+
PickerActivityGroup,
|
|
184
|
+
"dataviews-view-picker-activity-group__header"
|
|
185
|
+
);
|
|
186
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
187
|
+
import_ui.Stack,
|
|
188
|
+
{
|
|
189
|
+
direction: "column",
|
|
190
|
+
role: "group",
|
|
191
|
+
"aria-labelledby": headerId,
|
|
192
|
+
className: "dataviews-view-picker-activity-group",
|
|
193
|
+
children: [
|
|
194
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
195
|
+
"h3",
|
|
196
|
+
{
|
|
197
|
+
className: "dataviews-view-picker-activity-group__header",
|
|
198
|
+
id: headerId,
|
|
199
|
+
children: showLabel ? (0, import_i18n.sprintf)(
|
|
200
|
+
// translators: 1: The label of the field e.g. "Date". 2: The value of the field, e.g.: "May 2022".
|
|
201
|
+
(0, import_i18n.__)("%1$s: %2$s"),
|
|
202
|
+
groupField.label,
|
|
203
|
+
groupName
|
|
204
|
+
) : groupName
|
|
205
|
+
}
|
|
206
|
+
),
|
|
207
|
+
children
|
|
208
|
+
]
|
|
209
|
+
}
|
|
210
|
+
);
|
|
211
|
+
}
|
|
212
|
+
function ViewPickerActivity({
|
|
213
|
+
data,
|
|
214
|
+
fields,
|
|
215
|
+
getItemId,
|
|
216
|
+
isLoading,
|
|
217
|
+
onChangeSelection,
|
|
218
|
+
selection,
|
|
219
|
+
view,
|
|
220
|
+
actions,
|
|
221
|
+
className,
|
|
222
|
+
empty
|
|
223
|
+
}) {
|
|
224
|
+
const { itemListLabel, paginationInfo } = (0, import_element.useContext)(import_dataviews_context.default);
|
|
225
|
+
const isMultiselect = (0, import_dataviews_picker_footer.useIsMultiselectPicker)(actions);
|
|
226
|
+
const titleField = fields.find(
|
|
227
|
+
(field) => field.id === view?.titleField
|
|
228
|
+
);
|
|
229
|
+
const mediaField = fields.find(
|
|
230
|
+
(field) => field.id === view?.mediaField
|
|
231
|
+
);
|
|
232
|
+
const descriptionField = fields.find(
|
|
233
|
+
(field) => field.id === view?.descriptionField
|
|
234
|
+
);
|
|
235
|
+
const otherFields = (view?.fields ?? []).map((fieldId) => fields.find((f) => fieldId === f.id)).filter(isDefined);
|
|
236
|
+
const groupField = view.groupBy?.field ? fields.find((f) => f.id === view.groupBy?.field) : null;
|
|
237
|
+
const dataByGroup = groupField ? (0, import_get_data_by_group.default)(data, groupField) : null;
|
|
238
|
+
const isInfiniteScroll = (view.infiniteScrollEnabled && !dataByGroup) ?? false;
|
|
239
|
+
const setsize = isInfiniteScroll ? paginationInfo?.totalItems : void 0;
|
|
240
|
+
const hasData = !!data?.length;
|
|
241
|
+
const isGrouped = !!(groupField && dataByGroup);
|
|
242
|
+
const renderItem = (item) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
243
|
+
PickerActivityItem,
|
|
244
|
+
{
|
|
245
|
+
view,
|
|
246
|
+
multiselect: isMultiselect,
|
|
247
|
+
selection,
|
|
248
|
+
onChangeSelection,
|
|
249
|
+
getItemId,
|
|
250
|
+
item,
|
|
251
|
+
titleField,
|
|
252
|
+
mediaField,
|
|
253
|
+
descriptionField,
|
|
254
|
+
otherFields,
|
|
255
|
+
posinset: item.position,
|
|
256
|
+
setsize
|
|
257
|
+
},
|
|
258
|
+
getItemId(item)
|
|
259
|
+
);
|
|
260
|
+
if (!hasData) {
|
|
261
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
262
|
+
"div",
|
|
263
|
+
{
|
|
264
|
+
className: (0, import_clsx.default)({
|
|
265
|
+
"dataviews-loading": isLoading,
|
|
266
|
+
"dataviews-no-results": !isLoading
|
|
267
|
+
}),
|
|
268
|
+
children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Spinner, {}) }) : empty
|
|
269
|
+
}
|
|
270
|
+
);
|
|
271
|
+
}
|
|
272
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
273
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
274
|
+
import_components.Composite,
|
|
275
|
+
{
|
|
276
|
+
virtualFocus: true,
|
|
277
|
+
orientation: "vertical",
|
|
278
|
+
role: "listbox",
|
|
279
|
+
"aria-multiselectable": isMultiselect,
|
|
280
|
+
"aria-label": itemListLabel,
|
|
281
|
+
"aria-busy": isLoading,
|
|
282
|
+
render: isGrouped ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.Stack, { direction: "column", gap: "sm" }) : void 0,
|
|
283
|
+
className: (0, import_clsx.default)(
|
|
284
|
+
"dataviews-view-picker-activity",
|
|
285
|
+
className
|
|
286
|
+
),
|
|
287
|
+
children: isGrouped && dataByGroup ? Array.from(dataByGroup.entries()).map(
|
|
288
|
+
([groupName, groupItems]) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
289
|
+
PickerActivityGroup,
|
|
290
|
+
{
|
|
291
|
+
groupName,
|
|
292
|
+
groupField,
|
|
293
|
+
showLabel: view.groupBy?.showLabel !== false,
|
|
294
|
+
children: groupItems.map(renderItem)
|
|
295
|
+
},
|
|
296
|
+
groupName
|
|
297
|
+
)
|
|
298
|
+
) : data.map(renderItem)
|
|
299
|
+
}
|
|
300
|
+
),
|
|
301
|
+
isLoading && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "dataviews-loading-more", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Spinner, {}) })
|
|
302
|
+
] });
|
|
303
|
+
}
|
|
304
|
+
//# sourceMappingURL=index.cjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/components/dataviews-layouts/picker-activity/index.tsx"],
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport type { ReactNode } from 'react';\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { Spinner, Composite } from '@wordpress/components';\nimport { useContext, useMemo, useRef } from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { Stack, VisuallyHidden } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport DataViewsContext from '../../dataviews-context';\nimport { useIsMultiselectPicker } from '../../dataviews-picker-footer';\nimport getDataByGroup from '../utils/get-data-by-group';\nimport { useIntersectionObserver } from '../utils/use-infinite-scroll';\nimport type {\n\tNormalizedField,\n\tViewPickerActivity as ViewPickerActivityType,\n\tViewPickerActivityProps,\n} from '../../../types';\nimport type { SetSelection } from '../../../types/private';\n\nfunction isDefined< T >( item: T | undefined ): item is T {\n\treturn !! item;\n}\n\ninterface PickerActivityItemProps< Item > {\n\tview: ViewPickerActivityType;\n\tmultiselect?: boolean;\n\tselection: string[];\n\tonChangeSelection: SetSelection;\n\tgetItemId: ( item: Item ) => string;\n\titem: Item;\n\ttitleField?: NormalizedField< Item >;\n\tmediaField?: NormalizedField< Item >;\n\tdescriptionField?: NormalizedField< Item >;\n\totherFields: NormalizedField< Item >[];\n\tposinset?: number;\n\tsetsize?: number;\n}\n\nfunction PickerActivityItem< Item >( {\n\tview,\n\tmultiselect,\n\tselection,\n\tonChangeSelection,\n\tgetItemId,\n\titem,\n\ttitleField,\n\tmediaField,\n\tdescriptionField,\n\totherFields,\n\tposinset,\n\tsetsize,\n}: PickerActivityItemProps< Item > ) {\n\tconst elementRef = useRef< HTMLButtonElement >( null );\n\tuseIntersectionObserver( elementRef, posinset );\n\tconst { showTitle = true, showMedia = true, showDescription = true } = view;\n\tconst id = getItemId( item );\n\tconst isSelected = selection.includes( id );\n\tconst density = view.layout?.density ?? 'balanced';\n\n\tconst mediaContent =\n\t\tshowMedia && density !== 'compact' && mediaField?.render ? (\n\t\t\t<mediaField.render\n\t\t\t\titem={ item }\n\t\t\t\tfield={ mediaField }\n\t\t\t\tconfig={ {\n\t\t\t\t\tsizes: density === 'comfortable' ? '32px' : '24px',\n\t\t\t\t} }\n\t\t\t/>\n\t\t) : null;\n\n\tconst renderedMediaField = (\n\t\t<div className=\"dataviews-view-picker-activity__item-type-icon\">\n\t\t\t{ mediaContent || (\n\t\t\t\t<span\n\t\t\t\t\tclassName=\"dataviews-view-picker-activity__item-bullet\"\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t/>\n\t\t\t) }\n\t\t</div>\n\t);\n\n\tconst renderedTitleField =\n\t\tshowTitle && titleField?.render ? (\n\t\t\t<titleField.render item={ item } field={ titleField } />\n\t\t) : null;\n\n\tconst renderedDescriptionField =\n\t\tshowDescription && descriptionField?.render ? (\n\t\t\t<descriptionField.render item={ item } field={ descriptionField } />\n\t\t) : null;\n\n\tconst verticalGap = useMemo( () => {\n\t\tswitch ( density ) {\n\t\t\tcase 'comfortable':\n\t\t\t\treturn 'md';\n\t\t\tdefault:\n\t\t\t\treturn 'sm';\n\t\t}\n\t}, [ density ] );\n\n\treturn (\n\t\t<Composite.Item\n\t\t\tref={ elementRef }\n\t\t\trole=\"option\"\n\t\t\taria-label={\n\t\t\t\ttitleField\n\t\t\t\t\t? titleField.getValue( { item } ) || undefined\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\taria-posinset={ posinset }\n\t\t\taria-setsize={ setsize }\n\t\t\taria-selected={ isSelected }\n\t\t\tclassName={ clsx(\n\t\t\t\t'dataviews-view-picker-activity__item',\n\t\t\t\tdensity === 'compact' && 'is-compact',\n\t\t\t\tdensity === 'balanced' && 'is-balanced',\n\t\t\t\tdensity === 'comfortable' && 'is-comfortable',\n\t\t\t\tisSelected && 'is-selected'\n\t\t\t) }\n\t\t\tonClick={ () => {\n\t\t\t\tif ( isSelected ) {\n\t\t\t\t\tonChangeSelection(\n\t\t\t\t\t\tselection.filter( ( itemId ) => id !== itemId )\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\tconst newSelection = multiselect\n\t\t\t\t\t\t? [ ...selection, id ]\n\t\t\t\t\t\t: [ id ];\n\t\t\t\t\tonChangeSelection( newSelection );\n\t\t\t\t}\n\t\t\t} }\n\t\t\trender={ <div /> }\n\t\t>\n\t\t\t<Stack direction=\"row\" gap=\"lg\" justify=\"start\" align=\"flex-start\">\n\t\t\t\t<Stack\n\t\t\t\t\tdirection=\"column\"\n\t\t\t\t\tgap=\"xs\"\n\t\t\t\t\talign=\"center\"\n\t\t\t\t\tclassName=\"dataviews-view-picker-activity__item-type\"\n\t\t\t\t>\n\t\t\t\t\t{ renderedMediaField }\n\t\t\t\t</Stack>\n\t\t\t\t<Stack\n\t\t\t\t\tdirection=\"column\"\n\t\t\t\t\tgap={ verticalGap }\n\t\t\t\t\talign=\"flex-start\"\n\t\t\t\t\tclassName=\"dataviews-view-picker-activity__item-content\"\n\t\t\t\t>\n\t\t\t\t\t{ renderedTitleField && (\n\t\t\t\t\t\t<div className=\"dataviews-view-picker-activity__item-title\">\n\t\t\t\t\t\t\t{ renderedTitleField }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\t\t\t\t\t{ renderedDescriptionField && (\n\t\t\t\t\t\t<div className=\"dataviews-view-picker-activity__item-description\">\n\t\t\t\t\t\t\t{ renderedDescriptionField }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\t\t\t\t\t<div className=\"dataviews-view-picker-activity__item-fields\">\n\t\t\t\t\t\t{ otherFields.map( ( field ) => (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\t\t\tclassName=\"dataviews-view-picker-activity__item-field\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<VisuallyHidden\n\t\t\t\t\t\t\t\t\trender={ <span /> }\n\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-picker-activity__item-field-label\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ field.label }\n\t\t\t\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t\t\t\t\t<span className=\"dataviews-view-picker-activity__item-field-value\">\n\t\t\t\t\t\t\t\t\t<field.render\n\t\t\t\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\t\t\t\tfield={ field }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) ) }\n\t\t\t\t\t</div>\n\t\t\t\t</Stack>\n\t\t\t</Stack>\n\t\t</Composite.Item>\n\t);\n}\n\nfunction PickerActivityGroup< Item >( {\n\tgroupName,\n\tgroupField,\n\tshowLabel = true,\n\tchildren,\n}: {\n\tgroupName: string;\n\tgroupField: NormalizedField< Item >;\n\tshowLabel?: boolean;\n\tchildren: ReactNode;\n} ) {\n\tconst headerId = useInstanceId(\n\t\tPickerActivityGroup,\n\t\t'dataviews-view-picker-activity-group__header'\n\t);\n\treturn (\n\t\t<Stack\n\t\t\tdirection=\"column\"\n\t\t\trole=\"group\"\n\t\t\taria-labelledby={ headerId }\n\t\t\tclassName=\"dataviews-view-picker-activity-group\"\n\t\t>\n\t\t\t<h3\n\t\t\t\tclassName=\"dataviews-view-picker-activity-group__header\"\n\t\t\t\tid={ headerId }\n\t\t\t>\n\t\t\t\t{ showLabel\n\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t// translators: 1: The label of the field e.g. \"Date\". 2: The value of the field, e.g.: \"May 2022\".\n\t\t\t\t\t\t\t__( '%1$s: %2$s' ),\n\t\t\t\t\t\t\tgroupField.label,\n\t\t\t\t\t\t\tgroupName\n\t\t\t\t\t )\n\t\t\t\t\t: groupName }\n\t\t\t</h3>\n\t\t\t{ children }\n\t\t</Stack>\n\t);\n}\n\nexport default function ViewPickerActivity< Item >( {\n\tdata,\n\tfields,\n\tgetItemId,\n\tisLoading,\n\tonChangeSelection,\n\tselection,\n\tview,\n\tactions,\n\tclassName,\n\tempty,\n}: ViewPickerActivityProps< Item > ) {\n\tconst { itemListLabel, paginationInfo } = useContext( DataViewsContext );\n\tconst isMultiselect = useIsMultiselectPicker( actions );\n\n\tconst titleField = fields.find(\n\t\t( field ) => field.id === view?.titleField\n\t);\n\tconst mediaField = fields.find(\n\t\t( field ) => field.id === view?.mediaField\n\t);\n\tconst descriptionField = fields.find(\n\t\t( field ) => field.id === view?.descriptionField\n\t);\n\tconst otherFields = ( view?.fields ?? [] )\n\t\t.map( ( fieldId ) => fields.find( ( f ) => fieldId === f.id ) )\n\t\t.filter( isDefined );\n\n\tconst groupField = view.groupBy?.field\n\t\t? fields.find( ( f ) => f.id === view.groupBy?.field )\n\t\t: null;\n\tconst dataByGroup = groupField ? getDataByGroup( data, groupField ) : null;\n\n\tconst isInfiniteScroll =\n\t\t( view.infiniteScrollEnabled && ! dataByGroup ) ?? false;\n\tconst setsize = isInfiniteScroll ? paginationInfo?.totalItems : undefined;\n\n\tconst hasData = !! data?.length;\n\tconst isGrouped = !! ( groupField && dataByGroup );\n\n\tconst renderItem = ( item: Item ) => (\n\t\t<PickerActivityItem\n\t\t\tkey={ getItemId( item ) }\n\t\t\tview={ view }\n\t\t\tmultiselect={ isMultiselect }\n\t\t\tselection={ selection }\n\t\t\tonChangeSelection={ onChangeSelection }\n\t\t\tgetItemId={ getItemId }\n\t\t\titem={ item }\n\t\t\ttitleField={ titleField }\n\t\t\tmediaField={ mediaField }\n\t\t\tdescriptionField={ descriptionField }\n\t\t\totherFields={ otherFields }\n\t\t\tposinset={ ( item as { position?: number } ).position }\n\t\t\tsetsize={ setsize }\n\t\t/>\n\t);\n\n\tif ( ! hasData ) {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclassName={ clsx( {\n\t\t\t\t\t'dataviews-loading': isLoading,\n\t\t\t\t\t'dataviews-no-results': ! isLoading,\n\t\t\t\t} ) }\n\t\t\t>\n\t\t\t\t{ isLoading ? (\n\t\t\t\t\t<p>\n\t\t\t\t\t\t<Spinner />\n\t\t\t\t\t</p>\n\t\t\t\t) : (\n\t\t\t\t\tempty\n\t\t\t\t) }\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<Composite\n\t\t\t\tvirtualFocus\n\t\t\t\torientation=\"vertical\"\n\t\t\t\trole=\"listbox\"\n\t\t\t\taria-multiselectable={ isMultiselect }\n\t\t\t\taria-label={ itemListLabel }\n\t\t\t\taria-busy={ isLoading }\n\t\t\t\trender={\n\t\t\t\t\tisGrouped ? (\n\t\t\t\t\t\t<Stack direction=\"column\" gap=\"sm\" />\n\t\t\t\t\t) : undefined\n\t\t\t\t}\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\t'dataviews-view-picker-activity',\n\t\t\t\t\tclassName\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t{ isGrouped && dataByGroup\n\t\t\t\t\t? Array.from( dataByGroup.entries() ).map(\n\t\t\t\t\t\t\t( [ groupName, groupItems ]: [\n\t\t\t\t\t\t\t\tstring,\n\t\t\t\t\t\t\t\tItem[],\n\t\t\t\t\t\t\t] ) => (\n\t\t\t\t\t\t\t\t<PickerActivityGroup< Item >\n\t\t\t\t\t\t\t\t\tkey={ groupName }\n\t\t\t\t\t\t\t\t\tgroupName={ groupName }\n\t\t\t\t\t\t\t\t\tgroupField={ groupField }\n\t\t\t\t\t\t\t\t\tshowLabel={\n\t\t\t\t\t\t\t\t\t\tview.groupBy?.showLabel !== false\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ groupItems.map( renderItem ) }\n\t\t\t\t\t\t\t\t</PickerActivityGroup>\n\t\t\t\t\t\t\t)\n\t\t\t\t\t )\n\t\t\t\t\t: data.map( renderItem ) }\n\t\t\t</Composite>\n\t\t\t{ isLoading && (\n\t\t\t\t<p className=\"dataviews-loading-more\">\n\t\t\t\t\t<Spinner />\n\t\t\t\t</p>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["clsx", "DataViewsContext", "getDataByGroup"]
|
|
7
|
+
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/dataviews-view-config/index.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport type { ChangeEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\t__experimentalDropdownContentWrapper as DropdownContentWrapper,\n\tDropdown,\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n\t__experimentalToggleGroupControlOptionIcon as ToggleGroupControlOptionIcon,\n\tSelectControl,\n\t__experimentalHeading as Heading,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { __, _x } from '@wordpress/i18n';\nimport { memo, useContext, useMemo } from '@wordpress/element';\nimport { cog } from '@wordpress/icons';\nimport warning from '@wordpress/warning';\nimport { useInstanceId } from '@wordpress/compose';\nimport { Stack } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport { SORTING_DIRECTIONS, sortIcons, sortLabels } from '../../constants';\nimport { VIEW_LAYOUTS } from '../dataviews-layouts';\nimport type { View } from '../../types';\nimport DataViewsContext from '../dataviews-context';\nimport { PropertiesSection } from './properties-section';\nimport { unlock } from '../../lock-unlock';\n\nconst { Menu } = unlock( componentsPrivateApis );\n\nconst DATAVIEWS_CONFIG_POPOVER_PROPS = {\n\tclassName: 'dataviews-config__popover',\n\tplacement: 'bottom-end',\n\toffset: 9,\n};\n\nexport function ViewTypeMenu() {\n\tconst { view, onChangeView, defaultLayouts } =\n\t\tuseContext( DataViewsContext );\n\tconst availableLayouts = Object.keys( defaultLayouts );\n\tif ( availableLayouts.length <= 1 ) {\n\t\treturn null;\n\t}\n\tconst activeView = VIEW_LAYOUTS.find( ( v ) => view.type === v.type );\n\treturn (\n\t\t<Menu>\n\t\t\t<Menu.TriggerButton\n\t\t\t\trender={\n\t\t\t\t\t<Button\n\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\ticon={ activeView?.icon }\n\t\t\t\t\t\tlabel={ __( 'Layout' ) }\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t/>\n\t\t\t<Menu.Popover>\n\t\t\t\t{ availableLayouts.map( ( layout ) => {\n\t\t\t\t\tconst config = VIEW_LAYOUTS.find(\n\t\t\t\t\t\t( v ) => v.type === layout\n\t\t\t\t\t);\n\t\t\t\t\tif ( ! config ) {\n\t\t\t\t\t\treturn null;\n\t\t\t\t\t}\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<Menu.RadioItem\n\t\t\t\t\t\t\tkey={ layout }\n\t\t\t\t\t\t\tvalue={ layout }\n\t\t\t\t\t\t\tname=\"view-actions-available-view\"\n\t\t\t\t\t\t\tchecked={ layout === view.type }\n\t\t\t\t\t\t\thideOnClick\n\t\t\t\t\t\t\tonChange={ (\n\t\t\t\t\t\t\t\te: ChangeEvent< HTMLInputElement >\n\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\tswitch ( e.target.value ) {\n\t\t\t\t\t\t\t\t\tcase 'list':\n\t\t\t\t\t\t\t\t\tcase 'grid':\n\t\t\t\t\t\t\t\t\tcase 'table':\n\t\t\t\t\t\t\t\t\tcase 'pickerGrid':\n\t\t\t\t\t\t\t\t\tcase 'pickerTable':\n\t\t\t\t\t\t\t\t\tcase 'activity':\n\t\t\t\t\t\t\t\t\t\tconst viewWithoutLayout = { ...view };\n\t\t\t\t\t\t\t\t\t\tif ( 'layout' in viewWithoutLayout ) {\n\t\t\t\t\t\t\t\t\t\t\tdelete viewWithoutLayout.layout;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\treturn onChangeView( {\n\t\t\t\t\t\t\t\t\t\t\t...viewWithoutLayout,\n\t\t\t\t\t\t\t\t\t\t\ttype: e.target.value,\n\t\t\t\t\t\t\t\t\t\t\t...defaultLayouts[ e.target.value ],\n\t\t\t\t\t\t\t\t\t\t} as View );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\twarning( 'Invalid dataview' );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Menu.ItemLabel>{ config.label }</Menu.ItemLabel>\n\t\t\t\t\t\t</Menu.RadioItem>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t</Menu.Popover>\n\t\t</Menu>\n\t);\n}\n\nfunction SortFieldControl() {\n\tconst { view, fields, onChangeView } = useContext( DataViewsContext );\n\tconst orderOptions = useMemo( () => {\n\t\tconst sortableFields = fields.filter(\n\t\t\t( field ) => field.enableSorting !== false\n\t\t);\n\t\treturn sortableFields.map( ( field ) => {\n\t\t\treturn {\n\t\t\t\tlabel: field.label,\n\t\t\t\tvalue: field.id,\n\t\t\t};\n\t\t} );\n\t}, [ fields ] );\n\n\treturn (\n\t\t<SelectControl\n\t\t\t__next40pxDefaultSize\n\t\t\tlabel={ __( 'Sort by' ) }\n\t\t\tvalue={ view.sort?.field }\n\t\t\toptions={ orderOptions }\n\t\t\tonChange={ ( value: string ) => {\n\t\t\t\tonChangeView( {\n\t\t\t\t\t...view,\n\t\t\t\t\tsort: {\n\t\t\t\t\t\tdirection: view?.sort?.direction || 'desc',\n\t\t\t\t\t\tfield: value,\n\t\t\t\t\t},\n\t\t\t\t\tshowLevels: false,\n\t\t\t\t} );\n\t\t\t} }\n\t\t/>\n\t);\n}\n\nfunction SortDirectionControl() {\n\tconst { view, fields, onChangeView } = useContext( DataViewsContext );\n\n\tconst sortableFields = fields.filter(\n\t\t( field ) => field.enableSorting !== false\n\t);\n\tif ( sortableFields.length === 0 ) {\n\t\treturn null;\n\t}\n\n\tlet value = view.sort?.direction;\n\tif ( ! value && view.sort?.field ) {\n\t\tvalue = 'desc';\n\t}\n\treturn (\n\t\t<ToggleGroupControl\n\t\t\tclassName=\"dataviews-view-config__sort-direction\"\n\t\t\t__next40pxDefaultSize\n\t\t\tisBlock\n\t\t\tlabel={ __( 'Order' ) }\n\t\t\tvalue={ value }\n\t\t\tonChange={ ( newDirection ) => {\n\t\t\t\tif ( newDirection === 'asc' || newDirection === 'desc' ) {\n\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t...view,\n\t\t\t\t\t\tsort: {\n\t\t\t\t\t\t\tdirection: newDirection,\n\t\t\t\t\t\t\tfield:\n\t\t\t\t\t\t\t\tview.sort?.field ||\n\t\t\t\t\t\t\t\t// If there is no field assigned as the sorting field assign the first sortable field.\n\t\t\t\t\t\t\t\tfields.find(\n\t\t\t\t\t\t\t\t\t( field ) => field.enableSorting !== false\n\t\t\t\t\t\t\t\t)?.id ||\n\t\t\t\t\t\t\t\t'',\n\t\t\t\t\t\t},\n\t\t\t\t\t\tshowLevels: false,\n\t\t\t\t\t} );\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\twarning( 'Invalid direction' );\n\t\t\t} }\n\t\t>\n\t\t\t{ SORTING_DIRECTIONS.map( ( direction ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<ToggleGroupControlOptionIcon\n\t\t\t\t\t\tkey={ direction }\n\t\t\t\t\t\tvalue={ direction }\n\t\t\t\t\t\ticon={ sortIcons[ direction ] }\n\t\t\t\t\t\tlabel={ sortLabels[ direction ] }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ToggleGroupControl>\n\t);\n}\n\nfunction ItemsPerPageControl() {\n\tconst { view, config, onChangeView } = useContext( DataViewsContext );\n\tconst { infiniteScrollEnabled } = view;\n\tif (\n\t\t! config ||\n\t\t! config.perPageSizes ||\n\t\tconfig.perPageSizes.length < 2 ||\n\t\tconfig.perPageSizes.length > 6 ||\n\t\tinfiniteScrollEnabled\n\t) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<ToggleGroupControl\n\t\t\t__next40pxDefaultSize\n\t\t\tisBlock\n\t\t\tlabel={ __( 'Items per page' ) }\n\t\t\tvalue={ view.perPage || 10 }\n\t\t\tdisabled={ ! view?.sort?.field }\n\t\t\tonChange={ ( newItemsPerPage ) => {\n\t\t\t\tconst newItemsPerPageNumber =\n\t\t\t\t\ttypeof newItemsPerPage === 'number' ||\n\t\t\t\t\tnewItemsPerPage === undefined\n\t\t\t\t\t\t? newItemsPerPage\n\t\t\t\t\t\t: parseInt( newItemsPerPage, 10 );\n\t\t\t\tonChangeView( {\n\t\t\t\t\t...view,\n\t\t\t\t\tperPage: newItemsPerPageNumber,\n\t\t\t\t\tpage: 1,\n\t\t\t\t} );\n\t\t\t} }\n\t\t>\n\t\t\t{ config.perPageSizes.map( ( value ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\t\tkey={ value }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tlabel={ value.toString() }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ToggleGroupControl>\n\t);\n}\n\nfunction ResetViewButton() {\n\tconst { onReset } = useContext( DataViewsContext );\n\n\t// Don't render if no persistence support (onReset is undefined)\n\tif ( onReset === undefined ) {\n\t\treturn null;\n\t}\n\n\tconst isDisabled = onReset === false;\n\n\treturn (\n\t\t<Button\n\t\t\tvariant=\"tertiary\"\n\t\t\tsize=\"compact\"\n\t\t\tdisabled={ isDisabled }\n\t\t\taccessibleWhenDisabled\n\t\t\tclassName=\"dataviews-view-config__reset-button\"\n\t\t\tonClick={ () => {\n\t\t\t\tif ( typeof onReset === 'function' ) {\n\t\t\t\t\tonReset();\n\t\t\t\t}\n\t\t\t} }\n\t\t>\n\t\t\t{ __( 'Reset view' ) }\n\t\t</Button>\n\t);\n}\n\nexport function DataviewsViewConfigDropdown() {\n\tconst { view, onReset } = useContext( DataViewsContext );\n\tconst popoverId = useInstanceId(\n\t\t_DataViewsViewConfig,\n\t\t'dataviews-view-config-dropdown'\n\t);\n\tconst activeLayout = VIEW_LAYOUTS.find(\n\t\t( layout ) => layout.type === view.type\n\t);\n\tconst isModified = typeof onReset === 'function';\n\treturn (\n\t\t<Dropdown\n\t\t\texpandOnMobile\n\t\t\tpopoverProps={ {\n\t\t\t\t...DATAVIEWS_CONFIG_POPOVER_PROPS,\n\t\t\t\tid: popoverId,\n\t\t\t} }\n\t\t\trenderToggle={ ( { onToggle, isOpen } ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<div className=\"dataviews-view-config__toggle-wrapper\">\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t\ticon={ cog }\n\t\t\t\t\t\t\tlabel={ _x(\n\t\t\t\t\t\t\t\t'View options',\n\t\t\t\t\t\t\t\t'View is used as a noun'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\t\taria-expanded={ isOpen ? 'true' : 'false' }\n\t\t\t\t\t\t\taria-controls={ popoverId }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{ isModified && (\n\t\t\t\t\t\t\t<span className=\"dataviews-view-config__modified-indicator\" />\n\t\t\t\t\t\t) }\n\t\t\t\t\t</div>\n\t\t\t\t);\n\t\t\t} }\n\t\t\trenderContent={ () => (\n\t\t\t\t<DropdownContentWrapper\n\t\t\t\t\tpaddingSize=\"medium\"\n\t\t\t\t\tclassName=\"dataviews-config__popover-content-wrapper\"\n\t\t\t\t>\n\t\t\t\t\t<Stack\n\t\t\t\t\t\tdirection=\"column\"\n\t\t\t\t\t\tclassName=\"dataviews-view-config\"\n\t\t\t\t\t\tgap=\"xl\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<Stack\n\t\t\t\t\t\t\tdirection=\"row\"\n\t\t\t\t\t\t\tjustify=\"space-between\"\n\t\t\t\t\t\t\talign=\"center\"\n\t\t\t\t\t\t\tclassName=\"dataviews-view-config__header\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Heading\n\t\t\t\t\t\t\t\tlevel={ 2 }\n\t\t\t\t\t\t\t\tclassName=\"dataviews-settings-section__title\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'Appearance' ) }\n\t\t\t\t\t\t\t</Heading>\n\t\t\t\t\t\t\t<ResetViewButton />\n\t\t\t\t\t\t</Stack>\n\t\t\t\t\t\t<Stack direction=\"column\" gap=\"lg\">\n\t\t\t\t\t\t\t<Stack\n\t\t\t\t\t\t\t\tdirection=\"row\"\n\t\t\t\t\t\t\t\tgap=\"sm\"\n\t\t\t\t\t\t\t\tclassName=\"dataviews-view-config__sort-controls\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<SortFieldControl />\n\t\t\t\t\t\t\t\t<SortDirectionControl />\n\t\t\t\t\t\t\t</Stack>\n\t\t\t\t\t\t\t{ !! activeLayout?.viewConfigOptions && (\n\t\t\t\t\t\t\t\t<activeLayout.viewConfigOptions />\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t<ItemsPerPageControl />\n\t\t\t\t\t\t\t<PropertiesSection />\n\t\t\t\t\t\t</Stack>\n\t\t\t\t\t</Stack>\n\t\t\t\t</DropdownContentWrapper>\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nfunction _DataViewsViewConfig() {\n\treturn (\n\t\t<>\n\t\t\t<ViewTypeMenu />\n\t\t\t<DataviewsViewConfigDropdown />\n\t\t</>\n\t);\n}\n\nconst DataViewsViewConfig = memo( _DataViewsViewConfig );\n\nexport default DataViewsViewConfig;\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA,wBAUO;AACP,kBAAuB;AACvB,qBAA0C;AAC1C,mBAAoB;AACpB,qBAAoB;AACpB,qBAA8B;AAC9B,gBAAsB;AAKtB,uBAA0D;AAC1D,+BAA6B;AAE7B,+BAA6B;AAC7B,gCAAkC;AAClC,yBAAuB;AAmBrB;AAjBF,IAAM,EAAE,KAAK,QAAI,2BAAQ,kBAAAA,WAAsB;AAE/C,IAAM,iCAAiC;AAAA,EACtC,WAAW;AAAA,EACX,WAAW;AAAA,EACX,QAAQ;AACT;AAEO,SAAS,eAAe;AAC9B,QAAM,EAAE,MAAM,cAAc,eAAe,QAC1C,2BAAY,yBAAAC,OAAiB;AAC9B,QAAM,mBAAmB,OAAO,KAAM,cAAe;AACrD,MAAK,iBAAiB,UAAU,GAAI;AACnC,WAAO;AAAA,EACR;AACA,QAAM,aAAa,sCAAa,KAAM,CAAE,MAAO,KAAK,SAAS,EAAE,IAAK;AACpE,SACC,6CAAC,QACA;AAAA;AAAA,MAAC,KAAK;AAAA,MAAL;AAAA,QACA,QACC;AAAA,UAAC;AAAA;AAAA,YACA,MAAK;AAAA,YACL,MAAO,YAAY;AAAA,YACnB,WAAQ,gBAAI,QAAS;AAAA;AAAA,QACtB;AAAA;AAAA,IAEF;AAAA,IACA,4CAAC,KAAK,SAAL,EACE,2BAAiB,IAAK,CAAE,WAAY;AACrC,YAAM,SAAS,sCAAa;AAAA,QAC3B,CAAE,MAAO,EAAE,SAAS;AAAA,MACrB;AACA,UAAK,CAAE,QAAS;AACf,eAAO;AAAA,MACR;AACA,aACC;AAAA,QAAC,KAAK;AAAA,QAAL;AAAA,UAEA,OAAQ;AAAA,UACR,MAAK;AAAA,UACL,SAAU,WAAW,KAAK;AAAA,UAC1B,aAAW;AAAA,UACX,UAAW,CACV,MACI;AACJ,oBAAS,EAAE,OAAO,OAAQ;AAAA,cACzB,KAAK;AAAA,cACL,KAAK;AAAA,cACL,KAAK;AAAA,cACL,KAAK;AAAA,cACL,KAAK;AAAA,cACL,KAAK;AACJ,sBAAM,oBAAoB,EAAE,GAAG,KAAK;AACpC,oBAAK,YAAY,mBAAoB;AACpC,yBAAO,kBAAkB;AAAA,gBAC1B;AACA,uBAAO,aAAc;AAAA,kBACpB,GAAG;AAAA,kBACH,MAAM,EAAE,OAAO;AAAA,kBACf,GAAG,eAAgB,EAAE,OAAO,KAAM;AAAA,gBACnC,CAAU;AAAA,YACZ;AACA,+BAAAC,SAAS,kBAAmB;AAAA,UAC7B;AAAA,UAEA,sDAAC,KAAK,WAAL,EAAiB,iBAAO,OAAO;AAAA;AAAA,
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport type { ChangeEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\t__experimentalDropdownContentWrapper as DropdownContentWrapper,\n\tDropdown,\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n\t__experimentalToggleGroupControlOptionIcon as ToggleGroupControlOptionIcon,\n\tSelectControl,\n\t__experimentalHeading as Heading,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { __, _x } from '@wordpress/i18n';\nimport { memo, useContext, useMemo } from '@wordpress/element';\nimport { cog } from '@wordpress/icons';\nimport warning from '@wordpress/warning';\nimport { useInstanceId } from '@wordpress/compose';\nimport { Stack } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport { SORTING_DIRECTIONS, sortIcons, sortLabels } from '../../constants';\nimport { VIEW_LAYOUTS } from '../dataviews-layouts';\nimport type { View } from '../../types';\nimport DataViewsContext from '../dataviews-context';\nimport { PropertiesSection } from './properties-section';\nimport { unlock } from '../../lock-unlock';\n\nconst { Menu } = unlock( componentsPrivateApis );\n\nconst DATAVIEWS_CONFIG_POPOVER_PROPS = {\n\tclassName: 'dataviews-config__popover',\n\tplacement: 'bottom-end',\n\toffset: 9,\n};\n\nexport function ViewTypeMenu() {\n\tconst { view, onChangeView, defaultLayouts } =\n\t\tuseContext( DataViewsContext );\n\tconst availableLayouts = Object.keys( defaultLayouts );\n\tif ( availableLayouts.length <= 1 ) {\n\t\treturn null;\n\t}\n\tconst activeView = VIEW_LAYOUTS.find( ( v ) => view.type === v.type );\n\treturn (\n\t\t<Menu>\n\t\t\t<Menu.TriggerButton\n\t\t\t\trender={\n\t\t\t\t\t<Button\n\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\ticon={ activeView?.icon }\n\t\t\t\t\t\tlabel={ __( 'Layout' ) }\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t/>\n\t\t\t<Menu.Popover>\n\t\t\t\t{ availableLayouts.map( ( layout ) => {\n\t\t\t\t\tconst config = VIEW_LAYOUTS.find(\n\t\t\t\t\t\t( v ) => v.type === layout\n\t\t\t\t\t);\n\t\t\t\t\tif ( ! config ) {\n\t\t\t\t\t\treturn null;\n\t\t\t\t\t}\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<Menu.RadioItem\n\t\t\t\t\t\t\tkey={ layout }\n\t\t\t\t\t\t\tvalue={ layout }\n\t\t\t\t\t\t\tname=\"view-actions-available-view\"\n\t\t\t\t\t\t\tchecked={ layout === view.type }\n\t\t\t\t\t\t\thideOnClick\n\t\t\t\t\t\t\tonChange={ (\n\t\t\t\t\t\t\t\te: ChangeEvent< HTMLInputElement >\n\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\tswitch ( e.target.value ) {\n\t\t\t\t\t\t\t\t\tcase 'list':\n\t\t\t\t\t\t\t\t\tcase 'grid':\n\t\t\t\t\t\t\t\t\tcase 'table':\n\t\t\t\t\t\t\t\t\tcase 'pickerGrid':\n\t\t\t\t\t\t\t\t\tcase 'pickerTable':\n\t\t\t\t\t\t\t\t\tcase 'pickerActivity':\n\t\t\t\t\t\t\t\t\tcase 'activity':\n\t\t\t\t\t\t\t\t\t\tconst viewWithoutLayout = { ...view };\n\t\t\t\t\t\t\t\t\t\tif ( 'layout' in viewWithoutLayout ) {\n\t\t\t\t\t\t\t\t\t\t\tdelete viewWithoutLayout.layout;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\treturn onChangeView( {\n\t\t\t\t\t\t\t\t\t\t\t...viewWithoutLayout,\n\t\t\t\t\t\t\t\t\t\t\ttype: e.target.value,\n\t\t\t\t\t\t\t\t\t\t\t...defaultLayouts[ e.target.value ],\n\t\t\t\t\t\t\t\t\t\t} as View );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\twarning( 'Invalid dataview' );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Menu.ItemLabel>{ config.label }</Menu.ItemLabel>\n\t\t\t\t\t\t</Menu.RadioItem>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t</Menu.Popover>\n\t\t</Menu>\n\t);\n}\n\nfunction SortFieldControl() {\n\tconst { view, fields, onChangeView } = useContext( DataViewsContext );\n\tconst orderOptions = useMemo( () => {\n\t\tconst sortableFields = fields.filter(\n\t\t\t( field ) => field.enableSorting !== false\n\t\t);\n\t\treturn sortableFields.map( ( field ) => {\n\t\t\treturn {\n\t\t\t\tlabel: field.label,\n\t\t\t\tvalue: field.id,\n\t\t\t};\n\t\t} );\n\t}, [ fields ] );\n\n\treturn (\n\t\t<SelectControl\n\t\t\t__next40pxDefaultSize\n\t\t\tlabel={ __( 'Sort by' ) }\n\t\t\tvalue={ view.sort?.field }\n\t\t\toptions={ orderOptions }\n\t\t\tonChange={ ( value: string ) => {\n\t\t\t\tonChangeView( {\n\t\t\t\t\t...view,\n\t\t\t\t\tsort: {\n\t\t\t\t\t\tdirection: view?.sort?.direction || 'desc',\n\t\t\t\t\t\tfield: value,\n\t\t\t\t\t},\n\t\t\t\t\tshowLevels: false,\n\t\t\t\t} );\n\t\t\t} }\n\t\t/>\n\t);\n}\n\nfunction SortDirectionControl() {\n\tconst { view, fields, onChangeView } = useContext( DataViewsContext );\n\n\tconst sortableFields = fields.filter(\n\t\t( field ) => field.enableSorting !== false\n\t);\n\tif ( sortableFields.length === 0 ) {\n\t\treturn null;\n\t}\n\n\tlet value = view.sort?.direction;\n\tif ( ! value && view.sort?.field ) {\n\t\tvalue = 'desc';\n\t}\n\treturn (\n\t\t<ToggleGroupControl\n\t\t\tclassName=\"dataviews-view-config__sort-direction\"\n\t\t\t__next40pxDefaultSize\n\t\t\tisBlock\n\t\t\tlabel={ __( 'Order' ) }\n\t\t\tvalue={ value }\n\t\t\tonChange={ ( newDirection ) => {\n\t\t\t\tif ( newDirection === 'asc' || newDirection === 'desc' ) {\n\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t...view,\n\t\t\t\t\t\tsort: {\n\t\t\t\t\t\t\tdirection: newDirection,\n\t\t\t\t\t\t\tfield:\n\t\t\t\t\t\t\t\tview.sort?.field ||\n\t\t\t\t\t\t\t\t// If there is no field assigned as the sorting field assign the first sortable field.\n\t\t\t\t\t\t\t\tfields.find(\n\t\t\t\t\t\t\t\t\t( field ) => field.enableSorting !== false\n\t\t\t\t\t\t\t\t)?.id ||\n\t\t\t\t\t\t\t\t'',\n\t\t\t\t\t\t},\n\t\t\t\t\t\tshowLevels: false,\n\t\t\t\t\t} );\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\twarning( 'Invalid direction' );\n\t\t\t} }\n\t\t>\n\t\t\t{ SORTING_DIRECTIONS.map( ( direction ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<ToggleGroupControlOptionIcon\n\t\t\t\t\t\tkey={ direction }\n\t\t\t\t\t\tvalue={ direction }\n\t\t\t\t\t\ticon={ sortIcons[ direction ] }\n\t\t\t\t\t\tlabel={ sortLabels[ direction ] }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ToggleGroupControl>\n\t);\n}\n\nfunction ItemsPerPageControl() {\n\tconst { view, config, onChangeView } = useContext( DataViewsContext );\n\tconst { infiniteScrollEnabled } = view;\n\tif (\n\t\t! config ||\n\t\t! config.perPageSizes ||\n\t\tconfig.perPageSizes.length < 2 ||\n\t\tconfig.perPageSizes.length > 6 ||\n\t\tinfiniteScrollEnabled\n\t) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<ToggleGroupControl\n\t\t\t__next40pxDefaultSize\n\t\t\tisBlock\n\t\t\tlabel={ __( 'Items per page' ) }\n\t\t\tvalue={ view.perPage || 10 }\n\t\t\tdisabled={ ! view?.sort?.field }\n\t\t\tonChange={ ( newItemsPerPage ) => {\n\t\t\t\tconst newItemsPerPageNumber =\n\t\t\t\t\ttypeof newItemsPerPage === 'number' ||\n\t\t\t\t\tnewItemsPerPage === undefined\n\t\t\t\t\t\t? newItemsPerPage\n\t\t\t\t\t\t: parseInt( newItemsPerPage, 10 );\n\t\t\t\tonChangeView( {\n\t\t\t\t\t...view,\n\t\t\t\t\tperPage: newItemsPerPageNumber,\n\t\t\t\t\tpage: 1,\n\t\t\t\t} );\n\t\t\t} }\n\t\t>\n\t\t\t{ config.perPageSizes.map( ( value ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\t\tkey={ value }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tlabel={ value.toString() }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ToggleGroupControl>\n\t);\n}\n\nfunction ResetViewButton() {\n\tconst { onReset } = useContext( DataViewsContext );\n\n\t// Don't render if no persistence support (onReset is undefined)\n\tif ( onReset === undefined ) {\n\t\treturn null;\n\t}\n\n\tconst isDisabled = onReset === false;\n\n\treturn (\n\t\t<Button\n\t\t\tvariant=\"tertiary\"\n\t\t\tsize=\"compact\"\n\t\t\tdisabled={ isDisabled }\n\t\t\taccessibleWhenDisabled\n\t\t\tclassName=\"dataviews-view-config__reset-button\"\n\t\t\tonClick={ () => {\n\t\t\t\tif ( typeof onReset === 'function' ) {\n\t\t\t\t\tonReset();\n\t\t\t\t}\n\t\t\t} }\n\t\t>\n\t\t\t{ __( 'Reset view' ) }\n\t\t</Button>\n\t);\n}\n\nexport function DataviewsViewConfigDropdown() {\n\tconst { view, onReset } = useContext( DataViewsContext );\n\tconst popoverId = useInstanceId(\n\t\t_DataViewsViewConfig,\n\t\t'dataviews-view-config-dropdown'\n\t);\n\tconst activeLayout = VIEW_LAYOUTS.find(\n\t\t( layout ) => layout.type === view.type\n\t);\n\tconst isModified = typeof onReset === 'function';\n\treturn (\n\t\t<Dropdown\n\t\t\texpandOnMobile\n\t\t\tpopoverProps={ {\n\t\t\t\t...DATAVIEWS_CONFIG_POPOVER_PROPS,\n\t\t\t\tid: popoverId,\n\t\t\t} }\n\t\t\trenderToggle={ ( { onToggle, isOpen } ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<div className=\"dataviews-view-config__toggle-wrapper\">\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t\ticon={ cog }\n\t\t\t\t\t\t\tlabel={ _x(\n\t\t\t\t\t\t\t\t'View options',\n\t\t\t\t\t\t\t\t'View is used as a noun'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\t\taria-expanded={ isOpen ? 'true' : 'false' }\n\t\t\t\t\t\t\taria-controls={ popoverId }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{ isModified && (\n\t\t\t\t\t\t\t<span className=\"dataviews-view-config__modified-indicator\" />\n\t\t\t\t\t\t) }\n\t\t\t\t\t</div>\n\t\t\t\t);\n\t\t\t} }\n\t\t\trenderContent={ () => (\n\t\t\t\t<DropdownContentWrapper\n\t\t\t\t\tpaddingSize=\"medium\"\n\t\t\t\t\tclassName=\"dataviews-config__popover-content-wrapper\"\n\t\t\t\t>\n\t\t\t\t\t<Stack\n\t\t\t\t\t\tdirection=\"column\"\n\t\t\t\t\t\tclassName=\"dataviews-view-config\"\n\t\t\t\t\t\tgap=\"xl\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<Stack\n\t\t\t\t\t\t\tdirection=\"row\"\n\t\t\t\t\t\t\tjustify=\"space-between\"\n\t\t\t\t\t\t\talign=\"center\"\n\t\t\t\t\t\t\tclassName=\"dataviews-view-config__header\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Heading\n\t\t\t\t\t\t\t\tlevel={ 2 }\n\t\t\t\t\t\t\t\tclassName=\"dataviews-settings-section__title\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'Appearance' ) }\n\t\t\t\t\t\t\t</Heading>\n\t\t\t\t\t\t\t<ResetViewButton />\n\t\t\t\t\t\t</Stack>\n\t\t\t\t\t\t<Stack direction=\"column\" gap=\"lg\">\n\t\t\t\t\t\t\t<Stack\n\t\t\t\t\t\t\t\tdirection=\"row\"\n\t\t\t\t\t\t\t\tgap=\"sm\"\n\t\t\t\t\t\t\t\tclassName=\"dataviews-view-config__sort-controls\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<SortFieldControl />\n\t\t\t\t\t\t\t\t<SortDirectionControl />\n\t\t\t\t\t\t\t</Stack>\n\t\t\t\t\t\t\t{ !! activeLayout?.viewConfigOptions && (\n\t\t\t\t\t\t\t\t<activeLayout.viewConfigOptions />\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t<ItemsPerPageControl />\n\t\t\t\t\t\t\t<PropertiesSection />\n\t\t\t\t\t\t</Stack>\n\t\t\t\t\t</Stack>\n\t\t\t\t</DropdownContentWrapper>\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nfunction _DataViewsViewConfig() {\n\treturn (\n\t\t<>\n\t\t\t<ViewTypeMenu />\n\t\t\t<DataviewsViewConfigDropdown />\n\t\t</>\n\t);\n}\n\nconst DataViewsViewConfig = memo( _DataViewsViewConfig );\n\nexport default DataViewsViewConfig;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["componentsPrivateApis", "DataViewsContext", "warning", "ToggleGroupControl", "ToggleGroupControlOptionIcon", "ToggleGroupControlOption", "DropdownContentWrapper", "Heading"]
|
|
7
7
|
}
|
package/build/constants.cjs
CHANGED
|
@@ -24,6 +24,7 @@ __export(constants_exports, {
|
|
|
24
24
|
LAYOUT_ACTIVITY: () => LAYOUT_ACTIVITY,
|
|
25
25
|
LAYOUT_GRID: () => LAYOUT_GRID,
|
|
26
26
|
LAYOUT_LIST: () => LAYOUT_LIST,
|
|
27
|
+
LAYOUT_PICKER_ACTIVITY: () => LAYOUT_PICKER_ACTIVITY,
|
|
27
28
|
LAYOUT_PICKER_GRID: () => LAYOUT_PICKER_GRID,
|
|
28
29
|
LAYOUT_PICKER_TABLE: () => LAYOUT_PICKER_TABLE,
|
|
29
30
|
LAYOUT_TABLE: () => LAYOUT_TABLE,
|
|
@@ -97,6 +98,7 @@ var LAYOUT_LIST = "list";
|
|
|
97
98
|
var LAYOUT_ACTIVITY = "activity";
|
|
98
99
|
var LAYOUT_PICKER_GRID = "pickerGrid";
|
|
99
100
|
var LAYOUT_PICKER_TABLE = "pickerTable";
|
|
101
|
+
var LAYOUT_PICKER_ACTIVITY = "pickerActivity";
|
|
100
102
|
var DAYS_OF_WEEK = [0, 1, 2, 3, 4, 5, 6];
|
|
101
103
|
// Annotate the CommonJS export names for ESM import in node:
|
|
102
104
|
0 && (module.exports = {
|
|
@@ -104,6 +106,7 @@ var DAYS_OF_WEEK = [0, 1, 2, 3, 4, 5, 6];
|
|
|
104
106
|
LAYOUT_ACTIVITY,
|
|
105
107
|
LAYOUT_GRID,
|
|
106
108
|
LAYOUT_LIST,
|
|
109
|
+
LAYOUT_PICKER_ACTIVITY,
|
|
107
110
|
LAYOUT_PICKER_GRID,
|
|
108
111
|
LAYOUT_PICKER_TABLE,
|
|
109
112
|
LAYOUT_TABLE,
|
package/build/constants.cjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/constants.ts"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { arrowDown, arrowUp } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport type { DayNumber } from './types';\n\n// Filter operators.\nexport const OPERATOR_IS_ANY = 'isAny';\nexport const OPERATOR_IS_NONE = 'isNone';\nexport const OPERATOR_IS_ALL = 'isAll';\nexport const OPERATOR_IS_NOT_ALL = 'isNotAll';\nexport const OPERATOR_BETWEEN = 'between';\nexport const OPERATOR_IN_THE_PAST = 'inThePast';\nexport const OPERATOR_OVER = 'over';\nexport const OPERATOR_IS = 'is';\nexport const OPERATOR_IS_NOT = 'isNot';\nexport const OPERATOR_LESS_THAN = 'lessThan';\nexport const OPERATOR_GREATER_THAN = 'greaterThan';\nexport const OPERATOR_LESS_THAN_OR_EQUAL = 'lessThanOrEqual';\nexport const OPERATOR_GREATER_THAN_OR_EQUAL = 'greaterThanOrEqual';\nexport const OPERATOR_BEFORE = 'before';\nexport const OPERATOR_AFTER = 'after';\nexport const OPERATOR_BEFORE_INC = 'beforeInc';\nexport const OPERATOR_AFTER_INC = 'afterInc';\nexport const OPERATOR_CONTAINS = 'contains';\nexport const OPERATOR_NOT_CONTAINS = 'notContains';\nexport const OPERATOR_STARTS_WITH = 'startsWith';\nexport const OPERATOR_ON = 'on';\nexport const OPERATOR_NOT_ON = 'notOn';\n\nexport const SORTING_DIRECTIONS = [ 'asc', 'desc' ] as const;\nexport const sortArrows = { asc: '\u2191', desc: '\u2193' };\nexport const sortValues = { asc: 'ascending', desc: 'descending' } as const;\nexport const sortLabels = {\n\tasc: __( 'Sort ascending' ),\n\tdesc: __( 'Sort descending' ),\n};\nexport const sortIcons = {\n\tasc: arrowUp,\n\tdesc: arrowDown,\n};\n\n// View layouts.\nexport const LAYOUT_TABLE = 'table';\nexport const LAYOUT_GRID = 'grid';\nexport const LAYOUT_LIST = 'list';\nexport const LAYOUT_ACTIVITY = 'activity';\n\n// Picker view layouts.\nexport const LAYOUT_PICKER_GRID = 'pickerGrid';\nexport const LAYOUT_PICKER_TABLE = 'pickerTable';\n\nexport const DAYS_OF_WEEK: DayNumber[] = [ 0, 1, 2, 3, 4, 5, 6 ];\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAmB;AACnB,mBAAmC;AAQ5B,IAAM,kBAAkB;AACxB,IAAM,mBAAmB;AACzB,IAAM,kBAAkB;AACxB,IAAM,sBAAsB;AAC5B,IAAM,mBAAmB;AACzB,IAAM,uBAAuB;AAC7B,IAAM,gBAAgB;AACtB,IAAM,cAAc;AACpB,IAAM,kBAAkB;AACxB,IAAM,qBAAqB;AAC3B,IAAM,wBAAwB;AAC9B,IAAM,8BAA8B;AACpC,IAAM,iCAAiC;AACvC,IAAM,kBAAkB;AACxB,IAAM,iBAAiB;AACvB,IAAM,sBAAsB;AAC5B,IAAM,qBAAqB;AAC3B,IAAM,oBAAoB;AAC1B,IAAM,wBAAwB;AAC9B,IAAM,uBAAuB;AAC7B,IAAM,cAAc;AACpB,IAAM,kBAAkB;AAExB,IAAM,qBAAqB,CAAE,OAAO,MAAO;AAC3C,IAAM,aAAa,EAAE,KAAK,UAAK,MAAM,SAAI;AACzC,IAAM,aAAa,EAAE,KAAK,aAAa,MAAM,aAAa;AAC1D,IAAM,aAAa;AAAA,EACzB,SAAK,gBAAI,gBAAiB;AAAA,EAC1B,UAAM,gBAAI,iBAAkB;AAC7B;AACO,IAAM,YAAY;AAAA,EACxB,KAAK;AAAA,EACL,MAAM;AACP;AAGO,IAAM,eAAe;AACrB,IAAM,cAAc;AACpB,IAAM,cAAc;AACpB,IAAM,kBAAkB;AAGxB,IAAM,qBAAqB;AAC3B,IAAM,sBAAsB;
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { arrowDown, arrowUp } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport type { DayNumber } from './types';\n\n// Filter operators.\nexport const OPERATOR_IS_ANY = 'isAny';\nexport const OPERATOR_IS_NONE = 'isNone';\nexport const OPERATOR_IS_ALL = 'isAll';\nexport const OPERATOR_IS_NOT_ALL = 'isNotAll';\nexport const OPERATOR_BETWEEN = 'between';\nexport const OPERATOR_IN_THE_PAST = 'inThePast';\nexport const OPERATOR_OVER = 'over';\nexport const OPERATOR_IS = 'is';\nexport const OPERATOR_IS_NOT = 'isNot';\nexport const OPERATOR_LESS_THAN = 'lessThan';\nexport const OPERATOR_GREATER_THAN = 'greaterThan';\nexport const OPERATOR_LESS_THAN_OR_EQUAL = 'lessThanOrEqual';\nexport const OPERATOR_GREATER_THAN_OR_EQUAL = 'greaterThanOrEqual';\nexport const OPERATOR_BEFORE = 'before';\nexport const OPERATOR_AFTER = 'after';\nexport const OPERATOR_BEFORE_INC = 'beforeInc';\nexport const OPERATOR_AFTER_INC = 'afterInc';\nexport const OPERATOR_CONTAINS = 'contains';\nexport const OPERATOR_NOT_CONTAINS = 'notContains';\nexport const OPERATOR_STARTS_WITH = 'startsWith';\nexport const OPERATOR_ON = 'on';\nexport const OPERATOR_NOT_ON = 'notOn';\n\nexport const SORTING_DIRECTIONS = [ 'asc', 'desc' ] as const;\nexport const sortArrows = { asc: '\u2191', desc: '\u2193' };\nexport const sortValues = { asc: 'ascending', desc: 'descending' } as const;\nexport const sortLabels = {\n\tasc: __( 'Sort ascending' ),\n\tdesc: __( 'Sort descending' ),\n};\nexport const sortIcons = {\n\tasc: arrowUp,\n\tdesc: arrowDown,\n};\n\n// View layouts.\nexport const LAYOUT_TABLE = 'table';\nexport const LAYOUT_GRID = 'grid';\nexport const LAYOUT_LIST = 'list';\nexport const LAYOUT_ACTIVITY = 'activity';\n\n// Picker view layouts.\nexport const LAYOUT_PICKER_GRID = 'pickerGrid';\nexport const LAYOUT_PICKER_TABLE = 'pickerTable';\nexport const LAYOUT_PICKER_ACTIVITY = 'pickerActivity';\n\nexport const DAYS_OF_WEEK: DayNumber[] = [ 0, 1, 2, 3, 4, 5, 6 ];\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAmB;AACnB,mBAAmC;AAQ5B,IAAM,kBAAkB;AACxB,IAAM,mBAAmB;AACzB,IAAM,kBAAkB;AACxB,IAAM,sBAAsB;AAC5B,IAAM,mBAAmB;AACzB,IAAM,uBAAuB;AAC7B,IAAM,gBAAgB;AACtB,IAAM,cAAc;AACpB,IAAM,kBAAkB;AACxB,IAAM,qBAAqB;AAC3B,IAAM,wBAAwB;AAC9B,IAAM,8BAA8B;AACpC,IAAM,iCAAiC;AACvC,IAAM,kBAAkB;AACxB,IAAM,iBAAiB;AACvB,IAAM,sBAAsB;AAC5B,IAAM,qBAAqB;AAC3B,IAAM,oBAAoB;AAC1B,IAAM,wBAAwB;AAC9B,IAAM,uBAAuB;AAC7B,IAAM,cAAc;AACpB,IAAM,kBAAkB;AAExB,IAAM,qBAAqB,CAAE,OAAO,MAAO;AAC3C,IAAM,aAAa,EAAE,KAAK,UAAK,MAAM,SAAI;AACzC,IAAM,aAAa,EAAE,KAAK,aAAa,MAAM,aAAa;AAC1D,IAAM,aAAa;AAAA,EACzB,SAAK,gBAAI,gBAAiB;AAAA,EAC1B,UAAM,gBAAI,iBAAkB;AAC7B;AACO,IAAM,YAAY;AAAA,EACxB,KAAK;AAAA,EACL,MAAM;AACP;AAGO,IAAM,eAAe;AACrB,IAAM,cAAc;AACpB,IAAM,cAAc;AACpB,IAAM,kBAAkB;AAGxB,IAAM,qBAAqB;AAC3B,IAAM,sBAAsB;AAC5B,IAAM,yBAAyB;AAE/B,IAAM,eAA4B,CAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAE;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|