@mittwald/flow-react-components 0.2.0-alpha.115 → 0.2.0-alpha.117
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 +12 -12
- package/dist/js/components/src/components/FileCard/FileCard.mjs +17 -5
- package/dist/js/components/src/components/FileCard/FileCard.mjs.map +1 -1
- package/dist/types/components/FileCard/FileCard.d.ts.map +1 -1
- package/dist/types/components/FileCard/stories/Default.stories.d.ts +1 -0
- package/dist/types/components/FileCard/stories/Default.stories.d.ts.map +1 -1
- package/package.json +4 -4
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.117](https://github.com/mittwald/flow/compare/0.2.0-alpha.116...0.2.0-alpha.117) (2025-03-27)
|
|
7
|
+
|
|
8
|
+
### Features
|
|
9
|
+
|
|
10
|
+
* **FileCard:** Support ContextMenu in FileCard ([#1323](https://github.com/mittwald/flow/issues/1323)) ([02b5562](https://github.com/mittwald/flow/commit/02b5562578947b11c7c0271e50595f4c5faf13ed))
|
|
11
|
+
|
|
12
|
+
# [0.2.0-alpha.116](https://github.com/mittwald/flow/compare/0.2.0-alpha.115...0.2.0-alpha.116) (2025-03-26)
|
|
13
|
+
|
|
14
|
+
**Note:** Version bump only for package @mittwald/flow-react-components
|
|
15
|
+
|
|
6
16
|
# [0.2.0-alpha.115](https://github.com/mittwald/flow/compare/0.2.0-alpha.114...0.2.0-alpha.115) (2025-03-26)
|
|
7
17
|
|
|
8
18
|
**Note:** Version bump only for package @mittwald/flow-react-components
|
|
@@ -201658,9 +201658,9 @@
|
|
|
201658
201658
|
"flr-generate": "all",
|
|
201659
201659
|
"flr-clear-props-context": ""
|
|
201660
201660
|
},
|
|
201661
|
-
"filePath": "/home/runner/work/flow/flow/packages/components/src/components/RadioGroup/components/
|
|
201661
|
+
"filePath": "/home/runner/work/flow/flow/packages/components/src/components/RadioGroup/components/RadioButton/RadioButton.tsx",
|
|
201662
201662
|
"description": "",
|
|
201663
|
-
"displayName": "
|
|
201663
|
+
"displayName": "RadioButton",
|
|
201664
201664
|
"methods": [],
|
|
201665
201665
|
"props": {
|
|
201666
201666
|
"onFocus": {
|
|
@@ -202141,9 +202141,9 @@
|
|
|
202141
202141
|
"flr-generate": "all",
|
|
202142
202142
|
"flr-clear-props-context": ""
|
|
202143
202143
|
},
|
|
202144
|
-
"filePath": "/home/runner/work/flow/flow/packages/components/src/components/RadioGroup/components/
|
|
202144
|
+
"filePath": "/home/runner/work/flow/flow/packages/components/src/components/RadioGroup/components/Radio/Radio.tsx",
|
|
202145
202145
|
"description": "",
|
|
202146
|
-
"displayName": "
|
|
202146
|
+
"displayName": "Radio",
|
|
202147
202147
|
"methods": [],
|
|
202148
202148
|
"props": {
|
|
202149
202149
|
"onFocus": {
|
|
@@ -242780,14 +242780,6 @@
|
|
|
242780
242780
|
"methods": [],
|
|
242781
242781
|
"props": {}
|
|
242782
242782
|
},
|
|
242783
|
-
{
|
|
242784
|
-
"tags": {},
|
|
242785
|
-
"filePath": "/home/runner/work/flow/flow/packages/components/src/components/List/components/Header/components/ViewModeMenu/ViewModeMenu.tsx",
|
|
242786
|
-
"description": "",
|
|
242787
|
-
"displayName": "ViewModeMenu",
|
|
242788
|
-
"methods": [],
|
|
242789
|
-
"props": {}
|
|
242790
|
-
},
|
|
242791
242783
|
{
|
|
242792
242784
|
"tags": {},
|
|
242793
242785
|
"filePath": "/home/runner/work/flow/flow/packages/components/src/components/List/components/Header/components/SortingPickerItem/SortingPickerItem.tsx",
|
|
@@ -249237,6 +249229,14 @@
|
|
|
249237
249229
|
}
|
|
249238
249230
|
}
|
|
249239
249231
|
},
|
|
249232
|
+
{
|
|
249233
|
+
"tags": {},
|
|
249234
|
+
"filePath": "/home/runner/work/flow/flow/packages/components/src/components/List/components/Header/components/ViewModeMenu/ViewModeMenu.tsx",
|
|
249235
|
+
"description": "",
|
|
249236
|
+
"displayName": "ViewModeMenu",
|
|
249237
|
+
"methods": [],
|
|
249238
|
+
"props": {}
|
|
249239
|
+
},
|
|
249240
249240
|
{
|
|
249241
249241
|
"tags": {},
|
|
249242
249242
|
"filePath": "/home/runner/work/flow/flow/packages/components/src/components/List/components/Items/components/Item/hooks/useGridItemProps.tsx",
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
/* */
|
|
3
|
-
import {
|
|
3
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
4
4
|
import 'react';
|
|
5
5
|
import { Avatar } from './components/Avatar/Avatar.mjs';
|
|
6
6
|
import { Text } from '../Text/Text.mjs';
|
|
@@ -11,6 +11,10 @@ import { FileSizeText } from './components/FileSizeText/FileSizeText.mjs';
|
|
|
11
11
|
import { Link } from '../Link/Link.mjs';
|
|
12
12
|
import { Wrap } from '../Wrap/Wrap.mjs';
|
|
13
13
|
import { DeleteButton } from './components/DeleteButton/DeleteButton.mjs';
|
|
14
|
+
import '../../lib/propsContext/propsContext.mjs';
|
|
15
|
+
import '../../lib/viewComponentContext/viewComponentContext.mjs';
|
|
16
|
+
import { PropsContextProvider } from '../../lib/propsContext/PropsContextProvider.mjs';
|
|
17
|
+
import { OptionsButton } from '../List/components/Items/components/Item/components/OptionsButton/OptionsButton.mjs';
|
|
14
18
|
|
|
15
19
|
const FileCard = flowComponent("FileCard", (props) => {
|
|
16
20
|
const {
|
|
@@ -24,11 +28,18 @@ const FileCard = flowComponent("FileCard", (props) => {
|
|
|
24
28
|
href,
|
|
25
29
|
target,
|
|
26
30
|
download,
|
|
27
|
-
imageSrc
|
|
31
|
+
imageSrc,
|
|
32
|
+
children
|
|
28
33
|
} = props;
|
|
29
34
|
const rootClassName = clsx(styles.fileCard, className);
|
|
35
|
+
const propsContext = {
|
|
36
|
+
ContextMenu: {
|
|
37
|
+
wrapWith: /* @__PURE__ */ jsx(OptionsButton, {}),
|
|
38
|
+
placement: "bottom right"
|
|
39
|
+
}
|
|
40
|
+
};
|
|
30
41
|
const Element = elementType;
|
|
31
|
-
return /* @__PURE__ */ jsxs(Element, { className: rootClassName, children: [
|
|
42
|
+
return /* @__PURE__ */ jsx(PropsContextProvider, { props: propsContext, mergeInParentContext: true, children: /* @__PURE__ */ jsxs(Element, { className: rootClassName, children: [
|
|
32
43
|
/* @__PURE__ */ jsx(Wrap, { if: href || onPress, children: /* @__PURE__ */ jsxs(
|
|
33
44
|
Link,
|
|
34
45
|
{
|
|
@@ -47,8 +58,9 @@ const FileCard = flowComponent("FileCard", (props) => {
|
|
|
47
58
|
]
|
|
48
59
|
}
|
|
49
60
|
) }),
|
|
50
|
-
onDelete && /* @__PURE__ */ jsx(DeleteButton, { onDelete })
|
|
51
|
-
|
|
61
|
+
onDelete && children === void 0 && /* @__PURE__ */ jsx(DeleteButton, { onDelete }),
|
|
62
|
+
children
|
|
63
|
+
] }) });
|
|
52
64
|
});
|
|
53
65
|
|
|
54
66
|
export { FileCard, FileCard as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FileCard.mjs","sources":["../../../../../../src/components/FileCard/FileCard.tsx"],"sourcesContent":["import React from \"react\";\nimport { Avatar } from \"./components/Avatar\";\nimport { Text } from \"@/components/Text\";\nimport type {\n PropsWithClassName,\n PropsWithElementType,\n} from \"@/lib/types/props\";\nimport styles from \"./FileCard.module.scss\";\nimport clsx from \"clsx\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { FileSizeText } from \"@/components/FileCard/components/FileSizeText\";\nimport { Link, type LinkProps } from \"@/components/Link\";\nimport Wrap from \"@/components/Wrap\";\nimport { DeleteButton } from \"@/components/FileCard/components/DeleteButton\";\n\nexport interface FileCardProps\n extends PropsWithClassName,\n PropsWithElementType<\"div\" | \"li\">,\n Pick<LinkProps, \"onPress\" | \"href\" | \"target\" | \"download\"> {\n /** The name of the file. */\n name: string;\n /** The type of the file. */\n type?: string;\n /** Handler that is called when the file cards delete button is clicked. */\n onDelete?: () => void;\n /** The size of the file in bytes. */\n sizeInBytes?: number;\n /** The source of an image file. */\n imageSrc?: string;\n}\n\n/** @flr-generate all */\nexport const FileCard = flowComponent(\"FileCard\", (props) => {\n const {\n onDelete,\n type,\n sizeInBytes,\n name,\n className,\n elementType = \"div\",\n onPress,\n href,\n target,\n download,\n imageSrc,\n } = props;\n\n const rootClassName = clsx(styles.fileCard, className);\n\n const Element = elementType;\n\n return (\n <Element className={rootClassName}>\n
|
|
1
|
+
{"version":3,"file":"FileCard.mjs","sources":["../../../../../../src/components/FileCard/FileCard.tsx"],"sourcesContent":["import React from \"react\";\nimport { Avatar } from \"./components/Avatar\";\nimport { Text } from \"@/components/Text\";\nimport type {\n PropsWithClassName,\n PropsWithElementType,\n} from \"@/lib/types/props\";\nimport styles from \"./FileCard.module.scss\";\nimport clsx from \"clsx\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { FileSizeText } from \"@/components/FileCard/components/FileSizeText\";\nimport { Link, type LinkProps } from \"@/components/Link\";\nimport Wrap from \"@/components/Wrap\";\nimport { DeleteButton } from \"@/components/FileCard/components/DeleteButton\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport { OptionsButton } from \"@/components/List/components/Items/components/Item/components/OptionsButton\";\n\nexport interface FileCardProps\n extends PropsWithClassName,\n PropsWithElementType<\"div\" | \"li\">,\n Pick<LinkProps, \"onPress\" | \"href\" | \"target\" | \"download\"> {\n /** The name of the file. */\n name: string;\n /** The type of the file. */\n type?: string;\n /** Handler that is called when the file cards delete button is clicked. */\n onDelete?: () => void;\n /** The size of the file in bytes. */\n sizeInBytes?: number;\n /** The source of an image file. */\n imageSrc?: string;\n}\n\n/** @flr-generate all */\nexport const FileCard = flowComponent(\"FileCard\", (props) => {\n const {\n onDelete,\n type,\n sizeInBytes,\n name,\n className,\n elementType = \"div\",\n onPress,\n href,\n target,\n download,\n imageSrc,\n children,\n } = props;\n\n const rootClassName = clsx(styles.fileCard, className);\n\n const propsContext: PropsContext = {\n ContextMenu: {\n wrapWith: <OptionsButton />,\n placement: \"bottom right\",\n },\n };\n\n const Element = elementType;\n\n return (\n <PropsContextProvider props={propsContext} mergeInParentContext>\n <Element className={rootClassName}>\n <Wrap if={href || onPress}>\n <Link\n className={styles.link}\n unstyled\n href={href}\n onPress={onPress}\n target={target}\n download={download}\n >\n <Avatar type={type} imageSrc={imageSrc} />\n <span className={styles.text}>\n <Text className={styles.title}>\n <b>{name}</b>\n </Text>\n {sizeInBytes && <FileSizeText sizeInBytes={sizeInBytes} />}\n </span>\n </Link>\n </Wrap>\n {onDelete && children === undefined && (\n <DeleteButton onDelete={onDelete} />\n )}\n {children}\n </Element>\n </PropsContextProvider>\n );\n});\n\nexport default FileCard;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAkCO,MAAM,QAAW,GAAA,aAAA,CAAc,UAAY,EAAA,CAAC,KAAU,KAAA;AAC3D,EAAM,MAAA;AAAA,IACJ,QAAA;AAAA,IACA,IAAA;AAAA,IACA,WAAA;AAAA,IACA,IAAA;AAAA,IACA,SAAA;AAAA,IACA,WAAc,GAAA,KAAA;AAAA,IACd,OAAA;AAAA,IACA,IAAA;AAAA,IACA,MAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACA;AAAA,GACE,GAAA,KAAA;AAEJ,EAAA,MAAM,aAAgB,GAAA,IAAA,CAAK,MAAO,CAAA,QAAA,EAAU,SAAS,CAAA;AAErD,EAAA,MAAM,YAA6B,GAAA;AAAA,IACjC,WAAa,EAAA;AAAA,MACX,QAAA,sBAAW,aAAc,EAAA,EAAA,CAAA;AAAA,MACzB,SAAW,EAAA;AAAA;AACb,GACF;AAEA,EAAA,MAAM,OAAU,GAAA,WAAA;AAEhB,EACE,uBAAA,GAAA,CAAC,wBAAqB,KAAO,EAAA,YAAA,EAAc,sBAAoB,IAC7D,EAAA,QAAA,kBAAA,IAAA,CAAC,OAAQ,EAAA,EAAA,SAAA,EAAW,aAClB,EAAA,QAAA,EAAA;AAAA,oBAAC,GAAA,CAAA,IAAA,EAAA,EAAK,EAAI,EAAA,IAAA,IAAQ,OAChB,EAAA,QAAA,kBAAA,IAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,WAAW,MAAO,CAAA,IAAA;AAAA,QAClB,QAAQ,EAAA,IAAA;AAAA,QACR,IAAA;AAAA,QACA,OAAA;AAAA,QACA,MAAA;AAAA,QACA,QAAA;AAAA,QAEA,QAAA,EAAA;AAAA,0BAAC,GAAA,CAAA,MAAA,EAAA,EAAO,MAAY,QAAoB,EAAA,CAAA;AAAA,0BACvC,IAAA,CAAA,MAAA,EAAA,EAAK,SAAW,EAAA,MAAA,CAAO,IACtB,EAAA,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,QAAK,SAAW,EAAA,MAAA,CAAO,OACtB,QAAC,kBAAA,GAAA,CAAA,GAAA,EAAA,EAAG,gBAAK,CACX,EAAA,CAAA;AAAA,YACC,WAAA,oBAAgB,GAAA,CAAA,YAAA,EAAA,EAAa,WAA0B,EAAA;AAAA,WAC1D,EAAA;AAAA;AAAA;AAAA,KAEJ,EAAA,CAAA;AAAA,IACC,QAAY,IAAA,QAAA,KAAa,MACxB,oBAAA,GAAA,CAAC,gBAAa,QAAoB,EAAA,CAAA;AAAA,IAEnC;AAAA,GAAA,EACH,CACF,EAAA,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FileCard.d.ts","sourceRoot":"","sources":["../../../../src/components/FileCard/FileCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EACV,kBAAkB,EAClB,oBAAoB,EACrB,MAAM,mBAAmB,CAAC;AAK3B,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"FileCard.d.ts","sourceRoot":"","sources":["../../../../src/components/FileCard/FileCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EACV,kBAAkB,EAClB,oBAAoB,EACrB,MAAM,mBAAmB,CAAC;AAK3B,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAMzD,MAAM,WAAW,aACf,SAAQ,kBAAkB,EACxB,oBAAoB,CAAC,KAAK,GAAG,IAAI,CAAC,EAClC,IAAI,CAAC,SAAS,EAAE,SAAS,GAAG,MAAM,GAAG,QAAQ,GAAG,UAAU,CAAC;IAC7D,4BAA4B;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,4BAA4B;IAC5B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,2EAA2E;IAC3E,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,qCAAqC;IACrC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mCAAmC;IACnC,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,wBAAwB;AACxB,eAAO,MAAM,QAAQ,8EAuDnB,CAAC;AAEH,eAAe,QAAQ,CAAC"}
|
|
@@ -9,5 +9,6 @@ export declare const WithSize: Story;
|
|
|
9
9
|
export declare const WithOnDelete: Story;
|
|
10
10
|
export declare const WithLink: Story;
|
|
11
11
|
export declare const WithLinkAndOnDelete: Story;
|
|
12
|
+
export declare const WithContextMenu: Story;
|
|
12
13
|
export declare const WithImage: Story;
|
|
13
14
|
//# sourceMappingURL=Default.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Default.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/FileCard/stories/Default.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;
|
|
1
|
+
{"version":3,"file":"Default.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/FileCard/stories/Default.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAMjD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,QAAQ,CAK/B,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,QAAQ,CAAC,CAAC;AAEvC,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC;AAEjC,eAAO,MAAM,QAAQ,EAAE,KAAuC,CAAC;AAE/D,eAAO,MAAM,QAAQ,EAAE,KAAwC,CAAC;AAEhE,eAAO,MAAM,YAAY,EAAE,KAM1B,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAItB,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KAOjC,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAQ7B,CAAC;AACF,eAAO,MAAM,SAAS,EAAE,KAIvB,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.117",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "A React implementation of Flow, mittwald’s design system",
|
|
6
6
|
"homepage": "https://mittwald.github.io/flow",
|
|
@@ -53,7 +53,7 @@
|
|
|
53
53
|
"dependencies": {
|
|
54
54
|
"@chakra-ui/live-region": "^2.1.0",
|
|
55
55
|
"@internationalized/string-compiler": "^3.2.6",
|
|
56
|
-
"@mittwald/react-tunnel": "0.2.0-alpha.
|
|
56
|
+
"@mittwald/react-tunnel": "0.2.0-alpha.117",
|
|
57
57
|
"@mittwald/react-use-promise": "^3.0.3",
|
|
58
58
|
"@react-aria/form": "^3.0.14",
|
|
59
59
|
"@react-aria/utils": "^3.28.1",
|
|
@@ -93,7 +93,7 @@
|
|
|
93
93
|
"@faker-js/faker": "^9.6.0",
|
|
94
94
|
"@internationalized/date": "^3.7.0",
|
|
95
95
|
"@mfalkenberg/remote-dom-react": "1.2.3",
|
|
96
|
-
"@mittwald/flow-design-tokens": "0.2.0-alpha.
|
|
96
|
+
"@mittwald/flow-design-tokens": "0.2.0-alpha.117",
|
|
97
97
|
"@mittwald/react-use-promise": "^2.6.0",
|
|
98
98
|
"@mittwald/typescript-config": "",
|
|
99
99
|
"@nx/storybook": "^20.5.0",
|
|
@@ -173,5 +173,5 @@
|
|
|
173
173
|
"optional": true
|
|
174
174
|
}
|
|
175
175
|
},
|
|
176
|
-
"gitHead": "
|
|
176
|
+
"gitHead": "a34171fcad0231a7d30a32a02503b0892afbfa78"
|
|
177
177
|
}
|