@mittwald/flow-react-components 1.2.0-next.20 → 1.2.0-next.21
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/dist/assets/component-index.json +1 -1
- package/dist/assets/doc-properties.json +1 -1
- package/dist/css/all-layered.css +1 -1
- package/dist/css/all.css +1 -1
- package/dist/js/default.mjs +1 -1
- package/dist/js/packages/components/src/components/AlertBadge/AlertBadge.mjs +1 -1
- package/dist/js/packages/components/src/components/Autocomplete/Autocomplete.mjs +1 -1
- package/dist/js/packages/components/src/components/Button/Button.mjs +8 -10
- package/dist/js/packages/components/src/components/Button/Button.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Button/Button.module.mjs +5 -3
- package/dist/js/packages/components/src/components/Button/Button.module.mjs.map +1 -1
- package/dist/js/packages/components/src/components/FileCard/FileCard.mjs +1 -1
- package/dist/js/packages/components/src/components/Link/Link.mjs +1 -2
- package/dist/js/packages/components/src/components/Link/Link.mjs.map +1 -1
- package/dist/js/packages/components/src/components/List/views/EmptyView/EmptyView.mjs +1 -1
- package/dist/js/packages/components/src/components/PasswordCreationField/components/ValidationResultEntry/ValidationResultEntry.mjs +1 -1
- package/dist/js/packages/components/src/components/TabNavigation/TabNavigation.mjs +1 -1
- package/dist/js/packages/components/src/components/Tabs/components/FallbackTab/FallbackTab.mjs +1 -1
- package/dist/js/packages/components/src/lib/react/remote.mjs +9 -2
- package/dist/js/packages/components/src/lib/react/remote.mjs.map +1 -1
- package/dist/types/components/Button/Button.d.ts.map +1 -1
- package/dist/types/components/Link/Link.d.ts.map +1 -1
- package/dist/types/lib/react/remote.d.ts +5 -0
- package/dist/types/lib/react/remote.d.ts.map +1 -1
- package/package.json +9 -9
package/dist/js/default.mjs
CHANGED
|
@@ -144,7 +144,6 @@ import { IconSuccess } from "./packages/components/src/components/Icon/component
|
|
|
144
144
|
import { IconUnavailable } from "./packages/components/src/components/Icon/components/icons/IconUnavailable.mjs";
|
|
145
145
|
import { IconWarning } from "./packages/components/src/components/Icon/components/icons/IconWarning.mjs";
|
|
146
146
|
import { Wrap } from "./packages/components/src/components/Wrap/Wrap.mjs";
|
|
147
|
-
import { Text } from "./packages/components/src/components/Text/Text.mjs";
|
|
148
147
|
import { themeHtmlAttribute } from "./packages/components/src/lib/theming/lib/keys.mjs";
|
|
149
148
|
import { ThemedHtml } from "./packages/components/src/lib/theming/components/ThemedHtml.mjs";
|
|
150
149
|
import { getTheme } from "./packages/components/src/lib/theming/lib/getTheme.mjs";
|
|
@@ -174,6 +173,7 @@ import { ActionBatch } from "./packages/components/src/components/Action/ActionB
|
|
|
174
173
|
import { ActionGroup } from "./packages/components/src/components/ActionGroup/ActionGroup.mjs";
|
|
175
174
|
import { AlertIcon } from "./packages/components/src/components/AlertIcon/AlertIcon.mjs";
|
|
176
175
|
import { Alert } from "./packages/components/src/components/Alert/Alert.mjs";
|
|
176
|
+
import { Text } from "./packages/components/src/components/Text/Text.mjs";
|
|
177
177
|
import { AlertBadge } from "./packages/components/src/components/AlertBadge/AlertBadge.mjs";
|
|
178
178
|
import { AlertText } from "./packages/components/src/components/AlertText/AlertText.mjs";
|
|
179
179
|
import { Combine } from "./packages/components/src/components/Combine/Combine.mjs";
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
/* */
|
|
3
3
|
import { flowComponent } from "../../lib/componentFactory/flowComponent.mjs";
|
|
4
|
-
import { Text } from "../Text/Text.mjs";
|
|
5
4
|
import { AlertIcon } from "../AlertIcon/AlertIcon.mjs";
|
|
6
5
|
import AlertBadge_module_default from "./AlertBadge.module.mjs";
|
|
6
|
+
import { Text } from "../Text/Text.mjs";
|
|
7
7
|
import clsx from "clsx";
|
|
8
8
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
9
9
|
//#region src/components/AlertBadge/AlertBadge.tsx
|
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
/* */
|
|
3
3
|
import { PropsContextProvider } from "../../lib/propsContext/components/PropsContextProvider.mjs";
|
|
4
4
|
import { flowComponent } from "../../lib/componentFactory/flowComponent.mjs";
|
|
5
|
-
import { Text } from "../Text/Text.mjs";
|
|
6
5
|
import { UiComponentTunnelExit } from "../UiComponentTunnel/UiComponentTunnelExit.mjs";
|
|
7
6
|
import { useOverlayController } from "../../lib/controller/overlay/useOverlayController.mjs";
|
|
7
|
+
import { Text } from "../Text/Text.mjs";
|
|
8
8
|
import { Options } from "../Options/Options.mjs";
|
|
9
9
|
import __locale_default from "../../../../../_virtual/_3.locale.mjs";
|
|
10
10
|
import Autocomplete_module_default from "./Autocomplete.module.mjs";
|
|
@@ -3,12 +3,11 @@
|
|
|
3
3
|
import { PropsContextProvider } from "../../lib/propsContext/components/PropsContextProvider.mjs";
|
|
4
4
|
import { flowComponent } from "../../lib/componentFactory/flowComponent.mjs";
|
|
5
5
|
import Button_module_default from "./Button.module.mjs";
|
|
6
|
-
import {
|
|
6
|
+
import { containsTextChild } from "../../lib/react/remote.mjs";
|
|
7
7
|
import { useWarnDeprecation } from "../DeprecationWarningProvider/DeprecationWarningProvider.mjs";
|
|
8
8
|
import { IconFailed } from "../Icon/components/icons/IconFailed.mjs";
|
|
9
9
|
import { IconSucceeded } from "../Icon/components/icons/IconSucceeded.mjs";
|
|
10
10
|
import { Wrap } from "../Wrap/Wrap.mjs";
|
|
11
|
-
import { Text } from "../Text/Text.mjs";
|
|
12
11
|
import { LoadingSpinner } from "../LoadingSpinner/LoadingSpinner.mjs";
|
|
13
12
|
import { useAriaAnnounceActionState } from "../Action/lib/ariaLive.mjs";
|
|
14
13
|
import clsx from "clsx";
|
|
@@ -44,6 +43,11 @@ var Button = flowComponent("Button", (props) => {
|
|
|
44
43
|
const { color: colorFromProps = "primary", variant = "solid", children, className, size = "m", isPending, isSucceeded, isFailed, "aria-disabled": ariaDisabled, ref, slot: ignoredSlotProp, ariaSlot: slot, unstyled, isReadOnly, elementType, ...restProps } = props;
|
|
45
44
|
if (colorFromProps === "accent") warnDeprecation("The color 'accent' is deprecated and will be removed in a future release. Use 'success' instead.");
|
|
46
45
|
const color = colorFromProps === "accent" ? "success" : colorFromProps;
|
|
46
|
+
/**
|
|
47
|
+
* A string child renders no element the CSS could match, so the button itself
|
|
48
|
+
* carries the marker. An explicit `Text` child is matched by `:has(.text)`.
|
|
49
|
+
*/
|
|
50
|
+
const hasText = containsTextChild(children);
|
|
47
51
|
const rootClassName = unstyled ? className : clsx(
|
|
48
52
|
Button_module_default.button,
|
|
49
53
|
isPending && Button_module_default.isPending,
|
|
@@ -57,6 +61,7 @@ var Button = flowComponent("Button", (props) => {
|
|
|
57
61
|
* by now, so this Button will be visually disabled via CSS.
|
|
58
62
|
*/
|
|
59
63
|
ariaDisabled && Button_module_default.ariaDisabled,
|
|
64
|
+
hasText && Button_module_default.hasText,
|
|
60
65
|
className
|
|
61
66
|
);
|
|
62
67
|
useAriaAnnounceActionState(isPending ? "isPending" : isSucceeded ? "isSucceeded" : isFailed ? "isFailed" : "isIdle");
|
|
@@ -83,20 +88,13 @@ var Button = flowComponent("Button", (props) => {
|
|
|
83
88
|
size,
|
|
84
89
|
className: Button_module_default.stateIcon
|
|
85
90
|
}) : void 0;
|
|
86
|
-
const isStringContent = extractTextFromFirstChild(children) !== void 0;
|
|
87
91
|
const content = /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(PropsContextProvider, {
|
|
88
92
|
props: propsContext,
|
|
89
93
|
children: /* @__PURE__ */ jsx(Wrap, {
|
|
90
94
|
if: !unstyled,
|
|
91
95
|
children: /* @__PURE__ */ jsx("span", {
|
|
92
96
|
className: Button_module_default.content,
|
|
93
|
-
children
|
|
94
|
-
if: isStringContent,
|
|
95
|
-
children: /* @__PURE__ */ jsx(Text, {
|
|
96
|
-
className: Button_module_default.text,
|
|
97
|
-
children
|
|
98
|
-
})
|
|
99
|
-
})
|
|
97
|
+
children
|
|
100
98
|
})
|
|
101
99
|
})
|
|
102
100
|
}), stateIcon] });
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.mjs","names":[],"sources":["../../../../../../../src/components/Button/Button.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport styles from \"./Button.module.scss\";\nimport * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { IconFailed, IconSucceeded } from \"@/components/Icon/components/icons\";\nimport { Wrap } from \"@/components/Wrap\";\nimport
|
|
1
|
+
{"version":3,"file":"Button.mjs","names":[],"sources":["../../../../../../../src/components/Button/Button.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport styles from \"./Button.module.scss\";\nimport * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { IconFailed, IconSucceeded } from \"@/components/Icon/components/icons\";\nimport { Wrap } from \"@/components/Wrap\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport LoadingSpinner from \"@/components/LoadingSpinner/LoadingSpinner\";\nimport { useAriaAnnounceActionState } from \"@/components/Action/lib/ariaLive\";\nimport { containsTextChild } from \"@/lib/react/remote\";\nimport type { AlphaColor } from \"@/lib/types/props\";\nimport { filterDOMProps } from \"@react-aria/utils\";\nimport { useWarnDeprecation } from \"@/components/DeprecationWarningProvider\";\n\nexport interface ButtonProps\n extends\n PropsWithChildren<Aria.ButtonProps>,\n FlowComponentProps<HTMLButtonElement> {\n /** Slot for button placement in action groups. */\n slot?: string;\n /**\n * The color of the button.\n *\n * @default \"primary\"\n * @deprecatedValues accent\n */\n color?:\n \"primary\" | \"success\" | \"secondary\" | \"danger\" | AlphaColor | \"accent\";\n /** The visual variant of the button. @default \"solid\" */\n variant?: \"plain\" | \"solid\" | \"soft\" | \"outline\";\n /** The size of the button. @default \"m\" */\n size?: \"m\" | \"s\";\n /** Disables button but keeps it focusable. */\n \"aria-disabled\"?: boolean;\n /** Whether the button is in a pending state. */\n isPending?: boolean;\n /** Whether the button is in a succeeded state. */\n isSucceeded?: boolean;\n /** Whether the button is in a failed state. */\n isFailed?: boolean;\n /** Whether the button is in a read only state. */\n isReadOnly?: boolean;\n /** @internal */\n unstyled?: boolean;\n /** @internal */\n ariaSlot?: string | null;\n /** @internal */\n elementType?: \"button\" | \"span\";\n}\n\nconst disablePendingProps = (props: ButtonProps) => {\n if (\n props.isPending ||\n props.isSucceeded ||\n props.isFailed ||\n props[\"aria-disabled\"] ||\n props.isReadOnly\n ) {\n props = { ...props };\n\n const mutedActionHandler = (e: unknown) => {\n if (e && typeof e === \"object\") {\n // stopPropagation is the default behavior in React Aria\n const isReactAriaEvent =\n \"continuePropagation\" in e &&\n typeof e.continuePropagation === \"function\";\n\n if (\n !isReactAriaEvent &&\n \"stopPropagation\" in e &&\n typeof e.stopPropagation === \"function\"\n ) {\n e.stopPropagation();\n }\n if (\"preventDefault\" in e && typeof e.preventDefault === \"function\") {\n e.preventDefault();\n }\n }\n\n return false;\n };\n\n props.onClick = mutedActionHandler;\n props.onPress = mutedActionHandler;\n props.onPressStart = mutedActionHandler;\n props.onPressEnd = mutedActionHandler;\n props.onPressChange = mutedActionHandler;\n props.onPressUp = mutedActionHandler;\n props.onKeyDown = mutedActionHandler;\n props.onKeyUp = mutedActionHandler;\n }\n\n return props;\n};\n\n/** @flr-generate all */\nexport const Button = flowComponent(\"Button\", (props) => {\n props = disablePendingProps(props);\n\n const warnDeprecation = useWarnDeprecation();\n\n const {\n color: colorFromProps = \"primary\",\n variant = \"solid\",\n children,\n className,\n size = \"m\",\n isPending,\n isSucceeded,\n isFailed,\n \"aria-disabled\": ariaDisabled,\n ref,\n slot: ignoredSlotProp,\n ariaSlot: slot,\n unstyled,\n isReadOnly,\n elementType,\n ...restProps\n } = props;\n\n if (colorFromProps === \"accent\") {\n warnDeprecation(\n \"The color 'accent' is deprecated and will be removed in a future release. Use 'success' instead.\",\n );\n }\n\n const color = colorFromProps === \"accent\" ? \"success\" : colorFromProps;\n\n /**\n * A string child renders no element the CSS could match, so the button itself\n * carries the marker. An explicit `Text` child is matched by `:has(.text)`.\n */\n const hasText = containsTextChild(children);\n\n const rootClassName = unstyled\n ? className\n : clsx(\n styles.button,\n isPending && styles.isPending,\n isSucceeded && styles.isSucceeded,\n isFailed && styles.isFailed,\n size === \"s\" && styles[\"size-s\"],\n styles[color],\n styles[variant],\n /**\n * Workaround warning: The Aria.Button does not support \"aria-disabled\"\n * by now, so this Button will be visually disabled via CSS.\n */\n ariaDisabled && styles.ariaDisabled,\n hasText && styles.hasText,\n className,\n );\n\n useAriaAnnounceActionState(\n isPending\n ? \"isPending\"\n : isSucceeded\n ? \"isSucceeded\"\n : isFailed\n ? \"isFailed\"\n : \"isIdle\",\n );\n\n const propsContext: PropsContext = {\n Icon: {\n className: styles.icon,\n \"aria-hidden\": true,\n size,\n },\n Text: {\n className: styles.text,\n },\n Avatar: {\n className: styles.avatar,\n },\n CounterBadge: {\n className: styles.counterBadge,\n },\n Image: {\n className: styles.image,\n },\n };\n\n const stateIcon = isSucceeded ? (\n <IconSucceeded size={size} className={styles.stateIcon} color=\"success\" />\n ) : isFailed ? (\n <IconFailed size={size} className={styles.stateIcon} color=\"danger\" />\n ) : isPending ? (\n <LoadingSpinner size={size} className={styles.stateIcon} />\n ) : undefined;\n\n const content = (\n <>\n <PropsContextProvider props={propsContext}>\n <Wrap if={!unstyled}>\n <span className={styles.content}>{children}</span>\n </Wrap>\n </PropsContextProvider>\n {stateIcon}\n </>\n );\n\n if (elementType === \"span\") {\n const spanProps = filterDOMProps(restProps, { global: true });\n\n return (\n <span\n {...spanProps}\n data-disabled={restProps.isDisabled || undefined}\n className={\n typeof rootClassName === \"string\" ? rootClassName : undefined\n }\n >\n {content}\n </span>\n );\n }\n\n return (\n <Aria.Button\n className={rootClassName}\n ref={ref}\n slot={slot}\n {...(isReadOnly === true ? { \"data-readonly\": true } : {})}\n {...restProps}\n >\n {content}\n </Aria.Button>\n );\n});\n\nexport default Button;\n"],"mappings":";;;;;;;;;;;;;;;;;AAqDA,IAAM,uBAAuB,UAAuB;CAClD,IACE,MAAM,aACN,MAAM,eACN,MAAM,YACN,MAAM,oBACN,MAAM,YACN;EACA,QAAQ,EAAE,GAAG,MAAM;EAEnB,MAAM,sBAAsB,MAAe;GACzC,IAAI,KAAK,OAAO,MAAM,UAAU;IAM9B,IACE,EAJA,yBAAyB,KACzB,OAAO,EAAE,wBAAwB,eAIjC,qBAAqB,KACrB,OAAO,EAAE,oBAAoB,YAE7B,EAAE,gBAAgB;IAEpB,IAAI,oBAAoB,KAAK,OAAO,EAAE,mBAAmB,YACvD,EAAE,eAAe;GAErB;GAEA,OAAO;EACT;EAEA,MAAM,UAAU;EAChB,MAAM,UAAU;EAChB,MAAM,eAAe;EACrB,MAAM,aAAa;EACnB,MAAM,gBAAgB;EACtB,MAAM,YAAY;EAClB,MAAM,YAAY;EAClB,MAAM,UAAU;CAClB;CAEA,OAAO;AACT;;AAGA,IAAa,SAAS,cAAc,WAAW,UAAU;CACvD,QAAQ,oBAAoB,KAAK;CAEjC,MAAM,kBAAkB,mBAAmB;CAE3C,MAAM,EACJ,OAAO,iBAAiB,WACxB,UAAU,SACV,UACA,WACA,OAAO,KACP,WACA,aACA,UACA,iBAAiB,cACjB,KACA,MAAM,iBACN,UAAU,MACV,UACA,YACA,aACA,GAAG,cACD;CAEJ,IAAI,mBAAmB,UACrB,gBACE,kGACF;CAGF,MAAM,QAAQ,mBAAmB,WAAW,YAAY;;;;;CAMxD,MAAM,UAAU,kBAAkB,QAAQ;CAE1C,MAAM,gBAAgB,WAClB,YACA;EACE,sBAAO;EACP,aAAa,sBAAO;EACpB,eAAe,sBAAO;EACtB,YAAY,sBAAO;EACnB,SAAS,OAAO,sBAAO;EACvB,sBAAO;EACP,sBAAO;;;;;EAKP,gBAAgB,sBAAO;EACvB,WAAW,sBAAO;EAClB;CACF;CAEJ,2BACE,YACI,cACA,cACE,gBACA,WACE,aACA,QACV;CAEA,MAAM,eAA6B;EACjC,MAAM;GACJ,WAAW,sBAAO;GAClB,eAAe;GACf;EACF;EACA,MAAM,EACJ,WAAW,sBAAO,KACpB;EACA,QAAQ,EACN,WAAW,sBAAO,OACpB;EACA,cAAc,EACZ,WAAW,sBAAO,aACpB;EACA,OAAO,EACL,WAAW,sBAAO,MACpB;CACF;CAEA,MAAM,YAAY,cAChB,oBAAC,eAAD;EAAqB;EAAM,WAAW,sBAAO;EAAW,OAAM;CAAW,CAAA,IACvE,WACF,oBAAC,YAAD;EAAkB;EAAM,WAAW,sBAAO;EAAW,OAAM;CAAU,CAAA,IACnE,YACF,oBAAC,gBAAD;EAAsB;EAAM,WAAW,sBAAO;CAAY,CAAA,IACxD,KAAA;CAEJ,MAAM,UACJ,qBAAA,UAAA,EAAA,UAAA,CACE,oBAAC,sBAAD;EAAsB,OAAO;EAC3B,UAAA,oBAAC,MAAD;GAAM,IAAI,CAAC;GACT,UAAA,oBAAC,QAAD;IAAM,WAAW,sBAAO;IAAU;GAAe,CAAA;EAC7C,CAAA;CACc,CAAA,GACrB,SACD,EAAA,CAAA;CAGJ,IAAI,gBAAgB,QAAQ;EAC1B,MAAM,YAAY,eAAe,WAAW,EAAE,QAAQ,KAAK,CAAC;EAE5D,OACE,oBAAC,QAAD;GACE,GAAI;GACJ,iBAAe,UAAU,cAAc,KAAA;GACvC,WACE,OAAO,kBAAkB,WAAW,gBAAgB,KAAA;GAGrD,UAAA;EACG,CAAA;CAEV;CAEA,OACE,oBAAC,KAAK,QAAN;EACE,WAAW;EACN;EACC;EACN,GAAK,eAAe,OAAO,EAAE,iBAAiB,KAAK,IAAI,CAAC;EACxD,GAAI;EAEH,UAAA;CACU,CAAA;AAEjB,CAAC"}
|
|
@@ -7,11 +7,11 @@ var content = "flow--button--content";
|
|
|
7
7
|
var stateIcon = "flow--button--state-icon";
|
|
8
8
|
var icon = "flow--button--icon";
|
|
9
9
|
var text = "flow--button--text";
|
|
10
|
+
var hasText = "flow--button--has-text";
|
|
10
11
|
var counterBadge = "flow--button--counter-badge";
|
|
11
12
|
var isPending = "flow--button--is-pending";
|
|
12
13
|
var isFailed = "flow--button--is-failed";
|
|
13
14
|
var isSucceeded = "flow--button--is-succeeded";
|
|
14
|
-
var plain = "flow--button--plain";
|
|
15
15
|
var primary = "flow--button--primary";
|
|
16
16
|
var solid = "flow--button--solid";
|
|
17
17
|
var ariaDisabled = "flow--button--aria-disabled";
|
|
@@ -20,6 +20,7 @@ var danger = "flow--button--danger";
|
|
|
20
20
|
var secondary = "flow--button--secondary";
|
|
21
21
|
var dark = "flow--button--dark";
|
|
22
22
|
var light = "flow--button--light";
|
|
23
|
+
var plain = "flow--button--plain";
|
|
23
24
|
var soft = "flow--button--soft";
|
|
24
25
|
var avatar = "flow--button--avatar";
|
|
25
26
|
var image = "flow--button--image";
|
|
@@ -30,11 +31,11 @@ var Button_module_default = {
|
|
|
30
31
|
stateIcon,
|
|
31
32
|
icon,
|
|
32
33
|
text,
|
|
34
|
+
hasText,
|
|
33
35
|
counterBadge,
|
|
34
36
|
isPending,
|
|
35
37
|
isFailed,
|
|
36
38
|
isSucceeded,
|
|
37
|
-
plain,
|
|
38
39
|
"size-s": "flow--button--size-s",
|
|
39
40
|
primary,
|
|
40
41
|
solid,
|
|
@@ -46,11 +47,12 @@ var Button_module_default = {
|
|
|
46
47
|
light,
|
|
47
48
|
"dark-static": "flow--button--dark-static",
|
|
48
49
|
"light-static": "flow--button--light-static",
|
|
50
|
+
plain,
|
|
49
51
|
soft,
|
|
50
52
|
avatar,
|
|
51
53
|
image
|
|
52
54
|
};
|
|
53
55
|
//#endregion
|
|
54
|
-
export { ariaDisabled, avatar, button, content, counterBadge, danger, dark, Button_module_default as default, icon, image, isFailed, isPending, isSucceeded, light, outline, plain, primary, secondary, soft, solid, stateIcon, success, text };
|
|
56
|
+
export { ariaDisabled, avatar, button, content, counterBadge, danger, dark, Button_module_default as default, hasText, icon, image, isFailed, isPending, isSucceeded, light, outline, plain, primary, secondary, soft, solid, stateIcon, success, text };
|
|
55
57
|
|
|
56
58
|
//# sourceMappingURL=Button.module.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.module.mjs","names":[],"sources":["../../../../../../../src/components/Button/Button.module.scss"],"sourcesContent":["@use \"@/styles/mixins/ellipsis\";\n@use \"@/styles/mixins/focus\";\n@use \"@/styles/mixins/avatarButton\";\n\n.button {\n position: relative;\n font-family: Inter, sans-serif;\n font-size: var(--font-size-text--m);\n font-weight: bold;\n line-height: var(--line-height);\n border: none;\n border-radius: var(--button--corner-radius);\n padding-block: var(--button--padding-y);\n padding-inline: var(--button--padding-x);\n transition-property: color, background-color;\n transition-duration: var(--transition--duration--default);\n max-width: 100%;\n display: grid;\n align-items: center;\n grid-template-areas: \"content\";\n width: fit-content;\n\n &:where(.outline) {\n border-width: var(--button--border-width);\n border-style: var(--button--border-style);\n padding-block: calc(var(--button--padding-y) - var(--button--border-width));\n padding-inline: calc(\n var(--button--padding-x) - var(--button--border-width)\n );\n }\n\n @include focus.focus;\n\n @extend .primary;\n @extend .solid;\n\n /* Elements */\n .content {\n display: flex;\n column-gap: var(--button--spacing);\n align-items: center;\n justify-content: center;\n }\n\n .content,\n .stateIcon {\n grid-area: content;\n }\n\n .stateIcon {\n justify-self: center;\n }\n\n &:where(:has(.icon):not(:has(.text))) {\n padding: var(--button--padding-icon-only);\n\n &:where(.outline) {\n padding: calc(\n var(--button--padding-icon-only) - var(--button--border-width)\n );\n }\n }\n\n
|
|
1
|
+
{"version":3,"file":"Button.module.mjs","names":[],"sources":["../../../../../../../src/components/Button/Button.module.scss"],"sourcesContent":["@use \"@/styles/mixins/ellipsis\";\n@use \"@/styles/mixins/focus\";\n@use \"@/styles/mixins/avatarButton\";\n\n.button {\n position: relative;\n font-family: Inter, sans-serif;\n font-size: var(--font-size-text--m);\n font-weight: bold;\n line-height: var(--line-height);\n border: none;\n border-radius: var(--button--corner-radius);\n padding-block: var(--button--padding-y);\n padding-inline: var(--button--padding-x);\n transition-property: color, background-color;\n transition-duration: var(--transition--duration--default);\n max-width: 100%;\n display: grid;\n align-items: center;\n grid-template-areas: \"content\";\n width: fit-content;\n\n &:where(.outline) {\n border-width: var(--button--border-width);\n border-style: var(--button--border-style);\n padding-block: calc(var(--button--padding-y) - var(--button--border-width));\n padding-inline: calc(\n var(--button--padding-x) - var(--button--border-width)\n );\n }\n\n @include focus.focus;\n\n @extend .primary;\n @extend .solid;\n\n /* Elements */\n .content {\n display: flex;\n column-gap: var(--button--spacing);\n align-items: center;\n justify-content: center;\n text-align: start;\n text-wrap-style: pretty;\n }\n\n .content,\n .stateIcon {\n grid-area: content;\n }\n\n .stateIcon {\n justify-self: center;\n }\n\n &:where(:has(.icon):not(:has(.text), .hasText)) {\n padding: var(--button--padding-icon-only);\n\n &:where(.outline) {\n padding: calc(\n var(--button--padding-icon-only) - var(--button--border-width)\n );\n }\n }\n\n .counterBadge {\n position: absolute;\n top: calc(var(--size-px--xxs) * -1);\n inset-inline-end: calc(var(--size-px--xxs) * -1);\n }\n\n /* States */\n\n &.isPending,\n &.isFailed,\n &.isSucceeded {\n .content {\n opacity: 0;\n }\n }\n\n &.isPending {\n .stateIcon {\n color: var(--button--pending-icon-color);\n }\n }\n\n /* Size */\n\n &:where(.size-s) {\n font-size: var(--button--font-size-s);\n line-height: var(--button--line-height-s);\n padding-block: var(--button--padding-s-y);\n padding-inline: var(--button--padding-s-x);\n column-gap: var(--button--spacing-s);\n border-radius: var(--button--corner-radius-s);\n\n &:where(.outline) {\n padding-block: calc(\n var(--button--padding-s-y) - var(--button--border-width)\n );\n padding-inline: calc(\n var(--button--padding-s-x) - var(--button--border-width)\n );\n }\n\n &:where(:has(.icon):not(:has(.text), .hasText)) {\n padding: var(--button--padding-s-icon-only);\n\n &:where(.outline) {\n padding: calc(\n var(--button--padding-s-icon-only) - var(--button--border-width)\n );\n }\n }\n\n .content {\n column-gap: var(--button--spacing-s);\n }\n }\n\n /* Variants */\n\n @mixin variant($color, $variant) {\n &:where(.#{$color}.#{$variant}) {\n background-color: var(\n --button--#{$color}-#{$variant}-background-color--default\n );\n color: var(--button--#{$color}-#{$variant}-content-color--default);\n\n &:hover:where(:not([data-readonly])) {\n background-color: var(\n --button--#{$color}-#{$variant}-background-color--hover\n );\n }\n\n &[data-pressed]:where(:not([data-readonly])) {\n background-color: var(\n --button--#{$color}-#{$variant}-background-color--pressed\n );\n }\n\n &[disabled],\n &[data-disabled],\n &.ariaDisabled,\n &.isPending,\n &.isFailed,\n &.isSucceeded {\n background-color: var(\n --button--#{$color}-#{$variant}-background-color--disabled\n );\n color: var(--button--#{$color}-#{$variant}-content-color--disabled);\n }\n }\n }\n\n @include variant(primary, solid);\n @include variant(success, solid);\n @include variant(danger, solid);\n @include variant(secondary, solid);\n @include variant(dark, solid);\n @include variant(light, solid);\n @include variant(dark-static, solid);\n @include variant(light-static, solid);\n @include variant(primary, plain);\n @include variant(success, plain);\n @include variant(danger, plain);\n @include variant(secondary, plain);\n @include variant(dark, plain);\n @include variant(light, plain);\n @include variant(dark-static, plain);\n @include variant(light-static, plain);\n @include variant(primary, soft);\n @include variant(success, soft);\n @include variant(danger, soft);\n @include variant(secondary, soft);\n @include variant(dark, soft);\n @include variant(light, soft);\n @include variant(dark-static, soft);\n @include variant(light-static, soft);\n @include variant(primary, outline);\n @include variant(success, outline);\n @include variant(danger, outline);\n @include variant(secondary, outline);\n @include variant(dark, outline);\n @include variant(light, outline);\n @include variant(dark-static, outline);\n @include variant(light-static, outline);\n\n /* Outline */\n\n @mixin outline($color, $variant) {\n &:where(.#{$color}.#{$variant}) {\n &.outline {\n border-color: var(\n --button--#{$color}-#{$variant}-border-color--default\n );\n\n &[disabled],\n &[data-disabled],\n &.ariaDisabled,\n &.isPending,\n &.isFailed {\n border-color: var(\n --button--#{$color}-#{$variant}-border-color--disabled\n );\n }\n }\n }\n }\n\n @include outline(primary, outline);\n @include outline(success, outline);\n @include outline(danger, outline);\n @include outline(secondary, outline);\n @include outline(dark, outline);\n @include outline(light, outline);\n @include outline(dark-static, outline);\n @include outline(light-static, outline);\n @include avatarButton.avatarButton();\n\n &:has(.image) {\n padding: 0;\n background: none;\n height: fit-content;\n\n &:hover:where(:not([data-readonly])) .image {\n background: var(--button--dark-plain-background-color--hover);\n filter: brightness(var(--image-button--brightness--hover));\n }\n\n &[data-pressed]:where(:not([data-readonly])) .image {\n background: var(--button--dark-plain-background-color--pressed);\n filter: brightness(var(--image-button--brightness--pressed));\n }\n\n .image {\n width: 100%;\n }\n }\n}\n"],"mappings":""}
|
|
@@ -3,8 +3,8 @@
|
|
|
3
3
|
import { PropsContextProvider } from "../../lib/propsContext/components/PropsContextProvider.mjs";
|
|
4
4
|
import { flowComponent } from "../../lib/componentFactory/flowComponent.mjs";
|
|
5
5
|
import { Wrap } from "../Wrap/Wrap.mjs";
|
|
6
|
-
import { Text } from "../Text/Text.mjs";
|
|
7
6
|
import { UiComponentTunnelExit } from "../UiComponentTunnel/UiComponentTunnelExit.mjs";
|
|
7
|
+
import { Text } from "../Text/Text.mjs";
|
|
8
8
|
import { Avatar } from "./components/Avatar/Avatar.mjs";
|
|
9
9
|
import FileCard_module_default from "./FileCard.module.mjs";
|
|
10
10
|
import { FileSizeText } from "./components/FileSizeText/FileSizeText.mjs";
|
|
@@ -4,7 +4,6 @@ import { PropsContextProvider } from "../../lib/propsContext/components/PropsCon
|
|
|
4
4
|
import { flowComponent } from "../../lib/componentFactory/flowComponent.mjs";
|
|
5
5
|
import dynamic from "../../lib/propsContext/dynamicProps/dynamic.mjs";
|
|
6
6
|
import { isAlphaColor } from "../../lib/types/props.mjs";
|
|
7
|
-
import { Text } from "../Text/Text.mjs";
|
|
8
7
|
import { UiComponentTunnelExit } from "../UiComponentTunnel/UiComponentTunnelExit.mjs";
|
|
9
8
|
import Link_module_default from "./Link.module.mjs";
|
|
10
9
|
import { linkContext } from "./context.mjs";
|
|
@@ -51,7 +50,7 @@ var Link = flowComponent("Link", (props) => {
|
|
|
51
50
|
size: props.size,
|
|
52
51
|
color: props.color === "default" ? void 0 : props.color,
|
|
53
52
|
isDisabled: props.isDisabled,
|
|
54
|
-
children: dynamic((buttonProps) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
|
|
53
|
+
children: dynamic((buttonProps) => /* @__PURE__ */ jsxs(Fragment$1, { children: [buttonProps.children, /* @__PURE__ */ jsx(LinkIcon, {
|
|
55
54
|
download,
|
|
56
55
|
target,
|
|
57
56
|
unstyled
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Link.mjs","names":[],"sources":["../../../../../../../src/components/Link/Link.tsx"],"sourcesContent":["import type {\n ComponentProps,\n ComponentType,\n CSSProperties,\n MouseEvent,\n PropsWithChildren,\n} from \"react\";\nimport { useContext } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport { dynamic, type PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport styles from \"./Link.module.scss\";\nimport clsx from \"clsx\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport {\n type AlphaColor,\n isAlphaColor,\n type PropsWithClassName,\n} from \"@/lib/types/props\";\nimport { linkContext } from \"@/components/Link/context\";\nimport {
|
|
1
|
+
{"version":3,"file":"Link.mjs","names":[],"sources":["../../../../../../../src/components/Link/Link.tsx"],"sourcesContent":["import type {\n ComponentProps,\n ComponentType,\n CSSProperties,\n MouseEvent,\n PropsWithChildren,\n} from \"react\";\nimport { useContext } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport { dynamic, type PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport styles from \"./Link.module.scss\";\nimport clsx from \"clsx\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport {\n type AlphaColor,\n isAlphaColor,\n type PropsWithClassName,\n} from \"@/lib/types/props\";\nimport { linkContext } from \"@/components/Link/context\";\nimport { LinkIcon } from \"@/components/Link/components/LinkIcon\";\nimport { handleLinkClick, useRouter } from \"@react-aria/utils\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport interface LinkProps\n extends\n PropsWithChildren<Omit<Aria.LinkProps, \"children\" | \"slot\" | \"className\">>,\n FlowComponentProps<HTMLAnchorElement>,\n PropsWithClassName {\n /** Whether the link should be styled for being displayed inside a text. */\n inline?: boolean;\n /** An alternative link component. */\n linkComponent?: ComponentType<Omit<ComponentProps<\"a\">, \"ref\">>;\n /** The color of the link. @default \"default\" */\n color?: \"default\" | AlphaColor;\n /** Marks the link as the currently active one, e.g. in a navigation. */\n \"aria-current\"?: string;\n /** The name of the slot the link is placed in. */\n slot?: string;\n /** The whiteSpace css value of the element. */\n whiteSpace?: CSSProperties[\"whiteSpace\"];\n /** The size of the element. @default \"m\" */\n size?: \"s\" | \"m\";\n /** @internal */\n unstyled?: boolean;\n}\n\n/** @flr-generate all */\nexport const Link = flowComponent(\"Link\", (props) => {\n const {\n children,\n className,\n inline,\n linkComponent: linkComponentFromProps,\n color = \"default\",\n unstyled = false,\n \"aria-current\": ariaCurrent,\n ref,\n slot: ignoredSlotProp,\n style,\n whiteSpace,\n size = \"m\",\n onClickCapture: onClickCaptureFromProps,\n target,\n download,\n ...rest\n } = props;\n\n const { linkComponent: linkComponentFromContext } = useContext(linkContext);\n const Link = linkComponentFromProps\n ? (linkComponentFromProps as typeof Aria.Link)\n : props.href && linkComponentFromContext\n ? (linkComponentFromContext as typeof Aria.Link)\n : Aria.Link;\n\n const router = useRouter();\n\n /**\n * An interactive child (e.g. a Button) stops click propagation via React\n * Aria's `usePress`, so the anchor's own `onClick` never runs and navigation\n * falls back to a full page load. Handling it in the capture phase (top-down,\n * before the child) keeps navigation client-side. Only needed for React\n * Aria's `<a>`; custom link components handle navigation themselves.\n */\n const handleClickCapture =\n Link === Aria.Link && props.href\n ? (event: MouseEvent<HTMLAnchorElement>) => {\n onClickCaptureFromProps?.(event);\n if (event.target !== event.currentTarget) {\n handleLinkClick(event, router, props.href, props.routerOptions);\n }\n }\n : onClickCaptureFromProps;\n\n const rootClassName = unstyled\n ? className\n : clsx(\n styles.link,\n inline && styles.inline,\n isAlphaColor(color) && styles[color],\n size === \"s\" && styles[\"size-s\"],\n className,\n );\n\n const propsContext: PropsContext = {\n Icon: {\n tunnel: {\n component: \"Link\",\n id: \"icon\",\n },\n className: styles.icon,\n size: \"s\",\n },\n AlertText: {\n className: styles.alertText,\n },\n AccentBox: { className: styles.accentBox },\n LayoutCard: { className: styles.layoutCard },\n Button: {\n elementType: \"span\",\n className: styles.button,\n size: props.size,\n color: props.color === \"default\" ? undefined : props.color,\n isDisabled: props.isDisabled,\n children: dynamic((buttonProps) => (\n <>\n {buttonProps.children}\n <LinkIcon download={download} target={target} unstyled={unstyled} />\n </>\n )),\n },\n };\n\n const unsupportedTypingsLinkProps = ariaCurrent\n ? ({\n \"aria-current\": true,\n } as Record<string, unknown>)\n : {};\n\n return (\n <Link\n {...unsupportedTypingsLinkProps}\n {...rest}\n target={target}\n download={download}\n onClickCapture={handleClickCapture}\n className={rootClassName}\n ref={ref}\n style={{ ...style, whiteSpace }}\n >\n <PropsContextProvider props={propsContext}>\n {children}\n <LinkIcon\n withZeroWidthJoiner\n unstyled={unstyled}\n target={target}\n download={download}\n >\n <UiComponentTunnelExit id={\"icon\"} component={\"Link\"} />\n </LinkIcon>\n </PropsContextProvider>\n </Link>\n );\n});\n\nexport default Link;\n"],"mappings":";;;;;;;;;;;;;;;;;AAiDA,IAAa,OAAO,cAAc,SAAS,UAAU;CACnD,MAAM,EACJ,UACA,WACA,QACA,eAAe,wBACf,QAAQ,WACR,WAAW,OACX,gBAAgB,aAChB,KACA,MAAM,iBACN,OACA,YACA,OAAO,KACP,gBAAgB,yBAChB,QACA,UACA,GAAG,SACD;CAEJ,MAAM,EAAE,eAAe,6BAA6B,WAAW,WAAW;CAC1E,MAAM,OAAO,yBACR,yBACD,MAAM,QAAQ,2BACX,2BACD,KAAK;CAEX,MAAM,SAAS,UAAU;;;;;;;;CASzB,MAAM,qBACJ,SAAS,KAAK,QAAQ,MAAM,QACvB,UAAyC;EACxC,0BAA0B,KAAK;EAC/B,IAAI,MAAM,WAAW,MAAM,eACzB,gBAAgB,OAAO,QAAQ,MAAM,MAAM,MAAM,aAAa;CAElE,IACA;CAEN,MAAM,gBAAgB,WAClB,YACA,KACE,oBAAO,MACP,UAAU,oBAAO,QACjB,aAAa,KAAK,KAAK,oBAAO,QAC9B,SAAS,OAAO,oBAAO,WACvB,SACF;CAEJ,MAAM,eAA6B;EACjC,MAAM;GACJ,QAAQ;IACN,WAAW;IACX,IAAI;GACN;GACA,WAAW,oBAAO;GAClB,MAAM;EACR;EACA,WAAW,EACT,WAAW,oBAAO,UACpB;EACA,WAAW,EAAE,WAAW,oBAAO,UAAU;EACzC,YAAY,EAAE,WAAW,oBAAO,WAAW;EAC3C,QAAQ;GACN,aAAa;GACb,WAAW,oBAAO;GAClB,MAAM,MAAM;GACZ,OAAO,MAAM,UAAU,YAAY,KAAA,IAAY,MAAM;GACrD,YAAY,MAAM;GAClB,UAAU,SAAS,gBACjB,qBAAA,YAAA,EAAA,UAAA,CACG,YAAY,UACb,oBAAC,UAAD;IAAoB;IAAkB;IAAkB;GAAW,CAAA,CACnE,EAAA,CAAA,CACH;EACH;CACF;CAQA,OACE,oBAAC,MAAD;EACE,GARgC,cAC/B,EACC,gBAAgB,KAClB,IACA,CAAC;EAKD,GAAI;EACI;EACE;EACV,gBAAgB;EAChB,WAAW;EACN;EACL,OAAO;GAAE,GAAG;GAAO;EAAW;EAE9B,UAAA,qBAAC,sBAAD;GAAsB,OAAO;GAA7B,UAAA,CACG,UACD,oBAAC,UAAD;IACE,qBAAA;IACU;IACF;IACE;IAEV,UAAA,oBAAC,uBAAD;KAAuB,IAAI;KAAQ,WAAW;IAAS,CAAA;GAC/C,CAAA,CACU;;CAClB,CAAA;AAEV,CAAC"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
/* */
|
|
3
3
|
import { IconSearch } from "../../../Icon/components/icons/IconSearch.mjs";
|
|
4
|
-
import { Text } from "../../../Text/Text.mjs";
|
|
5
4
|
import { useLocalizedStringFormatter } from "../../../TranslationProvider/useLocalizedStringFormatter.mjs";
|
|
5
|
+
import { Text } from "../../../Text/Text.mjs";
|
|
6
6
|
import { Heading } from "../../../Heading/Heading.mjs";
|
|
7
7
|
import __locale_default from "../../../../../../../_virtual/_16.locale.mjs";
|
|
8
8
|
import { IllustratedMessage } from "../../../IllustratedMessage/IllustratedMessage.mjs";
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
/* */
|
|
3
|
-
import { Text } from "../../../Text/Text.mjs";
|
|
4
3
|
import { useLocalizedStringFormatter } from "../../../TranslationProvider/useLocalizedStringFormatter.mjs";
|
|
5
4
|
import { AlertIcon } from "../../../AlertIcon/AlertIcon.mjs";
|
|
5
|
+
import { Text } from "../../../Text/Text.mjs";
|
|
6
6
|
import __locale_default from "../../../../../../../_virtual/_28.locale.mjs";
|
|
7
7
|
import generateValidationTranslation from "../../lib/generateValidationTranslation.mjs";
|
|
8
8
|
import ValidationResultEntry_module_default from "./ValidationResultEntry.module.mjs";
|
|
@@ -4,10 +4,10 @@ import { PropsContextProvider } from "../../lib/propsContext/components/PropsCon
|
|
|
4
4
|
import { flowComponent } from "../../lib/componentFactory/flowComponent.mjs";
|
|
5
5
|
import dynamic from "../../lib/propsContext/dynamicProps/dynamic.mjs";
|
|
6
6
|
import { IconChevronDown } from "../Icon/components/icons/IconChevronDown.mjs";
|
|
7
|
-
import { Text } from "../Text/Text.mjs";
|
|
8
7
|
import { useLocalizedStringFormatter } from "../TranslationProvider/useLocalizedStringFormatter.mjs";
|
|
9
8
|
import { Button } from "../Button/Button.mjs";
|
|
10
9
|
import { UiComponentTunnelExit } from "../UiComponentTunnel/UiComponentTunnelExit.mjs";
|
|
10
|
+
import { Text } from "../Text/Text.mjs";
|
|
11
11
|
import ContextMenuTriggerView from "../../views/ContextMenuTriggerView.mjs";
|
|
12
12
|
import ContextMenuView from "../../views/ContextMenuView.mjs";
|
|
13
13
|
import TabNavigation_module_default from "./TabNavigation.module.mjs";
|
package/dist/js/packages/components/src/components/Tabs/components/FallbackTab/FallbackTab.mjs
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
/* */
|
|
3
|
-
import { Text } from "../../../Text/Text.mjs";
|
|
4
3
|
import { useLocalizedStringFormatter } from "../../../TranslationProvider/useLocalizedStringFormatter.mjs";
|
|
5
4
|
import { AlertIcon } from "../../../AlertIcon/AlertIcon.mjs";
|
|
5
|
+
import { Text } from "../../../Text/Text.mjs";
|
|
6
6
|
import { Heading } from "../../../Heading/Heading.mjs";
|
|
7
7
|
import { IllustratedMessage } from "../../../IllustratedMessage/IllustratedMessage.mjs";
|
|
8
8
|
import Tabs_module_default from "../../Tabs.module.mjs";
|
|
@@ -1,11 +1,18 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
/* */
|
|
3
|
-
import { Children, isValidElement } from "react";
|
|
3
|
+
import { Children, Fragment, isValidElement } from "react";
|
|
4
4
|
import { isObjectType, isString } from "remeda";
|
|
5
5
|
//#region src/lib/react/remote.ts
|
|
6
6
|
function isRemoteComponentRendererProps(props) {
|
|
7
7
|
return isObjectType(props) && "element" in props && "components" in props && "receiver" in props;
|
|
8
8
|
}
|
|
9
|
+
/** Whether the node renders text — a string, number, or remote counterpart. */
|
|
10
|
+
var isTextNode = (child) => typeof child === "string" || typeof child === "number" || isValidElement(child) && isRemoteTextRenderProps(child.props);
|
|
11
|
+
/**
|
|
12
|
+
* `Children.toArray` treats a fragment as a single child, so recurse into one
|
|
13
|
+
* to reach the text a component like `Link` passes down through it.
|
|
14
|
+
*/
|
|
15
|
+
var containsTextChild = (children) => Children.toArray(children).some((child) => isTextNode(child) || isValidElement(child) && child.type === Fragment && containsTextChild(child.props.children));
|
|
9
16
|
var extractTextFromFirstChild = (children) => {
|
|
10
17
|
if (Children.count(children) !== 1) return;
|
|
11
18
|
const firstChild = Children.toArray(children)[0];
|
|
@@ -15,6 +22,6 @@ function isRemoteTextRenderProps(props) {
|
|
|
15
22
|
return isObjectType(props) && "remote" in props && isObjectType(props.remote) && "data" in props.remote && isString(props.remote.data);
|
|
16
23
|
}
|
|
17
24
|
//#endregion
|
|
18
|
-
export { extractTextFromFirstChild, isRemoteComponentRendererProps, isRemoteTextRenderProps };
|
|
25
|
+
export { containsTextChild, extractTextFromFirstChild, isRemoteComponentRendererProps, isRemoteTextRenderProps };
|
|
19
26
|
|
|
20
27
|
//# sourceMappingURL=remote.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"remote.mjs","names":[],"sources":["../../../../../../../src/lib/react/remote.ts"],"sourcesContent":["import type {\n RemoteComponentRendererProps,\n RemoteTextRendererProps,\n} from \"@mittwald/remote-dom-react/host\";\nimport { isObjectType, isString } from \"remeda\";\nimport {
|
|
1
|
+
{"version":3,"file":"remote.mjs","names":[],"sources":["../../../../../../../src/lib/react/remote.ts"],"sourcesContent":["import type {\n RemoteComponentRendererProps,\n RemoteTextRendererProps,\n} from \"@mittwald/remote-dom-react/host\";\nimport { isObjectType, isString } from \"remeda\";\nimport {\n Children,\n Fragment,\n isValidElement,\n type PropsWithChildren,\n type ReactNode,\n} from \"react\";\n\nexport function isRemoteComponentRendererProps(\n props: unknown,\n): props is RemoteComponentRendererProps {\n return (\n isObjectType(props) &&\n \"element\" in props &&\n \"components\" in props &&\n \"receiver\" in props\n );\n}\n\n/** Whether the node renders text — a string, number, or remote counterpart. */\nconst isTextNode = (child: ReactNode): boolean =>\n typeof child === \"string\" ||\n typeof child === \"number\" ||\n (isValidElement(child) && isRemoteTextRenderProps(child.props));\n\n/**\n * `Children.toArray` treats a fragment as a single child, so recurse into one\n * to reach the text a component like `Link` passes down through it.\n */\nexport const containsTextChild = (children: ReactNode): boolean =>\n Children.toArray(children).some(\n (child) =>\n isTextNode(child) ||\n (isValidElement<PropsWithChildren>(child) &&\n child.type === Fragment &&\n containsTextChild(child.props.children)),\n );\n\nexport const extractTextFromFirstChild = (children: ReactNode) => {\n if (Children.count(children) !== 1) {\n return undefined;\n }\n\n const firstChild = Children.toArray(children)[0];\n\n return typeof firstChild === \"string\"\n ? firstChild\n : isValidElement(firstChild) && isRemoteTextRenderProps(firstChild.props)\n ? firstChild.props.remote.data\n : undefined;\n};\n\nexport function isRemoteTextRenderProps(\n props: unknown,\n): props is RemoteTextRendererProps {\n return (\n isObjectType(props) &&\n \"remote\" in props &&\n isObjectType(props.remote) &&\n \"data\" in props.remote &&\n isString(props.remote.data)\n );\n}\n"],"mappings":";;;;;AAaA,SAAgB,+BACd,OACuC;CACvC,OACE,aAAa,KAAK,KAClB,aAAa,SACb,gBAAgB,SAChB,cAAc;AAElB;;AAGA,IAAM,cAAc,UAClB,OAAO,UAAU,YACjB,OAAO,UAAU,YAChB,eAAe,KAAK,KAAK,wBAAwB,MAAM,KAAK;;;;;AAM/D,IAAa,qBAAqB,aAChC,SAAS,QAAQ,QAAQ,CAAC,CAAC,MACxB,UACC,WAAW,KAAK,KACf,eAAkC,KAAK,KACtC,MAAM,SAAS,YACf,kBAAkB,MAAM,MAAM,QAAQ,CAC5C;AAEF,IAAa,6BAA6B,aAAwB;CAChE,IAAI,SAAS,MAAM,QAAQ,MAAM,GAC/B;CAGF,MAAM,aAAa,SAAS,QAAQ,QAAQ,CAAC,CAAC;CAE9C,OAAO,OAAO,eAAe,WACzB,aACA,eAAe,UAAU,KAAK,wBAAwB,WAAW,KAAK,IACpE,WAAW,MAAM,OAAO,OACxB,KAAA;AACR;AAEA,SAAgB,wBACd,OACkC;CAClC,OACE,aAAa,KAAK,KAClB,YAAY,SACZ,aAAa,MAAM,MAAM,KACzB,UAAU,MAAM,UAChB,SAAS,MAAM,OAAO,IAAI;AAE9B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE/C,OAAO,KAAK,IAAI,MAAM,uBAAuB,CAAC;
|
|
1
|
+
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE/C,OAAO,KAAK,IAAI,MAAM,uBAAuB,CAAC;AAM9C,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sCAAsC,CAAC;AAK/E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAIpD,MAAM,WAAW,WACf,SACE,iBAAiB,CAAC,IAAI,CAAC,WAAW,CAAC,EACnC,kBAAkB,CAAC,iBAAiB,CAAC;IACvC,kDAAkD;IAClD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;;OAKG;IACH,KAAK,CAAC,EACJ,SAAS,GAAG,SAAS,GAAG,WAAW,GAAG,QAAQ,GAAG,UAAU,GAAG,QAAQ,CAAC;IACzE,yDAAyD;IACzD,OAAO,CAAC,EAAE,OAAO,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,CAAC;IACjD,2CAA2C;IAC3C,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;IACjB,8CAA8C;IAC9C,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,gDAAgD;IAChD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,kDAAkD;IAClD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kDAAkD;IAClD,UAAU,CAAC,EAAE,OAAO,CAAC;CAOtB;AA+CD,wBAAwB;AACxB,eAAO,MAAM,MAAM,mGAqIjB,CAAC;AAEH,eAAe,MAAM,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../../src/components/Link/Link.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,cAAc,EACd,aAAa,EACb,aAAa,EAEb,iBAAiB,EAClB,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,IAAI,MAAM,uBAAuB,CAAC;AAK9C,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sCAAsC,CAAC;AAE/E,OAAO,EACL,KAAK,UAAU,EAEf,KAAK,kBAAkB,EACxB,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../../src/components/Link/Link.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,cAAc,EACd,aAAa,EACb,aAAa,EAEb,iBAAiB,EAClB,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,IAAI,MAAM,uBAAuB,CAAC;AAK9C,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sCAAsC,CAAC;AAE/E,OAAO,EACL,KAAK,UAAU,EAEf,KAAK,kBAAkB,EACxB,MAAM,mBAAmB,CAAC;AAM3B,MAAM,WAAW,SACf,SACE,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,UAAU,GAAG,MAAM,GAAG,WAAW,CAAC,CAAC,EAC1E,kBAAkB,CAAC,iBAAiB,CAAC,EACrC,kBAAkB;IACpB,2EAA2E;IAC3E,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,qCAAqC;IACrC,aAAa,CAAC,EAAE,aAAa,CAAC,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC;IAChE,gDAAgD;IAChD,KAAK,CAAC,EAAE,SAAS,GAAG,UAAU,CAAC;IAC/B,wEAAwE;IACxE,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,kDAAkD;IAClD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,+CAA+C;IAC/C,UAAU,CAAC,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;IACzC,4CAA4C;IAC5C,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;CAGlB;AAED,wBAAwB;AACxB,eAAO,MAAM,IAAI,iGAmHf,CAAC;AAEH,eAAe,IAAI,CAAC"}
|
|
@@ -1,6 +1,11 @@
|
|
|
1
1
|
import { RemoteComponentRendererProps, RemoteTextRendererProps } from '@mittwald/remote-dom-react/host';
|
|
2
2
|
import { ReactNode } from 'react';
|
|
3
3
|
export declare function isRemoteComponentRendererProps(props: unknown): props is RemoteComponentRendererProps;
|
|
4
|
+
/**
|
|
5
|
+
* `Children.toArray` treats a fragment as a single child, so recurse into one
|
|
6
|
+
* to reach the text a component like `Link` passes down through it.
|
|
7
|
+
*/
|
|
8
|
+
export declare const containsTextChild: (children: ReactNode) => boolean;
|
|
4
9
|
export declare const extractTextFromFirstChild: (children: ReactNode) => string | undefined;
|
|
5
10
|
export declare function isRemoteTextRenderProps(props: unknown): props is RemoteTextRendererProps;
|
|
6
11
|
//# sourceMappingURL=remote.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"remote.d.ts","sourceRoot":"","sources":["../../../../src/lib/react/remote.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,4BAA4B,EAC5B,uBAAuB,EACxB,MAAM,iCAAiC,CAAC;AAEzC,OAAO,
|
|
1
|
+
{"version":3,"file":"remote.d.ts","sourceRoot":"","sources":["../../../../src/lib/react/remote.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,4BAA4B,EAC5B,uBAAuB,EACxB,MAAM,iCAAiC,CAAC;AAEzC,OAAO,EAKL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,wBAAgB,8BAA8B,CAC5C,KAAK,EAAE,OAAO,GACb,KAAK,IAAI,4BAA4B,CAOvC;AAQD;;;GAGG;AACH,eAAO,MAAM,iBAAiB,GAAI,UAAU,SAAS,KAAG,OAOrD,CAAC;AAEJ,eAAO,MAAM,yBAAyB,GAAI,UAAU,SAAS,uBAY5D,CAAC;AAEF,wBAAgB,uBAAuB,CACrC,KAAK,EAAE,OAAO,GACb,KAAK,IAAI,uBAAuB,CAQlC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mittwald/flow-react-components",
|
|
3
|
-
"version": "1.2.0-next.
|
|
3
|
+
"version": "1.2.0-next.21",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "A React implementation of Flow, mittwald’s design system",
|
|
6
6
|
"homepage": "https://flow.mittwald.de",
|
|
@@ -78,9 +78,9 @@
|
|
|
78
78
|
"@internationalized/string-compiler": "^3.4.1",
|
|
79
79
|
"@lezer/common": "^1.5.2",
|
|
80
80
|
"@lezer/highlight": "^1.2.3",
|
|
81
|
-
"@mittwald/flow-icons": "1.2.0-next.
|
|
81
|
+
"@mittwald/flow-icons": "1.2.0-next.21",
|
|
82
82
|
"@mittwald/password-tools-js": "3.0.0-alpha.31",
|
|
83
|
-
"@mittwald/react-tunnel": "1.2.0-next.
|
|
83
|
+
"@mittwald/react-tunnel": "1.2.0-next.21",
|
|
84
84
|
"@mittwald/react-use-promise": "^4.2.2",
|
|
85
85
|
"@react-aria/form": "^3.2.1",
|
|
86
86
|
"@react-aria/i18n": "^3.13.1",
|
|
@@ -134,12 +134,12 @@
|
|
|
134
134
|
"@internationalized/date": "^3.12.3",
|
|
135
135
|
"@lezer/generator": "^1.8.0",
|
|
136
136
|
"@lezer/lr": "^1.4.10",
|
|
137
|
-
"@mittwald/flow-core": "1.2.0-next.
|
|
138
|
-
"@mittwald/flow-design-tokens": "1.2.0-next.
|
|
139
|
-
"@mittwald/flow-icons-base": "1.2.0-next.
|
|
137
|
+
"@mittwald/flow-core": "1.2.0-next.21",
|
|
138
|
+
"@mittwald/flow-design-tokens": "1.2.0-next.21",
|
|
139
|
+
"@mittwald/flow-icons-base": "1.2.0-next.21",
|
|
140
140
|
"@mittwald/react-use-promise": "^4.2.2",
|
|
141
141
|
"@mittwald/remote-dom-react": "1.2.2-mittwald.10",
|
|
142
|
-
"@mittwald/typescript-config": "1.2.0-next.
|
|
142
|
+
"@mittwald/typescript-config": "1.2.0-next.21",
|
|
143
143
|
"@nx/storybook": "^22.7.6",
|
|
144
144
|
"@storybook/addon-a11y": "^10.5.10",
|
|
145
145
|
"@storybook/addon-actions": "^9.0.8",
|
|
@@ -190,7 +190,7 @@
|
|
|
190
190
|
},
|
|
191
191
|
"peerDependencies": {
|
|
192
192
|
"@internationalized/date": "^3.12.2",
|
|
193
|
-
"@mittwald/flow-icons-pro": "1.2.0-next.
|
|
193
|
+
"@mittwald/flow-icons-pro": "1.2.0-next.21",
|
|
194
194
|
"@mittwald/react-use-promise": "^4.2.2",
|
|
195
195
|
"next": "^16.2.3",
|
|
196
196
|
"react": "^19.2.0",
|
|
@@ -211,5 +211,5 @@
|
|
|
211
211
|
"optional": true
|
|
212
212
|
}
|
|
213
213
|
},
|
|
214
|
-
"gitHead": "
|
|
214
|
+
"gitHead": "adcd65f10768b86b23d77c26e2ac66a708167bd0"
|
|
215
215
|
}
|