@rio-cloud/rio-uikit 1.1.0 → 1.2.0

package/lib/es/components/states/CustomState.js

@@ -21,9 +21,9 @@ const renderButtons = (buttons) => {
         return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'btn-toolbar margin-top-20' }, { children: (0, jsx_runtime_1.jsx)(StateButton_1.default, Object.assign({}, buttons[0])) })));
     }
     if (buttons.length === 2) {
-        return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'btn-toolbar margin-top-20' }, { children: buttons.map((buttonProps, index) => ((0, jsx_runtime_1.jsx)(StateButton_1.default, Object.assign({}, buttonProps), index))) })));
+        return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'btn-toolbar margin-top-20 justify-content-center-xs' }, { children: buttons.map((buttonProps, index) => ((0, jsx_runtime_1.jsx)(StateButton_1.default, Object.assign({}, buttonProps), index))) })));
     }
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: 'btn-toolbar margin-top-20' }, { children: [(0, jsx_runtime_1.jsx)(StateButton_1.default, Object.assign({}, buttons[0]), '1'), (0, jsx_runtime_1.jsx)(StateButton_1.default, Object.assign({}, buttons[1]), '2')] })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'btn-toolbar' }, { children: buttons.map((buttonProps, index) => {
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: 'btn-toolbar margin-top-20 justify-content-center-xs' }, { children: [(0, jsx_runtime_1.jsx)(StateButton_1.default, Object.assign({}, buttons[0]), '1'), (0, jsx_runtime_1.jsx)(StateButton_1.default, Object.assign({}, buttons[1]), '2')] })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'btn-toolbar' }, { children: buttons.map((buttonProps, index) => {
                     return index > 1 && (0, jsx_runtime_1.jsx)(StateButton_1.default, Object.assign({}, buttonProps), index);
                 }) }))] }));
 };

package/lib/es/hooks/useAfterMount.js

@@ -8,12 +8,16 @@ const react_1 = require("react");
  * @param deps The deps of the callback (the same as if you were using useCallback or useEffect).
  */
 const useAfterMount = (callback, deps) => {
-    const componentJustMountedRef = (0, react_1.useRef)(true);
+    const hasMountedRef = (0, react_1.useRef)(false);
     (0, react_1.useEffect)(() => {
-        if (!componentJustMountedRef.current) {
-            return callback();
+        if (hasMountedRef.current) {
+            // Run the callback only after the first render and
+            // whenever the dependencies change afterwards
+            callback();
+        }
+        else {
+            hasMountedRef.current = true;
         }
-        componentJustMountedRef.current = false;
     }, deps);
 };
 exports.default = useAfterMount;

package/lib/es/utils/deviceUtils.d.ts

@@ -7,6 +7,7 @@ export declare const SCREEN_XL = 1700;
 export declare const isMobileScreen: () => boolean;
 export declare const isMobile: () => boolean;
 export declare const isDesktop: () => boolean;
+export declare const isMac: () => boolean;
 export declare const isRetinaDevice: () => boolean;
 export declare const inIframe: () => boolean;
 export declare const toggleZoomOnMobile: () => void;

package/lib/es/utils/deviceUtils.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.toggleZoomOnMobile = exports.inIframe = exports.isRetinaDevice = exports.isDesktop = exports.isMobile = exports.isMobileScreen = exports.SCREEN_XL = exports.SCREEN_LG = exports.SCREEN_MD = exports.SCREEN_SM = exports.MOBILE_SCREEN = exports.hasTouch = void 0;
+exports.toggleZoomOnMobile = exports.inIframe = exports.isRetinaDevice = exports.isMac = exports.isDesktop = exports.isMobile = exports.isMobileScreen = exports.SCREEN_XL = exports.SCREEN_LG = exports.SCREEN_MD = exports.SCREEN_SM = exports.MOBILE_SCREEN = exports.hasTouch = void 0;
 const cssuseragent_1 = require("./cssuseragent");
 // As "cssuseragent" is accessing the html dom object directly without checking whether it exists or not,
 // we need to initialize only when html really exists. This avoids issues when running the UIKIT in a web-worker
@@ -42,6 +42,8 @@ const isMobile = () => document === null || document === void 0 ? void 0 : docum
 exports.isMobile = isMobile;
 const isDesktop = () => document === null || document === void 0 ? void 0 : document.documentElement.classList.contains('ua-desktop');
 exports.isDesktop = isDesktop;
+const isMac = () => document === null || document === void 0 ? void 0 : document.documentElement.classList.contains('ua-desktop-macintosh');
+exports.isMac = isMac;
 const isRetinaDevice = () => window.devicePixelRatio > 1;
 exports.isRetinaDevice = isRetinaDevice;
 const inIframe = () => {

package/lib/es/version.json

@@ -1,3 +1,3 @@
 {
-    "version": "1.1.0"
+    "version": "1.2.0"
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@rio-cloud/rio-uikit",
-    "version": "1.1.0",
+    "version": "1.2.0",
     "description": "The RIO UIKIT component library",
     "repository": "https://bitbucket.collaboration-man.com/projects/RIOFRONT/repos/uikit-web/browse",
     "scripts": {

package/utils/deviceUtils.d.ts

@@ -7,6 +7,7 @@ export declare const SCREEN_XL = 1700;
 export declare const isMobileScreen: () => boolean;
 export declare const isMobile: () => boolean;
 export declare const isDesktop: () => boolean;
+export declare const isMac: () => boolean;
 export declare const isRetinaDevice: () => boolean;
 export declare const inIframe: () => boolean;
 export declare const toggleZoomOnMobile: () => void;

package/utils/deviceUtils.js

@@ -35,6 +35,7 @@ export const SCREEN_XL = 1700;
 export const isMobileScreen = () => window.matchMedia(`(max-width: ${MOBILE_SCREEN}px)`).matches;
 export const isMobile = () => document === null || document === void 0 ? void 0 : document.documentElement.classList.contains('ua-mobile');
 export const isDesktop = () => document === null || document === void 0 ? void 0 : document.documentElement.classList.contains('ua-desktop');
+export const isMac = () => document === null || document === void 0 ? void 0 : document.documentElement.classList.contains('ua-desktop-macintosh');
 export const isRetinaDevice = () => window.devicePixelRatio > 1;
 export const inIframe = () => {
     try {

package/version.json

@@ -1,3 +1,3 @@
 {
-    "version": "1.1.0"
+    "version": "1.2.0"
 }