@imfusion/web-ui 0.11.1-dev.55.gecb71e07 → 0.11.1-dev.57.g3cec18fa
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 +6 -0
- package/dist/components/rich-link/rich-link.d.ts +1 -1
- package/dist/index.js +1 -2
- package/dist/style.css +1 -1
- package/package.json +1 -1
- package/src/docgen/doc.gen.json +1 -1
- package/src/llms/skills/imf-web-ui-conventions/templates/AUDIT_CHECKLIST.md +15 -1
- package/src/llms/skills/imf-web-ui-conventions/topics/react/composition.md +54 -0
- package/src/llms/skills/imf-web-ui-conventions/topics/react/effects.md +59 -0
- package/src/llms/skills/imf-web-ui-conventions/topics/react/state.md +41 -0
- package/src/llms/skills/imf-web-ui-conventions/topics/react.md +7 -60
- package/src/llms/skills/imf-web-ui-conventions/topics/validation.md +2 -1
package/CHANGELOG.md
CHANGED
|
@@ -102,6 +102,11 @@
|
|
|
102
102
|
- Forms use TanStack Form: `imf-web-ui-ux` names it for every form, the `imf-web-ui-conventions` `validation` topic
|
|
103
103
|
validates user input in the form's validators with the Zod schema, and `imf-web-ui-audit` reports a form whose state and
|
|
104
104
|
validation are written by hand.
|
|
105
|
+
- The `imf-web-ui-conventions` `react` topic splits into `composition`, `state`, and `effects`, and each rule names the
|
|
106
|
+
React version it needs. New rules from react.dev: pure render, no component defined inside another, no `ref.current`
|
|
107
|
+
during render, `ref` as a prop, `useId` for accessibility ids, error boundaries around UI units, one `status` over
|
|
108
|
+
exclusive booleans, pure reducers, no object or function effect dependencies, and `useEffectEvent` for values an effect
|
|
109
|
+
should not react to. React's `<form action>`, `useActionState`, and `useOptimistic` are the fallbacks without TanStack.
|
|
105
110
|
- `web-ui-dev-new-component`, `web-ui-dev-update-component`, and `web-ui-dev-design-component` draft on the shared
|
|
106
111
|
Web UI Component Drafts canvas: a block per component on its Storybook group's page, one row per fidelity rung.
|
|
107
112
|
- `web-ui-dev-new-component` and `web-ui-dev-update-component` wait for the user to approve the design on the canvas
|
|
@@ -134,6 +139,7 @@
|
|
|
134
139
|
- Combobox and Autocomplete stories start at the same top-left corner, so clicking through them does not shift the
|
|
135
140
|
layout. A story resizes its frame with `parameters.frame`, which `withFrame` reads.
|
|
136
141
|
- The Autocomplete interaction test reads the popup's height after it reopens, so it passes on every run.
|
|
142
|
+
- `RichLink` sets every label in the strong weight, with or without a `description`. [RichLink](src/components/rich-link/rich-link.mdx) — Nikolaus Brunner <brunner@imfusion.com>
|
|
137
143
|
|
|
138
144
|
### Fixed
|
|
139
145
|
|
|
@@ -2,7 +2,7 @@ import { IconComponent } from '../icon';
|
|
|
2
2
|
type Props = React.ComponentProps<"a"> & {
|
|
3
3
|
/** Leading icon from `@imfusion/web-ui/icons`, shown on a tile in the primary color. */
|
|
4
4
|
glyph?: IconComponent;
|
|
5
|
-
/** Second line under the label.
|
|
5
|
+
/** Second line under the label. */
|
|
6
6
|
description?: React.ReactNode;
|
|
7
7
|
/** Link target scope. `"external"` (default) opens in a new tab with a diagonal `ArrowUpRight` icon; `"internal"` stays in the current tab with a horizontal `ArrowRight` icon. */
|
|
8
8
|
kind?: "external" | "internal";
|
package/dist/index.js
CHANGED
|
@@ -152,7 +152,6 @@ var Ct = {
|
|
|
152
152
|
description: "imf-ui-rich-link-module-description",
|
|
153
153
|
end: "imf-ui-rich-link-module-end",
|
|
154
154
|
label: "imf-ui-rich-link-module-label",
|
|
155
|
-
labelStrong: "imf-ui-rich-link-module-labelStrong",
|
|
156
155
|
root: "imf-ui-rich-link-module-root",
|
|
157
156
|
text: "imf-ui-rich-link-module-text",
|
|
158
157
|
tile: "imf-ui-rich-link-module-tile",
|
|
@@ -180,7 +179,7 @@ function Et({ glyph: e, description: t, kind: n = "external", endGlyph: r, child
|
|
|
180
179
|
/* @__PURE__ */ C("span", {
|
|
181
180
|
className: wt.text,
|
|
182
181
|
children: [/* @__PURE__ */ S("span", {
|
|
183
|
-
className:
|
|
182
|
+
className: wt.label,
|
|
184
183
|
children: i
|
|
185
184
|
}), t && /* @__PURE__ */ S("span", {
|
|
186
185
|
className: wt.description,
|