@veracity/vui 2.8.3 → 2.8.4-rc.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.
- package/dist/cjs/button/button.d.ts.map +1 -1
- package/dist/cjs/button/button.js +2 -5
- package/dist/cjs/checkbox/checkbox.d.ts.map +1 -1
- package/dist/cjs/checkbox/checkbox.js +2 -2
- package/dist/cjs/footer/footer.d.ts.map +1 -1
- package/dist/cjs/footer/footer.js +1 -1
- package/dist/cjs/header/header.d.ts.map +1 -1
- package/dist/cjs/header/header.js +1 -1
- package/dist/cjs/image/image.js +1 -1
- package/dist/cjs/input/inputInput.d.ts.map +1 -1
- package/dist/cjs/input/inputInput.js +1 -1
- package/dist/cjs/notification/notification.d.ts.map +1 -1
- package/dist/cjs/notification/notification.js +1 -1
- package/dist/cjs/radio/radio.d.ts.map +1 -1
- package/dist/cjs/radio/radio.js +1 -1
- package/dist/cjs/table/th.d.ts.map +1 -1
- package/dist/cjs/table/th.js +3 -1
- package/dist/cjs/table/thead.js +1 -1
- package/dist/cjs/textarea/textarea.d.ts.map +1 -1
- package/dist/cjs/textarea/textarea.js +1 -1
- package/dist/esm/button/button.d.ts.map +1 -1
- package/dist/esm/button/button.js +2 -5
- package/dist/esm/checkbox/checkbox.d.ts.map +1 -1
- package/dist/esm/checkbox/checkbox.js +2 -2
- package/dist/esm/footer/footer.d.ts.map +1 -1
- package/dist/esm/footer/footer.js +1 -1
- package/dist/esm/header/header.d.ts.map +1 -1
- package/dist/esm/header/header.js +1 -1
- package/dist/esm/image/image.js +1 -1
- package/dist/esm/input/inputInput.d.ts.map +1 -1
- package/dist/esm/input/inputInput.js +1 -1
- package/dist/esm/notification/notification.d.ts.map +1 -1
- package/dist/esm/notification/notification.js +1 -1
- package/dist/esm/radio/radio.d.ts.map +1 -1
- package/dist/esm/radio/radio.js +1 -1
- package/dist/esm/table/th.d.ts.map +1 -1
- package/dist/esm/table/th.js +6 -3
- package/dist/esm/table/thead.js +1 -1
- package/dist/esm/textarea/textarea.d.ts.map +1 -1
- package/dist/esm/textarea/textarea.js +1 -1
- package/package.json +1 -1
- package/src/button/button.tsx +4 -6
- package/src/checkbox/checkbox.tsx +2 -0
- package/src/footer/footer.tsx +1 -0
- package/src/header/header.tsx +1 -0
- package/src/image/image.tsx +1 -1
- package/src/input/inputInput.tsx +1 -0
- package/src/notification/notification.tsx +1 -0
- package/src/radio/radio.tsx +1 -0
- package/src/table/th.tsx +2 -0
- package/src/table/thead.tsx +1 -1
- package/src/textarea/textarea.tsx +1 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/button/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAA;AAGtC,OAAO,EAA+B,YAAY,EAAE,MAAM,SAAS,CAAA;AAEnE,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,UAAU,MAAM,cAAc,CAAA;AACrC,OAAO,UAAU,MAAM,cAAc,CAAA;AAiBrC,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;SAatB,CAAA;
|
|
1
|
+
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/button/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAA;AAGtC,OAAO,EAA+B,YAAY,EAAE,MAAM,SAAS,CAAA;AAEnE,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,UAAU,MAAM,cAAc,CAAA;AACrC,OAAO,UAAU,MAAM,cAAc,CAAA;AAiBrC,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;SAatB,CAAA;AAED;;;;;;GAMG;AACH,eAAO,MAAM,MAAM;UAuHX,iBAAiB;UACjB,iBAAiB;CACxB,CAAA;AAKD,eAAe,MAAM,CAAA"}
|
|
@@ -71,9 +71,6 @@ exports.ButtonBase = core_1.styled.buttonBox `
|
|
|
71
71
|
user-select: none;
|
|
72
72
|
width: fit-content;
|
|
73
73
|
`;
|
|
74
|
-
const ariaProps = {
|
|
75
|
-
'aria-label': 'button'
|
|
76
|
-
};
|
|
77
74
|
/**
|
|
78
75
|
* Triggers given actions on click. Supports multiple states, sizes and variants.
|
|
79
76
|
*
|
|
@@ -86,7 +83,7 @@ exports.Button = (0, core_1.vui)((props, ref) => {
|
|
|
86
83
|
const buttonGroupProps = (0, context_1.useButtonGroupContext)();
|
|
87
84
|
const mergedProps = Object.assign(Object.assign({}, buttonGroupProps), props);
|
|
88
85
|
const { borderWidth: borderWidthProp, children, className, colorScheme, disabled, dropDownIcon = 'falAngleDown', icon, iconLeft, iconRight, isActive, isDropDown, isElevated, isFullWidth, isLoading, // eslint-disable-line
|
|
89
|
-
isRound, isSplit, isTruncated, size, state = props.isLoading ? 'loading' : '', stateMapping, text, variant: variantProp } = mergedProps, rest = __rest(mergedProps, ["borderWidth", "children", "className", "colorScheme", "disabled", "dropDownIcon", "icon", "iconLeft", "iconRight", "isActive", "isDropDown", "isElevated", "isFullWidth", "isLoading", "isRound", "isSplit", "isTruncated", "size", "state", "stateMapping", "text", "variant"]);
|
|
86
|
+
isRound, isSplit, isTruncated, size, state = props.isLoading ? 'loading' : '', stateMapping, text, title, variant: variantProp } = mergedProps, rest = __rest(mergedProps, ["borderWidth", "children", "className", "colorScheme", "disabled", "dropDownIcon", "icon", "iconLeft", "iconRight", "isActive", "isDropDown", "isElevated", "isFullWidth", "isLoading", "isRound", "isSplit", "isTruncated", "size", "state", "stateMapping", "text", "title", "variant"]);
|
|
90
87
|
const hasState = Boolean(state) && state !== 'idle';
|
|
91
88
|
const states = Object.assign(Object.assign({}, consts_1.buttonStateMapping), stateMapping);
|
|
92
89
|
const _e = (_a = states[state]) !== null && _a !== void 0 ? _a : {}, { iconProps: stateIconProps } = _e, stateProps = __rest(_e, ["iconProps"]);
|
|
@@ -126,7 +123,7 @@ exports.Button = (0, core_1.vui)((props, ref) => {
|
|
|
126
123
|
w: isFullWidth ? '100%' : undefined
|
|
127
124
|
});
|
|
128
125
|
return (react_1.default.createElement(context_2.ButtonProvider, { value: context },
|
|
129
|
-
react_1.default.createElement(exports.ButtonBase, Object.assign({ borderWidth: border, className: (0, utils_1.cs)('vui-button', className, isActive && utils_1.activeClassName), disabled: disabled, focusRing: 3, h: h, pl: pl, pr: isDropDown ? 0 : pr, ref: ref, type: "button", variant: variant },
|
|
126
|
+
react_1.default.createElement(exports.ButtonBase, Object.assign({ "aria-label": title ? undefined : 'button', borderWidth: border, className: (0, utils_1.cs)('vui-button', className, isActive && utils_1.activeClassName), disabled: disabled, focusRing: 3, h: h, pl: pl, pr: isDropDown ? 0 : pr, ref: ref, title: title, type: "button", variant: variant }, buttonStyles, disabledProps, aliasedProps, rest),
|
|
130
127
|
hasState && (react_1.default.createElement(StateWrapper, Object.assign({ onClick: (e) => e.stopPropagation() }, stateProps),
|
|
131
128
|
react_1.default.createElement(buttonIcon_1.default, Object.assign({ m: "auto" }, stateIconProps)))),
|
|
132
129
|
react_1.default.createElement(Content, null,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../src/checkbox/checkbox.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAA;AAyBpE,eAAO,MAAM,YAAY,ulJAkBxB,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,QAAQ,
|
|
1
|
+
{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../src/checkbox/checkbox.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAA;AAyBpE,eAAO,MAAM,YAAY,ulJAkBxB,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,QAAQ,uDAqFnB,CAAA;AAEF,eAAe,QAAQ,CAAA"}
|
|
@@ -110,8 +110,8 @@ exports.Checkbox = (0, core_1.vui)((props, ref) => {
|
|
|
110
110
|
'aria-disabled': disabled
|
|
111
111
|
});
|
|
112
112
|
return (react_1.default.createElement(exports.CheckboxBase, Object.assign({ className: (0, utils_1.cs)('vui-checkbox', className), controlHoverColor: controlHoverColor, ref: ref }, styles.container, aliasedProps, rest),
|
|
113
|
-
react_1.default.createElement(CheckboxControl, Object.assign({ bg: "white", className: "vui-checkboxControl", color: color, focusWithinRing: 3, mr: controlMr }, controlStyles),
|
|
114
|
-
react_1.default.createElement(CheckboxInput, Object.assign({ className: "vui-checkboxInput", onChange: handleOnChange, ref: inputRef, type: "checkbox" }, { checked, defaultChecked, disabled, id, name, required, value }, inputProps)),
|
|
113
|
+
react_1.default.createElement(CheckboxControl, Object.assign({ bg: "white", className: "vui-checkboxControl", color: color, focusWithinRing: 3, mr: controlMr, role: "none" }, controlStyles),
|
|
114
|
+
react_1.default.createElement(CheckboxInput, Object.assign({ "aria-label": label ? label : 'input-checkbox', className: "vui-checkboxInput", onChange: handleOnChange, ref: inputRef, type: "checkbox" }, { checked, defaultChecked, disabled, id, name, required, value }, inputProps)),
|
|
115
115
|
react_1.default.createElement(icon_1.default, { className: "vui-checkboxIcon", h: "100%", name: icon, w: "100%" })), children !== null && children !== void 0 ? children : (label && (react_1.default.createElement(t_1.default, Object.assign({ className: "vui-checkboxLabel", lineHeight: "normal" }, styles.label), label)))));
|
|
116
116
|
});
|
|
117
117
|
exports.default = exports.Checkbox;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"footer.d.ts","sourceRoot":"","sources":["../../../src/footer/footer.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAwC,YAAY,EAAE,MAAM,SAAS,CAAA;AAM5E,OAAO,EAAkB,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5D,OAAO,YAAY,MAAM,gBAAgB,CAAA;AACzC,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,UAAU,MAAM,cAAc,CAAA;AACrC,OAAO,SAAS,MAAM,aAAa,CAAA;AACnC,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAK3C,eAAO,MAAM,UAAU,+HAItB,CAAA;AAGD,oGAAoG;AACpG,eAAO,MAAM,MAAM;
|
|
1
|
+
{"version":3,"file":"footer.d.ts","sourceRoot":"","sources":["../../../src/footer/footer.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAwC,YAAY,EAAE,MAAM,SAAS,CAAA;AAM5E,OAAO,EAAkB,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5D,OAAO,YAAY,MAAM,gBAAgB,CAAA;AACzC,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,UAAU,MAAM,cAAc,CAAA;AACrC,OAAO,SAAS,MAAM,aAAa,CAAA;AACnC,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAK3C,eAAO,MAAM,UAAU,+HAItB,CAAA;AAGD,oGAAoG;AACpG,eAAO,MAAM,MAAM;YAwKT,mBAAmB;aAClB,oBAAoB;aACpB,oBAAoB;UACvB,iBAAiB;SAClB,gBAAgB;aACZ,oBAAoB;CAC9B,CAAA;AASD,eAAe,MAAM,CAAA"}
|
|
@@ -70,7 +70,7 @@ exports.Footer = (0, core_1.vui)((props, ref) => {
|
|
|
70
70
|
const downMd = (0, core_1.useDown)('md');
|
|
71
71
|
const downLg = (0, core_1.useDown)('lg');
|
|
72
72
|
return (react_1.default.createElement(context_1.FooterProvider, { value: context },
|
|
73
|
-
react_1.default.createElement(exports.FooterBase, Object.assign({ className: (0, utils_1.cs)('vui-footer', isApplication ? 'vui-footer-app' : '', className), px: isApplication ? '40px' : 3, py: isSlim ? (downMd ? '16px' : '9px') : 5 }, styles.container, { ref: ref }, rest),
|
|
73
|
+
react_1.default.createElement(exports.FooterBase, Object.assign({ className: (0, utils_1.cs)('vui-footer', isApplication ? 'vui-footer-app' : '', className), px: isApplication ? '40px' : 3, py: isSlim ? (downMd ? '16px' : '9px') : 5, role: "contentinfo" }, styles.container, { ref: ref }, rest),
|
|
74
74
|
isApplication && (react_1.default.createElement(footerContent_1.default, { alignContent: "center", alignItems: "center", maxW: "100%" },
|
|
75
75
|
react_1.default.createElement(footerRow_1.default, { alignContent: "space-between", w: 1 },
|
|
76
76
|
react_1.default.createElement(box_1.Box, { alignItems: "self-start", columnGap: 3, flex: { xs: '0 0 100%', sm: '0 0 100%', md: '0 0 100%', lg: '0 0 50%' }, py: { xs: 1, sm: 1, md: 1.25, lg: 1.5 }, wrap: true }, applicationLinks === null || applicationLinks === void 0 ? void 0 : applicationLinks.map((link, index) => (react_1.default.createElement(box_1.Box, { flex: { xs: '0 0 50%', sm: '0 0 auto' }, key: index, minW: 70 },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"header.d.ts","sourceRoot":"","sources":["../../../src/header/header.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAgD,YAAY,EAAE,MAAM,SAAS,CAAA;AAGpF,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,qBAAqB,MAAM,yBAAyB,CAAA;AAC3D,OAAO,qBAAqB,MAAM,yBAAyB,CAAA;AAC3D,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,mBAAmB,MAAM,uBAAuB,CAAA;AACvD,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,cAAc,MAAM,kBAAkB,CAAA;AAC7C,OAAO,UAAU,MAAM,cAAc,CAAA;AACrC,OAAO,eAAe,MAAM,mBAAmB,CAAA;AAC/C,OAAO,mBAAmB,MAAM,uBAAuB,CAAA;AACvD,OAAO,kBAAkB,MAAM,sBAAsB,CAAA;AACrD,OAAO,mBAAmB,MAAM,uBAAuB,CAAA;AACvD,OAAO,cAAc,MAAM,kBAAkB,CAAA;AAC7C,OAAO,qBAAqB,MAAM,yBAAyB,CAAA;AAC3D,OAAO,YAAY,MAAM,gBAAgB,CAAA;AACzC,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAG3C,eAAO,MAAM,UAAU,kIAMtB,CAAA;AAGD,qHAAqH;AACrH,eAAO,MAAM,MAAM;
|
|
1
|
+
{"version":3,"file":"header.d.ts","sourceRoot":"","sources":["../../../src/header/header.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAgD,YAAY,EAAE,MAAM,SAAS,CAAA;AAGpF,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,qBAAqB,MAAM,yBAAyB,CAAA;AAC3D,OAAO,qBAAqB,MAAM,yBAAyB,CAAA;AAC3D,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,mBAAmB,MAAM,uBAAuB,CAAA;AACvD,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,cAAc,MAAM,kBAAkB,CAAA;AAC7C,OAAO,UAAU,MAAM,cAAc,CAAA;AACrC,OAAO,eAAe,MAAM,mBAAmB,CAAA;AAC/C,OAAO,mBAAmB,MAAM,uBAAuB,CAAA;AACvD,OAAO,kBAAkB,MAAM,sBAAsB,CAAA;AACrD,OAAO,mBAAmB,MAAM,uBAAuB,CAAA;AACvD,OAAO,cAAc,MAAM,kBAAkB,CAAA;AAC7C,OAAO,qBAAqB,MAAM,yBAAyB,CAAA;AAC3D,OAAO,YAAY,MAAM,gBAAgB,CAAA;AACzC,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAG3C,eAAO,MAAM,UAAU,kIAMtB,CAAA;AAGD,qHAAqH;AACrH,eAAO,MAAM,MAAM;aA6CR,oBAAoB;qBACZ,4BAA4B;aACpC,oBAAoB;qBACZ,4BAA4B;aACpC,oBAAoB;mBACd,0BAA0B;aAChC,oBAAoB;cACnB,qBAAqB;UACzB,iBAAiB;eACZ,sBAAsB;mBAClB,0BAA0B;kBAC3B,yBAAyB;mBACxB,0BAA0B;cAC/B,qBAAqB;qBACd,4BAA4B;YACrC,mBAAmB;CAC5B,CAAA;AAmBD,eAAe,MAAM,CAAA"}
|
|
@@ -94,7 +94,7 @@ exports.Header = (0, core_1.vui)((props, ref) => {
|
|
|
94
94
|
variant
|
|
95
95
|
};
|
|
96
96
|
return (react_1.default.createElement(context_1.HeaderProvider, { value: context },
|
|
97
|
-
react_1.default.createElement(exports.HeaderBase, Object.assign({ className: (0, utils_1.cs)('vui-header', className), h: headerHeight, px: { xs: 2, lg: 5 }, ref: ref }, styles.container, rest))));
|
|
97
|
+
react_1.default.createElement(exports.HeaderBase, Object.assign({ className: (0, utils_1.cs)('vui-header', className), h: headerHeight, px: { xs: 2, lg: 5 }, ref: ref, role: "banner" }, styles.container, rest))));
|
|
98
98
|
});
|
|
99
99
|
exports.Header.Account = headerAccount_1.default;
|
|
100
100
|
exports.Header.AccountUserInfo = headerAccountUserInfo_1.default;
|
package/dist/cjs/image/image.js
CHANGED
|
@@ -27,6 +27,6 @@ exports.ImageBase = core_1.styled.imgBox `
|
|
|
27
27
|
exports.Image = (0, core_1.vui)((props, ref) => {
|
|
28
28
|
const _a = (0, core_1.omitThemingProps)(props), { className } = _a, rest = __rest(_a, ["className"]);
|
|
29
29
|
const styles = (0, core_1.useStyleConfig)('Image', props);
|
|
30
|
-
return react_1.default.createElement(exports.ImageBase, Object.assign({ className: (0, utils_1.cs)('vui-image', className), ref: ref }, styles, rest));
|
|
30
|
+
return react_1.default.createElement(exports.ImageBase, Object.assign({ alt: "VUI image", className: (0, utils_1.cs)('vui-image', className), ref: ref }, styles, rest));
|
|
31
31
|
});
|
|
32
32
|
exports.default = exports.Image;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"inputInput.d.ts","sourceRoot":"","sources":["../../../src/input/inputInput.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AAE/C,eAAO,MAAM,cAAc,2GAe1B,CAAA;AAED,4DAA4D;AAC5D,eAAO,MAAM,UAAU,
|
|
1
|
+
{"version":3,"file":"inputInput.d.ts","sourceRoot":"","sources":["../../../src/input/inputInput.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AAE/C,eAAO,MAAM,cAAc,2GAe1B,CAAA;AAED,4DAA4D;AAC5D,eAAO,MAAM,UAAU,0DAqBrB,CAAA;AAEF,eAAe,UAAU,CAAA"}
|
|
@@ -44,6 +44,6 @@ exports.InputInput = (0, core_1.vui)((props, ref) => {
|
|
|
44
44
|
const aliasedProps = (0, utils_1.filterUndefined)({
|
|
45
45
|
'aria-disabled': mergedProps.disabled
|
|
46
46
|
});
|
|
47
|
-
return (react_1.default.createElement(exports.InputInputBase, Object.assign({ autoComplete: "false", className: (0, utils_1.cs)('vui-inputInput', className), ref: ref }, styles.input, aliasedProps, rest)));
|
|
47
|
+
return (react_1.default.createElement(exports.InputInputBase, Object.assign({ "aria-label": "input-text", autoComplete: "false", className: (0, utils_1.cs)('vui-inputInput', className), ref: ref }, styles.input, aliasedProps, rest)));
|
|
48
48
|
});
|
|
49
49
|
exports.default = exports.InputInput;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"notification.d.ts","sourceRoot":"","sources":["../../../src/notification/notification.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAuB,YAAY,EAAE,MAAM,SAAS,CAAA;AAI3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAA;AACxD,OAAO,kBAAkB,MAAM,sBAAsB,CAAA;AACrD,OAAO,gBAAgB,MAAM,oBAAoB,CAAA;AACjD,OAAO,gBAAgB,MAAM,oBAAoB,CAAA;AACjD,OAAO,iBAAiB,MAAM,qBAAqB,CAAA;AAEnD;;;GAGG;AACH,eAAO,MAAM,YAAY;
|
|
1
|
+
{"version":3,"file":"notification.d.ts","sourceRoot":"","sources":["../../../src/notification/notification.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAuB,YAAY,EAAE,MAAM,SAAS,CAAA;AAI3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAA;AACxD,OAAO,kBAAkB,MAAM,sBAAsB,CAAA;AACrD,OAAO,gBAAgB,MAAM,oBAAoB,CAAA;AACjD,OAAO,gBAAgB,MAAM,oBAAoB,CAAA;AACjD,OAAO,iBAAiB,MAAM,qBAAqB,CAAA;AAEnD;;;GAGG;AACH,eAAO,MAAM,YAAY;YAyDf,yBAAyB;UAC3B,uBAAuB;UACvB,uBAAuB;WACtB,wBAAwB;CAChC,CAAA;AAOD,eAAe,YAAY,CAAA"}
|
|
@@ -40,7 +40,7 @@ exports.Notification = (0, core_1.vui)((props, ref) => {
|
|
|
40
40
|
const titleDisplay = action ? 'block' : 'inline-flex';
|
|
41
41
|
const alignSelf = verticalAlign === 'center' ? 'center' : 'flex-start';
|
|
42
42
|
return (react_1.default.createElement(context_1.NotificationProvider, { value: context },
|
|
43
|
-
react_1.default.createElement(box_1.default, Object.assign({ borderRadius: "md", borderWidth: 1, className: (0, utils_1.cs)('vui-notification', className), ref: ref, w: "fit-content" }, styles.container, rest),
|
|
43
|
+
react_1.default.createElement(box_1.default, Object.assign({ borderRadius: "md", borderWidth: 1, className: (0, utils_1.cs)('vui-notification', className), ref: ref, role: "mark", w: "fit-content" }, styles.container, rest),
|
|
44
44
|
iconName ? react_1.default.createElement(notificationIcon_1.default, { alignSelf: alignSelf, name: iconName }) : icon, children !== null && children !== void 0 ? children : (react_1.default.createElement(notificationText_1.default, { alignSelf: alignSelf },
|
|
45
45
|
(0, utils_1.isReactText)(title) ? react_1.default.createElement(notificationTitle_1.default, { display: titleDisplay, text: title }) : title,
|
|
46
46
|
" ",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"radio.d.ts","sourceRoot":"","sources":["../../../src/radio/radio.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AAuB3D,eAAO,MAAM,SAAS,olJAkBrB,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,KAAK,
|
|
1
|
+
{"version":3,"file":"radio.d.ts","sourceRoot":"","sources":["../../../src/radio/radio.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AAuB3D,eAAO,MAAM,SAAS,olJAkBrB,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,KAAK,oDA4FhB,CAAA;AAEF,eAAe,KAAK,CAAA"}
|
package/dist/cjs/radio/radio.js
CHANGED
|
@@ -117,7 +117,7 @@ exports.Radio = (0, core_1.vui)((props, ref) => {
|
|
|
117
117
|
});
|
|
118
118
|
return (react_1.default.createElement(exports.RadioBase, Object.assign({ className: (0, utils_1.cs)('vui-radio', className), controlHoverColor: controlHoverColor, ref: ref }, styles.container, aliasedProps, rest),
|
|
119
119
|
react_1.default.createElement(RadioControl, Object.assign({ bg: "white", className: "vui-radioControl", color: color, focusWithinRing: 3, mr: controlMr }, controlStyles),
|
|
120
|
-
react_1.default.createElement(RadioInput, Object.assign({ className: "vui-radioInput", onChange: handleOnChange, ref: inputRef, type: "radio" }, { checked, defaultChecked, disabled, id, name, required, value }, inputProps)),
|
|
120
|
+
react_1.default.createElement(RadioInput, Object.assign({ "aria-label": "input-radio", className: "vui-radioInput", onChange: handleOnChange, ref: inputRef, type: "radio" }, { checked, defaultChecked, disabled, id, name, required, value }, inputProps)),
|
|
121
121
|
react_1.default.createElement(icon_1.default, { className: "vui-radioIcon", h: "100%", name: icon, w: "100%" })), children !== null && children !== void 0 ? children : (label && (react_1.default.createElement(t_1.default, Object.assign({ className: "vui-radioLabel", lineHeight: "normal" }, styles.label), label)))));
|
|
122
122
|
});
|
|
123
123
|
exports.default = exports.Radio;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"th.d.ts","sourceRoot":"","sources":["../../../src/table/th.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"th.d.ts","sourceRoot":"","sources":["../../../src/table/th.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AAGvC,eAAO,MAAM,MAAM,8HAIlB,CAAA;AAED,oDAAoD;AACpD,eAAO,MAAM,EAAE,+CA+Db,CAAA;AAEF,eAAe,EAAE,CAAA"}
|
package/dist/cjs/table/th.js
CHANGED
|
@@ -18,6 +18,7 @@ exports.Th = exports.ThBase = void 0;
|
|
|
18
18
|
const react_1 = __importDefault(require("react"));
|
|
19
19
|
const box_1 = __importDefault(require("../box"));
|
|
20
20
|
const core_1 = require("../core");
|
|
21
|
+
const t_1 = require("../t");
|
|
21
22
|
const utils_1 = require("../utils");
|
|
22
23
|
const context_1 = require("./context");
|
|
23
24
|
const tableSortIcon_1 = __importDefault(require("./tableSortIcon"));
|
|
@@ -54,6 +55,7 @@ exports.Th = (0, core_1.vui)((props, ref) => {
|
|
|
54
55
|
: {};
|
|
55
56
|
return (react_1.default.createElement(exports.ThBase, Object.assign({ className: (0, utils_1.cs)('vui-th', className), "data-active": isActive, "data-disabled": disabled, hoverBg: hoverBg, px: 2, ref: ref }, styles.th, activeProps, disabledProps, interactiveProps, rest), children !== null && children !== void 0 ? children : (react_1.default.createElement(box_1.default, { centerV: true, display: "inline-flex" },
|
|
56
57
|
title,
|
|
57
|
-
isSortable && react_1.default.createElement(tableSortIcon_1.default, { ml: 1, my: 0.5, order: sortOrder })))
|
|
58
|
+
isSortable && react_1.default.createElement(tableSortIcon_1.default, { ml: 1, my: 0.5, order: sortOrder }))),
|
|
59
|
+
!title && react_1.default.createElement(t_1.T, { color: "white" }, "a11y fix")));
|
|
58
60
|
});
|
|
59
61
|
exports.default = exports.Th;
|
package/dist/cjs/table/thead.js
CHANGED
|
@@ -42,6 +42,6 @@ exports.Thead = (0, core_1.vui)((props, ref) => {
|
|
|
42
42
|
zIndex: 3
|
|
43
43
|
}
|
|
44
44
|
: {};
|
|
45
|
-
return (react_1.default.createElement(TheadBase, Object.assign({ className: (0, utils_1.cs)('vui-thead', className), ref: ref }, stickyProps, styles.thead, rest), children !== null && children !== void 0 ? children : (react_1.default.createElement(tr_1.default, null, columns === null || columns === void 0 ? void 0 : columns.map(column => (react_1.default.createElement(th_1.default, Object.assign({ key: column.field }, column))))))));
|
|
45
|
+
return (react_1.default.createElement(TheadBase, Object.assign({ className: (0, utils_1.cs)('vui-thead', className), ref: ref }, stickyProps, styles.thead, rest), children !== null && children !== void 0 ? children : (react_1.default.createElement(tr_1.default, null, columns === null || columns === void 0 ? void 0 : columns.map(column => (react_1.default.createElement(th_1.default, Object.assign({ key: column.field, role: "columnheader" }, column))))))));
|
|
46
46
|
});
|
|
47
47
|
exports.default = exports.Thead;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../../../src/textarea/textarea.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAkBhD,eAAO,MAAM,YAAY,+HAKxB,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,QAAQ,
|
|
1
|
+
{"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../../../src/textarea/textarea.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAkBhD,eAAO,MAAM,YAAY,+HAKxB,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,QAAQ,sDAgGnB,CAAA;AAEF,eAAe,QAAQ,CAAA"}
|
|
@@ -94,7 +94,7 @@ exports.Textarea = (0, core_1.vui)((props, ref) => {
|
|
|
94
94
|
setCount(((_a = `${value}`) === null || _a === void 0 ? void 0 : _a.length) ? `${value}`.length : 0);
|
|
95
95
|
}, [value]);
|
|
96
96
|
return (react_1.default.createElement(exports.TextareaBase, Object.assign({ className: (0, utils_1.cs)('vui-textarea', className), ref: ref }, styles.container, aliasedProps, rest),
|
|
97
|
-
react_1.default.createElement(TextareaTextarea, Object.assign({ className: "vui-textareaTextarea", ref: textareaRef }, {
|
|
97
|
+
react_1.default.createElement(TextareaTextarea, Object.assign({ "aria-label": "input-textarea", className: "vui-textareaTextarea", ref: textareaRef }, {
|
|
98
98
|
autoFocus,
|
|
99
99
|
cols,
|
|
100
100
|
defaultValue,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/button/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAA;AAGtC,OAAO,EAA+B,YAAY,EAAE,MAAM,SAAS,CAAA;AAEnE,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,UAAU,MAAM,cAAc,CAAA;AACrC,OAAO,UAAU,MAAM,cAAc,CAAA;AAiBrC,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;SAatB,CAAA;
|
|
1
|
+
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/button/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAA;AAGtC,OAAO,EAA+B,YAAY,EAAE,MAAM,SAAS,CAAA;AAEnE,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,UAAU,MAAM,cAAc,CAAA;AACrC,OAAO,UAAU,MAAM,cAAc,CAAA;AAiBrC,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;SAatB,CAAA;AAED;;;;;;GAMG;AACH,eAAO,MAAM,MAAM;UAuHX,iBAAiB;UACjB,iBAAiB;CACxB,CAAA;AAKD,eAAe,MAAM,CAAA"}
|
|
@@ -31,9 +31,6 @@ export const ButtonBase = styled.buttonBox `
|
|
|
31
31
|
user-select: none;
|
|
32
32
|
width: fit-content;
|
|
33
33
|
`;
|
|
34
|
-
const ariaProps = {
|
|
35
|
-
'aria-label': 'button'
|
|
36
|
-
};
|
|
37
34
|
/**
|
|
38
35
|
* Triggers given actions on click. Supports multiple states, sizes and variants.
|
|
39
36
|
*
|
|
@@ -45,7 +42,7 @@ export const Button = vui((props, ref) => {
|
|
|
45
42
|
const buttonGroupProps = useButtonGroupContext();
|
|
46
43
|
const mergedProps = { ...buttonGroupProps, ...props };
|
|
47
44
|
const { borderWidth: borderWidthProp, children, className, colorScheme, disabled, dropDownIcon = 'falAngleDown', icon, iconLeft, iconRight, isActive, isDropDown, isElevated, isFullWidth, isLoading, // eslint-disable-line
|
|
48
|
-
isRound, isSplit, isTruncated, size, state = props.isLoading ? 'loading' : '', stateMapping, text, variant: variantProp, ...rest } = mergedProps;
|
|
45
|
+
isRound, isSplit, isTruncated, size, state = props.isLoading ? 'loading' : '', stateMapping, text, title, variant: variantProp, ...rest } = mergedProps;
|
|
49
46
|
const hasState = Boolean(state) && state !== 'idle';
|
|
50
47
|
const states = { ...buttonStateMapping, ...stateMapping };
|
|
51
48
|
const { iconProps: stateIconProps, ...stateProps } = states[state] ?? {};
|
|
@@ -85,7 +82,7 @@ export const Button = vui((props, ref) => {
|
|
|
85
82
|
w: isFullWidth ? '100%' : undefined
|
|
86
83
|
});
|
|
87
84
|
return (React.createElement(ButtonProvider, { value: context },
|
|
88
|
-
React.createElement(ButtonBase, { borderWidth: border, className: cs('vui-button', className, isActive && activeClassName), disabled: disabled, focusRing: 3, h: h, pl: pl, pr: isDropDown ? 0 : pr, ref: ref, type: "button", variant: variant, ...
|
|
85
|
+
React.createElement(ButtonBase, { "aria-label": title ? undefined : 'button', borderWidth: border, className: cs('vui-button', className, isActive && activeClassName), disabled: disabled, focusRing: 3, h: h, pl: pl, pr: isDropDown ? 0 : pr, ref: ref, title: title, type: "button", variant: variant, ...buttonStyles, ...disabledProps, ...aliasedProps, ...rest },
|
|
89
86
|
hasState && (React.createElement(StateWrapper, { onClick: (e) => e.stopPropagation(), ...stateProps },
|
|
90
87
|
React.createElement(ButtonIcon, { m: "auto", ...stateIconProps }))),
|
|
91
88
|
React.createElement(Content, null,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../src/checkbox/checkbox.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAA;AAyBpE,eAAO,MAAM,YAAY,ulJAkBxB,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,QAAQ,
|
|
1
|
+
{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../src/checkbox/checkbox.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAA;AAyBpE,eAAO,MAAM,YAAY,ulJAkBxB,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,QAAQ,uDAqFnB,CAAA;AAEF,eAAe,QAAQ,CAAA"}
|
|
@@ -69,8 +69,8 @@ export const Checkbox = vui((props, ref) => {
|
|
|
69
69
|
'aria-disabled': disabled
|
|
70
70
|
});
|
|
71
71
|
return (React.createElement(CheckboxBase, { className: cs('vui-checkbox', className), controlHoverColor: controlHoverColor, ref: ref, ...styles.container, ...aliasedProps, ...rest },
|
|
72
|
-
React.createElement(CheckboxControl, { bg: "white", className: "vui-checkboxControl", color: color, focusWithinRing: 3, mr: controlMr, ...controlStyles },
|
|
73
|
-
React.createElement(CheckboxInput, { className: "vui-checkboxInput", onChange: handleOnChange, ref: inputRef, type: "checkbox", ...{ checked, defaultChecked, disabled, id, name, required, value }, ...inputProps }),
|
|
72
|
+
React.createElement(CheckboxControl, { bg: "white", className: "vui-checkboxControl", color: color, focusWithinRing: 3, mr: controlMr, role: "none", ...controlStyles },
|
|
73
|
+
React.createElement(CheckboxInput, { "aria-label": label ? label : 'input-checkbox', className: "vui-checkboxInput", onChange: handleOnChange, ref: inputRef, type: "checkbox", ...{ checked, defaultChecked, disabled, id, name, required, value }, ...inputProps }),
|
|
74
74
|
React.createElement(Icon, { className: "vui-checkboxIcon", h: "100%", name: icon, w: "100%" })),
|
|
75
75
|
children ??
|
|
76
76
|
(label && (React.createElement(T, { className: "vui-checkboxLabel", lineHeight: "normal", ...styles.label }, label)))));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"footer.d.ts","sourceRoot":"","sources":["../../../src/footer/footer.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAwC,YAAY,EAAE,MAAM,SAAS,CAAA;AAM5E,OAAO,EAAkB,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5D,OAAO,YAAY,MAAM,gBAAgB,CAAA;AACzC,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,UAAU,MAAM,cAAc,CAAA;AACrC,OAAO,SAAS,MAAM,aAAa,CAAA;AACnC,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAK3C,eAAO,MAAM,UAAU,+HAItB,CAAA;AAGD,oGAAoG;AACpG,eAAO,MAAM,MAAM;
|
|
1
|
+
{"version":3,"file":"footer.d.ts","sourceRoot":"","sources":["../../../src/footer/footer.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAwC,YAAY,EAAE,MAAM,SAAS,CAAA;AAM5E,OAAO,EAAkB,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5D,OAAO,YAAY,MAAM,gBAAgB,CAAA;AACzC,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,UAAU,MAAM,cAAc,CAAA;AACrC,OAAO,SAAS,MAAM,aAAa,CAAA;AACnC,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAK3C,eAAO,MAAM,UAAU,+HAItB,CAAA;AAGD,oGAAoG;AACpG,eAAO,MAAM,MAAM;YAwKT,mBAAmB;aAClB,oBAAoB;aACpB,oBAAoB;UACvB,iBAAiB;SAClB,gBAAgB;aACZ,oBAAoB;CAC9B,CAAA;AASD,eAAe,MAAM,CAAA"}
|
|
@@ -52,7 +52,7 @@ export const Footer = vui((props, ref) => {
|
|
|
52
52
|
const downMd = useDown('md');
|
|
53
53
|
const downLg = useDown('lg');
|
|
54
54
|
return (React.createElement(FooterProvider, { value: context },
|
|
55
|
-
React.createElement(FooterBase, { className: cs('vui-footer', isApplication ? 'vui-footer-app' : '', className), px: isApplication ? '40px' : 3, py: isSlim ? (downMd ? '16px' : '9px') : 5, ...styles.container, ref: ref, ...rest },
|
|
55
|
+
React.createElement(FooterBase, { className: cs('vui-footer', isApplication ? 'vui-footer-app' : '', className), px: isApplication ? '40px' : 3, py: isSlim ? (downMd ? '16px' : '9px') : 5, role: "contentinfo", ...styles.container, ref: ref, ...rest },
|
|
56
56
|
isApplication && (React.createElement(FooterContent, { alignContent: "center", alignItems: "center", maxW: "100%" },
|
|
57
57
|
React.createElement(FooterRow, { alignContent: "space-between", w: 1 },
|
|
58
58
|
React.createElement(Box, { alignItems: "self-start", columnGap: 3, flex: { xs: '0 0 100%', sm: '0 0 100%', md: '0 0 100%', lg: '0 0 50%' }, py: { xs: 1, sm: 1, md: 1.25, lg: 1.5 }, wrap: true }, applicationLinks?.map((link, index) => (React.createElement(Box, { flex: { xs: '0 0 50%', sm: '0 0 auto' }, key: index, minW: 70 },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"header.d.ts","sourceRoot":"","sources":["../../../src/header/header.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAgD,YAAY,EAAE,MAAM,SAAS,CAAA;AAGpF,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,qBAAqB,MAAM,yBAAyB,CAAA;AAC3D,OAAO,qBAAqB,MAAM,yBAAyB,CAAA;AAC3D,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,mBAAmB,MAAM,uBAAuB,CAAA;AACvD,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,cAAc,MAAM,kBAAkB,CAAA;AAC7C,OAAO,UAAU,MAAM,cAAc,CAAA;AACrC,OAAO,eAAe,MAAM,mBAAmB,CAAA;AAC/C,OAAO,mBAAmB,MAAM,uBAAuB,CAAA;AACvD,OAAO,kBAAkB,MAAM,sBAAsB,CAAA;AACrD,OAAO,mBAAmB,MAAM,uBAAuB,CAAA;AACvD,OAAO,cAAc,MAAM,kBAAkB,CAAA;AAC7C,OAAO,qBAAqB,MAAM,yBAAyB,CAAA;AAC3D,OAAO,YAAY,MAAM,gBAAgB,CAAA;AACzC,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAG3C,eAAO,MAAM,UAAU,kIAMtB,CAAA;AAGD,qHAAqH;AACrH,eAAO,MAAM,MAAM;
|
|
1
|
+
{"version":3,"file":"header.d.ts","sourceRoot":"","sources":["../../../src/header/header.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAgD,YAAY,EAAE,MAAM,SAAS,CAAA;AAGpF,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,qBAAqB,MAAM,yBAAyB,CAAA;AAC3D,OAAO,qBAAqB,MAAM,yBAAyB,CAAA;AAC3D,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,mBAAmB,MAAM,uBAAuB,CAAA;AACvD,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,cAAc,MAAM,kBAAkB,CAAA;AAC7C,OAAO,UAAU,MAAM,cAAc,CAAA;AACrC,OAAO,eAAe,MAAM,mBAAmB,CAAA;AAC/C,OAAO,mBAAmB,MAAM,uBAAuB,CAAA;AACvD,OAAO,kBAAkB,MAAM,sBAAsB,CAAA;AACrD,OAAO,mBAAmB,MAAM,uBAAuB,CAAA;AACvD,OAAO,cAAc,MAAM,kBAAkB,CAAA;AAC7C,OAAO,qBAAqB,MAAM,yBAAyB,CAAA;AAC3D,OAAO,YAAY,MAAM,gBAAgB,CAAA;AACzC,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAG3C,eAAO,MAAM,UAAU,kIAMtB,CAAA;AAGD,qHAAqH;AACrH,eAAO,MAAM,MAAM;aA6CR,oBAAoB;qBACZ,4BAA4B;aACpC,oBAAoB;qBACZ,4BAA4B;aACpC,oBAAoB;mBACd,0BAA0B;aAChC,oBAAoB;cACnB,qBAAqB;UACzB,iBAAiB;eACZ,sBAAsB;mBAClB,0BAA0B;kBAC3B,yBAAyB;mBACxB,0BAA0B;cAC/B,qBAAqB;qBACd,4BAA4B;YACrC,mBAAmB;CAC5B,CAAA;AAmBD,eAAe,MAAM,CAAA"}
|
|
@@ -54,7 +54,7 @@ export const Header = vui((props, ref) => {
|
|
|
54
54
|
variant
|
|
55
55
|
};
|
|
56
56
|
return (React.createElement(HeaderProvider, { value: context },
|
|
57
|
-
React.createElement(HeaderBase, { className: cs('vui-header', className), h: headerHeight, px: { xs: 2, lg: 5 }, ref: ref, ...styles.container, ...rest })));
|
|
57
|
+
React.createElement(HeaderBase, { className: cs('vui-header', className), h: headerHeight, px: { xs: 2, lg: 5 }, ref: ref, role: "banner", ...styles.container, ...rest })));
|
|
58
58
|
});
|
|
59
59
|
Header.Account = HeaderAccount;
|
|
60
60
|
Header.AccountUserInfo = HeaderAccountUserInfo;
|
package/dist/esm/image/image.js
CHANGED
|
@@ -10,6 +10,6 @@ export const ImageBase = styled.imgBox `
|
|
|
10
10
|
export const Image = vui((props, ref) => {
|
|
11
11
|
const { className, ...rest } = omitThemingProps(props);
|
|
12
12
|
const styles = useStyleConfig('Image', props);
|
|
13
|
-
return React.createElement(ImageBase, { className: cs('vui-image', className), ref: ref, ...styles, ...rest });
|
|
13
|
+
return React.createElement(ImageBase, { alt: "VUI image", className: cs('vui-image', className), ref: ref, ...styles, ...rest });
|
|
14
14
|
});
|
|
15
15
|
export default Image;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"inputInput.d.ts","sourceRoot":"","sources":["../../../src/input/inputInput.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AAE/C,eAAO,MAAM,cAAc,2GAe1B,CAAA;AAED,4DAA4D;AAC5D,eAAO,MAAM,UAAU,
|
|
1
|
+
{"version":3,"file":"inputInput.d.ts","sourceRoot":"","sources":["../../../src/input/inputInput.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AAE/C,eAAO,MAAM,cAAc,2GAe1B,CAAA;AAED,4DAA4D;AAC5D,eAAO,MAAM,UAAU,0DAqBrB,CAAA;AAEF,eAAe,UAAU,CAAA"}
|
|
@@ -27,6 +27,6 @@ export const InputInput = vui((props, ref) => {
|
|
|
27
27
|
const aliasedProps = filterUndefined({
|
|
28
28
|
'aria-disabled': mergedProps.disabled
|
|
29
29
|
});
|
|
30
|
-
return (React.createElement(InputInputBase, { autoComplete: "false", className: cs('vui-inputInput', className), ref: ref, ...styles.input, ...aliasedProps, ...rest }));
|
|
30
|
+
return (React.createElement(InputInputBase, { "aria-label": "input-text", autoComplete: "false", className: cs('vui-inputInput', className), ref: ref, ...styles.input, ...aliasedProps, ...rest }));
|
|
31
31
|
});
|
|
32
32
|
export default InputInput;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"notification.d.ts","sourceRoot":"","sources":["../../../src/notification/notification.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAuB,YAAY,EAAE,MAAM,SAAS,CAAA;AAI3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAA;AACxD,OAAO,kBAAkB,MAAM,sBAAsB,CAAA;AACrD,OAAO,gBAAgB,MAAM,oBAAoB,CAAA;AACjD,OAAO,gBAAgB,MAAM,oBAAoB,CAAA;AACjD,OAAO,iBAAiB,MAAM,qBAAqB,CAAA;AAEnD;;;GAGG;AACH,eAAO,MAAM,YAAY;
|
|
1
|
+
{"version":3,"file":"notification.d.ts","sourceRoot":"","sources":["../../../src/notification/notification.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAuB,YAAY,EAAE,MAAM,SAAS,CAAA;AAI3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAA;AACxD,OAAO,kBAAkB,MAAM,sBAAsB,CAAA;AACrD,OAAO,gBAAgB,MAAM,oBAAoB,CAAA;AACjD,OAAO,gBAAgB,MAAM,oBAAoB,CAAA;AACjD,OAAO,iBAAiB,MAAM,qBAAqB,CAAA;AAEnD;;;GAGG;AACH,eAAO,MAAM,YAAY;YAyDf,yBAAyB;UAC3B,uBAAuB;UACvB,uBAAuB;WACtB,wBAAwB;CAChC,CAAA;AAOD,eAAe,YAAY,CAAA"}
|
|
@@ -22,7 +22,7 @@ export const Notification = vui((props, ref) => {
|
|
|
22
22
|
const titleDisplay = action ? 'block' : 'inline-flex';
|
|
23
23
|
const alignSelf = verticalAlign === 'center' ? 'center' : 'flex-start';
|
|
24
24
|
return (React.createElement(NotificationProvider, { value: context },
|
|
25
|
-
React.createElement(Box, { borderRadius: "md", borderWidth: 1, className: cs('vui-notification', className), ref: ref, w: "fit-content", ...styles.container, ...rest },
|
|
25
|
+
React.createElement(Box, { borderRadius: "md", borderWidth: 1, className: cs('vui-notification', className), ref: ref, role: "mark", w: "fit-content", ...styles.container, ...rest },
|
|
26
26
|
iconName ? React.createElement(NotificationIcon, { alignSelf: alignSelf, name: iconName }) : icon,
|
|
27
27
|
children ?? (React.createElement(NotificationText, { alignSelf: alignSelf },
|
|
28
28
|
isReactText(title) ? React.createElement(NotificationTitle, { display: titleDisplay, text: title }) : title,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"radio.d.ts","sourceRoot":"","sources":["../../../src/radio/radio.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AAuB3D,eAAO,MAAM,SAAS,olJAkBrB,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,KAAK,
|
|
1
|
+
{"version":3,"file":"radio.d.ts","sourceRoot":"","sources":["../../../src/radio/radio.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AAuB3D,eAAO,MAAM,SAAS,olJAkBrB,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,KAAK,oDA4FhB,CAAA;AAEF,eAAe,KAAK,CAAA"}
|
package/dist/esm/radio/radio.js
CHANGED
|
@@ -76,7 +76,7 @@ export const Radio = vui((props, ref) => {
|
|
|
76
76
|
});
|
|
77
77
|
return (React.createElement(RadioBase, { className: cs('vui-radio', className), controlHoverColor: controlHoverColor, ref: ref, ...styles.container, ...aliasedProps, ...rest },
|
|
78
78
|
React.createElement(RadioControl, { bg: "white", className: "vui-radioControl", color: color, focusWithinRing: 3, mr: controlMr, ...controlStyles },
|
|
79
|
-
React.createElement(RadioInput, { className: "vui-radioInput", onChange: handleOnChange, ref: inputRef, type: "radio", ...{ checked, defaultChecked, disabled, id, name, required, value }, ...inputProps }),
|
|
79
|
+
React.createElement(RadioInput, { "aria-label": "input-radio", className: "vui-radioInput", onChange: handleOnChange, ref: inputRef, type: "radio", ...{ checked, defaultChecked, disabled, id, name, required, value }, ...inputProps }),
|
|
80
80
|
React.createElement(Icon, { className: "vui-radioIcon", h: "100%", name: icon, w: "100%" })),
|
|
81
81
|
children ??
|
|
82
82
|
(label && (React.createElement(T, { className: "vui-radioLabel", lineHeight: "normal", ...styles.label }, label)))));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"th.d.ts","sourceRoot":"","sources":["../../../src/table/th.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"th.d.ts","sourceRoot":"","sources":["../../../src/table/th.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AAGvC,eAAO,MAAM,MAAM,8HAIlB,CAAA;AAED,oDAAoD;AACpD,eAAO,MAAM,EAAE,+CA+Db,CAAA;AAEF,eAAe,EAAE,CAAA"}
|
package/dist/esm/table/th.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import Box from '../box';
|
|
3
3
|
import { styled, useStyleConfig, vui } from '../core';
|
|
4
|
+
import { T } from '../t';
|
|
4
5
|
import { cs, useCallbackRef } from '../utils';
|
|
5
6
|
import { useTableContext } from './context';
|
|
6
7
|
import TableSortIcon from './tableSortIcon';
|
|
@@ -34,8 +35,10 @@ export const Th = vui((props, ref) => {
|
|
|
34
35
|
userSelect: 'none'
|
|
35
36
|
}
|
|
36
37
|
: {};
|
|
37
|
-
return (React.createElement(ThBase, { className: cs('vui-th', className), "data-active": isActive, "data-disabled": disabled, hoverBg: hoverBg, px: 2, ref: ref, ...styles.th, ...activeProps, ...disabledProps, ...interactiveProps, ...rest },
|
|
38
|
-
|
|
39
|
-
|
|
38
|
+
return (React.createElement(ThBase, { className: cs('vui-th', className), "data-active": isActive, "data-disabled": disabled, hoverBg: hoverBg, px: 2, ref: ref, ...styles.th, ...activeProps, ...disabledProps, ...interactiveProps, ...rest },
|
|
39
|
+
children ?? (React.createElement(Box, { centerV: true, display: "inline-flex" },
|
|
40
|
+
title,
|
|
41
|
+
isSortable && React.createElement(TableSortIcon, { ml: 1, my: 0.5, order: sortOrder }))),
|
|
42
|
+
!title && React.createElement(T, { color: "white" }, "a11y fix")));
|
|
40
43
|
});
|
|
41
44
|
export default Th;
|
package/dist/esm/table/thead.js
CHANGED
|
@@ -24,6 +24,6 @@ export const Thead = vui((props, ref) => {
|
|
|
24
24
|
zIndex: 3
|
|
25
25
|
}
|
|
26
26
|
: {};
|
|
27
|
-
return (React.createElement(TheadBase, { className: cs('vui-thead', className), ref: ref, ...stickyProps, ...styles.thead, ...rest }, children ?? (React.createElement(Tr, null, columns?.map(column => (React.createElement(Th, { key: column.field, ...column })))))));
|
|
27
|
+
return (React.createElement(TheadBase, { className: cs('vui-thead', className), ref: ref, ...stickyProps, ...styles.thead, ...rest }, children ?? (React.createElement(Tr, null, columns?.map(column => (React.createElement(Th, { key: column.field, role: "columnheader", ...column })))))));
|
|
28
28
|
});
|
|
29
29
|
export default Thead;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../../../src/textarea/textarea.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAkBhD,eAAO,MAAM,YAAY,+HAKxB,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,QAAQ,
|
|
1
|
+
{"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../../../src/textarea/textarea.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAkBhD,eAAO,MAAM,YAAY,+HAKxB,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,QAAQ,sDAgGnB,CAAA;AAEF,eAAe,QAAQ,CAAA"}
|
|
@@ -53,7 +53,7 @@ export const Textarea = vui((props, ref) => {
|
|
|
53
53
|
setCount(`${value}`?.length ? `${value}`.length : 0);
|
|
54
54
|
}, [value]);
|
|
55
55
|
return (React.createElement(TextareaBase, { className: cs('vui-textarea', className), ref: ref, ...styles.container, ...aliasedProps, ...rest },
|
|
56
|
-
React.createElement(TextareaTextarea, { className: "vui-textareaTextarea", ref: textareaRef, ...{
|
|
56
|
+
React.createElement(TextareaTextarea, { "aria-label": "input-textarea", className: "vui-textareaTextarea", ref: textareaRef, ...{
|
|
57
57
|
autoFocus,
|
|
58
58
|
cols,
|
|
59
59
|
defaultValue,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@veracity/vui",
|
|
3
|
-
"version": "2.8.
|
|
3
|
+
"version": "2.8.4-rc.0",
|
|
4
4
|
"description": "Veracity UI is a React component library crafted for use within Veracity applications and pages. Based on Styled Components and @xstyled.",
|
|
5
5
|
"module": "./dist/esm/index.js",
|
|
6
6
|
"main": "./dist/cjs/index.js",
|
package/src/button/button.tsx
CHANGED
|
@@ -37,10 +37,6 @@ export const ButtonBase = styled.buttonBox<ButtonProps>`
|
|
|
37
37
|
width: fit-content;
|
|
38
38
|
`
|
|
39
39
|
|
|
40
|
-
const ariaProps = {
|
|
41
|
-
'aria-label': 'button'
|
|
42
|
-
}
|
|
43
|
-
|
|
44
40
|
/**
|
|
45
41
|
* Triggers given actions on click. Supports multiple states, sizes and variants.
|
|
46
42
|
*
|
|
@@ -65,7 +61,7 @@ export const Button = vui<'button', ButtonProps>((props, ref) => {
|
|
|
65
61
|
isDropDown,
|
|
66
62
|
isElevated,
|
|
67
63
|
isFullWidth,
|
|
68
|
-
|
|
64
|
+
isLoading, // eslint-disable-line
|
|
69
65
|
isRound,
|
|
70
66
|
isSplit,
|
|
71
67
|
isTruncated,
|
|
@@ -73,6 +69,7 @@ export const Button = vui<'button', ButtonProps>((props, ref) => {
|
|
|
73
69
|
state = props.isLoading ? 'loading' : '',
|
|
74
70
|
stateMapping,
|
|
75
71
|
text,
|
|
72
|
+
title,
|
|
76
73
|
variant: variantProp,
|
|
77
74
|
...rest
|
|
78
75
|
} = mergedProps
|
|
@@ -126,6 +123,7 @@ export const Button = vui<'button', ButtonProps>((props, ref) => {
|
|
|
126
123
|
return (
|
|
127
124
|
<ButtonProvider value={context}>
|
|
128
125
|
<ButtonBase
|
|
126
|
+
aria-label={title ? undefined : 'button'}
|
|
129
127
|
borderWidth={border}
|
|
130
128
|
className={cs('vui-button', className, isActive && activeClassName)}
|
|
131
129
|
disabled={disabled}
|
|
@@ -134,9 +132,9 @@ export const Button = vui<'button', ButtonProps>((props, ref) => {
|
|
|
134
132
|
pl={pl}
|
|
135
133
|
pr={isDropDown ? 0 : pr}
|
|
136
134
|
ref={ref}
|
|
135
|
+
title={title}
|
|
137
136
|
type="button"
|
|
138
137
|
variant={variant}
|
|
139
|
-
{...ariaProps}
|
|
140
138
|
{...buttonStyles}
|
|
141
139
|
{...disabledProps}
|
|
142
140
|
{...aliasedProps}
|
|
@@ -114,9 +114,11 @@ export const Checkbox = vui<'span', CheckboxProps>((props, ref) => {
|
|
|
114
114
|
color={color}
|
|
115
115
|
focusWithinRing={3}
|
|
116
116
|
mr={controlMr}
|
|
117
|
+
role="none"
|
|
117
118
|
{...controlStyles}
|
|
118
119
|
>
|
|
119
120
|
<CheckboxInput
|
|
121
|
+
aria-label={label ? label : 'input-checkbox'}
|
|
120
122
|
className="vui-checkboxInput"
|
|
121
123
|
onChange={handleOnChange}
|
|
122
124
|
ref={inputRef}
|
package/src/footer/footer.tsx
CHANGED
|
@@ -80,6 +80,7 @@ export const Footer = vui<'div', FooterProps>((props, ref) => {
|
|
|
80
80
|
className={cs('vui-footer', isApplication ? 'vui-footer-app' : '', className)}
|
|
81
81
|
px={isApplication ? '40px' : 3}
|
|
82
82
|
py={isSlim ? (downMd ? '16px' : '9px') : 5}
|
|
83
|
+
role="contentinfo"
|
|
83
84
|
{...styles.container}
|
|
84
85
|
ref={ref}
|
|
85
86
|
{...rest}
|
package/src/header/header.tsx
CHANGED
package/src/image/image.tsx
CHANGED
|
@@ -15,7 +15,7 @@ export const Image = vui<'img', ImageProps>((props, ref) => {
|
|
|
15
15
|
const { className, ...rest } = omitThemingProps(props)
|
|
16
16
|
const styles = useStyleConfig('Image', props)
|
|
17
17
|
|
|
18
|
-
return <ImageBase className={cs('vui-image', className)} ref={ref} {...styles} {...rest} />
|
|
18
|
+
return <ImageBase alt="VUI image" className={cs('vui-image', className)} ref={ref} {...styles} {...rest} />
|
|
19
19
|
})
|
|
20
20
|
|
|
21
21
|
export default Image
|
package/src/input/inputInput.tsx
CHANGED
package/src/radio/radio.tsx
CHANGED
package/src/table/th.tsx
CHANGED
|
@@ -2,6 +2,7 @@ import React from 'react'
|
|
|
2
2
|
|
|
3
3
|
import Box from '../box'
|
|
4
4
|
import { styled, useStyleConfig, vui } from '../core'
|
|
5
|
+
import { T } from '../t'
|
|
5
6
|
import { cs, MouseEvent, useCallbackRef } from '../utils'
|
|
6
7
|
import { useTableContext } from './context'
|
|
7
8
|
import { ThProps } from './table.types'
|
|
@@ -74,6 +75,7 @@ export const Th = vui<'th', ThProps>((props, ref) => {
|
|
|
74
75
|
{isSortable && <TableSortIcon ml={1} my={0.5} order={sortOrder} />}
|
|
75
76
|
</Box>
|
|
76
77
|
)}
|
|
78
|
+
{!title && <T color="white">a11y fix</T>}
|
|
77
79
|
</ThBase>
|
|
78
80
|
)
|
|
79
81
|
})
|
package/src/table/thead.tsx
CHANGED
|
@@ -90,6 +90,7 @@ export const Textarea = vui<'div', TextareaProps>((props, ref) => {
|
|
|
90
90
|
return (
|
|
91
91
|
<TextareaBase className={cs('vui-textarea', className)} ref={ref} {...styles.container} {...aliasedProps} {...rest}>
|
|
92
92
|
<TextareaTextarea
|
|
93
|
+
aria-label="input-textarea"
|
|
93
94
|
className="vui-textareaTextarea"
|
|
94
95
|
ref={textareaRef}
|
|
95
96
|
{...{
|