@mittwald/flow-react-components 1.5.41 → 1.5.42
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Link.mjs","names":["styles","_Fragment","_jsx"],"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\";\nimport { SkeletonTextContent } from \"@/components/SkeletonMode/components/SkeletonTextContent\";\nimport { useSkeletonMode } from \"@/components/SkeletonMode/skeletonModeContext\";\nimport { hasContent } from \"@/components/SkeletonMode/lib/hasContent\";\nimport { containsTextChild } from \"@/lib/react/remote\";\n\nexport interface LinkProps\n extends\n PropsWithChildren
|
|
1
|
+
{"version":3,"file":"Link.mjs","names":["styles","_Fragment","_jsx"],"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\";\nimport { SkeletonTextContent } from \"@/components/SkeletonMode/components/SkeletonTextContent\";\nimport { useSkeletonMode } from \"@/components/SkeletonMode/skeletonModeContext\";\nimport { hasContent } from \"@/components/SkeletonMode/lib/hasContent\";\nimport { containsTextChild } from \"@/lib/react/remote\";\n\nexport interface LinkProps\n extends\n PropsWithChildren<\n Omit<Aria.LinkProps, \"children\" | \"slot\" | \"className\" | \"aria-current\">\n >,\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 /**\n * The name of the slot the link is placed in. In action groups: `primary` (at\n * the end), `secondary` (before the primary action) or `abort` (at the\n * start).\n */\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 isSkeleton = useSkeletonMode();\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 /* Without text of its own — a Link styled as a Button, a Link around a\n LayoutCard — the content follows its own skeleton rules instead of\n becoming a text bar. */\n const hasOnlyElements = hasContent(children) && !containsTextChild(children);\n\n const textBars = (\n <SkeletonTextContent defaultWidth=\"6em\">{children}</SkeletonTextContent>\n );\n\n const content = (\n <PropsContextProvider props={propsContext}>\n {hasOnlyElements ? children : textBars}\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 );\n\n /* react-aria's Link drops `inert`, and a skeleton needs no anchor. */\n if (isSkeleton) {\n return (\n <span className={rootClassName} style={{ ...style, whiteSpace }} inert>\n {content}\n </span>\n );\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 {content}\n </Link>\n );\n});\n\nexport default Link;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AA2DA,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,aAAa,gBAAgB;CACnC,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,KACEA,oBAAO,MACP,UAAUA,oBAAO,QACjB,aAAa,KAAK,KAAKA,oBAAO,QAC9B,SAAS,OAAOA,oBAAO,WACvB,SACF;CAEJ,MAAM,eAA6B;EACjC,MAAM;GACJ,QAAQ;IACN,WAAW;IACX,IAAI;GACN;GACA,WAAWA,oBAAO;GAClB,MAAM;EACR;EACA,WAAW,EACT,WAAWA,oBAAO,UACpB;EACA,WAAW,EAAE,WAAWA,oBAAO,UAAU;EACzC,YAAY,EAAE,WAAWA,oBAAO,WAAW;EAC3C,QAAQ;GACN,aAAa;GACb,WAAWA,oBAAO;GAClB,MAAM,MAAM;GACZ,OAAO,MAAM,UAAU,YAAY,KAAA,IAAY,MAAM;GACrD,YAAY,MAAM;GAClB,UAAU,SAAS,gBACjB,qBAAAC,YAAA,EAAA,UAAA,CACG,YAAY,UACb,oBAAC,UAAD;IAAoB;IAAkB;IAAkB;GAAW,CAAA,CACnE,EAAA,CAAA,CACH;EACH;CACF;CAEA,MAAM,8BAA8B,cAC/B,EACC,gBAAgB,KAClB,IACA,CAAC;CAKL,MAAM,kBAAkB,WAAW,QAAQ,KAAK,CAAC,kBAAkB,QAAQ;CAM3E,MAAM,UACJ,qBAAC,sBAAD;EAAsB,OAAO;EAA7B,UAAA,CACG,kBAAkB,WALrBC,oBAAC,qBAAD;GAAqB,cAAa;GAAO;EAA8B,CAKvC,GAC9B,oBAAC,UAAD;GACE,qBAAA;GACU;GACF;GACE;GAEV,UAAA,oBAAC,uBAAD;IAAuB,IAAI;IAAQ,WAAW;GAAS,CAAA;EAC/C,CAAA,CACU;;CAIxB,IAAI,YACF,OACE,oBAAC,QAAD;EAAM,WAAW;EAAe,OAAO;GAAE,GAAG;GAAO;EAAW;EAAG,OAAA;EAC9D,UAAA;CACG,CAAA;CAIV,OACE,oBAAC,MAAD;EACE,GAAI;EACJ,GAAI;EACI;EACE;EACV,gBAAgB;EAChB,WAAW;EACN;EACL,OAAO;GAAE,GAAG;GAAO;EAAW;EAE7B,UAAA;CACG,CAAA;AAEV,CAAC"}
|
|
@@ -2,7 +2,7 @@ import { ComponentProps, ComponentType, CSSProperties, PropsWithChildren } from
|
|
|
2
2
|
import { FlowComponentProps } from '../../lib/componentFactory/flowComponent';
|
|
3
3
|
import { AlphaColor, PropsWithClassName } from '../../lib/types/props';
|
|
4
4
|
import * as Aria from "react-aria-components";
|
|
5
|
-
export interface LinkProps extends PropsWithChildren<Omit<Aria.LinkProps, "children" | "slot" | "className">>, FlowComponentProps<HTMLAnchorElement>, PropsWithClassName {
|
|
5
|
+
export interface LinkProps extends PropsWithChildren<Omit<Aria.LinkProps, "children" | "slot" | "className" | "aria-current">>, FlowComponentProps<HTMLAnchorElement>, PropsWithClassName {
|
|
6
6
|
/** Whether the link should be styled for being displayed inside a text. */
|
|
7
7
|
inline?: boolean;
|
|
8
8
|
/** An alternative link component. */
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mittwald/flow-react-components",
|
|
3
|
-
"version": "1.5.
|
|
3
|
+
"version": "1.5.42",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "A React implementation of Flow, mittwald’s design system",
|
|
6
6
|
"homepage": "https://flow.mittwald.de",
|
|
@@ -84,9 +84,9 @@
|
|
|
84
84
|
"@internationalized/string-compiler": "^3.4.1",
|
|
85
85
|
"@lezer/common": "^1.5.2",
|
|
86
86
|
"@lezer/highlight": "^1.2.3",
|
|
87
|
-
"@mittwald/flow-icons": "^1.5.
|
|
87
|
+
"@mittwald/flow-icons": "^1.5.42",
|
|
88
88
|
"@mittwald/password-tools-js": "^3.0.0",
|
|
89
|
-
"@mittwald/react-tunnel": "^1.5.
|
|
89
|
+
"@mittwald/react-tunnel": "^1.5.42",
|
|
90
90
|
"@mittwald/react-use-promise": "^4.2.2",
|
|
91
91
|
"@react-aria/form": "^3.2.1",
|
|
92
92
|
"@react-aria/i18n": "^3.13.1",
|
|
@@ -139,13 +139,13 @@
|
|
|
139
139
|
"@internationalized/date": "^3.12.3",
|
|
140
140
|
"@lezer/generator": "^1.8.0",
|
|
141
141
|
"@lezer/lr": "^1.4.10",
|
|
142
|
-
"@mittwald/flow-components-base": "1.5.
|
|
143
|
-
"@mittwald/flow-core": "1.5.
|
|
144
|
-
"@mittwald/flow-design-tokens": "1.5.
|
|
145
|
-
"@mittwald/flow-icons-base": "1.5.
|
|
142
|
+
"@mittwald/flow-components-base": "1.5.42",
|
|
143
|
+
"@mittwald/flow-core": "1.5.42",
|
|
144
|
+
"@mittwald/flow-design-tokens": "1.5.42",
|
|
145
|
+
"@mittwald/flow-icons-base": "1.5.42",
|
|
146
146
|
"@mittwald/react-use-promise": "^4.2.2",
|
|
147
147
|
"@mittwald/remote-dom-react": "1.2.2-mittwald.10",
|
|
148
|
-
"@mittwald/typescript-config": "1.5.
|
|
148
|
+
"@mittwald/typescript-config": "1.5.42",
|
|
149
149
|
"@nx/storybook": "^22.7.6",
|
|
150
150
|
"@storybook/addon-a11y": "^10.5.10",
|
|
151
151
|
"@storybook/addon-actions": "^9.0.8",
|
|
@@ -199,7 +199,7 @@
|
|
|
199
199
|
},
|
|
200
200
|
"peerDependencies": {
|
|
201
201
|
"@internationalized/date": "^3.12.2",
|
|
202
|
-
"@mittwald/flow-icons-pro": "1.5.
|
|
202
|
+
"@mittwald/flow-icons-pro": "1.5.42",
|
|
203
203
|
"@mittwald/react-use-promise": "^4.2.2",
|
|
204
204
|
"next": "^16.2.3",
|
|
205
205
|
"react": "^19.2.0",
|
|
@@ -223,5 +223,5 @@
|
|
|
223
223
|
"browserslist": [
|
|
224
224
|
"baseline widely available"
|
|
225
225
|
],
|
|
226
|
-
"gitHead": "
|
|
226
|
+
"gitHead": "2574cebacfcf0441b6a77edd66e3e56095c417fe"
|
|
227
227
|
}
|