@webority/ui-react 0.27.3 → 0.29.0
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.
|
@@ -43,8 +43,10 @@
|
|
|
43
43
|
* @param {"bare"} [props.variant] Borderless variant — no border/background, inherits the
|
|
44
44
|
* container's chrome (inline-rename, ⌘K).
|
|
45
45
|
* @param {boolean|object} [props.passwordRequirements=false] Only honoured when `type="password"`.
|
|
46
|
-
* Pass `true` for the default policy (≥
|
|
47
|
-
* configure it — `{ minLength, uppercase, lowercase, digit, special, uniqueChars, title }`.
|
|
46
|
+
* Pass `true` for the default policy (≥10 chars, upper, lower, digit, special), or an object to
|
|
47
|
+
* configure it — `{ minLength, uppercase, lowercase, digit, special, uniqueChars, customRules, title }`.
|
|
48
|
+
* `customRules` is a list of `{ label, pattern }` for a product's own rules (such as no spaces): a rule
|
|
49
|
+
* ticks when the regular expression `pattern` (a JavaScript RegExp source string) matches. Shows
|
|
48
50
|
* a live "Password requirements" checklist on focus that ticks each rule green as the user types
|
|
49
51
|
* (client-side, before any server validation). The rule set is the one shared with Razor via
|
|
50
52
|
* `@webority/ui-elements`, so both surfaces validate identically.
|
|
@@ -21,10 +21,12 @@ import "@webority/ui-elements";
|
|
|
21
21
|
* @param {(index: number) => void} [props.onInvalid] Fired when advancing is blocked by beforeNext (the step is marked invalid).
|
|
22
22
|
* @param {'steps'|'journey'|'icons'} [props.variant='steps'] Stepper header style — compact circles, the wide journey bar, or large connected icon badges with a "STEP n" eyebrow.
|
|
23
23
|
* @param {'primary'|'success'|'warning'|'danger'|'info'} [props.tone] Recolour the whole stepper accent (active fill, done rail, ring, done tint) to a semantic ramp. Unset keeps the variant's default (primary for steps/journey, success/green for icons). For any other colour, override the `--wui-step-accent` / `--wui-step-soft` CSS variables via `style` or a `className` instead.
|
|
24
|
+
* @param {'primary'|'success'|'warning'|'danger'|'info'} [props.doneTone] Recolour completed steps only (their badge, "STEP n" eyebrow and the filled line after them) to a semantic ramp; the current step keeps the `tone` accent. Unset, completed steps follow `tone`. For any other colour, override the `--wui-step-done-accent` / `--wui-step-done-soft` CSS variables via `style` or a `className` instead.
|
|
24
25
|
* @param {'horizontal'|'vertical'} [props.orientation='horizontal']
|
|
25
26
|
* @param {boolean} [props.skippable=false] Show a Skip button on every step (bar the last), without needing per-step `optional`. A per-step `optional` still works on its own.
|
|
26
27
|
* @param {boolean} [props.nonLinear=false] Allow jumping to any step, not only completed ones.
|
|
27
28
|
* @param {boolean} [props.hideStepper=false] Hide the progress header.
|
|
29
|
+
* @param {boolean} [props.hideConnectors=false] Drop the line joining the steps, on every variant and orientation. Lines show by default.
|
|
28
30
|
* @param {boolean} [props.disabled=false] Disable all navigation.
|
|
29
31
|
* @param {string} [props.label='Progress'] Accessible name for the stepper.
|
|
30
32
|
* @param {string} [props.backLabel='Back']
|
package/dist/ui-react.js
CHANGED
|
@@ -675,7 +675,10 @@ var at = [
|
|
|
675
675
|
"twotone"
|
|
676
676
|
];
|
|
677
677
|
function ot({ icon: e, iconVariant: t, label: n, tooltipPlacement: r = "auto", danger: i = !1, disabled: a = !1, size: o = 20, onClick: s, className: c = "", as: l, href: u, ...d }) {
|
|
678
|
-
Y("AppActionIcon",
|
|
678
|
+
Y("AppActionIcon", l === void 0 ? d : {
|
|
679
|
+
...d,
|
|
680
|
+
as: l
|
|
681
|
+
}), J("AppActionIcon", "iconVariant", t, at);
|
|
679
682
|
let f = [
|
|
680
683
|
"u-action",
|
|
681
684
|
i ? "danger" : "",
|
|
@@ -9094,25 +9097,29 @@ var Hc = [
|
|
|
9094
9097
|
"active",
|
|
9095
9098
|
"pending",
|
|
9096
9099
|
"error"
|
|
9097
|
-
], Jc = I(function({ steps: e = [], children: t, active: n, defaultActive: r = 0, onStepChange: i, onFinish: a, onSkip: o, beforeNext: s, onInvalid: c, variant: l = "steps", tone: u,
|
|
9098
|
-
Y("AppWizard",
|
|
9100
|
+
], Jc = I(function({ steps: e = [], children: t, active: n, defaultActive: r = 0, onStepChange: i, onFinish: a, onSkip: o, beforeNext: s, onInvalid: c, variant: l = "steps", tone: u, doneTone: d, orientation: f = "horizontal", skippable: p = !1, nonLinear: m = !1, hideStepper: h = !1, hideConnectors: g = !1, disabled: _ = !1, label: v = "Progress", backLabel: y = "Back", nextLabel: b = "Next", skipLabel: x = "Skip", finishLabel: S = "Finish", className: C = "", ...w }, T) {
|
|
9101
|
+
Y("AppWizard", w), J("AppWizard", "variant", l, Wc), J("AppWizard", "tone", u, Gc), J("AppWizard", "doneTone", d, Gc), J("AppWizard", "orientation", f, Kc);
|
|
9099
9102
|
for (let t of e) J("AppWizard", "steps[].status", t.status, qc);
|
|
9100
|
-
let
|
|
9101
|
-
|
|
9102
|
-
},
|
|
9103
|
+
let E = V(null), D = (e) => {
|
|
9104
|
+
E.current = e, typeof T == "function" ? T(e) : T && (T.current = e);
|
|
9105
|
+
}, O = P.toArray(t), k = [
|
|
9106
|
+
u && `wui-step-tone-${u}`,
|
|
9107
|
+
d && `wui-step-done-tone-${d}`,
|
|
9108
|
+
C
|
|
9109
|
+
].filter(Boolean).join(" ");
|
|
9103
9110
|
return R(() => {
|
|
9104
|
-
let e =
|
|
9111
|
+
let e = E.current;
|
|
9105
9112
|
if (!e) return;
|
|
9106
9113
|
let t = n === void 0 ? r : n;
|
|
9107
9114
|
t && (e.active = t);
|
|
9108
9115
|
}, []), R(() => {
|
|
9109
|
-
let e =
|
|
9116
|
+
let e = E.current;
|
|
9110
9117
|
e && n !== void 0 && Number(e.active) !== n && (e.active = n);
|
|
9111
9118
|
}, [n]), R(() => {
|
|
9112
|
-
let e =
|
|
9119
|
+
let e = E.current;
|
|
9113
9120
|
e && (e.beforeNext = s ?? null);
|
|
9114
9121
|
}, [s]), R(() => {
|
|
9115
|
-
let e =
|
|
9122
|
+
let e = E.current;
|
|
9116
9123
|
if (!e) return;
|
|
9117
9124
|
let t = (e) => i?.(e.detail.index, e.detail), n = (e) => a?.(e.detail), r = (e) => o?.(e.detail.index), s = (e) => c?.(e.detail.index);
|
|
9118
9125
|
return e.addEventListener("wui-wizard:change", t), e.addEventListener("wui-wizard:finish", n), e.addEventListener("wui-wizard:skip", r), e.addEventListener("wui-wizard:invalid", s), () => {
|
|
@@ -9124,27 +9131,28 @@ var Hc = [
|
|
|
9124
9131
|
o,
|
|
9125
9132
|
c
|
|
9126
9133
|
]), /* @__PURE__ */ K("wui-wizard", {
|
|
9127
|
-
ref:
|
|
9134
|
+
ref: D,
|
|
9128
9135
|
variant: l,
|
|
9129
|
-
orientation:
|
|
9130
|
-
skippable:
|
|
9131
|
-
"non-linear":
|
|
9132
|
-
"hide-stepper":
|
|
9133
|
-
|
|
9134
|
-
|
|
9135
|
-
|
|
9136
|
-
"
|
|
9137
|
-
"
|
|
9138
|
-
"
|
|
9139
|
-
|
|
9140
|
-
|
|
9136
|
+
orientation: f,
|
|
9137
|
+
skippable: p ? "" : void 0,
|
|
9138
|
+
"non-linear": m ? "" : void 0,
|
|
9139
|
+
"hide-stepper": h ? "" : void 0,
|
|
9140
|
+
"hide-connectors": g ? "" : void 0,
|
|
9141
|
+
disabled: _ ? "" : void 0,
|
|
9142
|
+
label: v,
|
|
9143
|
+
"back-label": y,
|
|
9144
|
+
"next-label": b,
|
|
9145
|
+
"skip-label": x,
|
|
9146
|
+
"finish-label": S,
|
|
9147
|
+
className: k || void 0,
|
|
9148
|
+
...w,
|
|
9141
9149
|
children: e.map((e, t) => /* @__PURE__ */ K("wui-wizard-step", {
|
|
9142
9150
|
label: e.label,
|
|
9143
9151
|
description: e.description || void 0,
|
|
9144
9152
|
optional: e.optional ? "" : void 0,
|
|
9145
9153
|
icon: e.icon || void 0,
|
|
9146
9154
|
status: e.status || void 0,
|
|
9147
|
-
children:
|
|
9155
|
+
children: O[t]
|
|
9148
9156
|
}, e.key ?? `${e.label}-${t}`))
|
|
9149
9157
|
});
|
|
9150
9158
|
}), Yc = [
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@webority/ui-react",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.29.0",
|
|
4
4
|
"description": "Webority shared React component library — App* primitives on react-bootstrap + the @webority/theme design system.",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE",
|
|
6
6
|
"type": "module",
|
|
@@ -29,8 +29,8 @@
|
|
|
29
29
|
},
|
|
30
30
|
"sideEffects": false,
|
|
31
31
|
"dependencies": {
|
|
32
|
-
"@webority/
|
|
33
|
-
"@webority/
|
|
32
|
+
"@webority/ui-elements": "0.29.0",
|
|
33
|
+
"@webority/theme": "0.29.0"
|
|
34
34
|
},
|
|
35
35
|
"peerDependencies": {
|
|
36
36
|
"@webority/analytics": "^0.6.0 || ^0.7.0 || ^0.8.0 || ^0.9.0",
|