@mittwald/flow-react-components 1.0.5 → 1.0.6
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/AGENTS.md +5 -1
- package/CHANGELOG.md +6 -0
- package/dist/assets/doc-properties.json +88399 -88399
- package/dist/js/packages/components/src/components/Button/Button.mjs.map +1 -1
- package/dist/types/components/Button/Button.d.ts +6 -1
- package/dist/types/components/Button/Button.d.ts.map +1 -1
- package/package.json +9 -9
|
@@ -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 { Text } from \"@/components/Text\";\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 { extractTextFromFirstChild } 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
|
|
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 { Text } from \"@/components/Text\";\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 { extractTextFromFirstChild } 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 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 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 isStringContent = extractTextFromFirstChild(children) !== undefined;\n\n const content = (\n <>\n <PropsContextProvider props={propsContext}>\n <Wrap if={!unstyled}>\n <span className={styles.content}>\n <Wrap if={isStringContent}>\n <Text className={styles.text}>{children}</Text>\n </Wrap>\n </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":"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"}
|
|
@@ -5,7 +5,12 @@ import * as Aria from "react-aria-components";
|
|
|
5
5
|
export interface ButtonProps extends PropsWithChildren<Aria.ButtonProps>, FlowComponentProps<HTMLButtonElement> {
|
|
6
6
|
/** Slot for button placement in action groups. */
|
|
7
7
|
slot?: string;
|
|
8
|
-
/**
|
|
8
|
+
/**
|
|
9
|
+
* The color of the button.
|
|
10
|
+
*
|
|
11
|
+
* @default "primary"
|
|
12
|
+
* @deprecatedValues accent
|
|
13
|
+
*/
|
|
9
14
|
color?: "primary" | "success" | "secondary" | "danger" | AlphaColor | "accent";
|
|
10
15
|
/** The visual variant of the button. @default "solid" */
|
|
11
16
|
variant?: "plain" | "solid" | "soft" | "outline";
|
|
@@ -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;AAO9C,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
|
|
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;AAO9C,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,mGAoIjB,CAAC;AAEH,eAAe,MAAM,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mittwald/flow-react-components",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.6",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "A React implementation of Flow, mittwald’s design system",
|
|
6
6
|
"homepage": "https://flow.mittwald.de",
|
|
@@ -74,9 +74,9 @@
|
|
|
74
74
|
"@internationalized/string-compiler": "^3.4.1",
|
|
75
75
|
"@lezer/common": "^1.5.2",
|
|
76
76
|
"@lezer/highlight": "^1.2.3",
|
|
77
|
-
"@mittwald/flow-icons": "1.0.
|
|
77
|
+
"@mittwald/flow-icons": "1.0.6",
|
|
78
78
|
"@mittwald/password-tools-js": "3.0.0-alpha.31",
|
|
79
|
-
"@mittwald/react-tunnel": "1.0.
|
|
79
|
+
"@mittwald/react-tunnel": "1.0.6",
|
|
80
80
|
"@mittwald/react-use-promise": "^4.2.2",
|
|
81
81
|
"@react-aria/form": "^3.2.1",
|
|
82
82
|
"@react-aria/i18n": "^3.13.1",
|
|
@@ -130,12 +130,12 @@
|
|
|
130
130
|
"@internationalized/date": "^3.12.3",
|
|
131
131
|
"@lezer/generator": "^1.8.0",
|
|
132
132
|
"@lezer/lr": "^1.4.10",
|
|
133
|
-
"@mittwald/flow-core": "1.0.
|
|
134
|
-
"@mittwald/flow-design-tokens": "1.0.
|
|
135
|
-
"@mittwald/flow-icons-base": "1.0.
|
|
133
|
+
"@mittwald/flow-core": "1.0.6",
|
|
134
|
+
"@mittwald/flow-design-tokens": "1.0.6",
|
|
135
|
+
"@mittwald/flow-icons-base": "1.0.6",
|
|
136
136
|
"@mittwald/react-use-promise": "^4.2.2",
|
|
137
137
|
"@mittwald/remote-dom-react": "1.2.2-mittwald.10",
|
|
138
|
-
"@mittwald/typescript-config": "1.0.
|
|
138
|
+
"@mittwald/typescript-config": "1.0.6",
|
|
139
139
|
"@nx/storybook": "^22.7.6",
|
|
140
140
|
"@storybook/addon-a11y": "^10.5.10",
|
|
141
141
|
"@storybook/addon-actions": "^9.0.8",
|
|
@@ -186,7 +186,7 @@
|
|
|
186
186
|
},
|
|
187
187
|
"peerDependencies": {
|
|
188
188
|
"@internationalized/date": "^3.12.2",
|
|
189
|
-
"@mittwald/flow-icons-pro": "1.0.
|
|
189
|
+
"@mittwald/flow-icons-pro": "1.0.6",
|
|
190
190
|
"@mittwald/react-use-promise": "^4.2.2",
|
|
191
191
|
"next": "^16.2.3",
|
|
192
192
|
"react": "^19.2.0",
|
|
@@ -207,5 +207,5 @@
|
|
|
207
207
|
"optional": true
|
|
208
208
|
}
|
|
209
209
|
},
|
|
210
|
-
"gitHead": "
|
|
210
|
+
"gitHead": "a9ba537685703d9dbb5c251d499e5c9fd1cb28f0"
|
|
211
211
|
}
|