@databiosphere/findable-ui 6.0.0 → 7.0.0

package/lib/providers/layoutState.js

@@ -1,56 +1,29 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.LayoutActionKind = exports.LayoutStateProvider = exports.LayoutStateContext = exports.DEFAULT_LAYOUT_STATE = void 0;
-const react_1 = __importStar(require("react"));
-const constants_1 = require("../components/Layout/components/Header/common/constants");
+import React, { createContext, useReducer } from "react";
+import { HEADER_HEIGHT } from "../components/Layout/components/Header/common/constants";
 // Default layout state.
-exports.DEFAULT_LAYOUT_STATE = {
-    headerHeight: constants_1.HEADER_HEIGHT + 1, // 1px for bottom border.
+export const DEFAULT_LAYOUT_STATE = {
+    headerHeight: HEADER_HEIGHT + 1, // 1px for bottom border.
 };
-exports.LayoutStateContext = (0, react_1.createContext)({
+export const LayoutStateContext = createContext({
     // eslint-disable-next-line @typescript-eslint/no-empty-function -- allow dummy function for default state.
     layoutDispatch: () => { },
-    layoutState: exports.DEFAULT_LAYOUT_STATE,
+    layoutState: DEFAULT_LAYOUT_STATE,
 });
-function LayoutStateProvider({ children, }) {
+export function LayoutStateProvider({ children, }) {
     // Layout state.
-    const [layoutState, layoutDispatch] = (0, react_1.useReducer)((s, a) => layoutReducer(s, a), exports.DEFAULT_LAYOUT_STATE);
-    return (react_1.default.createElement(exports.LayoutStateContext.Provider, { value: {
+    const [layoutState, layoutDispatch] = useReducer((s, a) => layoutReducer(s, a), DEFAULT_LAYOUT_STATE);
+    return (React.createElement(LayoutStateContext.Provider, { value: {
             layoutDispatch,
             layoutState,
         } }, children));
 }
-exports.LayoutStateProvider = LayoutStateProvider;
 /**
  * Layout action kind.
  */
-var LayoutActionKind;
+export var LayoutActionKind;
 (function (LayoutActionKind) {
     LayoutActionKind["UpdateHeaderHeight"] = "UPDATE_HEADER_HEIGHT";
-})(LayoutActionKind = exports.LayoutActionKind || (exports.LayoutActionKind = {}));
+})(LayoutActionKind || (LayoutActionKind = {}));
 /**
  * Layout reducer.
  * @param state - Layout state.
@@ -63,7 +36,10 @@ function layoutReducer(state, action) {
     switch (type) {
         // Updates header height.
         case LayoutActionKind.UpdateHeaderHeight: {
-            return Object.assign(Object.assign({}, state), { headerHeight: payload !== null && payload !== void 0 ? payload : state.headerHeight });
+            return {
+                ...state,
+                headerHeight: payload ?? state.headerHeight,
+            };
         }
         default:
             return state;

package/lib/providers/systemStatus.js

@@ -1,45 +1,8 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SystemStatusProvider = exports.SystemStatusContext = exports.INDEXING_STATUS = void 0;
-const react_1 = __importStar(require("react"));
-const service_1 = require("../entity/api/service");
-const useAsync_1 = require("../hooks/useAsync");
-const useCatalog_1 = require("../hooks/useCatalog");
-const useConfig_1 = require("../hooks/useConfig");
+import React, { createContext, useEffect, useMemo } from "react";
+import { fetchSystemStatusFromURL } from "../entity/api/service";
+import { useAsync } from "../hooks/useAsync";
+import { useCatalog } from "../hooks/useCatalog";
+import { useConfig } from "../hooks/useConfig";
 // Default system status.
 const DEFAULT_SYSTEM_STATUS = {
     indexing: false,
@@ -49,44 +12,45 @@ const DEFAULT_SYSTEM_STATUS = {
 /**
  * Possible values of indexing status check.
  */
-var INDEXING_STATUS;
+export var INDEXING_STATUS;
 (function (INDEXING_STATUS) {
     INDEXING_STATUS["COMPLETE"] = "COMPLETE";
     INDEXING_STATUS["FAILED"] = "FAILED";
-})(INDEXING_STATUS = exports.INDEXING_STATUS || (exports.INDEXING_STATUS = {}));
+})(INDEXING_STATUS || (INDEXING_STATUS = {}));
 /**
  * System status context.
  */
-exports.SystemStatusContext = (0, react_1.createContext)(DEFAULT_SYSTEM_STATUS);
-function SystemStatusProvider({ children, }) {
-    const catalog = (0, useCatalog_1.useCatalog)();
-    const { config } = (0, useConfig_1.useConfig)();
+export const SystemStatusContext = createContext(DEFAULT_SYSTEM_STATUS);
+export function SystemStatusProvider({ children, }) {
+    const catalog = useCatalog();
+    const { config } = useConfig();
     const { systemStatus: systemStatusConfig } = config || {};
     const { apiPath, bindResponse } = systemStatusConfig || {};
     // Build system status URL.
-    const url = (0, react_1.useMemo)(() => getSystemStatusURL(apiPath, catalog), [apiPath, catalog]);
+    const url = useMemo(() => getSystemStatusURL(apiPath, catalog), [apiPath, catalog]);
     // System status (raw) response.
-    const { data, isIdle, isLoading, run } = (0, useAsync_1.useAsync)();
+    const { data, isIdle, isLoading, run } = useAsync();
     // Bind system status response.
-    const response = (0, react_1.useMemo)(() => bindResponse === null || bindResponse === void 0 ? void 0 : bindResponse(data), [bindResponse, data]);
+    const response = useMemo(() => bindResponse?.(data), [bindResponse, data]);
     // Remove indexing status from response.
     // eslint-disable-next-line @typescript-eslint/no-unused-vars -- using destructuring to remove indexingStatus from response.
-    const _a = response || {}, { indexingStatus } = _a, systemStatusResponse = __rest(_a, ["indexingStatus"]);
+    const { indexingStatus, ...systemStatusResponse } = response || {};
     // Build system status.
-    const systemStatus = Object.assign(Object.assign({}, DEFAULT_SYSTEM_STATUS), systemStatusResponse);
+    const systemStatus = { ...DEFAULT_SYSTEM_STATUS, ...systemStatusResponse };
     // If the system status is configured, update the loading state.
     if (config.systemStatus) {
         systemStatus.loading = isIdle || isLoading;
     }
     // Fetch system status from URL.
-    (0, react_1.useEffect)(() => {
+    useEffect(() => {
         if (!url)
             return;
-        run((0, service_1.fetchSystemStatusFromURL)(url));
+        run(fetchSystemStatusFromURL(url));
     }, [run, url]);
-    return (react_1.default.createElement(exports.SystemStatusContext.Provider, { value: Object.assign({}, systemStatus) }, children));
+    return (React.createElement(SystemStatusContext.Provider, { value: {
+            ...systemStatus,
+        } }, children));
 }
-exports.SystemStatusProvider = SystemStatusProvider;
 /**
  * Returns system status URL.
  * @param path - System status endpoint.

package/lib/shared/constants.js

@@ -1,4 +1 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.PAGINATION_PAGE_SIZE = void 0;
-exports.PAGINATION_PAGE_SIZE = 25;
+export const PAGINATION_PAGE_SIZE = 25;

package/lib/shared/utils.js

@@ -1,41 +1,34 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.getURL = exports.getEntityURL = exports.getDefaultListParams = exports.getDefaultDetailParams = void 0;
-const config_1 = require("../config/config");
+import { getConfig } from "../config/config";
 /**
  * Returns application DEFAULT_DETAIL_PARAMS.
  * @returns application DEFAULT_DETAIL_PARAMS.
  */
-function getDefaultDetailParams() {
-    const { dataSource } = (0, config_1.getConfig)();
+export function getDefaultDetailParams() {
+    const { dataSource } = getConfig();
     const { defaultDetailParams, defaultParams } = dataSource || {};
-    return Object.assign(Object.assign({}, defaultDetailParams), defaultParams);
+    return { ...defaultDetailParams, ...defaultParams };
 }
-exports.getDefaultDetailParams = getDefaultDetailParams;
 /**
  * Returns application DEFAULT_LIST_PARAMS.
  * @returns application DEFAULT_LIST_PARAMS.
  */
-function getDefaultListParams() {
-    const { dataSource } = (0, config_1.getConfig)();
+export function getDefaultListParams() {
+    const { dataSource } = getConfig();
     const { defaultListParams, defaultParams } = dataSource;
-    return Object.assign(Object.assign({}, defaultListParams), defaultParams);
+    return { ...defaultListParams, ...defaultParams };
 }
-exports.getDefaultListParams = getDefaultListParams;
 /**
  * Returns entity source URL.
  * @returns entity source URL.
  */
-function getEntityURL() {
-    const dataSource = (0, config_1.getConfig)().dataSource;
+export function getEntityURL() {
+    const dataSource = getConfig().dataSource;
     return dataSource.entityURL || dataSource.url;
 }
-exports.getEntityURL = getEntityURL;
 /**
  * Returns application URL.
  * @returns application url.
  */
-function getURL() {
-    return (0, config_1.getConfig)().dataSource.url;
+export function getURL() {
+    return getConfig().dataSource.url;
 }
-exports.getURL = getURL;

package/lib/styles/common/mixins/breakpoints.js

@@ -1,16 +1,7 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.media1366Up = exports.mediaTabletUp = exports.mediaTabletDown = exports.mediaDesktopUp = exports.mediaDesktopSmallUp = exports.mediaDesktopSmallDown = void 0;
-const breakpoints_1 = require("../../../theme/common/breakpoints");
-const mediaDesktopSmallDown = ({ theme }) => theme.breakpoints.down(breakpoints_1.DESKTOP_SM);
-exports.mediaDesktopSmallDown = mediaDesktopSmallDown;
-const mediaDesktopSmallUp = ({ theme }) => theme.breakpoints.up(breakpoints_1.DESKTOP_SM);
-exports.mediaDesktopSmallUp = mediaDesktopSmallUp;
-const mediaDesktopUp = ({ theme }) => theme.breakpoints.up(breakpoints_1.DESKTOP);
-exports.mediaDesktopUp = mediaDesktopUp;
-const mediaTabletDown = ({ theme }) => theme.breakpoints.down(breakpoints_1.TABLET);
-exports.mediaTabletDown = mediaTabletDown;
-const mediaTabletUp = ({ theme }) => theme.breakpoints.up(breakpoints_1.TABLET);
-exports.mediaTabletUp = mediaTabletUp;
-const media1366Up = ({ theme }) => theme.breakpoints.up(1366);
-exports.media1366Up = media1366Up;
+import { DESKTOP, DESKTOP_SM, TABLET } from "../../../theme/common/breakpoints";
+export const mediaDesktopSmallDown = ({ theme }) => theme.breakpoints.down(DESKTOP_SM);
+export const mediaDesktopSmallUp = ({ theme }) => theme.breakpoints.up(DESKTOP_SM);
+export const mediaDesktopUp = ({ theme }) => theme.breakpoints.up(DESKTOP);
+export const mediaTabletDown = ({ theme }) => theme.breakpoints.down(TABLET);
+export const mediaTabletUp = ({ theme }) => theme.breakpoints.up(TABLET);
+export const media1366Up = ({ theme }) => theme.breakpoints.up(1366);

package/lib/styles/common/mixins/colors.js

@@ -1,58 +1,32 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.white = exports.warningMain = exports.warningLightest = exports.warningLight = exports.successMain = exports.successLightest = exports.successLight = exports.smokeMain = exports.smokeLightest = exports.smokeLight = exports.smokeDark = exports.primaryMain = exports.primaryLightest = exports.primaryDark = exports.inkMain = exports.inkLight = exports.infoMain = exports.infoLightest = exports.infoLight = exports.errorMain = exports.alertMain = exports.alertLightest = exports.alertLight = void 0;
 // Alert
-const alertLight = ({ theme }) => theme.palette.alert.light;
-exports.alertLight = alertLight;
-const alertLightest = ({ theme, }) => theme.palette.alert.lightest;
-exports.alertLightest = alertLightest;
-const alertMain = ({ theme }) => theme.palette.alert.main;
-exports.alertMain = alertMain;
+export const alertLight = ({ theme }) => theme.palette.alert.light;
+export const alertLightest = ({ theme, }) => theme.palette.alert.lightest;
+export const alertMain = ({ theme }) => theme.palette.alert.main;
 // Error
-const errorMain = ({ theme }) => theme.palette.error.main;
-exports.errorMain = errorMain;
+export const errorMain = ({ theme }) => theme.palette.error.main;
 // Info
-const infoLight = ({ theme }) => theme.palette.info.light;
-exports.infoLight = infoLight;
-const infoLightest = ({ theme }) => theme.palette.info.lightest;
-exports.infoLightest = infoLightest;
-const infoMain = ({ theme }) => theme.palette.info.main;
-exports.infoMain = infoMain;
+export const infoLight = ({ theme }) => theme.palette.info.light;
+export const infoLightest = ({ theme }) => theme.palette.info.lightest;
+export const infoMain = ({ theme }) => theme.palette.info.main;
 // Ink
-const inkLight = ({ theme }) => theme.palette.ink.light;
-exports.inkLight = inkLight;
-const inkMain = ({ theme }) => theme.palette.ink.main;
-exports.inkMain = inkMain;
+export const inkLight = ({ theme }) => theme.palette.ink.light;
+export const inkMain = ({ theme }) => theme.palette.ink.main;
 // Primary
-const primaryDark = ({ theme }) => theme.palette.primary.dark;
-exports.primaryDark = primaryDark;
-const primaryLightest = ({ theme, }) => theme.palette.primary.lightest;
-exports.primaryLightest = primaryLightest;
-const primaryMain = ({ theme }) => theme.palette.primary.main;
-exports.primaryMain = primaryMain;
+export const primaryDark = ({ theme }) => theme.palette.primary.dark;
+export const primaryLightest = ({ theme, }) => theme.palette.primary.lightest;
+export const primaryMain = ({ theme }) => theme.palette.primary.main;
 // Smoke
-const smokeDark = ({ theme }) => theme.palette.smoke.dark;
-exports.smokeDark = smokeDark;
-const smokeLight = ({ theme }) => theme.palette.smoke.light;
-exports.smokeLight = smokeLight;
-const smokeLightest = ({ theme, }) => theme.palette.smoke.lightest;
-exports.smokeLightest = smokeLightest;
-const smokeMain = ({ theme }) => theme.palette.smoke.main;
-exports.smokeMain = smokeMain;
+export const smokeDark = ({ theme }) => theme.palette.smoke.dark;
+export const smokeLight = ({ theme }) => theme.palette.smoke.light;
+export const smokeLightest = ({ theme, }) => theme.palette.smoke.lightest;
+export const smokeMain = ({ theme }) => theme.palette.smoke.main;
 // Success
-const successLight = ({ theme }) => theme.palette.success.light;
-exports.successLight = successLight;
-const successLightest = ({ theme, }) => theme.palette.success.lightest;
-exports.successLightest = successLightest;
-const successMain = ({ theme }) => theme.palette.success.main;
-exports.successMain = successMain;
+export const successLight = ({ theme }) => theme.palette.success.light;
+export const successLightest = ({ theme, }) => theme.palette.success.lightest;
+export const successMain = ({ theme }) => theme.palette.success.main;
 // Warning
-const warningLight = ({ theme }) => theme.palette.warning.light;
-exports.warningLight = warningLight;
-const warningLightest = ({ theme, }) => theme.palette.warning.lightest;
-exports.warningLightest = warningLightest;
-const warningMain = ({ theme }) => theme.palette.warning.main;
-exports.warningMain = warningMain;
+export const warningLight = ({ theme }) => theme.palette.warning.light;
+export const warningLightest = ({ theme, }) => theme.palette.warning.lightest;
+export const warningMain = ({ theme }) => theme.palette.warning.main;
 // White
-const white = ({ theme }) => theme.palette.common.white;
-exports.white = white;
+export const white = ({ theme }) => theme.palette.common.white;

package/lib/styles/common/mixins/fonts.js

@@ -1,8 +1,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.textUppercase500 = exports.textHeadingXLarge = exports.textHeadingSmall = exports.textHeadingLarge = exports.textHeading = exports.textBodySmall500 = exports.textBodySmall4002Lines = exports.textBodySmall400 = exports.textBodyLarge500 = exports.textBodyLarge4002Lines = exports.textBodyLarge400 = exports.textBody5002Lines = exports.textBody500 = exports.textBody4002Lines = exports.textBody400 = void 0;
-const react_1 = require("@emotion/react");
-const typography_1 = require("../../../theme/common/typography");
+import { css } from "@emotion/react";
+import { TEXT_BODY_400, TEXT_BODY_400_2_LINES, TEXT_BODY_500, TEXT_BODY_500_2_LINES, TEXT_BODY_LARGE_400, TEXT_BODY_LARGE_400_2_LINES, TEXT_BODY_LARGE_500, TEXT_BODY_SMALL_400, TEXT_BODY_SMALL_400_2_LINES, TEXT_BODY_SMALL_500, TEXT_HEADING, TEXT_HEADING_LARGE, TEXT_HEADING_SMALL, TEXT_HEADING_XLARGE, TEXT_UPPERCASE_500, } from "../../../theme/common/typography";
 /**
  * Returns typography style for the specified typography variant.
  * @param TYPOGRAPHY - Typography variant name.
@@ -11,23 +8,23 @@ const typography_1 = require("../../../theme/common/typography");
 function typographyToCSS(TYPOGRAPHY) {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any -- TODO revisit any.
     return (props) => {
-        return (0, react_1.css) `
+        return css `
       ${props.theme.typography[TYPOGRAPHY]}
     `;
     };
 }
-exports.textBody400 = typographyToCSS(typography_1.TEXT_BODY_400);
-exports.textBody4002Lines = typographyToCSS(typography_1.TEXT_BODY_400_2_LINES);
-exports.textBody500 = typographyToCSS(typography_1.TEXT_BODY_500);
-exports.textBody5002Lines = typographyToCSS(typography_1.TEXT_BODY_500_2_LINES);
-exports.textBodyLarge400 = typographyToCSS(typography_1.TEXT_BODY_LARGE_400);
-exports.textBodyLarge4002Lines = typographyToCSS(typography_1.TEXT_BODY_LARGE_400_2_LINES);
-exports.textBodyLarge500 = typographyToCSS(typography_1.TEXT_BODY_LARGE_500);
-exports.textBodySmall400 = typographyToCSS(typography_1.TEXT_BODY_SMALL_400);
-exports.textBodySmall4002Lines = typographyToCSS(typography_1.TEXT_BODY_SMALL_400_2_LINES);
-exports.textBodySmall500 = typographyToCSS(typography_1.TEXT_BODY_SMALL_500);
-exports.textHeading = typographyToCSS(typography_1.TEXT_HEADING);
-exports.textHeadingLarge = typographyToCSS(typography_1.TEXT_HEADING_LARGE);
-exports.textHeadingSmall = typographyToCSS(typography_1.TEXT_HEADING_SMALL);
-exports.textHeadingXLarge = typographyToCSS(typography_1.TEXT_HEADING_XLARGE);
-exports.textUppercase500 = typographyToCSS(typography_1.TEXT_UPPERCASE_500);
+export const textBody400 = typographyToCSS(TEXT_BODY_400);
+export const textBody4002Lines = typographyToCSS(TEXT_BODY_400_2_LINES);
+export const textBody500 = typographyToCSS(TEXT_BODY_500);
+export const textBody5002Lines = typographyToCSS(TEXT_BODY_500_2_LINES);
+export const textBodyLarge400 = typographyToCSS(TEXT_BODY_LARGE_400);
+export const textBodyLarge4002Lines = typographyToCSS(TEXT_BODY_LARGE_400_2_LINES);
+export const textBodyLarge500 = typographyToCSS(TEXT_BODY_LARGE_500);
+export const textBodySmall400 = typographyToCSS(TEXT_BODY_SMALL_400);
+export const textBodySmall4002Lines = typographyToCSS(TEXT_BODY_SMALL_400_2_LINES);
+export const textBodySmall500 = typographyToCSS(TEXT_BODY_SMALL_500);
+export const textHeading = typographyToCSS(TEXT_HEADING);
+export const textHeadingLarge = typographyToCSS(TEXT_HEADING_LARGE);
+export const textHeadingSmall = typographyToCSS(TEXT_HEADING_SMALL);
+export const textHeadingXLarge = typographyToCSS(TEXT_HEADING_XLARGE);
+export const textUppercase500 = typographyToCSS(TEXT_UPPERCASE_500);

package/lib/styles/common/mixins/shadows.js

@@ -1,9 +1,4 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.shadows02 = exports.shadows01 = void 0;
 // Elevation 01
-const shadows01 = ({ theme }) => theme.shadows[1];
-exports.shadows01 = shadows01;
+export const shadows01 = ({ theme }) => theme.shadows[1];
 // Elevation 02
-const shadows02 = ({ theme }) => theme.shadows[2];
-exports.shadows02 = shadows02;
+export const shadows02 = ({ theme }) => theme.shadows[2];

package/lib/theme/common/breakpoints.js

@@ -1,6 +1,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.tabletUp = exports.mobileUp = exports.desktopSmUp = exports.desktopUp = exports.tablet = exports.mobile = exports.desktopSm = exports.desktop = exports.TABLET = exports.MOBILE = exports.DESKTOP_SM = exports.DESKTOP = void 0;
 /**
  * Breakpoints
  */
@@ -20,21 +17,21 @@ const BREAKPOINT_KEY = {
     MOBILE: "xs",
     TABLET: "sm",
 };
-exports.DESKTOP = BREAKPOINT_KEY.DESKTOP;
-exports.DESKTOP_SM = BREAKPOINT_KEY.DESKTOP_SM;
-exports.MOBILE = BREAKPOINT_KEY.MOBILE;
-exports.TABLET = BREAKPOINT_KEY.TABLET;
+export const DESKTOP = BREAKPOINT_KEY.DESKTOP;
+export const DESKTOP_SM = BREAKPOINT_KEY.DESKTOP_SM;
+export const MOBILE = BREAKPOINT_KEY.MOBILE;
+export const TABLET = BREAKPOINT_KEY.TABLET;
 /**
  * Breakpoints constants
  */
-exports.desktop = BREAKPOINTS.DESKTOP;
-exports.desktopSm = BREAKPOINTS.DESKTOP_SM;
-exports.mobile = BREAKPOINTS.MOBILE;
-exports.tablet = BREAKPOINTS.TABLET;
+export const desktop = BREAKPOINTS.DESKTOP;
+export const desktopSm = BREAKPOINTS.DESKTOP_SM;
+export const mobile = BREAKPOINTS.MOBILE;
+export const tablet = BREAKPOINTS.TABLET;
 /**
  * Breakpoints queries
  */
-exports.desktopUp = `@media (min-width: ${exports.desktop}px)`;
-exports.desktopSmUp = `@media (min-width: ${exports.desktopSm}px)`;
-exports.mobileUp = `@media (min-width: ${exports.mobile}px)`;
-exports.tabletUp = `@media (min-width: ${exports.tablet}px)`;
+export const desktopUp = `@media (min-width: ${desktop}px)`;
+export const desktopSmUp = `@media (min-width: ${desktopSm}px)`;
+export const mobileUp = `@media (min-width: ${mobile}px)`;
+export const tabletUp = `@media (min-width: ${tablet}px)`;