@mittwald/flow-react-components 0.2.0-alpha.652 → 0.2.0-alpha.654
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 +10 -0
- package/dist/assets/doc-properties.json +0 -8
- package/dist/js/components/src/components/List/components/Header/Header.mjs +0 -2
- package/dist/js/components/src/components/List/components/Header/Header.mjs.map +1 -1
- package/dist/js/components/src/components/List/components/Header/components/Filters/CombinedFilterMenu.mjs +52 -21
- package/dist/js/components/src/components/List/components/Header/components/Filters/CombinedFilterMenu.mjs.map +1 -1
- package/dist/types/components/List/components/Header/Header.d.ts.map +1 -1
- package/dist/types/components/List/components/Header/components/Filters/CombinedFilterMenu.d.ts.map +1 -1
- package/package.json +4 -4
- package/dist/js/components/src/components/List/components/Header/components/Settings/SettingsMenu.mjs +0 -74
- package/dist/js/components/src/components/List/components/Header/components/Settings/SettingsMenu.mjs.map +0 -1
- package/dist/types/components/List/components/Header/components/Settings/SettingsMenu.d.ts +0 -3
- package/dist/types/components/List/components/Header/components/Settings/SettingsMenu.d.ts.map +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,16 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
# [0.2.0-alpha.654](https://github.com/mittwald/flow/compare/0.2.0-alpha.653...0.2.0-alpha.654) (2026-01-28)
|
|
7
|
+
|
|
8
|
+
### Features
|
|
9
|
+
|
|
10
|
+
* **List:** improve mobile list header ([#2283](https://github.com/mittwald/flow/issues/2283)) ([d4cd35e](https://github.com/mittwald/flow/commit/d4cd35ee53428d9d890df950a2a4d7aceb756d9b))
|
|
11
|
+
|
|
12
|
+
# [0.2.0-alpha.653](https://github.com/mittwald/flow/compare/0.2.0-alpha.652...0.2.0-alpha.653) (2026-01-28)
|
|
13
|
+
|
|
14
|
+
**Note:** Version bump only for package @mittwald/flow-react-components
|
|
15
|
+
|
|
6
16
|
# [0.2.0-alpha.652](https://github.com/mittwald/flow/compare/0.2.0-alpha.651...0.2.0-alpha.652) (2026-01-28)
|
|
7
17
|
|
|
8
18
|
### Bug Fixes
|
|
@@ -335414,14 +335414,6 @@
|
|
|
335414
335414
|
"methods": [],
|
|
335415
335415
|
"props": {}
|
|
335416
335416
|
},
|
|
335417
|
-
{
|
|
335418
|
-
"tags": {},
|
|
335419
|
-
"filePath": "/home/runner/work/flow/flow/packages/components/src/components/List/components/Header/components/Settings/SettingsMenu.tsx",
|
|
335420
|
-
"description": "",
|
|
335421
|
-
"displayName": "SettingsMenu",
|
|
335422
|
-
"methods": [],
|
|
335423
|
-
"props": {}
|
|
335424
|
-
},
|
|
335425
335417
|
{
|
|
335426
335418
|
"tags": {},
|
|
335427
335419
|
"filePath": "/home/runner/work/flow/flow/packages/components/src/components/List/components/Footer/components/ShowNextBatchButton/ShowNextBatchButton.tsx",
|
|
@@ -10,7 +10,6 @@ import { SearchField } from './components/SearchField/SearchField.mjs';
|
|
|
10
10
|
import { ViewModeMenu } from './components/Settings/ViewModeMenu.mjs';
|
|
11
11
|
import { TunnelExit } from '@mittwald/react-tunnel';
|
|
12
12
|
import DivView from '../../../../views/DivView.mjs';
|
|
13
|
-
import { SettingsMenu } from './components/Settings/SettingsMenu.mjs';
|
|
14
13
|
import { SortingMenu } from './components/Settings/SortingMenu.mjs';
|
|
15
14
|
import { FilterMenuList } from './components/Filters/FilterMenuList.mjs';
|
|
16
15
|
import { CombinedFilterMenu } from './components/Filters/CombinedFilterMenu.mjs';
|
|
@@ -36,7 +35,6 @@ const Header = (props) => {
|
|
|
36
35
|
/* @__PURE__ */ jsx(ViewModeMenu, {}),
|
|
37
36
|
/* @__PURE__ */ jsx(SortingMenu, {}),
|
|
38
37
|
/* @__PURE__ */ jsx(FilterMenuList, {}),
|
|
39
|
-
/* @__PURE__ */ jsx(SettingsMenu, {}),
|
|
40
38
|
/* @__PURE__ */ jsx(CombinedFilterMenu, {}),
|
|
41
39
|
list.search && /* @__PURE__ */ jsx(SearchField, { search: list.search })
|
|
42
40
|
] })
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Header.mjs","sources":["../../../../../../../../src/components/List/components/Header/Header.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport React from \"react\";\nimport styles from \"./Header.module.css\";\nimport clsx from \"clsx\";\nimport { ActiveFilters } from \"@/components/List/components/Header/components/ActiveFilters\";\nimport { useList } from \"@/components/List/hooks/useList\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport { SearchField } from \"@/components/List/components/Header/components/SearchField/SearchField\";\nimport { ViewModeMenu } from \"@/components/List/components/Header/components/Settings/ViewModeMenu\";\nimport { TunnelExit } from \"@mittwald/react-tunnel\";\nimport DivView from \"@/views/DivView\";\nimport {
|
|
1
|
+
{"version":3,"file":"Header.mjs","sources":["../../../../../../../../src/components/List/components/Header/Header.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport React from \"react\";\nimport styles from \"./Header.module.css\";\nimport clsx from \"clsx\";\nimport { ActiveFilters } from \"@/components/List/components/Header/components/ActiveFilters\";\nimport { useList } from \"@/components/List/hooks/useList\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport { SearchField } from \"@/components/List/components/Header/components/SearchField/SearchField\";\nimport { ViewModeMenu } from \"@/components/List/components/Header/components/Settings/ViewModeMenu\";\nimport { TunnelExit } from \"@mittwald/react-tunnel\";\nimport DivView from \"@/views/DivView\";\nimport { SortingMenu } from \"@/components/List/components/Header/components/Settings/SortingMenu\";\nimport { FilterMenuList } from \"@/components/List/components/Header/components/Filters/FilterMenuList\";\nimport { CombinedFilterMenu } from \"@/components/List/components/Header/components/Filters/CombinedFilterMenu\";\nimport { useAvailableViewModes } from \"@/components/List/components/Header/lib\";\n\nexport const Header: FC<PropsWithClassName> = (props) => {\n const { className } = props;\n const list = useList();\n\n const availableViewModes = useAvailableViewModes();\n\n const hasOptions =\n list.filters.length > 0 ||\n list.visibleSorting.length > 0 ||\n list.search ||\n availableViewModes.length > 1;\n\n return (\n <DivView\n className={clsx(\n className,\n styles.header,\n list.search && styles.withSearch,\n )}\n >\n <DivView className={styles.headerContent}>\n <TunnelExit id=\"actions\" />\n {hasOptions && (\n <DivView className={styles.options}>\n {/* Desktop */}\n <ViewModeMenu />\n <SortingMenu />\n <FilterMenuList />\n\n {/* Mobile */}\n <CombinedFilterMenu />\n\n {list.search && <SearchField search={list.search} />}\n </DivView>\n )}\n </DivView>\n <ActiveFilters />\n </DivView>\n );\n};\n\nexport default Header;\n"],"names":["styles"],"mappings":";;;;;;;;;;;;;;;AAgBO,MAAM,MAAA,GAAiC,CAAC,KAAA,KAAU;AACvD,EAAA,MAAM,EAAE,WAAU,GAAI,KAAA;AACtB,EAAA,MAAM,OAAO,OAAA,EAAQ;AAErB,EAAA,MAAM,qBAAqB,qBAAA,EAAsB;AAEjD,EAAA,MAAM,UAAA,GACJ,IAAA,CAAK,OAAA,CAAQ,MAAA,GAAS,CAAA,IACtB,IAAA,CAAK,cAAA,CAAe,MAAA,GAAS,CAAA,IAC7B,IAAA,CAAK,MAAA,IACL,kBAAA,CAAmB,MAAA,GAAS,CAAA;AAE9B,EAAA,uBACE,IAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,IAAA;AAAA,QACT,SAAA;AAAA,QACAA,YAAA,CAAO,MAAA;AAAA,QACP,IAAA,CAAK,UAAUA,YAAA,CAAO;AAAA,OACxB;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAC,OAAA,EAAA,EAAQ,SAAA,EAAWA,YAAA,CAAO,aAAA,EACzB,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,UAAA,EAAA,EAAW,IAAG,SAAA,EAAU,CAAA;AAAA,UACxB,UAAA,oBACC,IAAA,CAAC,OAAA,EAAA,EAAQ,SAAA,EAAWA,aAAO,OAAA,EAEzB,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,YAAA,EAAA,EAAa,CAAA;AAAA,gCACb,WAAA,EAAA,EAAY,CAAA;AAAA,gCACZ,cAAA,EAAA,EAAe,CAAA;AAAA,gCAGf,kBAAA,EAAA,EAAmB,CAAA;AAAA,YAEnB,KAAK,MAAA,oBAAU,GAAA,CAAC,WAAA,EAAA,EAAY,MAAA,EAAQ,KAAK,MAAA,EAAQ;AAAA,WAAA,EACpD;AAAA,SAAA,EAEJ,CAAA;AAAA,4BACC,aAAA,EAAA,EAAc;AAAA;AAAA;AAAA,GACjB;AAEJ;;;;"}
|
|
@@ -32,14 +32,58 @@ import headerStyles from '../../Header.module.css.mjs';
|
|
|
32
32
|
import ContextMenuSectionView from '../../../../../../views/ContextMenuSectionView.mjs';
|
|
33
33
|
import SeparatorView from '../../../../../../views/SeparatorView.mjs';
|
|
34
34
|
import ContextMenuView from '../../../../../../views/ContextMenuView.mjs';
|
|
35
|
+
import { useAvailableViewModes } from '../../lib.mjs';
|
|
36
|
+
import { ViewModeMenuItem } from '../Settings/ViewModeMenuItem.mjs';
|
|
37
|
+
import { SortingMenuItem } from '../Settings/SortingMenuItem.mjs';
|
|
35
38
|
|
|
36
39
|
const CombinedFilterMenu = () => {
|
|
37
40
|
const list = useList();
|
|
38
|
-
const filters = list.filters;
|
|
39
41
|
const stringFormatter = useLocalizedStringFormatter(locales);
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
42
|
+
const filterSections = list.filters.map((f) => {
|
|
43
|
+
const activeKeys = f.values.filter((v) => v.isActive).map((v) => v.id);
|
|
44
|
+
return /* @__PURE__ */ jsxs(
|
|
45
|
+
ContextMenuSectionView,
|
|
46
|
+
{
|
|
47
|
+
selectionMode: f.mode === "one" ? "single" : "multiple",
|
|
48
|
+
selectedKeys: activeKeys,
|
|
49
|
+
children: [
|
|
50
|
+
/* @__PURE__ */ jsx(HeadingView, { children: f.name ?? f.property }),
|
|
51
|
+
f.values.map((v) => /* @__PURE__ */ jsx(FilterMenuItem, { filterValue: v }, v.id))
|
|
52
|
+
]
|
|
53
|
+
},
|
|
54
|
+
f.property
|
|
55
|
+
);
|
|
56
|
+
});
|
|
57
|
+
const availableViewModes = useAvailableViewModes();
|
|
58
|
+
const selectedViewMode = list.viewMode;
|
|
59
|
+
const viewModeSection = availableViewModes.length > 1 ? /* @__PURE__ */ jsxs(
|
|
60
|
+
ContextMenuSectionView,
|
|
61
|
+
{
|
|
62
|
+
selectionMode: "single",
|
|
63
|
+
selectedKeys: [selectedViewMode],
|
|
64
|
+
children: [
|
|
65
|
+
/* @__PURE__ */ jsx(HeadingView, { children: stringFormatter.format("list.settings.viewMode") }),
|
|
66
|
+
availableViewModes.map((vm) => /* @__PURE__ */ jsx(ViewModeMenuItem, { viewMode: vm }, vm))
|
|
67
|
+
]
|
|
68
|
+
}
|
|
69
|
+
) : null;
|
|
70
|
+
const sortingItems = list.visibleSorting.map((s) => /* @__PURE__ */ jsx(SortingMenuItem, { sorting: s }, s.id));
|
|
71
|
+
const labelSorting = list.visibleSorting.find((s) => s.isSorted());
|
|
72
|
+
const sortingSection = sortingItems.length > 0 ? /* @__PURE__ */ jsxs(
|
|
73
|
+
ContextMenuSectionView,
|
|
74
|
+
{
|
|
75
|
+
selectionMode: "single",
|
|
76
|
+
selectedKeys: labelSorting ? [labelSorting.id] : [],
|
|
77
|
+
children: [
|
|
78
|
+
/* @__PURE__ */ jsx(HeadingView, { children: stringFormatter.format("list.sorting") }),
|
|
79
|
+
sortingItems
|
|
80
|
+
]
|
|
81
|
+
}
|
|
82
|
+
) : null;
|
|
83
|
+
const sections = [viewModeSection, sortingSection, ...filterSections].filter(
|
|
84
|
+
Boolean
|
|
85
|
+
);
|
|
86
|
+
if (sections.length === 0) return null;
|
|
43
87
|
return /* @__PURE__ */ jsxs(ContextMenuTriggerView, { children: [
|
|
44
88
|
/* @__PURE__ */ jsx(
|
|
45
89
|
ButtonView,
|
|
@@ -51,23 +95,10 @@ const CombinedFilterMenu = () => {
|
|
|
51
95
|
children: /* @__PURE__ */ jsx(IconFilter, {})
|
|
52
96
|
}
|
|
53
97
|
),
|
|
54
|
-
/* @__PURE__ */ jsx(ContextMenuView, { children:
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
ContextMenuSectionView,
|
|
59
|
-
{
|
|
60
|
-
selectionMode: f.mode === "one" ? "single" : "multiple",
|
|
61
|
-
selectedKeys: activeFilterKeys,
|
|
62
|
-
children: [
|
|
63
|
-
/* @__PURE__ */ jsx(HeadingView, { children: f.name ?? f.property }),
|
|
64
|
-
f.values.map((v) => /* @__PURE__ */ jsx(FilterMenuItem, { filterValue: v }, v.id))
|
|
65
|
-
]
|
|
66
|
-
}
|
|
67
|
-
),
|
|
68
|
-
i + 1 < filters.length && /* @__PURE__ */ jsx(SeparatorView, {})
|
|
69
|
-
] }, f.property);
|
|
70
|
-
}) })
|
|
98
|
+
/* @__PURE__ */ jsx(ContextMenuView, { children: sections.map((section, index) => /* @__PURE__ */ jsxs(React.Fragment, { children: [
|
|
99
|
+
index > 0 && /* @__PURE__ */ jsx(SeparatorView, {}),
|
|
100
|
+
section
|
|
101
|
+
] }, index)) })
|
|
71
102
|
] });
|
|
72
103
|
};
|
|
73
104
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CombinedFilterMenu.mjs","sources":["../../../../../../../../../../src/components/List/components/Header/components/Filters/CombinedFilterMenu.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport React from \"react\";\nimport { IconFilter } from \"@/components/Icon/components/icons\";\nimport ButtonView from \"@/views/ButtonView\";\nimport { useList } from \"@/components/List\";\nimport HeadingView from \"@/views/HeadingView\";\nimport { FilterMenuItem } from \"@/components/List/components/Header/components/Filters/FilterMenuItem\";\nimport styles from \"@/components/List/components/Header/Header.module.css\";\nimport { useLocalizedStringFormatter } from \"react-aria\";\nimport locales from \"../../../../locales/*.locale.json\";\nimport ContextMenuSectionView from \"@/views/ContextMenuSectionView\";\nimport SeparatorView from \"@/views/SeparatorView\";\nimport ContextMenuTriggerView from \"@/views/ContextMenuTriggerView\";\nimport ContextMenuView from \"@/views/ContextMenuView\";\n\nexport const CombinedFilterMenu: FC = () => {\n const list = useList();\n
|
|
1
|
+
{"version":3,"file":"CombinedFilterMenu.mjs","sources":["../../../../../../../../../../src/components/List/components/Header/components/Filters/CombinedFilterMenu.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport React from \"react\";\nimport { IconFilter } from \"@/components/Icon/components/icons\";\nimport ButtonView from \"@/views/ButtonView\";\nimport { useList } from \"@/components/List\";\nimport HeadingView from \"@/views/HeadingView\";\nimport { FilterMenuItem } from \"@/components/List/components/Header/components/Filters/FilterMenuItem\";\nimport styles from \"@/components/List/components/Header/Header.module.css\";\nimport { useLocalizedStringFormatter } from \"react-aria\";\nimport locales from \"../../../../locales/*.locale.json\";\nimport ContextMenuSectionView from \"@/views/ContextMenuSectionView\";\nimport SeparatorView from \"@/views/SeparatorView\";\nimport ContextMenuTriggerView from \"@/views/ContextMenuTriggerView\";\nimport ContextMenuView from \"@/views/ContextMenuView\";\nimport { useAvailableViewModes } from \"@/components/List/components/Header/lib\";\nimport { ViewModeMenuItem } from \"@/components/List/components/Header/components/Settings/ViewModeMenuItem\";\nimport { SortingMenuItem } from \"@/components/List/components/Header/components/Settings/SortingMenuItem\";\n\nexport const CombinedFilterMenu: FC = () => {\n const list = useList();\n const stringFormatter = useLocalizedStringFormatter(locales);\n\n const filterSections = list.filters.map((f) => {\n const activeKeys = f.values.filter((v) => v.isActive).map((v) => v.id);\n return (\n <ContextMenuSectionView\n key={f.property}\n selectionMode={f.mode === \"one\" ? \"single\" : \"multiple\"}\n selectedKeys={activeKeys}\n >\n <HeadingView>{f.name ?? f.property}</HeadingView>\n {f.values.map((v) => (\n <FilterMenuItem key={v.id} filterValue={v} />\n ))}\n </ContextMenuSectionView>\n );\n });\n\n const availableViewModes = useAvailableViewModes();\n const selectedViewMode = list.viewMode;\n const viewModeSection =\n availableViewModes.length > 1 ? (\n <ContextMenuSectionView\n selectionMode=\"single\"\n selectedKeys={[selectedViewMode]}\n >\n <HeadingView>\n {stringFormatter.format(\"list.settings.viewMode\")}\n </HeadingView>\n {availableViewModes.map((vm) => (\n <ViewModeMenuItem key={vm} viewMode={vm} />\n ))}\n </ContextMenuSectionView>\n ) : null;\n\n const sortingItems = list.visibleSorting.map((s) => (\n <SortingMenuItem key={s.id} sorting={s} />\n ));\n const labelSorting = list.visibleSorting.find((s) => s.isSorted());\n const sortingSection =\n sortingItems.length > 0 ? (\n <ContextMenuSectionView\n selectionMode=\"single\"\n selectedKeys={labelSorting ? [labelSorting.id] : []}\n >\n <HeadingView>{stringFormatter.format(\"list.sorting\")}</HeadingView>\n {sortingItems}\n </ContextMenuSectionView>\n ) : null;\n\n const sections = [viewModeSection, sortingSection, ...filterSections].filter(\n Boolean,\n );\n\n if (sections.length === 0) return null;\n\n return (\n <ContextMenuTriggerView>\n <ButtonView\n className={styles.mobile}\n variant=\"outline\"\n color=\"secondary\"\n aria-label={stringFormatter.format(\"list.filters\")}\n >\n <IconFilter />\n </ButtonView>\n\n <ContextMenuView>\n {sections.map((section, index) => (\n <React.Fragment key={index}>\n {index > 0 && <SeparatorView />}\n {section}\n </React.Fragment>\n ))}\n </ContextMenuView>\n </ContextMenuTriggerView>\n );\n};\n"],"names":["styles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBO,MAAM,qBAAyB,MAAM;AAC1C,EAAA,MAAM,OAAO,OAAA,EAAQ;AACrB,EAAA,MAAM,eAAA,GAAkB,4BAA4B,OAAO,CAAA;AAE3D,EAAA,MAAM,cAAA,GAAiB,IAAA,CAAK,OAAA,CAAQ,GAAA,CAAI,CAAC,CAAA,KAAM;AAC7C,IAAA,MAAM,UAAA,GAAa,CAAA,CAAE,MAAA,CAAO,MAAA,CAAO,CAAC,CAAA,KAAM,CAAA,CAAE,QAAQ,CAAA,CAAE,GAAA,CAAI,CAAC,CAAA,KAAM,EAAE,EAAE,CAAA;AACrE,IAAA,uBACE,IAAA;AAAA,MAAC,sBAAA;AAAA,MAAA;AAAA,QAEC,aAAA,EAAe,CAAA,CAAE,IAAA,KAAS,KAAA,GAAQ,QAAA,GAAW,UAAA;AAAA,QAC7C,YAAA,EAAc,UAAA;AAAA,QAEd,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,WAAA,EAAA,EAAa,QAAA,EAAA,CAAA,CAAE,IAAA,IAAQ,CAAA,CAAE,QAAA,EAAS,CAAA;AAAA,UAClC,CAAA,CAAE,MAAA,CAAO,GAAA,CAAI,CAAC,CAAA,qBACb,GAAA,CAAC,cAAA,EAAA,EAA0B,WAAA,EAAa,CAAA,EAAA,EAAnB,CAAA,CAAE,EAAoB,CAC5C;AAAA;AAAA,OAAA;AAAA,MAPI,CAAA,CAAE;AAAA,KAQT;AAAA,EAEJ,CAAC,CAAA;AAED,EAAA,MAAM,qBAAqB,qBAAA,EAAsB;AACjD,EAAA,MAAM,mBAAmB,IAAA,CAAK,QAAA;AAC9B,EAAA,MAAM,eAAA,GACJ,kBAAA,CAAmB,MAAA,GAAS,CAAA,mBAC1B,IAAA;AAAA,IAAC,sBAAA;AAAA,IAAA;AAAA,MACC,aAAA,EAAc,QAAA;AAAA,MACd,YAAA,EAAc,CAAC,gBAAgB,CAAA;AAAA,MAE/B,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,WAAA,EAAA,EACE,QAAA,EAAA,eAAA,CAAgB,MAAA,CAAO,wBAAwB,CAAA,EAClD,CAAA;AAAA,QACC,kBAAA,CAAmB,IAAI,CAAC,EAAA,yBACtB,gBAAA,EAAA,EAA0B,QAAA,EAAU,EAAA,EAAA,EAAd,EAAkB,CAC1C;AAAA;AAAA;AAAA,GACH,GACE,IAAA;AAEN,EAAA,MAAM,YAAA,GAAe,IAAA,CAAK,cAAA,CAAe,GAAA,CAAI,CAAC,CAAA,qBAC5C,GAAA,CAAC,eAAA,EAAA,EAA2B,OAAA,EAAS,CAAA,EAAA,EAAf,CAAA,CAAE,EAAgB,CACzC,CAAA;AACD,EAAA,MAAM,YAAA,GAAe,KAAK,cAAA,CAAe,IAAA,CAAK,CAAC,CAAA,KAAM,CAAA,CAAE,UAAU,CAAA;AACjE,EAAA,MAAM,cAAA,GACJ,YAAA,CAAa,MAAA,GAAS,CAAA,mBACpB,IAAA;AAAA,IAAC,sBAAA;AAAA,IAAA;AAAA,MACC,aAAA,EAAc,QAAA;AAAA,MACd,cAAc,YAAA,GAAe,CAAC,YAAA,CAAa,EAAE,IAAI,EAAC;AAAA,MAElD,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,WAAA,EAAA,EAAa,QAAA,EAAA,eAAA,CAAgB,MAAA,CAAO,cAAc,CAAA,EAAE,CAAA;AAAA,QACpD;AAAA;AAAA;AAAA,GACH,GACE,IAAA;AAEN,EAAA,MAAM,WAAW,CAAC,eAAA,EAAiB,cAAA,EAAgB,GAAG,cAAc,CAAA,CAAE,MAAA;AAAA,IACpE;AAAA,GACF;AAEA,EAAA,IAAI,QAAA,CAAS,MAAA,KAAW,CAAA,EAAG,OAAO,IAAA;AAElC,EAAA,4BACG,sBAAA,EAAA,EACC,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,WAAWA,YAAA,CAAO,MAAA;AAAA,QAClB,OAAA,EAAQ,SAAA;AAAA,QACR,KAAA,EAAM,WAAA;AAAA,QACN,YAAA,EAAY,eAAA,CAAgB,MAAA,CAAO,cAAc,CAAA;AAAA,QAEjD,8BAAC,UAAA,EAAA,EAAW;AAAA;AAAA,KACd;AAAA,oBAEA,GAAA,CAAC,eAAA,EAAA,EACE,QAAA,EAAA,QAAA,CAAS,GAAA,CAAI,CAAC,SAAS,KAAA,qBACtB,IAAA,CAAC,KAAA,CAAM,QAAA,EAAN,EACE,QAAA,EAAA;AAAA,MAAA,KAAA,GAAQ,CAAA,wBAAM,aAAA,EAAA,EAAc,CAAA;AAAA,MAC5B;AAAA,KAAA,EAAA,EAFkB,KAGrB,CACD,CAAA,EACH;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../../../../../src/components/List/components/Header/Header.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAMhC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../../../../../src/components/List/components/Header/Header.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAMhC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAU5D,eAAO,MAAM,MAAM,EAAE,EAAE,CAAC,kBAAkB,CAuCzC,CAAC;AAEF,eAAe,MAAM,CAAC"}
|
package/dist/types/components/List/components/Header/components/Filters/CombinedFilterMenu.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CombinedFilterMenu.d.ts","sourceRoot":"","sources":["../../../../../../../../src/components/List/components/Header/components/Filters/CombinedFilterMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"CombinedFilterMenu.d.ts","sourceRoot":"","sources":["../../../../../../../../src/components/List/components/Header/components/Filters/CombinedFilterMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAkBhC,eAAO,MAAM,kBAAkB,EAAE,EA+EhC,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mittwald/flow-react-components",
|
|
3
|
-
"version": "0.2.0-alpha.
|
|
3
|
+
"version": "0.2.0-alpha.654",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "A React implementation of Flow, mittwald’s design system",
|
|
6
6
|
"homepage": "https://mittwald.github.io/flow",
|
|
@@ -58,7 +58,7 @@
|
|
|
58
58
|
"dependencies": {
|
|
59
59
|
"@internationalized/string-compiler": "^3.2.6",
|
|
60
60
|
"@mittwald/password-tools-js": "3.0.0-alpha.18",
|
|
61
|
-
"@mittwald/react-tunnel": "0.2.0-alpha.
|
|
61
|
+
"@mittwald/react-tunnel": "0.2.0-alpha.654",
|
|
62
62
|
"@mittwald/react-use-promise": "^4.2.2",
|
|
63
63
|
"@react-aria/form": "^3.1.3",
|
|
64
64
|
"@react-aria/live-announcer": "^3.4.4",
|
|
@@ -103,7 +103,7 @@
|
|
|
103
103
|
"@faker-js/faker": "^10.2.0",
|
|
104
104
|
"@internationalized/date": "^3.10.1",
|
|
105
105
|
"@mittwald/flow-core": "",
|
|
106
|
-
"@mittwald/flow-design-tokens": "0.2.0-alpha.
|
|
106
|
+
"@mittwald/flow-design-tokens": "0.2.0-alpha.654",
|
|
107
107
|
"@mittwald/react-use-promise": "^4.2.2",
|
|
108
108
|
"@mittwald/remote-dom-react": "1.2.2-mittwald.10",
|
|
109
109
|
"@mittwald/typescript-config": "",
|
|
@@ -172,5 +172,5 @@
|
|
|
172
172
|
"optional": true
|
|
173
173
|
}
|
|
174
174
|
},
|
|
175
|
-
"gitHead": "
|
|
175
|
+
"gitHead": "3f097992d0193a2ea5d9d7a29a5161b320433968"
|
|
176
176
|
}
|
|
@@ -1,74 +0,0 @@
|
|
|
1
|
-
"use client"
|
|
2
|
-
/* */
|
|
3
|
-
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
4
|
-
import { useList } from '../../../../hooks/useList.mjs';
|
|
5
|
-
import locales from '../../../../../../../../_virtual/_.locale.json@8d5024994f97657f895a4e2a188d2d8a.mjs';
|
|
6
|
-
import ButtonView from '../../../../../../views/ButtonView.mjs';
|
|
7
|
-
import 'react';
|
|
8
|
-
import '@tabler/icons-react';
|
|
9
|
-
import '../../../../../Icon/Icon.mjs';
|
|
10
|
-
import '../../../../../../views/IconView.mjs';
|
|
11
|
-
import { IconSettings } from '../../../../../Icon/components/icons/IconSettings.mjs';
|
|
12
|
-
import HeadingView from '../../../../../../views/HeadingView.mjs';
|
|
13
|
-
import { useLocalizedStringFormatter } from 'react-aria';
|
|
14
|
-
import headerStyles from '../../Header.module.css.mjs';
|
|
15
|
-
import { ViewModeMenuItem } from './ViewModeMenuItem.mjs';
|
|
16
|
-
import { useAvailableViewModes } from '../../lib.mjs';
|
|
17
|
-
import { SortingMenuItem } from './SortingMenuItem.mjs';
|
|
18
|
-
import SeparatorView from '../../../../../../views/SeparatorView.mjs';
|
|
19
|
-
import ContextMenuSectionView from '../../../../../../views/ContextMenuSectionView.mjs';
|
|
20
|
-
import ContextMenuTriggerView from '../../../../../../views/ContextMenuTriggerView.mjs';
|
|
21
|
-
import ContextMenuView from '../../../../../../views/ContextMenuView.mjs';
|
|
22
|
-
|
|
23
|
-
const SettingsMenu = () => {
|
|
24
|
-
const list = useList();
|
|
25
|
-
const selectedViewMode = list.viewMode;
|
|
26
|
-
const availableViewModes = useAvailableViewModes();
|
|
27
|
-
const viewModeItems = availableViewModes.map((viewMode) => /* @__PURE__ */ jsx(ViewModeMenuItem, { viewMode }, viewMode));
|
|
28
|
-
const sortingItems = list.visibleSorting.map((s) => /* @__PURE__ */ jsx(SortingMenuItem, { sorting: s }, s.id));
|
|
29
|
-
const labelSorting = list.visibleSorting.find((s) => s.isSorted());
|
|
30
|
-
const stringFormatter = useLocalizedStringFormatter(locales);
|
|
31
|
-
if (sortingItems.length === 0 && viewModeItems.length <= 1) {
|
|
32
|
-
return null;
|
|
33
|
-
}
|
|
34
|
-
return /* @__PURE__ */ jsxs(ContextMenuTriggerView, { children: [
|
|
35
|
-
/* @__PURE__ */ jsx(
|
|
36
|
-
ButtonView,
|
|
37
|
-
{
|
|
38
|
-
className: headerStyles.mobile,
|
|
39
|
-
variant: "outline",
|
|
40
|
-
color: "secondary",
|
|
41
|
-
"aria-label": stringFormatter.format("list.settings"),
|
|
42
|
-
children: /* @__PURE__ */ jsx(IconSettings, {})
|
|
43
|
-
}
|
|
44
|
-
),
|
|
45
|
-
/* @__PURE__ */ jsxs(ContextMenuView, { children: [
|
|
46
|
-
viewModeItems.length > 1 && /* @__PURE__ */ jsxs(
|
|
47
|
-
ContextMenuSectionView,
|
|
48
|
-
{
|
|
49
|
-
selectionMode: "single",
|
|
50
|
-
selectedKeys: [selectedViewMode],
|
|
51
|
-
children: [
|
|
52
|
-
/* @__PURE__ */ jsx(HeadingView, { children: stringFormatter.format("list.settings.viewMode") }),
|
|
53
|
-
viewModeItems
|
|
54
|
-
]
|
|
55
|
-
}
|
|
56
|
-
),
|
|
57
|
-
sortingItems.length > 0 && viewModeItems.length > 1 && /* @__PURE__ */ jsx(SeparatorView, {}),
|
|
58
|
-
sortingItems.length > 0 && /* @__PURE__ */ jsxs(
|
|
59
|
-
ContextMenuSectionView,
|
|
60
|
-
{
|
|
61
|
-
selectionMode: "single",
|
|
62
|
-
selectedKeys: labelSorting ? [labelSorting.id] : [],
|
|
63
|
-
children: [
|
|
64
|
-
/* @__PURE__ */ jsx(HeadingView, { children: stringFormatter.format("list.sorting") }),
|
|
65
|
-
sortingItems
|
|
66
|
-
]
|
|
67
|
-
}
|
|
68
|
-
)
|
|
69
|
-
] })
|
|
70
|
-
] });
|
|
71
|
-
};
|
|
72
|
-
|
|
73
|
-
export { SettingsMenu };
|
|
74
|
-
//# sourceMappingURL=SettingsMenu.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"SettingsMenu.mjs","sources":["../../../../../../../../../../src/components/List/components/Header/components/Settings/SettingsMenu.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { useList } from \"@/components/List/hooks/useList\";\nimport locales from \"../../../../locales/*.locale.json\";\nimport ButtonView from \"@/views/ButtonView\";\nimport { IconSettings } from \"@/components/Icon/components/icons\";\nimport HeadingView from \"@/views/HeadingView\";\nimport { useLocalizedStringFormatter } from \"react-aria\";\nimport styles from \"../../Header.module.css\";\nimport { ViewModeMenuItem } from \"@/components/List/components/Header/components/Settings/ViewModeMenuItem\";\nimport { useAvailableViewModes } from \"@/components/List/components/Header/lib\";\nimport { SortingMenuItem } from \"@/components/List/components/Header/components/Settings/SortingMenuItem\";\nimport SeparatorView from \"@/views/SeparatorView\";\nimport ContextMenuSectionView from \"@/views/ContextMenuSectionView\";\nimport ContextMenuTriggerView from \"@/views/ContextMenuTriggerView\";\nimport ContextMenuView from \"@/views/ContextMenuView\";\n\nexport const SettingsMenu: FC = () => {\n const list = useList();\n\n const selectedViewMode = list.viewMode;\n const availableViewModes = useAvailableViewModes();\n const viewModeItems = availableViewModes.map((viewMode) => (\n <ViewModeMenuItem viewMode={viewMode} key={viewMode} />\n ));\n\n const sortingItems = list.visibleSorting.map((s) => (\n <SortingMenuItem sorting={s} key={s.id} />\n ));\n const labelSorting = list.visibleSorting.find((s) => s.isSorted());\n\n const stringFormatter = useLocalizedStringFormatter(locales);\n\n if (sortingItems.length === 0 && viewModeItems.length <= 1) {\n return null;\n }\n\n return (\n <ContextMenuTriggerView>\n <ButtonView\n className={styles.mobile}\n variant=\"outline\"\n color=\"secondary\"\n aria-label={stringFormatter.format(\"list.settings\")}\n >\n <IconSettings />\n </ButtonView>\n\n <ContextMenuView>\n {viewModeItems.length > 1 && (\n <ContextMenuSectionView\n selectionMode=\"single\"\n selectedKeys={[selectedViewMode]}\n >\n <HeadingView>\n {stringFormatter.format(\"list.settings.viewMode\")}\n </HeadingView>\n {viewModeItems}\n </ContextMenuSectionView>\n )}\n\n {sortingItems.length > 0 && viewModeItems.length > 1 && (\n <SeparatorView />\n )}\n\n {sortingItems.length > 0 && (\n <ContextMenuSectionView\n selectionMode=\"single\"\n selectedKeys={labelSorting ? [labelSorting.id] : []}\n >\n <HeadingView>{stringFormatter.format(\"list.sorting\")}</HeadingView>\n {sortingItems}\n </ContextMenuSectionView>\n )}\n </ContextMenuView>\n </ContextMenuTriggerView>\n );\n};\n"],"names":["styles"],"mappings":";;;;;;;;;;;;;;;;;;;;AAgBO,MAAM,eAAmB,MAAM;AACpC,EAAA,MAAM,OAAO,OAAA,EAAQ;AAErB,EAAA,MAAM,mBAAmB,IAAA,CAAK,QAAA;AAC9B,EAAA,MAAM,qBAAqB,qBAAA,EAAsB;AACjD,EAAA,MAAM,aAAA,GAAgB,mBAAmB,GAAA,CAAI,CAAC,6BAC5C,GAAA,CAAC,gBAAA,EAAA,EAAiB,QAAA,EAAA,EAAyB,QAAU,CACtD,CAAA;AAED,EAAA,MAAM,YAAA,GAAe,IAAA,CAAK,cAAA,CAAe,GAAA,CAAI,CAAC,CAAA,qBAC5C,GAAA,CAAC,eAAA,EAAA,EAAgB,OAAA,EAAS,CAAA,EAAA,EAAQ,CAAA,CAAE,EAAI,CACzC,CAAA;AACD,EAAA,MAAM,YAAA,GAAe,KAAK,cAAA,CAAe,IAAA,CAAK,CAAC,CAAA,KAAM,CAAA,CAAE,UAAU,CAAA;AAEjE,EAAA,MAAM,eAAA,GAAkB,4BAA4B,OAAO,CAAA;AAE3D,EAAA,IAAI,YAAA,CAAa,MAAA,KAAW,CAAA,IAAK,aAAA,CAAc,UAAU,CAAA,EAAG;AAC1D,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,4BACG,sBAAA,EAAA,EACC,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,WAAWA,YAAA,CAAO,MAAA;AAAA,QAClB,OAAA,EAAQ,SAAA;AAAA,QACR,KAAA,EAAM,WAAA;AAAA,QACN,YAAA,EAAY,eAAA,CAAgB,MAAA,CAAO,eAAe,CAAA;AAAA,QAElD,8BAAC,YAAA,EAAA,EAAa;AAAA;AAAA,KAChB;AAAA,yBAEC,eAAA,EAAA,EACE,QAAA,EAAA;AAAA,MAAA,aAAA,CAAc,SAAS,CAAA,oBACtB,IAAA;AAAA,QAAC,sBAAA;AAAA,QAAA;AAAA,UACC,aAAA,EAAc,QAAA;AAAA,UACd,YAAA,EAAc,CAAC,gBAAgB,CAAA;AAAA,UAE/B,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,WAAA,EAAA,EACE,QAAA,EAAA,eAAA,CAAgB,MAAA,CAAO,wBAAwB,CAAA,EAClD,CAAA;AAAA,YACC;AAAA;AAAA;AAAA,OACH;AAAA,MAGD,aAAa,MAAA,GAAS,CAAA,IAAK,cAAc,MAAA,GAAS,CAAA,wBAChD,aAAA,EAAA,EAAc,CAAA;AAAA,MAGhB,YAAA,CAAa,SAAS,CAAA,oBACrB,IAAA;AAAA,QAAC,sBAAA;AAAA,QAAA;AAAA,UACC,aAAA,EAAc,QAAA;AAAA,UACd,cAAc,YAAA,GAAe,CAAC,YAAA,CAAa,EAAE,IAAI,EAAC;AAAA,UAElD,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,WAAA,EAAA,EAAa,QAAA,EAAA,eAAA,CAAgB,MAAA,CAAO,cAAc,CAAA,EAAE,CAAA;AAAA,YACpD;AAAA;AAAA;AAAA;AACH,KAAA,EAEJ;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}
|
package/dist/types/components/List/components/Header/components/Settings/SettingsMenu.d.ts.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"SettingsMenu.d.ts","sourceRoot":"","sources":["../../../../../../../../src/components/List/components/Header/components/Settings/SettingsMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAgBhC,eAAO,MAAM,YAAY,EAAE,EA4D1B,CAAC"}
|