@citygross/components 0.8.91 → 0.8.93

package/build/@types/components/CgButton/CgButton.d.ts

@@ -12,17 +12,18 @@ export declare enum EButtonVariant {
     'ghost' = 4
 }
 export declare type TCgButton = {
-    size?: ECgButtonSize;
-    variant?: EButtonVariant;
-    icon?: React.ReactNode;
-    flexReverse?: boolean;
-    loading?: boolean;
+    buttonRef?: React.Ref<HTMLButtonElement>;
     children?: React.ReactNode;
     disabled?: boolean;
-    onClick?: () => void;
+    flexReverse?: boolean;
     fullWidth?: boolean;
-    buttonRef?: React.Ref<HTMLButtonElement>;
+    icon?: React.ReactNode;
+    id?: string;
+    loading?: boolean;
+    onClick?: () => void;
     round?: boolean;
     shouldPreventDefault?: boolean;
+    size?: ECgButtonSize;
+    variant?: EButtonVariant;
 };
-export declare const CgButton: ({ size, variant, icon, flexReverse, disabled, onClick, children, loading, fullWidth, buttonRef, round, shouldPreventDefault }: TCgButton) => JSX.Element;
+export declare const CgButton: ({ buttonRef, children, disabled, flexReverse, fullWidth, icon, id, loading, onClick, round, shouldPreventDefault, size, variant }: TCgButton) => JSX.Element;

package/build/cjs/components/src/components/CgButton/CgButton.js

@@ -25,16 +25,12 @@ exports.EButtonVariant = void 0;
     EButtonVariant[EButtonVariant["ghost"] = 4] = "ghost";
 })(exports.EButtonVariant || (exports.EButtonVariant = {}));
 var CgButton = function (_a) {
-    var size = _a.size, variant = _a.variant, icon = _a.icon, flexReverse = _a.flexReverse, disabled = _a.disabled, onClick = _a.onClick, children = _a.children, loading = _a.loading, fullWidth = _a.fullWidth, buttonRef = _a.buttonRef, round = _a.round, _b = _a.shouldPreventDefault, shouldPreventDefault = _b === void 0 ? true : _b;
-    return (React__default["default"].createElement(CgButton_styles.CgButtonContainer, { ref: buttonRef, round: round, size: size, variant: variant, isIconOnly: !children, flexReverse: flexReverse, disabled: disabled || loading, fullWidth: fullWidth, loading: loading, onKeyDown: function (event) {
-            if (event.key === 'Enter' && !disabled) {
-                onClick && onClick();
-            }
-        }, onClick: function (e) {
+    var buttonRef = _a.buttonRef, children = _a.children, disabled = _a.disabled, flexReverse = _a.flexReverse, fullWidth = _a.fullWidth, icon = _a.icon, _b = _a.id, id = _b === void 0 ? 'cg-button' : _b, loading = _a.loading, onClick = _a.onClick, round = _a.round, _c = _a.shouldPreventDefault, shouldPreventDefault = _c === void 0 ? true : _c, size = _a.size, variant = _a.variant;
+    return (React__default["default"].createElement(CgButton_styles.CgButtonContainer, { disabled: disabled || loading, flexReverse: flexReverse, fullWidth: fullWidth, isIconOnly: !children, id: id, loading: loading, onClick: function (e) {
             shouldPreventDefault && e.preventDefault();
             onClick && onClick();
-        } },
-        React__default["default"].createElement(CgButton_styles.CgButtonContent, { size: size, flexReverse: flexReverse, loading: loading },
+        }, ref: buttonRef, round: round, size: size, variant: variant },
+        React__default["default"].createElement(CgButton_styles.CgButtonContent, { flexReverse: flexReverse, loading: loading, size: size },
             icon,
             children),
         loading && (React__default["default"].createElement(CgButton_styles.CgButtonLoader, null,

package/build/cjs/components/src/components/CgButton/CgButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"CgButton.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"CgButton.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/cjs/utils/build/index.js

@@ -447,6 +447,45 @@ var makeCateringPortionsString = function (variant, cartItem, unit) {
     return qString;
 };
 
+var focusTrap = function (_a) {
+    var _b;
+    var exitFunction = _a.exitFunction, ref = _a.ref;
+    var elements = 'button:not([disabled]), [href]:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])';
+    var focusableElements = (_b = ref.current) === null || _b === void 0 ? void 0 : _b.querySelectorAll(elements);
+    if (focusableElements &&
+        focusableElements.length > 0 &&
+        focusableElements[0] instanceof HTMLElement) {
+        focusableElements[0].focus();
+    }
+    var handleKeyDown = function (e) {
+        if (!ref.current)
+            return;
+        var focusable = Array.from(ref.current.querySelectorAll(elements));
+        if (focusable.length === 0)
+            return;
+        var firstElement = focusable[0];
+        var lastElement = focusable[focusable.length - 1];
+        if (e.key === 'Tab') {
+            if (e.shiftKey && document.activeElement === firstElement) {
+                e.preventDefault();
+                lastElement.focus();
+            }
+            else if (!e.shiftKey && document.activeElement === lastElement) {
+                e.preventDefault();
+                firstElement.focus();
+            }
+        }
+        else if (e.key === 'Escape')
+            exitFunction();
+    };
+    if (ref.current)
+        ref.current.addEventListener('keydown', handleKeyDown);
+    return function () {
+        if (ref.current)
+            ref.current.removeEventListener('keydown', handleKeyDown);
+    };
+};
+
 var formatLeadingZero = function (day) { return day.replace(/^0+/, ''); };
 
 var formatPostalCode = function (postalCode, spaceIndex) {
@@ -18848,6 +18887,7 @@ index.__exports.capitalizeFirstLetter = capitalizeFirstLetter;
 index.__exports.capitalizedAllWords = capitalizedAllWords;
 index.__exports.comparisonTypes = comparisonTypes;
 index.__exports.emailRegex = emailRegex;
+index.__exports.focusTrap = focusTrap;
 index.__exports.formatDateToLocale = formatDateToLocale;
 index.__exports.formatLeadingZero = formatLeadingZero;
 index.__exports.formatPostalCode = formatPostalCode;