carbon-react 105.1.0 → 105.2.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/esm/__internal__/tooltip-provider/index.d.ts +19 -24
- package/esm/__internal__/tooltip-provider/index.js +0 -10
- package/esm/__spec_helper__/mock-match-media.d.ts +3 -1
- package/esm/components/app-wrapper/app-wrapper.component.d.ts +4 -0
- package/esm/components/badge/badge.style.d.ts +4 -2
- package/esm/components/button/button-types.style.d.ts +1 -2
- package/esm/components/button/button-types.style.js +3 -1
- package/esm/components/button/button.component.d.ts +67 -36
- package/esm/components/button/button.component.js +3314 -165
- package/esm/components/button/button.config.d.ts +4 -3
- package/esm/components/button/button.style.d.ts +6 -8
- package/esm/components/button/button.style.js +51 -95
- package/esm/components/button/index.d.ts +2 -2
- package/esm/components/duelling-picklist/picklist-group/picklist-group.style.d.ts +1 -2
- package/esm/components/duelling-picklist/picklist-item/picklist-item.style.d.ts +1 -2
- package/esm/components/flat-table/flat-table-body-draggable/flat-table-body-draggable.component.js +10 -3
- package/esm/components/flat-table/flat-table-body-draggable/flat-table-body-draggable.style.d.ts +2 -0
- package/esm/components/flat-table/flat-table-body-draggable/flat-table-body-draggable.style.js +9 -0
- package/esm/components/flat-table/flat-table-row/flat-table-row.style.js +0 -1
- package/esm/components/heading/heading.component.d.ts +5 -0
- package/esm/components/icon/index.d.ts +1 -0
- package/esm/components/multi-action-button/multi-action-button.component.d.ts +3 -1
- package/esm/components/multi-action-button/multi-action-button.component.js +7 -5
- package/esm/components/multi-action-button/multi-action-button.d.ts +4 -2
- package/esm/components/multi-step-wizard/multi-step-wizard.d.ts +22 -0
- package/esm/components/multi-step-wizard/step/step.d.ts +6 -0
- package/esm/components/multi-step-wizard/step/step.style.d.ts +4 -2
- package/esm/components/radio-button/radio-button-svg.component.js +29 -16
- package/esm/components/scrollable-list/scrollable-list.component.d.ts +8 -0
- package/esm/components/select/option/index.d.ts +1 -1
- package/esm/components/split-button/split-button-toggle.style.d.ts +2 -6
- package/esm/components/split-button/split-button.component.d.ts +3 -1
- package/esm/components/split-button/split-button.component.js +7 -4
- package/esm/components/split-button/split-button.d.ts +5 -2
- package/esm/components/tooltip/index.d.ts +2 -1
- package/esm/components/tooltip/tooltip-pointer.style.d.ts +10 -1
- package/esm/components/tooltip/tooltip-pointer.style.js +5 -12
- package/esm/components/tooltip/tooltip.component.d.ts +33 -2
- package/esm/components/tooltip/tooltip.component.js +255 -110
- package/esm/components/tooltip/tooltip.config.d.ts +2 -1
- package/esm/components/tooltip/tooltip.style.d.ts +7 -2
- package/esm/components/tooltip/tooltip.style.js +7 -21
- package/esm/components/typography/typography.component.d.ts +1 -1
- package/esm/hooks/__internal__/useCharacterCount/index.d.ts +1 -2
- package/esm/hooks/__internal__/useCharacterCount/index.js +1 -18
- package/esm/hooks/__internal__/useCharacterCount/useCharacterCount.d.ts +3 -0
- package/esm/hooks/__internal__/useCharacterCount/useCharacterCount.js +24 -0
- package/esm/hooks/__internal__/useInputAccessibility/index.d.ts +1 -24
- package/esm/hooks/__internal__/useInputAccessibility/useInputAccessibility.d.ts +11 -11
- package/esm/hooks/__internal__/useInputAccessibility/useInputAccessibility.js +1 -3
- package/esm/hooks/__internal__/useIsAboveBreakpoint/index.d.ts +1 -1
- package/esm/hooks/__internal__/useIsAboveBreakpoint/index.js +1 -6
- package/esm/hooks/__internal__/useIsAboveBreakpoint/useIsAboveBreakpoint.d.ts +1 -0
- package/esm/hooks/__internal__/useIsAboveBreakpoint/useIsAboveBreakpoint.js +6 -0
- package/esm/hooks/__internal__/useLocale/index.d.ts +1 -1
- package/esm/hooks/__internal__/useLocale/index.js +1 -5
- package/esm/hooks/__internal__/useLocale/useLocale.d.ts +1 -0
- package/esm/hooks/__internal__/useLocale/useLocale.js +5 -0
- package/esm/hooks/__internal__/useResizeObserver/index.d.ts +1 -10
- package/esm/hooks/__internal__/useResizeObserver/index.js +1 -23
- package/esm/hooks/__internal__/useResizeObserver/useResizeObserver.d.ts +8 -0
- package/esm/hooks/__internal__/useResizeObserver/useResizeObserver.js +29 -0
- package/esm/hooks/__internal__/useScrollBlock/index.d.ts +1 -4
- package/esm/hooks/__internal__/useScrollBlock/scroll-block-manager.d.ts +23 -9
- package/esm/hooks/__internal__/useScrollBlock/scroll-block-manager.js +24 -12
- package/esm/hooks/__internal__/useScrollBlock/useScrollBlock.d.ts +2 -2
- package/esm/hooks/__internal__/useScrollBlock/useScrollBlock.js +3 -5
- package/esm/hooks/useMediaQuery/index.d.ts +1 -1
- package/esm/hooks/useMediaQuery/index.js +1 -19
- package/esm/hooks/useMediaQuery/useMediaQuery.d.ts +1 -0
- package/esm/hooks/useMediaQuery/useMediaQuery.js +19 -0
- package/esm/locales/en-gb.d.ts +3 -5
- package/esm/locales/en-gb.js +5 -4
- package/esm/locales/index.d.ts +1 -1
- package/esm/locales/index.js +2 -0
- package/esm/locales/locale.d.ts +99 -105
- package/esm/locales/locale.js +1 -0
- package/esm/locales/pl-pl.d.ts +3 -5
- package/esm/locales/pl-pl.js +5 -4
- package/lib/__internal__/tooltip-provider/index.d.ts +19 -24
- package/lib/__internal__/tooltip-provider/index.js +1 -12
- package/lib/__spec_helper__/mock-match-media.d.ts +3 -1
- package/lib/components/app-wrapper/app-wrapper.component.d.ts +4 -0
- package/lib/components/badge/badge.style.d.ts +4 -2
- package/lib/components/button/button-types.style.d.ts +1 -2
- package/lib/components/button/button-types.style.js +0 -1
- package/lib/components/button/button.component.d.ts +67 -36
- package/lib/components/button/button.component.js +3381 -172
- package/lib/components/button/button.config.d.ts +4 -3
- package/lib/components/button/button.style.d.ts +6 -8
- package/lib/components/button/button.style.js +52 -101
- package/lib/components/button/index.d.ts +2 -2
- package/lib/components/duelling-picklist/picklist-group/picklist-group.style.d.ts +1 -2
- package/lib/components/duelling-picklist/picklist-item/picklist-item.style.d.ts +1 -2
- package/lib/components/flat-table/flat-table-body-draggable/flat-table-body-draggable.component.js +10 -3
- package/lib/components/flat-table/flat-table-body-draggable/flat-table-body-draggable.style.d.ts +2 -0
- package/lib/components/flat-table/flat-table-body-draggable/flat-table-body-draggable.style.js +22 -0
- package/lib/components/flat-table/flat-table-row/flat-table-row.style.js +0 -1
- package/lib/components/heading/heading.component.d.ts +5 -0
- package/lib/components/icon/index.d.ts +1 -0
- package/lib/components/multi-action-button/multi-action-button.component.d.ts +3 -1
- package/lib/components/multi-action-button/multi-action-button.component.js +6 -4
- package/lib/components/multi-action-button/multi-action-button.d.ts +4 -2
- package/lib/components/multi-step-wizard/multi-step-wizard.d.ts +22 -0
- package/lib/components/multi-step-wizard/step/step.d.ts +6 -0
- package/lib/components/multi-step-wizard/step/step.style.d.ts +4 -2
- package/lib/components/radio-button/radio-button-svg.component.js +38 -20
- package/lib/components/scrollable-list/scrollable-list.component.d.ts +8 -0
- package/lib/components/select/option/index.d.ts +1 -1
- package/lib/components/split-button/split-button-toggle.style.d.ts +2 -6
- package/lib/components/split-button/split-button.component.d.ts +3 -1
- package/lib/components/split-button/split-button.component.js +6 -3
- package/lib/components/split-button/split-button.d.ts +5 -2
- package/lib/components/tooltip/index.d.ts +2 -1
- package/lib/components/tooltip/tooltip-pointer.style.d.ts +10 -1
- package/lib/components/tooltip/tooltip-pointer.style.js +7 -15
- package/lib/components/tooltip/tooltip.component.d.ts +33 -2
- package/lib/components/tooltip/tooltip.component.js +221 -130
- package/lib/components/tooltip/tooltip.config.d.ts +2 -1
- package/lib/components/tooltip/tooltip.style.d.ts +7 -2
- package/lib/components/tooltip/tooltip.style.js +7 -22
- package/lib/components/typography/typography.component.d.ts +1 -1
- package/lib/components/vertical-divider/vertical-divider.component.js +3 -0
- package/lib/hooks/__internal__/useCharacterCount/index.d.ts +1 -2
- package/lib/hooks/__internal__/useCharacterCount/index.js +8 -27
- package/lib/hooks/__internal__/useCharacterCount/useCharacterCount.d.ts +3 -0
- package/lib/hooks/__internal__/useCharacterCount/useCharacterCount.js +40 -0
- package/lib/hooks/__internal__/useInputAccessibility/index.d.ts +1 -24
- package/lib/hooks/__internal__/useInputAccessibility/useInputAccessibility.d.ts +11 -11
- package/lib/hooks/__internal__/useInputAccessibility/useInputAccessibility.js +1 -3
- package/lib/hooks/__internal__/useIsAboveBreakpoint/index.d.ts +1 -1
- package/lib/hooks/__internal__/useIsAboveBreakpoint/index.js +8 -9
- package/lib/hooks/__internal__/useIsAboveBreakpoint/useIsAboveBreakpoint.d.ts +1 -0
- package/lib/hooks/__internal__/useIsAboveBreakpoint/useIsAboveBreakpoint.js +16 -0
- package/lib/hooks/__internal__/useLocale/index.d.ts +1 -1
- package/lib/hooks/__internal__/useLocale/index.js +8 -9
- package/lib/hooks/__internal__/useLocale/useLocale.d.ts +1 -0
- package/lib/hooks/__internal__/useLocale/useLocale.js +16 -0
- package/lib/hooks/__internal__/useResizeObserver/index.d.ts +1 -10
- package/lib/hooks/__internal__/useResizeObserver/index.js +8 -24
- package/lib/hooks/__internal__/useResizeObserver/useResizeObserver.d.ts +8 -0
- package/lib/hooks/__internal__/useResizeObserver/useResizeObserver.js +37 -0
- package/lib/hooks/__internal__/useScrollBlock/index.d.ts +1 -4
- package/lib/hooks/__internal__/useScrollBlock/scroll-block-manager.d.ts +23 -9
- package/lib/hooks/__internal__/useScrollBlock/scroll-block-manager.js +24 -12
- package/lib/hooks/__internal__/useScrollBlock/useScrollBlock.d.ts +2 -2
- package/lib/hooks/__internal__/useScrollBlock/useScrollBlock.js +3 -5
- package/lib/hooks/useMediaQuery/index.d.ts +1 -1
- package/lib/hooks/useMediaQuery/index.js +8 -25
- package/lib/hooks/useMediaQuery/useMediaQuery.d.ts +1 -0
- package/lib/hooks/useMediaQuery/useMediaQuery.js +32 -0
- package/lib/locales/en-gb.d.ts +3 -5
- package/lib/locales/en-gb.js +2 -1
- package/lib/locales/index.d.ts +1 -1
- package/lib/locales/index.js +23 -0
- package/lib/locales/locale.d.ts +99 -105
- package/lib/locales/locale.js +5 -0
- package/lib/locales/package.json +6 -0
- package/lib/locales/pl-pl.d.ts +3 -5
- package/lib/locales/pl-pl.js +2 -1
- package/package.json +11 -6
- package/esm/components/button/button.d.ts +0 -85
- package/esm/components/tooltip/tooltip.d.ts +0 -40
- package/lib/components/button/button.d.ts +0 -85
- package/lib/components/tooltip/tooltip.d.ts +0 -40
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
9
|
+
|
|
10
|
+
var _characterCount = _interopRequireDefault(require("../../../__internal__/character-count"));
|
|
11
|
+
|
|
12
|
+
var _useLocale = _interopRequireDefault(require("../useLocale"));
|
|
13
|
+
|
|
14
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
+
|
|
16
|
+
function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
|
|
17
|
+
|
|
18
|
+
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
19
|
+
|
|
20
|
+
const getFormatNumber = (value, locale) => new Intl.NumberFormat(locale).format(value);
|
|
21
|
+
|
|
22
|
+
const useCharacterCount = (value, characterLimit, warnOverLimit = false, enforceCharacterLimit = true) => {
|
|
23
|
+
const l = (0, _useLocale.default)();
|
|
24
|
+
const isOverLimit = (0, _react.useMemo)(() => {
|
|
25
|
+
if (value && characterLimit) {
|
|
26
|
+
return value.length > parseInt(characterLimit, 10);
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
return false;
|
|
30
|
+
}, [value, characterLimit]);
|
|
31
|
+
return [enforceCharacterLimit && characterLimit ? characterLimit : undefined, characterLimit ? /*#__PURE__*/_react.default.createElement(_characterCount.default, {
|
|
32
|
+
isOverLimit: isOverLimit && warnOverLimit,
|
|
33
|
+
value: getFormatNumber(value.length, l.locale()),
|
|
34
|
+
limit: getFormatNumber(+characterLimit, l.locale()),
|
|
35
|
+
"data-element": "character-limit"
|
|
36
|
+
}) : null];
|
|
37
|
+
};
|
|
38
|
+
|
|
39
|
+
var _default = useCharacterCount;
|
|
40
|
+
exports.default = _default;
|
|
@@ -1,24 +1 @@
|
|
|
1
|
-
|
|
2
|
-
labelId?: string;
|
|
3
|
-
tooltipId?: string;
|
|
4
|
-
fieldHelpId?: string;
|
|
5
|
-
ariaDescribedBy?: string;
|
|
6
|
-
ariaLabelledBy?: string;
|
|
7
|
-
}
|
|
8
|
-
|
|
9
|
-
export default function useInputAccessibility(
|
|
10
|
-
/** Input id - */
|
|
11
|
-
id: string,
|
|
12
|
-
/** Error validation message */
|
|
13
|
-
error?: string,
|
|
14
|
-
/** Warning validation message */
|
|
15
|
-
warning?: string,
|
|
16
|
-
/** Info validation message */
|
|
17
|
-
info?: string,
|
|
18
|
-
/** Label */
|
|
19
|
-
label?: string,
|
|
20
|
-
/** labelHelp message */
|
|
21
|
-
labelHelp?: string,
|
|
22
|
-
/** fieldHelp message */
|
|
23
|
-
fieldHelp?: string
|
|
24
|
-
): void;
|
|
1
|
+
export { default } from "./useInputAccessibility";
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
export default function useInputAccessibility({ id, error, warning, info, label, fieldHelp, }: {
|
|
2
|
-
id:
|
|
3
|
-
error
|
|
4
|
-
warning
|
|
5
|
-
info
|
|
6
|
-
label
|
|
7
|
-
fieldHelp
|
|
2
|
+
id: string;
|
|
3
|
+
error?: string;
|
|
4
|
+
warning?: string;
|
|
5
|
+
info?: string;
|
|
6
|
+
label?: string;
|
|
7
|
+
fieldHelp?: string;
|
|
8
8
|
}): {
|
|
9
|
-
labelId
|
|
10
|
-
validationIconId
|
|
11
|
-
fieldHelpId
|
|
12
|
-
ariaDescribedBy
|
|
13
|
-
ariaLabelledBy
|
|
9
|
+
labelId?: string;
|
|
10
|
+
validationIconId?: string;
|
|
11
|
+
fieldHelpId?: string;
|
|
12
|
+
ariaDescribedBy?: string;
|
|
13
|
+
ariaLabelledBy?: string;
|
|
14
14
|
};
|
|
@@ -14,9 +14,7 @@ function useInputAccessibility({
|
|
|
14
14
|
fieldHelp
|
|
15
15
|
}) {
|
|
16
16
|
const labelId = label ? `${id}-label` : undefined;
|
|
17
|
-
const validationIconId = [error, warning, info].filter(validation => {
|
|
18
|
-
return validation && typeof validation === "string";
|
|
19
|
-
}).length ? `${id}-validation-icon` : undefined;
|
|
17
|
+
const validationIconId = [error, warning, info].filter(validation => validation && typeof validation === "string").length ? `${id}-validation-icon` : undefined;
|
|
20
18
|
const fieldHelpId = fieldHelp ? `${id}-field-help` : undefined;
|
|
21
19
|
const ariaDescribedBy = [fieldHelpId, validationIconId].filter(Boolean).join(" ");
|
|
22
20
|
const ariaLabelledBy = labelId;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export default
|
|
1
|
+
export { default } from "./useIsAboveBreakpoint";
|
|
@@ -3,14 +3,13 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports
|
|
7
|
-
|
|
8
|
-
|
|
6
|
+
Object.defineProperty(exports, "default", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function () {
|
|
9
|
+
return _useIsAboveBreakpoint.default;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
9
12
|
|
|
10
|
-
|
|
13
|
+
var _useIsAboveBreakpoint = _interopRequireDefault(require("./useIsAboveBreakpoint"));
|
|
11
14
|
|
|
12
|
-
function
|
|
13
|
-
const matchesQuery = (0, _useMediaQuery.default)(`(min-width:${breakpoint}px)`);
|
|
14
|
-
if (!breakpoint) return undefined;
|
|
15
|
-
return matchesQuery;
|
|
16
|
-
}
|
|
15
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function useIsAboveBreakpoint(breakpoint?: number): boolean | undefined;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = useIsAboveBreakpoint;
|
|
7
|
+
|
|
8
|
+
var _useMediaQuery = _interopRequireDefault(require("../../useMediaQuery"));
|
|
9
|
+
|
|
10
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
|
+
|
|
12
|
+
function useIsAboveBreakpoint(breakpoint) {
|
|
13
|
+
const matchesQuery = (0, _useMediaQuery.default)(`(min-width:${breakpoint}px)`);
|
|
14
|
+
if (!breakpoint) return undefined;
|
|
15
|
+
return matchesQuery;
|
|
16
|
+
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export default
|
|
1
|
+
export { default } from "./useLocale";
|
|
@@ -3,14 +3,13 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
6
|
+
Object.defineProperty(exports, "default", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function () {
|
|
9
|
+
return _useLocale.default;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
11
12
|
|
|
12
|
-
|
|
13
|
+
var _useLocale = _interopRequireDefault(require("./useLocale"));
|
|
13
14
|
|
|
14
|
-
function
|
|
15
|
-
return (0, _react.useContext)(_i18nContext.default);
|
|
16
|
-
}
|
|
15
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function useLocale(): import("../../../locales/locale").default;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = useLocale;
|
|
7
|
+
|
|
8
|
+
var _react = require("react");
|
|
9
|
+
|
|
10
|
+
var _i18nContext = _interopRequireDefault(require("../../../__internal__/i18n-context"));
|
|
11
|
+
|
|
12
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
+
|
|
14
|
+
function useLocale() {
|
|
15
|
+
return (0, _react.useContext)(_i18nContext.default);
|
|
16
|
+
}
|
|
@@ -1,10 +1 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
export default function useResizeObserver(
|
|
4
|
-
/** Reference to the resizable HTML element - */
|
|
5
|
-
ref: React.RefObject<HTMLElement>,
|
|
6
|
-
/** Callback meant to be executed on element resize */
|
|
7
|
-
onResize: () => void,
|
|
8
|
-
/** Flag to indicate whether hook should be disabled */
|
|
9
|
-
disabled?: boolean
|
|
10
|
-
): void;
|
|
1
|
+
export { default } from "./useResizeObserver";
|
|
@@ -3,29 +3,13 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
const onResizeRef = (0, _react.useRef)(null);
|
|
13
|
-
onResizeRef.current = onResize;
|
|
14
|
-
(0, _react.useLayoutEffect)(() => {
|
|
15
|
-
const referenceRef = ref.current;
|
|
6
|
+
Object.defineProperty(exports, "default", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function () {
|
|
9
|
+
return _useResizeObserver.default;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
16
12
|
|
|
17
|
-
|
|
18
|
-
observer.current = new ResizeObserver(() => {
|
|
19
|
-
onResizeRef === null || onResizeRef === void 0 ? void 0 : onResizeRef.current();
|
|
20
|
-
});
|
|
21
|
-
observer.current.observe(referenceRef);
|
|
22
|
-
}
|
|
13
|
+
var _useResizeObserver = _interopRequireDefault(require("./useResizeObserver"));
|
|
23
14
|
|
|
24
|
-
|
|
25
|
-
if (!disabled) {
|
|
26
|
-
observer.current.unobserve(referenceRef);
|
|
27
|
-
observer.current.disconnect();
|
|
28
|
-
}
|
|
29
|
-
};
|
|
30
|
-
}, [ref, disabled]);
|
|
31
|
-
}
|
|
15
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { RefObject } from "react";
|
|
2
|
+
export default function useResizeObserver(
|
|
3
|
+
/** Reference to the resizable HTML element */
|
|
4
|
+
ref: RefObject<Element>,
|
|
5
|
+
/** Callback meant to be executed on element resize */
|
|
6
|
+
onResize: () => void,
|
|
7
|
+
/** Flag to indicate whether hook should be disabled */
|
|
8
|
+
disabled?: boolean): void;
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = useResizeObserver;
|
|
7
|
+
|
|
8
|
+
var _react = require("react");
|
|
9
|
+
|
|
10
|
+
function useResizeObserver(
|
|
11
|
+
/** Reference to the resizable HTML element */
|
|
12
|
+
ref,
|
|
13
|
+
/** Callback meant to be executed on element resize */
|
|
14
|
+
onResize,
|
|
15
|
+
/** Flag to indicate whether hook should be disabled */
|
|
16
|
+
disabled) {
|
|
17
|
+
const observer = (0, _react.useRef)();
|
|
18
|
+
const onResizeRef = (0, _react.useRef)(onResize);
|
|
19
|
+
onResizeRef.current = onResize;
|
|
20
|
+
(0, _react.useLayoutEffect)(() => {
|
|
21
|
+
const referenceRef = ref.current;
|
|
22
|
+
|
|
23
|
+
if (!disabled && referenceRef) {
|
|
24
|
+
observer.current = new ResizeObserver(() => {
|
|
25
|
+
onResizeRef === null || onResizeRef === void 0 ? void 0 : onResizeRef.current();
|
|
26
|
+
});
|
|
27
|
+
observer.current.observe(referenceRef);
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
return () => {
|
|
31
|
+
if (!disabled && referenceRef && observer.current) {
|
|
32
|
+
observer.current.unobserve(referenceRef);
|
|
33
|
+
observer.current.disconnect();
|
|
34
|
+
}
|
|
35
|
+
};
|
|
36
|
+
}, [ref, disabled]);
|
|
37
|
+
}
|
|
@@ -1,12 +1,26 @@
|
|
|
1
|
-
|
|
1
|
+
declare global {
|
|
2
|
+
interface Window {
|
|
3
|
+
__CARBON_INTERNALS_SCROLL_BLOCKERS?: {
|
|
4
|
+
components: {
|
|
5
|
+
[key: string]: boolean;
|
|
6
|
+
};
|
|
7
|
+
originalValues: string[];
|
|
8
|
+
restoreValues?: (() => void) | null;
|
|
9
|
+
};
|
|
10
|
+
}
|
|
11
|
+
}
|
|
2
12
|
declare class ScrollBlockManager {
|
|
3
|
-
components:
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
13
|
+
components: {
|
|
14
|
+
[key: string]: boolean;
|
|
15
|
+
};
|
|
16
|
+
originalValues: string[];
|
|
17
|
+
constructor();
|
|
18
|
+
registerComponent(id: string): void;
|
|
19
|
+
unregisterComponent(id: string): void;
|
|
20
|
+
saveRestoreValuesCallback(callback: (() => void) | null): void;
|
|
21
|
+
getRestoreValuesCallback(): (() => void) | null | undefined;
|
|
22
|
+
saveOriginalValues(values: string[]): void;
|
|
23
|
+
getOriginalValues(): string[];
|
|
11
24
|
isBlocked(): boolean;
|
|
12
25
|
}
|
|
26
|
+
export default ScrollBlockManager;
|
|
@@ -11,19 +11,26 @@ function _defineProperties(target, props) { for (var i = 0; i < props.length; i+
|
|
|
11
11
|
|
|
12
12
|
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
|
|
13
13
|
|
|
14
|
-
|
|
15
|
-
|
|
14
|
+
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
15
|
+
|
|
16
|
+
// TODO: This component can be refactored to remove redundant code
|
|
17
|
+
// once we can confirm that all Sage products use version 105.0.0^
|
|
16
18
|
let ScrollBlockManager = /*#__PURE__*/function () {
|
|
17
19
|
function ScrollBlockManager() {
|
|
18
20
|
_classCallCheck(this, ScrollBlockManager);
|
|
19
21
|
|
|
22
|
+
_defineProperty(this, "components", void 0);
|
|
23
|
+
|
|
24
|
+
_defineProperty(this, "originalValues", void 0);
|
|
25
|
+
|
|
20
26
|
// Due to possibility of multiple carbon versions using it
|
|
21
27
|
// it is necessary to maintain same structure in this global variable
|
|
22
28
|
if (!window.__CARBON_INTERNALS_SCROLL_BLOCKERS) {
|
|
23
29
|
window.__CARBON_INTERNALS_SCROLL_BLOCKERS = {
|
|
24
30
|
components: {},
|
|
25
31
|
// originalValues can be removed
|
|
26
|
-
originalValues: []
|
|
32
|
+
originalValues: [],
|
|
33
|
+
restoreValues: null
|
|
27
34
|
};
|
|
28
35
|
}
|
|
29
36
|
|
|
@@ -41,23 +48,28 @@ let ScrollBlockManager = /*#__PURE__*/function () {
|
|
|
41
48
|
key: "unregisterComponent",
|
|
42
49
|
value: function unregisterComponent(id) {
|
|
43
50
|
delete this.components[id];
|
|
44
|
-
} // TODO: saveOriginalValues can be removed
|
|
45
|
-
|
|
46
|
-
}, {
|
|
47
|
-
key: "saveOriginalValues",
|
|
48
|
-
value: function saveOriginalValues(values) {
|
|
49
|
-
this.originalValues.length = 0;
|
|
50
|
-
this.originalValues.push(...values);
|
|
51
51
|
}
|
|
52
52
|
}, {
|
|
53
53
|
key: "saveRestoreValuesCallback",
|
|
54
54
|
value: function saveRestoreValuesCallback(callback) {
|
|
55
|
-
|
|
55
|
+
/* istanbul ignore else */
|
|
56
|
+
if (window.__CARBON_INTERNALS_SCROLL_BLOCKERS) {
|
|
57
|
+
window.__CARBON_INTERNALS_SCROLL_BLOCKERS.restoreValues = callback;
|
|
58
|
+
}
|
|
56
59
|
}
|
|
57
60
|
}, {
|
|
58
61
|
key: "getRestoreValuesCallback",
|
|
59
62
|
value: function getRestoreValuesCallback() {
|
|
60
|
-
|
|
63
|
+
var _window$__CARBON_INTE;
|
|
64
|
+
|
|
65
|
+
return (_window$__CARBON_INTE = window.__CARBON_INTERNALS_SCROLL_BLOCKERS) === null || _window$__CARBON_INTE === void 0 ? void 0 : _window$__CARBON_INTE.restoreValues;
|
|
66
|
+
} // TODO: saveOriginalValues can be removed
|
|
67
|
+
|
|
68
|
+
}, {
|
|
69
|
+
key: "saveOriginalValues",
|
|
70
|
+
value: function saveOriginalValues(values) {
|
|
71
|
+
this.originalValues.length = 0;
|
|
72
|
+
this.originalValues.push(...values);
|
|
61
73
|
} // TODO: getOriginalValues can be removed
|
|
62
74
|
|
|
63
75
|
}, {
|
|
@@ -16,20 +16,18 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
|
|
|
16
16
|
// TODO: This component can be refactored to remove redundant code after
|
|
17
17
|
// we can confirm that all Sage products use version 105.0.0^
|
|
18
18
|
const scrollBlockManager = new _scrollBlockManager.default();
|
|
19
|
-
/* istanbul ignore next */
|
|
20
|
-
|
|
21
|
-
const safeDocument = typeof document !== "undefined" ? document : {};
|
|
22
19
|
|
|
23
20
|
const useScrollBlock = () => {
|
|
24
21
|
const {
|
|
25
22
|
current: containerGuid
|
|
26
23
|
} = (0, _react.useRef)((0, _guid.default)());
|
|
27
|
-
const originalValuesRef = (0, _react.useRef)();
|
|
24
|
+
const originalValuesRef = (0, _react.useRef)([]);
|
|
28
25
|
const rules = (0, _react.useMemo)(() => {
|
|
26
|
+
/* istanbul ignore next */
|
|
29
27
|
const {
|
|
30
28
|
documentElement,
|
|
31
29
|
body
|
|
32
|
-
} =
|
|
30
|
+
} = document || {};
|
|
33
31
|
const scrollBarWidth = window.innerWidth - documentElement.clientWidth;
|
|
34
32
|
const bodyPaddingRight = parseInt(window.getComputedStyle(body).getPropertyValue("padding-right")) || 0;
|
|
35
33
|
return [// TODO: First two entries of this array with the documentElement can be removed
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export default
|
|
1
|
+
export { default } from "./useMediaQuery";
|
|
@@ -3,30 +3,13 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
function useMediaQuery(queryInput) {
|
|
13
|
-
const query = queryInput.replace(/^@media( ?)/m, "");
|
|
14
|
-
|
|
15
|
-
const [match, setMatch] = _react.default.useState(() => false);
|
|
16
|
-
|
|
17
|
-
_react.default.useEffect(() => {
|
|
18
|
-
const queryList = window.matchMedia(query);
|
|
19
|
-
|
|
20
|
-
const updateMatch = () => {
|
|
21
|
-
setMatch(queryList.matches);
|
|
22
|
-
};
|
|
6
|
+
Object.defineProperty(exports, "default", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function () {
|
|
9
|
+
return _useMediaQuery.default;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
23
12
|
|
|
24
|
-
|
|
25
|
-
queryList.addListener(updateMatch);
|
|
26
|
-
return () => {
|
|
27
|
-
queryList.removeListener(updateMatch);
|
|
28
|
-
};
|
|
29
|
-
}, [query]);
|
|
13
|
+
var _useMediaQuery = _interopRequireDefault(require("./useMediaQuery"));
|
|
30
14
|
|
|
31
|
-
|
|
32
|
-
}
|
|
15
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function useMediaQuery(queryInput: string): boolean;
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = useMediaQuery;
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
|
|
10
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
|
+
|
|
12
|
+
function useMediaQuery(queryInput) {
|
|
13
|
+
const query = queryInput.replace(/^@media( ?)/m, "");
|
|
14
|
+
|
|
15
|
+
const [match, setMatch] = _react.default.useState(() => false);
|
|
16
|
+
|
|
17
|
+
_react.default.useEffect(() => {
|
|
18
|
+
const queryList = window.matchMedia(query);
|
|
19
|
+
|
|
20
|
+
const updateMatch = () => {
|
|
21
|
+
setMatch(queryList.matches);
|
|
22
|
+
};
|
|
23
|
+
|
|
24
|
+
updateMatch();
|
|
25
|
+
queryList.addListener(updateMatch);
|
|
26
|
+
return () => {
|
|
27
|
+
queryList.removeListener(updateMatch);
|
|
28
|
+
};
|
|
29
|
+
}, [query]);
|
|
30
|
+
|
|
31
|
+
return match;
|
|
32
|
+
}
|
package/lib/locales/en-gb.d.ts
CHANGED
package/lib/locales/en-gb.js
CHANGED
|
@@ -9,7 +9,7 @@ var _dateFnsLocales = require("./date-fns-locales");
|
|
|
9
9
|
|
|
10
10
|
const isSingular = count => (typeof count === "string" ? parseInt(count) : count) === 1;
|
|
11
11
|
|
|
12
|
-
|
|
12
|
+
const enGB = {
|
|
13
13
|
locale: () => "en-GB",
|
|
14
14
|
actions: {
|
|
15
15
|
edit: () => "Edit",
|
|
@@ -136,4 +136,5 @@ var _default = {
|
|
|
136
136
|
}
|
|
137
137
|
}
|
|
138
138
|
};
|
|
139
|
+
var _default = enGB;
|
|
139
140
|
exports.default = _default;
|
package/lib/locales/index.d.ts
CHANGED
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "EnGb", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function () {
|
|
9
|
+
return _enGb.default;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
Object.defineProperty(exports, "PlPl", {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function () {
|
|
15
|
+
return _plPl.default;
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
|
|
19
|
+
var _enGb = _interopRequireDefault(require("./en-gb"));
|
|
20
|
+
|
|
21
|
+
var _plPl = _interopRequireDefault(require("./pl-pl"));
|
|
22
|
+
|
|
23
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|