npm - @onewelcome/react-lib-components - Versions diffs - 9.8.1 → 10.0.1 - Mend

@onewelcome/react-lib-components 9.8.1 → 10.0.1

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.

Files changed (4856) hide show

package/dist/components/_BaseStyling_/BaseStyling.es.js ADDED Viewed

@@ -0,0 +1,231 @@
+import React, { useState, useRef, useEffect } from "react";
+import { defaultButtonColors } from "./buttonBaseStyling.es.js";
+const BaseStyling = ({ children, properties = {} }) => {
+  const defaultProperties = {
+    colorPrimary50: "#E6E7F4",
+    colorPrimary100: "#CDD0EA",
+    colorPrimary300: "#6871BF",
+    colorPrimary500: "#041295",
+    colorPrimary600: "#030F77",
+    colorPrimary700: "#020B59",
+    colorPrimary900: "#01041E",
+    colorBlueGrey25: "#F7F7F9",
+    colorBlueGrey50: "#EEEFF3",
+    colorBlueGrey100: "#DEDEE6",
+    colorBlueGrey200: "#BCBECE",
+    colorBlueGrey300: "#9A9DB5",
+    colorBlueGrey400: "#797D9C",
+    colorBlueGrey500: "#5D607E",
+    colorBlueGrey700: "#383A4B",
+    colorBlueGrey800: "#252733",
+    colorBlueGrey900: "#131319",
+    colorGreen50: "#E8F3ED",
+    colorGreen100: "#D1E6DA",
+    colorGreen200: "#A2CDB4",
+    colorGreen500: "#178244",
+    colorGreen600: "#126836",
+    colorGreen700: "#0E4E29",
+    colorOrange50: "#FCF2E6",
+    colorOrange100: "#FFE0B2",
+    colorOrange500: "#E07900",
+    colorOrange600: "#B36100",
+    colorOrange700: "#864900",
+    colorRed50: "#FCE9E6",
+    colorRed100: "#FFCDD2",
+    colorRed200: "#F3A599",
+    colorRed500: "#E01E00",
+    colorRed600: "#B31800",
+    colorRed700: "#861200",
+    colorRed900: "#2D0600",
+    colorBlack100: "#000000",
+    colorBlack50: "rgba(0, 0, 0, 0.5)",
+    colorBlack20: "rgba(0, 0, 0, 0.2)",
+    colorBlack10: "rgba(0, 0, 0, 0.1)",
+    colorWhite: "#FFFFFF",
+    colorFocus: "var(--color-primary300)",
+    colorPrimary: "var(--color-primary500)",
+    colorSuccess: "var(--color-green500)",
+    colorWarning: "var(--color-orange500)",
+    colorDanger: "var(--color-red500)",
+    defaultPressedColor: "var(--color-blue-grey100)",
+    defaultHoverColor: "var(--color-blue-grey25)",
+    defaultLineHeight: "1.5",
+    dataGridLineHeight: "1.25",
+    defaultBorderRadius: "0.25rem",
+    focusBorderRadius: "0.125rem",
+    buttonBorderRadius: "0.125rem",
+    buttonBorderWidth: "2px",
+    buttonFontSize: "0.875rem",
+    buttonBorderStyle: "solid",
+    ...defaultButtonColors,
+    buttonFillTextColor: "var(--light)",
+    buttonOutlineHoverTextColor: "var(--color-primary600)",
+    //TODO: to be removed, it's not used anywhere within component library
+    checkboxUncheckedColor: "var(--color-blue-grey500)",
+    checkboxUncheckedHoverColor: "var(--color-blue-grey50)",
+    checkboxUncheckedPressedColor: "var(--default-pressed-color)",
+    checkboxCheckedColor: "var(--color-primary)",
+    checkboxCheckedHoverColor: "var(--color-primary600)",
+    checkboxCheckedPressedColor: "var(--color-primary700)",
+    radioHoverBackgroundColor: "var(--color-blue-grey50)",
+    radioPressedBackgroundColor: "var(--default-pressed-color)",
+    radioCheckedColor: "var(--color-primary)",
+    radioHoverColor: "var(--color-primary600)",
+    radioPressedColor: "var(--color-primary700)",
+    inputBorderRadius: "2px",
+    inputBorderWidth: "1px",
+    inputBorderWidthFocus: "1px",
+    inputBorderStyle: "solid",
+    fileUploadBorderWidth: "1px",
+    dragDropBorderStyle: "dashed",
+    inputBorderColor: "var(--color-blue-grey500)",
+    inputBackgroundColor: "var(--light)",
+    inputHelperTextColor: "var(--color-blue-grey500)",
+    inputHoverBackgroundColor: "var(--default-hover-color)",
+    inputDisabledBackgroundColor: "var(--input-hover-background-color)",
+    inputFontSize: "0.875rem",
+    dragBorderStyle: "solid",
+    modalTitleColor: "var(--font-color-h4)",
+    modalShadowColor: "rgba(0, 0, 0, 0.16)",
+    modalBackgroundColor: "var(--light)",
+    modalBackdropColor: "var(--default)",
+    modalContentFontSize: "0.875rem",
+    sideSheetShadowColorOne: "#01053214",
+    sideSheetShadowColorTwo: "#0105320a",
+    skeletonBackgroundColor: "var(--disabled)",
+    skeletonAnimationColorRgb: "255, 255, 255",
+    alertFontSize: "0.875rem",
+    alertTextColor: "var(--default)",
+    alertTextInvertedColor: "var(--color-blue-grey25)",
+    alertNeutralBackgroundColor: "var(--color-blue-grey50)",
+    alertNeutralInvertedColor: "var(--color-blue-grey500)",
+    alertInfoBackgroundColor: "var(--color-primary50)",
+    alertInfoInvertedColor: "var(--color-primary500)",
+    alertSuccessBackgroundColor: "var(--color-green50)",
+    alertSuccessInvertedColor: "var(--color-green500)",
+    alertErrorBackgroundColor: "var(--color-red50)",
+    alertErrorInvertedColor: "var(--color-red500)",
+    alertWarningBackgroundColor: "var(--color-orange50)",
+    alertWarningInvertedColor: "var(--color-orange600)",
+    alertBorderWidth: "4px",
+    alertBorderRadius: "2px",
+    stepperWaitingColor: "var(--color-blue-grey200)",
+    stepperWaitingHoverColor: "var(--color-blue-grey300)",
+    stepperWaitingActiveColor: "var(--color-blue-grey400)",
+    stepperWaitingDisabledColor: "var(--color-blue-grey100)",
+    stepperCurrentColor: "var(--color-primary500)",
+    stepperCurrentHoverColor: "var(--color-primary600)",
+    stepperCurrentActiveColor: "var(--color-primary700)",
+    stepperCurrentDisabledColor: "var(--color-primary100)",
+    stepperDoneColor: "var(--color-green500)",
+    stepperDoneHoverColor: "var(--color-green600)",
+    stepperDoneActiveColor: "var(--color-green700)",
+    stepperDoneDisabledColor: "var(--color-green200)",
+    stepperErrorColor: "var(--color-red500)",
+    stepperErrorHoverColor: "var(--color-red600)",
+    stepperErrorActiveColor: "var(--color-red700)",
+    stepperErrorDisabledColor: "var(--color-red200)",
+    stepperDefaultTextColor: "var(--color-white)",
+    stepperLineColor: "var(--color-blue-grey300)",
+    stepperLineBoldColor: "var(--color-blue-grey700)",
+    stepperLineDisabledColor: "var(--color-blue-grey100)",
+    stepperLineBoldDisabledColor: "var(--color-blue-grey300)",
+    stepperLabelColor: "var(--color-blue-grey900)",
+    stepperCaptionColor: "var(--color-blue-grey500)",
+    stepperCaptionErrorColor: "var(--color-red500)",
+    stepperLabelDisabledColor: "var(--color-blue-grey400)",
+    stepperCaptionDisabledColor: "var(--color-blue-grey400)",
+    stepperCaptionErrorDisabledColor: "var(--color-red200)",
+    bannerBorderRadius: "2px",
+    bannerBorderWidth: "4px",
+    dataGridRowBackgroundColor: "transparent",
+    dataGridRowHoverBackgroundColor: "var(--default-hover-color)",
+    progressBarBackgroundColor: "var(--disabled)",
+    tabsBackgroundColor: "var(--light)",
+    tabActiveBorderHeight: "0.25rem",
+    tabActiveBorderColor: "var(--color-primary)",
+    tabActiveTextColor: "var(--color-primary)",
+    tablistBorderWidth: "0.0625rem",
+    tablistBorderStyle: "solid",
+    tablistBorderColor: "var(--color-blue-grey100)",
+    tabTextColor: "var(--color-blue-grey900)",
+    tabHoverColor: "var(--default-hover-color)",
+    tabPressedColor: "var(--default-pressed-color)",
+    toggleBackgroundColor: "var(--color-blue-grey100)",
+    tooltipBackgroundColor: "var(--default)",
+    contextMenuHoverColor: "var(--default-hover-color)",
+    contextMenuActiveColor: "var(--color-primary)",
+    contextMenuPressedColor: "var(--default-pressed-color)",
+    contextMenuFontSize: "0.875rem",
+    linkFontSize: "var(--font-size)",
+    linkPrimaryDefaultColor: "var(--color-primary)",
+    linkPrimaryVisitedColor: "var(--button-primary-pressed-color)",
+    linkSuccessDefaultColor: "var(--color-success)",
+    linkSuccessVisitedColor: "var(--button-success-pressed-color)",
+    linkDangerDefaultColor: "var(--color-danger)",
+    linkDangerVisitedColor: "var(--button-danger-pressed-color)",
+    linkWarningDefaultColor: "var(--color-warning)",
+    linkWarningVisitedColor: "var(--button-warning-pressed-color)",
+    leftNavItemActiveRibbonColor: "var(--color-primary)",
+    leftNavItemActiveBackgroundColor: "var(--color-primary50)",
+    default: "var(--color-blue-grey900)",
+    success: "var(--color-green500)",
+    error: "var(--color-red500)",
+    info: "var(--color-primary500)",
+    disabled: "var(--color-blue-grey100)",
+    greyedOut: "var(--color-blue-grey400)",
+    lightGreyBorder: "var(--color-blue-grey100)",
+    warning: "var(--color-orange500)",
+    light: "var(--color-white)",
+    fontFamily: "Roboto, sans-serif",
+    fontFamilyCode: "'Roboto Mono', monospace",
+    fontSizeFormLabel: "0.875rem",
+    fontSize: "1rem",
+    fontColorBody: "var(--default)",
+    fontSizeH1: "2.5rem",
+    fontColorH1: "var(--default)",
+    fontSizeH2: "1.625rem",
+    fontColorH2: "var(--default)",
+    fontSizeH3: "1.5rem",
+    fontColorH3: "var(--default)",
+    fontSizeH4: "1.25rem",
+    fontColorH4: "var(--default)",
+    fontSizeSub: "0.75rem",
+    fontColorSub: "var(--default)",
+    fontSizeCode: "1rem",
+    fontColorCode: "var(--default)",
+    fontSizeSmall: "0.625rem",
+    fontSizeBig: "1.25rem",
+    readOnlyBorderColor: "var(--color-blue-grey100)",
+    readOnlyTextColor: "var(--color-blue-grey900)",
+    formControlFontSize: "0.875rem",
+    fontSizeDataGrid: "0.875rem",
+    iconFontBig: "1.125rem",
+    tooltipIndex: "12"
+  };
+  const [isLoading, setIsLoading] = useState(true);
+  const baseStylingWrapper = useRef(null);
+  const setCSSProperties = (CSSPropertiesObject) => {
+    for (const [key, value] of Object.entries(CSSPropertiesObject)) {
+      const formattedPropertyName = key.replace(/([A-Z])/g, (val) => `-${val.toLowerCase()}`);
+      baseStylingWrapper.current.style.setProperty(
+        `--${formattedPropertyName}`,
+        value
+      );
+    }
+  };
+  useEffect(() => {
+    if (Object.keys(properties).length !== 0 && baseStylingWrapper.current) {
+      const mergedState = { ...defaultProperties, ...properties };
+      setCSSProperties(mergedState);
+    } else if (baseStylingWrapper.current) {
+      setCSSProperties(defaultProperties);
+    }
+    setIsLoading(false);
+  }, [properties, baseStylingWrapper.current]);
+  return /* @__PURE__ */ React.createElement("div", { className: "basestyling-wrapper", ref: baseStylingWrapper }, !isLoading ? children : null);
+};
+export {
+  BaseStyling
+};
+//# sourceMappingURL=BaseStyling.es.js.map

package/dist/components/_BaseStyling_/BaseStyling.es.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"BaseStyling.es.js","sources":["../../../src/components/_BaseStyling_/BaseStyling.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n/**\n * If you add more CSS variables, and they are a color, make sure to go into /.storybook/addon/src/components/PanelContent.tsx\n * and make sure to add it to the shouldBeColorPicker array!\n */\n\nimport React, { HTMLAttributes, ReactElement, useEffect, useRef, useState } from \"react\";\nimport { ButtonColorProps, defaultButtonColors } from \"./buttonBaseStyling\";\n\nexport interface CSSProperties extends ButtonColorProps {\n colorFocus?: string;\n colorPrimary?: string;\n colorSuccess?: string;\n colorWarning?: string;\n colorDanger?: string;\n colorPrimary100?: string;\n colorPrimary300?: string;\n colorPrimary500?: string;\n colorPrimary600?: string;\n colorPrimary700?: string;\n colorPrimary900?: string;\n colorPrimary50?: string;\n colorBlueGrey25?: string;\n colorBlueGrey50?: string;\n colorBlueGrey100?: string;\n colorBlueGrey200?: string;\n colorBlueGrey300?: string;\n colorBlueGrey400?: string;\n colorBlueGrey500?: string;\n colorBlueGrey700?: string;\n colorBlueGrey800?: string;\n colorBlueGrey900?: string;\n colorGreen50?: string;\n colorGreen100?: string;\n colorGreen200?: string;\n colorGreen500?: string;\n colorGreen600?: string;\n colorGreen700?: string;\n colorOrange50?: string;\n colorOrange100?: string;\n colorOrange500?: string;\n colorOrange600?: string;\n colorOrange700?: string;\n colorRed50?: string;\n colorRed100?: string;\n colorRed200?: string;\n colorRed500?: string;\n colorRed600?: string;\n colorRed700?: string;\n colorRed900?: string;\n colorWhite?: string;\n colorBlack100?: string;\n colorBlack50?: string;\n colorBlack20?: string;\n colorBlack10?: string;\n defaultPressedColor?: string;\n defaultHoverColor?: string;\n defaultLineHeight?: string;\n dataGridLineHeight?: string;\n focusBorderRadius?: string;\n buttonBorderRadius?: string;\n buttonBorderWidth?: string;\n buttonFontSize?: string;\n buttonBorderStyle?: string;\n /**@deprecated*/\n buttonOutlineHoverTextColor?: string;\n buttonFillTextColor?: string;\n checkboxUncheckedColor?: string;\n checkboxUncheckedHoverColor?: string;\n checkboxUncheckedPressedColor?: string;\n checkboxCheckedColor?: string;\n checkboxCheckedHoverColor?: string;\n checkboxCheckedPressedColor?: string;\n radioHoverBackgroundColor?: string;\n radioPressedBackgroundColor?: string;\n radioHoverColor?: string;\n radioCheckedColor?: string;\n radioPressedColor?: string;\n defaultBorderRadius?: string;\n inputBorderRadius?: string;\n inputBorderWidth?: string;\n inputBorderWidthFocus?: string;\n inputBorderStyle?: string;\n inputBorderColor?: string;\n inputBackgroundColor?: string;\n inputHelperTextColor?: string;\n inputHoverBackgroundColor?: string;\n inputDisabledBackgroundColor?: string;\n inputFontSize?: string;\n dragBorderStyle?: string;\n modalTitleColor?: string;\n modalShadowColor?: string;\n modalBackgroundColor?: string;\n modalBackdropColor?: string;\n modalContentFontSize?: string;\n sideSheetShadowColorOne?: string;\n sideSheetShadowColorTwo?: string;\n skeletonBackgroundColor?: string;\n skeletonAnimationColorRgb?: string;\n\n alertFontSize?: string;\n alertTextColor?: string;\n alertTextInvertedColor?: string;\n alertNeutralBackgroundColor?: string;\n alertInfoBackgroundColor?: string;\n alertSuccessBackgroundColor?: string;\n alertErrorBackgroundColor?: string;\n alertWarningBackgroundColor?: string;\n alertNeutralInvertedColor?: string;\n alertInfoInvertedColor?: string;\n alertSuccessInvertedColor?: string;\n alertErrorInvertedColor?: string;\n alertWarningInvertedColor?: string;\n alertBorderWidth?: string;\n alertBorderRadius?: string;\n\n stepperWaitingColor?: string;\n stepperWaitingHoverColor?: string;\n stepperWaitingActiveColor?: string;\n stepperWaitingDisabledColor?: string;\n stepperCurrentColor?: string;\n stepperCurrentHoverColor?: string;\n stepperCurrentActiveColor?: string;\n stepperCurrentDisabledColor?: string;\n stepperDoneColor?: string;\n stepperDoneHoverColor?: string;\n stepperDoneActiveColor?: string;\n stepperDoneDisabledColor?: string;\n stepperErrorColor?: string;\n stepperErrorHoverColor?: string;\n stepperErrorActiveColor?: string;\n stepperErrorDisabledColor?: string;\n stepperDefaultTextColor?: string;\n stepperLineColor?: string;\n stepperLineBoldColor?: string;\n stepperLineDisabledColor?: string;\n stepperLineBoldDisabledColor?: string;\n stepperLabelColor?: string;\n stepperCaptionColor?: string;\n stepperCaptionErrorColor?: string;\n stepperLabelDisabledColor?: string;\n stepperCaptionDisabledColor?: string;\n stepperCaptionErrorDisabledColor?: string;\n bannerBorderRadius?: string;\n bannerBorderWidth?: string;\n dataGridRowBackgroundColor?: string;\n dataGridRowHoverBackgroundColor?: string;\n progressBarBackgroundColor?: string;\n tabsBackgroundColor?: string;\n tabActiveBorderHeight?: string;\n tabActiveBorderColor?: string;\n tabActiveTextColor?: string;\n tablistBorderWidth?: string;\n tablistBorderStyle?: string;\n tablistBorderColor?: string;\n tabTextColor?: string;\n tabHoverColor?: string;\n tabPressedColor?: string;\n toggleBackgroundColor?: string;\n tooltipBackgroundColor?: string;\n\n contextMenuHoverColor?: string;\n contextMenuActiveColor?: string;\n contextMenuPressedColor?: string;\n contextMenuFontSize?: string;\n\n linkFontSize?: string;\n linkPrimaryDefaultColor?: string;\n linkPrimaryVisitedColor?: string;\n linkSuccessDefaultColor?: string;\n linkSuccessVisitedColor?: string;\n linkDangerDefaultColor?: string;\n linkDangerVisitedColor?: string;\n linkWarningDefaultColor?: string;\n linkWarningVisitedColor?: string;\n\n leftNavItemActiveRibbonColor?: string;\n leftNavItemActiveBackgroundColor?: string;\n\n default?: string;\n success?: string;\n error?: string;\n info?: string;\n disabled?: string;\n greyedOut?: string;\n lightGreyBorder?: string;\n warning?: string;\n light?: string;\n\n fontFamily?: string;\n fontFamilyCode?: string;\n fontSizeFormLabel?: string;\n fontSize?: string;\n fontColorBody?: string;\n fontSizeH1?: string;\n fontColorH1?: string;\n fontSizeH2?: string;\n fontColorH2?: string;\n fontSizeH3?: string;\n fontColorH3?: string;\n fontSizeH4?: string;\n fontColorH4?: string;\n fontSizeSub?: string;\n fontColorSub?: string;\n fontSizeCode?: string;\n fontColorCode?: string;\n fontSizeSmall?: string;\n fontSizeBig?: string;\n\n formControlFontSize?: string;\n fileUploadBorderWidth?: string;\n dragDropBorderStyle?: string;\n fontSizeDataGrid?: string;\n readOnlyBorderColor?: string;\n readOnlyTextColor?: string;\n iconFontBig?: string;\n tooltipIndex?: string;\n}\n\nexport interface Props extends HTMLAttributes<HTMLDivElement> {\n children?: ReactElement[] | ReactElement | string[] | string | number[] | number;\n properties?: CSSProperties;\n}\n\nexport const BaseStyling = ({ children, properties = {} }: Props) => {\n const defaultProperties: CSSProperties = {\n colorPrimary50: \"#E6E7F4\",\n colorPrimary100: \"#CDD0EA\",\n colorPrimary300: \"#6871BF\",\n colorPrimary500: \"#041295\",\n colorPrimary600: \"#030F77\",\n colorPrimary700: \"#020B59\",\n colorPrimary900: \"#01041E\",\n colorBlueGrey25: \"#F7F7F9\",\n colorBlueGrey50: \"#EEEFF3\",\n colorBlueGrey100: \"#DEDEE6\",\n colorBlueGrey200: \"#BCBECE\",\n colorBlueGrey300: \"#9A9DB5\",\n colorBlueGrey400: \"#797D9C\",\n colorBlueGrey500: \"#5D607E\",\n colorBlueGrey700: \"#383A4B\",\n colorBlueGrey800: \"#252733\",\n colorBlueGrey900: \"#131319\",\n colorGreen50: \"#E8F3ED\",\n colorGreen100: \"#D1E6DA\",\n colorGreen200: \"#A2CDB4\",\n colorGreen500: \"#178244\",\n colorGreen600: \"#126836\",\n colorGreen700: \"#0E4E29\",\n colorOrange50: \"#FCF2E6\",\n colorOrange100: \"#FFE0B2\",\n colorOrange500: \"#E07900\",\n colorOrange600: \"#B36100\",\n colorOrange700: \"#864900\",\n colorRed50: \"#FCE9E6\",\n colorRed100: \"#FFCDD2\",\n colorRed200: \"#F3A599\",\n colorRed500: \"#E01E00\",\n colorRed600: \"#B31800\",\n colorRed700: \"#861200\",\n colorRed900: \"#2D0600\",\n colorBlack100: \"#000000\",\n colorBlack50: \"rgba(0, 0, 0, 0.5)\",\n colorBlack20: \"rgba(0, 0, 0, 0.2)\",\n colorBlack10: \"rgba(0, 0, 0, 0.1)\",\n colorWhite: \"#FFFFFF\",\n colorFocus: \"var(--color-primary300)\",\n colorPrimary: \"var(--color-primary500)\",\n colorSuccess: \"var(--color-green500)\",\n colorWarning: \"var(--color-orange500)\",\n colorDanger: \"var(--color-red500)\",\n defaultPressedColor: \"var(--color-blue-grey100)\",\n defaultHoverColor: \"var(--color-blue-grey25)\",\n defaultLineHeight: \"1.5\",\n dataGridLineHeight: \"1.25\",\n defaultBorderRadius: \"0.25rem\",\n focusBorderRadius: \"0.125rem\",\n buttonBorderRadius: \"0.125rem\",\n buttonBorderWidth: \"2px\",\n buttonFontSize: \"0.875rem\",\n buttonBorderStyle: \"solid\",\n ...defaultButtonColors,\n buttonFillTextColor: \"var(--light)\",\n buttonOutlineHoverTextColor: \"var(--color-primary600)\", //TODO: to be removed, it's not used anywhere within component library\n checkboxUncheckedColor: \"var(--color-blue-grey500)\",\n checkboxUncheckedHoverColor: \"var(--color-blue-grey50)\",\n checkboxUncheckedPressedColor: \"var(--default-pressed-color)\",\n checkboxCheckedColor: \"var(--color-primary)\",\n checkboxCheckedHoverColor: \"var(--color-primary600)\",\n checkboxCheckedPressedColor: \"var(--color-primary700)\",\n radioHoverBackgroundColor: \"var(--color-blue-grey50)\",\n radioPressedBackgroundColor: \"var(--default-pressed-color)\",\n radioCheckedColor: \"var(--color-primary)\",\n radioHoverColor: \"var(--color-primary600)\",\n radioPressedColor: \"var(--color-primary700)\",\n inputBorderRadius: \"2px\",\n inputBorderWidth: \"1px\",\n inputBorderWidthFocus: \"1px\",\n inputBorderStyle: \"solid\",\n fileUploadBorderWidth: \"1px\",\n dragDropBorderStyle: \"dashed\",\n inputBorderColor: \"var(--color-blue-grey500)\",\n inputBackgroundColor: \"var(--light)\",\n inputHelperTextColor: \"var(--color-blue-grey500)\",\n inputHoverBackgroundColor: \"var(--default-hover-color)\",\n inputDisabledBackgroundColor: \"var(--input-hover-background-color)\",\n inputFontSize: \"0.875rem\",\n dragBorderStyle: \"solid\",\n modalTitleColor: \"var(--font-color-h4)\",\n modalShadowColor: \"rgba(0, 0, 0, 0.16)\",\n modalBackgroundColor: \"var(--light)\",\n modalBackdropColor: \"var(--default)\",\n modalContentFontSize: \"0.875rem\",\n sideSheetShadowColorOne: \"#01053214\",\n sideSheetShadowColorTwo: \"#0105320a\",\n skeletonBackgroundColor: \"var(--disabled)\",\n skeletonAnimationColorRgb: \"255, 255, 255\",\n\n alertFontSize: \"0.875rem\",\n alertTextColor: \"var(--default)\",\n alertTextInvertedColor: \"var(--color-blue-grey25)\",\n\n alertNeutralBackgroundColor: \"var(--color-blue-grey50)\",\n alertNeutralInvertedColor: \"var(--color-blue-grey500)\",\n alertInfoBackgroundColor: \"var(--color-primary50)\",\n alertInfoInvertedColor: \"var(--color-primary500)\",\n alertSuccessBackgroundColor: \"var(--color-green50)\",\n alertSuccessInvertedColor: \"var(--color-green500)\",\n alertErrorBackgroundColor: \"var(--color-red50)\",\n alertErrorInvertedColor: \"var(--color-red500)\",\n alertWarningBackgroundColor: \"var(--color-orange50)\",\n alertWarningInvertedColor: \"var(--color-orange600)\",\n alertBorderWidth: \"4px\",\n alertBorderRadius: \"2px\",\n\n stepperWaitingColor: \"var(--color-blue-grey200)\",\n stepperWaitingHoverColor: \"var(--color-blue-grey300)\",\n stepperWaitingActiveColor: \"var(--color-blue-grey400)\",\n stepperWaitingDisabledColor: \"var(--color-blue-grey100)\",\n stepperCurrentColor: \"var(--color-primary500)\",\n stepperCurrentHoverColor: \"var(--color-primary600)\",\n stepperCurrentActiveColor: \"var(--color-primary700)\",\n stepperCurrentDisabledColor: \"var(--color-primary100)\",\n stepperDoneColor: \"var(--color-green500)\",\n stepperDoneHoverColor: \"var(--color-green600)\",\n stepperDoneActiveColor: \"var(--color-green700)\",\n stepperDoneDisabledColor: \"var(--color-green200)\",\n stepperErrorColor: \"var(--color-red500)\",\n stepperErrorHoverColor: \"var(--color-red600)\",\n stepperErrorActiveColor: \"var(--color-red700)\",\n stepperErrorDisabledColor: \"var(--color-red200)\",\n stepperDefaultTextColor: \"var(--color-white)\",\n stepperLineColor: \"var(--color-blue-grey300)\",\n stepperLineBoldColor: \"var(--color-blue-grey700)\",\n stepperLineDisabledColor: \"var(--color-blue-grey100)\",\n stepperLineBoldDisabledColor: \"var(--color-blue-grey300)\",\n stepperLabelColor: \"var(--color-blue-grey900)\",\n stepperCaptionColor: \"var(--color-blue-grey500)\",\n stepperCaptionErrorColor: \"var(--color-red500)\",\n stepperLabelDisabledColor: \"var(--color-blue-grey400)\",\n stepperCaptionDisabledColor: \"var(--color-blue-grey400)\",\n stepperCaptionErrorDisabledColor: \"var(--color-red200)\",\n bannerBorderRadius: \"2px\",\n bannerBorderWidth: \"4px\",\n dataGridRowBackgroundColor: \"transparent\",\n dataGridRowHoverBackgroundColor: \"var(--default-hover-color)\",\n progressBarBackgroundColor: \"var(--disabled)\",\n tabsBackgroundColor: \"var(--light)\",\n tabActiveBorderHeight: \"0.25rem\",\n tabActiveBorderColor: \"var(--color-primary)\",\n tabActiveTextColor: \"var(--color-primary)\",\n tablistBorderWidth: \"0.0625rem\",\n tablistBorderStyle: \"solid\",\n tablistBorderColor: \"var(--color-blue-grey100)\",\n tabTextColor: \"var(--color-blue-grey900)\",\n tabHoverColor: \"var(--default-hover-color)\",\n tabPressedColor: \"var(--default-pressed-color)\",\n toggleBackgroundColor: \"var(--color-blue-grey100)\",\n tooltipBackgroundColor: \"var(--default)\",\n\n contextMenuHoverColor: \"var(--default-hover-color)\",\n contextMenuActiveColor: \"var(--color-primary)\",\n contextMenuPressedColor: \"var(--default-pressed-color)\",\n contextMenuFontSize: \"0.875rem\",\n\n linkFontSize: \"var(--font-size)\",\n linkPrimaryDefaultColor: \"var(--color-primary)\",\n linkPrimaryVisitedColor: \"var(--button-primary-pressed-color)\",\n linkSuccessDefaultColor: \"var(--color-success)\",\n linkSuccessVisitedColor: \"var(--button-success-pressed-color)\",\n linkDangerDefaultColor: \"var(--color-danger)\",\n linkDangerVisitedColor: \"var(--button-danger-pressed-color)\",\n linkWarningDefaultColor: \"var(--color-warning)\",\n linkWarningVisitedColor: \"var(--button-warning-pressed-color)\",\n\n leftNavItemActiveRibbonColor: \"var(--color-primary)\",\n leftNavItemActiveBackgroundColor: \"var(--color-primary50)\",\n\n default: \"var(--color-blue-grey900)\",\n success: \"var(--color-green500)\",\n error: \"var(--color-red500)\",\n info: \"var(--color-primary500)\",\n disabled: \"var(--color-blue-grey100)\",\n greyedOut: \"var(--color-blue-grey400)\",\n lightGreyBorder: \"var(--color-blue-grey100)\",\n warning: \"var(--color-orange500)\",\n light: \"var(--color-white)\",\n\n fontFamily: \"Roboto, sans-serif\",\n fontFamilyCode: \"'Roboto Mono', monospace\",\n fontSizeFormLabel: \"0.875rem\",\n fontSize: \"1rem\",\n fontColorBody: \"var(--default)\",\n fontSizeH1: \"2.5rem\",\n fontColorH1: \"var(--default)\",\n fontSizeH2: \"1.625rem\",\n fontColorH2: \"var(--default)\",\n fontSizeH3: \"1.5rem\",\n fontColorH3: \"var(--default)\",\n fontSizeH4: \"1.25rem\",\n fontColorH4: \"var(--default)\",\n fontSizeSub: \"0.75rem\",\n fontColorSub: \"var(--default)\",\n fontSizeCode: \"1rem\",\n fontColorCode: \"var(--default)\",\n fontSizeSmall: \"0.625rem\",\n fontSizeBig: \"1.25rem\",\n\n readOnlyBorderColor: \"var(--color-blue-grey100)\",\n readOnlyTextColor: \"var(--color-blue-grey900)\",\n formControlFontSize: \"0.875rem\",\n fontSizeDataGrid: \"0.875rem\",\n iconFontBig: \"1.125rem\",\n tooltipIndex: \"12\"\n };\n\n /** We need a loading state, because otherwise you see the colors flash from the default to the possible overridden ones. */\n const [isLoading, setIsLoading] = useState(true);\n const baseStylingWrapper = useRef(null);\n\n const setCSSProperties = (CSSPropertiesObject: CSSProperties) => {\n for (const [key, value] of Object.entries(CSSPropertiesObject)) {\n const formattedPropertyName = key.replace(/([A-Z])/g, val => `-${val.toLowerCase()}`);\n (baseStylingWrapper.current! as HTMLElement).style.setProperty(\n `--${formattedPropertyName}`,\n value\n );\n }\n };\n\n useEffect(() => {\n if (Object.keys(properties).length !== 0 && baseStylingWrapper.current) {\n const mergedState = { ...defaultProperties, ...properties };\n setCSSProperties(mergedState);\n } else if (baseStylingWrapper.current) {\n setCSSProperties(defaultProperties);\n }\n setIsLoading(false);\n }, [properties, baseStylingWrapper.current]);\n\n return (\n <div className=\"basestyling-wrapper\" ref={baseStylingWrapper}>\n {!isLoading ? children : null}\n </div>\n );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/_BaseStyling_/buttonBaseStyling.cjs.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"}),exports.defaultButtonColors={buttonPrimaryDefaultColor:"var(--color-primary500)",buttonPrimaryHoverColor:"var(--color-primary600)",buttonPrimaryFocusedColor:"var(--color-primary500)",buttonPrimaryPressedColor:"var(--color-primary700)",buttonSuccessDefaultColor:"var(--color-green500)",buttonSuccessHoverColor:"var(--color-green600)",buttonSuccessFocusedColor:"var(--color-green500)",buttonSuccessPressedColor:"var(--color-green700)",buttonDangerDefaultColor:"var(--color-red500)",buttonDangerHoverColor:"var(--color-red600)",buttonDangerFocusedColor:"var(--color-red500)",buttonDangerPressedColor:"var(--color-red700)",buttonWarningDefaultColor:"var(--color-orange500)",buttonWarningHoverColor:"var(--color-orange600)",buttonWarningFocusedColor:"var(--color-orange500)",buttonWarningPressedColor:"var(--color-orange700)",buttonDefaultColor:"var(--color-blue-grey700)",buttonDefaultHoverColor:"var(--color-blue-grey800)",buttonDefaultFocusedColor:"var(--color-blue-grey700)",buttonDefaultPressedColor:"var(--color-blue-grey800)",buttonFillPrimaryDefaultColor:"var(--button-primary-default-color)",buttonFillPrimaryHoverColor:"var(--button-primary-hover-color)",buttonFillPrimaryFocusedColor:"var(--button-primary-focused-color)",buttonFillPrimaryPressedColor:"var(--button-primary-pressed-color)",buttonFillSuccessDefaultColor:"var(--button-success-default-color)",buttonFillSuccessHoverColor:"var(--button-success-hover-color)",buttonFillSuccessFocusedColor:"var(--button-success-focused-color)",buttonFillSuccessPressedColor:"var(--button-success-pressed-color)",buttonFillDangerDefaultColor:"var(--button-danger-default-color)",buttonFillDangerHoverColor:"var(--button-danger-hover-color)",buttonFillDangerFocusedColor:"var(--button-danger-focused-color)",buttonFillDangerPressedColor:"var(--button-danger-pressed-color)",buttonFillWarningDefaultColor:"var(--button-warning-default-color)",buttonFillWarningHoverColor:"var(--button-warning-hover-color)",buttonFillWarningFocusedColor:"var(--button-warning-focused-color)",buttonFillWarningPressedColor:"var(--button-warning-pressed-color)",buttonFillDefaultDefaultColor:"var(--button-default-default-color)",buttonFillDefaultHoverColor:"var(--button-default-hover-color)",buttonFillDefaultFocusedColor:"var(--button-default-focused-color)",buttonFillDefaultPressedColor:"var(--button-default-pressed-color)",buttonOutlinePrimaryDefaultColor:"var(--button-primary-default-color)",buttonOutlinePrimaryHoverColor:"var(--button-primary-hover-color)",buttonOutlinePrimaryFocusedColor:"var(--button-primary-focused-color)",buttonOutlinePrimaryPressedColor:"var(--button-primary-pressed-color)",buttonOutlineSuccessDefaultColor:"var(--button-success-default-color)",buttonOutlineSuccessHoverColor:"var(--button-success-hover-color)",buttonOutlineSuccessFocusedColor:"var(--button-success-focused-color)",buttonOutlineSuccessPressedColor:"var(--button-success-pressed-color)",buttonOutlineDangerDefaultColor:"var(--button-danger-default-color)",buttonOutlineDangerHoverColor:"var(--button-danger-hover-color)",buttonOutlineDangerFocusedColor:"var(--button-danger-focused-color)",buttonOutlineDangerPressedColor:"var(--button-danger-pressed-color)",buttonOutlineWarningDefaultColor:"var(--button-warning-default-color)",buttonOutlineWarningHoverColor:"var(--button-warning-hover-color)",buttonOutlineWarningFocusedColor:"var(--button-warning-focused-color)",buttonOutlineWarningPressedColor:"var(--button-warning-pressed-color)",buttonOutlineDefaultDefaultColor:"var(--button-default-default-color)",buttonOutlineDefaultHoverColor:"var(--button-default-hover-color)",buttonOutlineDefaultFocusedColor:"var(--button-default-focused-color)",buttonOutlineDefaultPressedColor:"var(--button-default-pressed-color)",buttonTextPrimaryDefaultColor:"var(--button-primary-default-color)",buttonTextPrimaryHoverColor:"var(--button-primary-hover-color)",buttonTextPrimaryFocusedColor:"var(--button-primary-focused-color)",buttonTextPrimaryPressedColor:"var(--button-primary-pressed-color)",buttonTextSuccessDefaultColor:"var(--button-success-default-color)",buttonTextSuccessHoverColor:"var(--button-success-hover-color)",buttonTextSuccessFocusedColor:"var(--button-success-focused-color)",buttonTextSuccessPressedColor:"var(--button-success-pressed-color)",buttonTextDangerDefaultColor:"var(--button-danger-default-color)",buttonTextDangerHoverColor:"var(--button-danger-hover-color)",buttonTextDangerFocusedColor:"var(--button-danger-focused-color)",buttonTextDangerPressedColor:"var(--button-danger-pressed-color)",buttonTextWarningDefaultColor:"var(--button-warning-default-color)",buttonTextWarningHoverColor:"var(--button-warning-hover-color)",buttonTextWarningFocusedColor:"var(--button-warning-focused-color)",buttonTextWarningPressedColor:"var(--button-warning-pressed-color)",buttonTextDefaultDefaultColor:"var(--button-default-default-color)",buttonTextDefaultHoverColor:"var(--button-default-hover-color)",buttonTextDefaultFocusedColor:"var(--button-default-focused-color)",buttonTextDefaultPressedColor:"var(--button-default-pressed-color)"};
2	+ //# sourceMappingURL=buttonBaseStyling.cjs.js.map

package/dist/components/_BaseStyling_/buttonBaseStyling.cjs.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"buttonBaseStyling.cjs.js","sources":["../../../src/components/_BaseStyling_/buttonBaseStyling.ts"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\ntype ButtonType = \"primary\" | \"success\" | \"danger\" | \"warning\" | \"default\";\ntype ButtonVariant = \"fill\" | \"outline\" | \"text\";\ntype ButtonState = \"default\" | \"hover\" | \"focused\" | \"pressed\";\n\ntype CapitalizeString<T extends string> = T extends `${infer First}${infer Rest}`\n ? `${Uppercase<First>}${Rest}`\n : T;\n\ntype Flattened<K extends string> = {\n [Key in K]?: string;\n};\n\ntype BaseButtonProps = Omit<\n Flattened<`button${CapitalizeString<ButtonType>}${CapitalizeString<ButtonState>}Color`>,\n \"buttonDefaultDefaultColor\"\n> & { buttonDefaultColor?: string };\n\ntype VariantButtonProps =\n Flattened<`button${CapitalizeString<ButtonVariant>}${CapitalizeString<ButtonType>}${CapitalizeString<ButtonState>}Color`>;\n\nexport type ButtonColorProps = BaseButtonProps & VariantButtonProps;\n\nexport const defaultButtonColors: Required<ButtonColorProps> = {\n buttonPrimaryDefaultColor: \"var(--color-primary500)\",\n buttonPrimaryHoverColor: \"var(--color-primary600)\",\n buttonPrimaryFocusedColor: \"var(--color-primary500)\",\n buttonPrimaryPressedColor: \"var(--color-primary700)\",\n buttonSuccessDefaultColor: \"var(--color-green500)\",\n buttonSuccessHoverColor: \"var(--color-green600)\",\n buttonSuccessFocusedColor: \"var(--color-green500)\",\n buttonSuccessPressedColor: \"var(--color-green700)\",\n buttonDangerDefaultColor: \"var(--color-red500)\",\n buttonDangerHoverColor: \"var(--color-red600)\",\n buttonDangerFocusedColor: \"var(--color-red500)\",\n buttonDangerPressedColor: \"var(--color-red700)\",\n buttonWarningDefaultColor: \"var(--color-orange500)\",\n buttonWarningHoverColor: \"var(--color-orange600)\",\n buttonWarningFocusedColor: \"var(--color-orange500)\",\n buttonWarningPressedColor: \"var(--color-orange700)\",\n buttonDefaultColor: \"var(--color-blue-grey700)\",\n buttonDefaultHoverColor: \"var(--color-blue-grey800)\",\n buttonDefaultFocusedColor: \"var(--color-blue-grey700)\",\n buttonDefaultPressedColor: \"var(--color-blue-grey800)\",\n\n buttonFillPrimaryDefaultColor: \"var(--button-primary-default-color)\",\n buttonFillPrimaryHoverColor: \"var(--button-primary-hover-color)\",\n buttonFillPrimaryFocusedColor: \"var(--button-primary-focused-color)\",\n buttonFillPrimaryPressedColor: \"var(--button-primary-pressed-color)\",\n buttonFillSuccessDefaultColor: \"var(--button-success-default-color)\",\n buttonFillSuccessHoverColor: \"var(--button-success-hover-color)\",\n buttonFillSuccessFocusedColor: \"var(--button-success-focused-color)\",\n buttonFillSuccessPressedColor: \"var(--button-success-pressed-color)\",\n buttonFillDangerDefaultColor: \"var(--button-danger-default-color)\",\n buttonFillDangerHoverColor: \"var(--button-danger-hover-color)\",\n buttonFillDangerFocusedColor: \"var(--button-danger-focused-color)\",\n buttonFillDangerPressedColor: \"var(--button-danger-pressed-color)\",\n buttonFillWarningDefaultColor: \"var(--button-warning-default-color)\",\n buttonFillWarningHoverColor: \"var(--button-warning-hover-color)\",\n buttonFillWarningFocusedColor: \"var(--button-warning-focused-color)\",\n buttonFillWarningPressedColor: \"var(--button-warning-pressed-color)\",\n buttonFillDefaultDefaultColor: \"var(--button-default-default-color)\",\n buttonFillDefaultHoverColor: \"var(--button-default-hover-color)\",\n buttonFillDefaultFocusedColor: \"var(--button-default-focused-color)\",\n buttonFillDefaultPressedColor: \"var(--button-default-pressed-color)\",\n\n buttonOutlinePrimaryDefaultColor: \"var(--button-primary-default-color)\",\n buttonOutlinePrimaryHoverColor: \"var(--button-primary-hover-color)\",\n buttonOutlinePrimaryFocusedColor: \"var(--button-primary-focused-color)\",\n buttonOutlinePrimaryPressedColor: \"var(--button-primary-pressed-color)\",\n buttonOutlineSuccessDefaultColor: \"var(--button-success-default-color)\",\n buttonOutlineSuccessHoverColor: \"var(--button-success-hover-color)\",\n buttonOutlineSuccessFocusedColor: \"var(--button-success-focused-color)\",\n buttonOutlineSuccessPressedColor: \"var(--button-success-pressed-color)\",\n buttonOutlineDangerDefaultColor: \"var(--button-danger-default-color)\",\n buttonOutlineDangerHoverColor: \"var(--button-danger-hover-color)\",\n buttonOutlineDangerFocusedColor: \"var(--button-danger-focused-color)\",\n buttonOutlineDangerPressedColor: \"var(--button-danger-pressed-color)\",\n buttonOutlineWarningDefaultColor: \"var(--button-warning-default-color)\",\n buttonOutlineWarningHoverColor: \"var(--button-warning-hover-color)\",\n buttonOutlineWarningFocusedColor: \"var(--button-warning-focused-color)\",\n buttonOutlineWarningPressedColor: \"var(--button-warning-pressed-color)\",\n buttonOutlineDefaultDefaultColor: \"var(--button-default-default-color)\",\n buttonOutlineDefaultHoverColor: \"var(--button-default-hover-color)\",\n buttonOutlineDefaultFocusedColor: \"var(--button-default-focused-color)\",\n buttonOutlineDefaultPressedColor: \"var(--button-default-pressed-color)\",\n\n buttonTextPrimaryDefaultColor: \"var(--button-primary-default-color)\",\n buttonTextPrimaryHoverColor: \"var(--button-primary-hover-color)\",\n buttonTextPrimaryFocusedColor: \"var(--button-primary-focused-color)\",\n buttonTextPrimaryPressedColor: \"var(--button-primary-pressed-color)\",\n buttonTextSuccessDefaultColor: \"var(--button-success-default-color)\",\n buttonTextSuccessHoverColor: \"var(--button-success-hover-color)\",\n buttonTextSuccessFocusedColor: \"var(--button-success-focused-color)\",\n buttonTextSuccessPressedColor: \"var(--button-success-pressed-color)\",\n buttonTextDangerDefaultColor: \"var(--button-danger-default-color)\",\n buttonTextDangerHoverColor: \"var(--button-danger-hover-color)\",\n buttonTextDangerFocusedColor: \"var(--button-danger-focused-color)\",\n buttonTextDangerPressedColor: \"var(--button-danger-pressed-color)\",\n buttonTextWarningDefaultColor: \"var(--button-warning-default-color)\",\n buttonTextWarningHoverColor: \"var(--button-warning-hover-color)\",\n buttonTextWarningFocusedColor: \"var(--button-warning-focused-color)\",\n buttonTextWarningPressedColor: \"var(--button-warning-pressed-color)\",\n buttonTextDefaultDefaultColor: \"var(--button-default-default-color)\",\n buttonTextDefaultHoverColor: \"var(--button-default-hover-color)\",\n buttonTextDefaultFocusedColor: \"var(--button-default-focused-color)\",\n buttonTextDefaultPressedColor: \"var(--button-default-pressed-color)\"\n};\n"],"names":["buttonPrimaryDefaultColor","buttonPrimaryHoverColor","buttonPrimaryFocusedColor","buttonPrimaryPressedColor","buttonSuccessDefaultColor","buttonSuccessHoverColor","buttonSuccessFocusedColor","buttonSuccessPressedColor","buttonDangerDefaultColor","buttonDangerHoverColor","buttonDangerFocusedColor","buttonDangerPressedColor","buttonWarningDefaultColor","buttonWarningHoverColor","buttonWarningFocusedColor","buttonWarningPressedColor","buttonDefaultColor","buttonDefaultHoverColor","buttonDefaultFocusedColor","buttonDefaultPressedColor","buttonFillPrimaryDefaultColor","buttonFillPrimaryHoverColor","buttonFillPrimaryFocusedColor","buttonFillPrimaryPressedColor","buttonFillSuccessDefaultColor","buttonFillSuccessHoverColor","buttonFillSuccessFocusedColor","buttonFillSuccessPressedColor","buttonFillDangerDefaultColor","buttonFillDangerHoverColor","buttonFillDangerFocusedColor","buttonFillDangerPressedColor","buttonFillWarningDefaultColor","buttonFillWarningHoverColor","buttonFillWarningFocusedColor","buttonFillWarningPressedColor","buttonFillDefaultDefaultColor","buttonFillDefaultHoverColor","buttonFillDefaultFocusedColor","buttonFillDefaultPressedColor","buttonOutlinePrimaryDefaultColor","buttonOutlinePrimaryHoverColor","buttonOutlinePrimaryFocusedColor","buttonOutlinePrimaryPressedColor","buttonOutlineSuccessDefaultColor","buttonOutlineSuccessHoverColor","buttonOutlineSuccessFocusedColor","buttonOutlineSuccessPressedColor","buttonOutlineDangerDefaultColor","buttonOutlineDangerHoverColor","buttonOutlineDangerFocusedColor","buttonOutlineDangerPressedColor","buttonOutlineWarningDefaultColor","buttonOutlineWarningHoverColor","buttonOutlineWarningFocusedColor","buttonOutlineWarningPressedColor","buttonOutlineDefaultDefaultColor","buttonOutlineDefaultHoverColor","buttonOutlineDefaultFocusedColor","buttonOutlineDefaultPressedColor","buttonTextPrimaryDefaultColor","buttonTextPrimaryHoverColor","buttonTextPrimaryFocusedColor","buttonTextPrimaryPressedColor","buttonTextSuccessDefaultColor","buttonTextSuccessHoverColor","buttonTextSuccessFocusedColor","buttonTextSuccessPressedColor","buttonTextDangerDefaultColor","buttonTextDangerHoverColor","buttonTextDangerFocusedColor","buttonTextDangerPressedColor","buttonTextWarningDefaultColor","buttonTextWarningHoverColor","buttonTextWarningFocusedColor","buttonTextWarningPressedColor","buttonTextDefaultDefaultColor","buttonTextDefaultHoverColor","buttonTextDefaultFocusedColor","buttonTextDefaultPressedColor"],"mappings":"4GAsC+D,CAC7DA,0BAA2B,0BAC3BC,wBAAyB,0BACzBC,0BAA2B,0BAC3BC,0BAA2B,0BAC3BC,0BAA2B,wBAC3BC,wBAAyB,wBACzBC,0BAA2B,wBAC3BC,0BAA2B,wBAC3BC,yBAA0B,sBAC1BC,uBAAwB,sBACxBC,yBAA0B,sBAC1BC,yBAA0B,sBAC1BC,0BAA2B,yBAC3BC,wBAAyB,yBACzBC,0BAA2B,yBAC3BC,0BAA2B,yBAC3BC,mBAAoB,4BACpBC,wBAAyB,4BACzBC,0BAA2B,4BAC3BC,0BAA2B,4BAE3BC,8BAA+B,sCAC/BC,4BAA6B,oCAC7BC,8BAA+B,sCAC/BC,8BAA+B,sCAC/BC,8BAA+B,sCAC/BC,4BAA6B,oCAC7BC,8BAA+B,sCAC/BC,8BAA+B,sCAC/BC,6BAA8B,qCAC9BC,2BAA4B,mCAC5BC,6BAA8B,qCAC9BC,6BAA8B,qCAC9BC,8BAA+B,sCAC/BC,4BAA6B,oCAC7BC,8BAA+B,sCAC/BC,8BAA+B,sCAC/BC,8BAA+B,sCAC/BC,4BAA6B,oCAC7BC,8BAA+B,sCAC/BC,8BAA+B,sCAE/BC,iCAAkC,sCAClCC,+BAAgC,oCAChCC,iCAAkC,sCAClCC,iCAAkC,sCAClCC,iCAAkC,sCAClCC,+BAAgC,oCAChCC,iCAAkC,sCAClCC,iCAAkC,sCAClCC,gCAAiC,qCACjCC,8BAA+B,mCAC/BC,gCAAiC,qCACjCC,gCAAiC,qCACjCC,iCAAkC,sCAClCC,+BAAgC,oCAChCC,iCAAkC,sCAClCC,iCAAkC,sCAClCC,iCAAkC,sCAClCC,+BAAgC,oCAChCC,iCAAkC,sCAClCC,iCAAkC,sCAElCC,8BAA+B,sCAC/BC,4BAA6B,oCAC7BC,8BAA+B,sCAC/BC,8BAA+B,sCAC/BC,8BAA+B,sCAC/BC,4BAA6B,oCAC7BC,8BAA+B,sCAC/BC,8BAA+B,sCAC/BC,6BAA8B,qCAC9BC,2BAA4B,mCAC5BC,6BAA8B,qCAC9BC,6BAA8B,qCAC9BC,8BAA+B,sCAC/BC,4BAA6B,oCAC7BC,8BAA+B,sCAC/BC,8BAA+B,sCAC/BC,8BAA+B,sCAC/BC,4BAA6B,oCAC7BC,8BAA+B,sCAC/BC,8BAA+B"}

package/dist/components/_BaseStyling_/buttonBaseStyling.es.js ADDED Viewed

@@ -0,0 +1,86 @@
+const defaultButtonColors = {
+  buttonPrimaryDefaultColor: "var(--color-primary500)",
+  buttonPrimaryHoverColor: "var(--color-primary600)",
+  buttonPrimaryFocusedColor: "var(--color-primary500)",
+  buttonPrimaryPressedColor: "var(--color-primary700)",
+  buttonSuccessDefaultColor: "var(--color-green500)",
+  buttonSuccessHoverColor: "var(--color-green600)",
+  buttonSuccessFocusedColor: "var(--color-green500)",
+  buttonSuccessPressedColor: "var(--color-green700)",
+  buttonDangerDefaultColor: "var(--color-red500)",
+  buttonDangerHoverColor: "var(--color-red600)",
+  buttonDangerFocusedColor: "var(--color-red500)",
+  buttonDangerPressedColor: "var(--color-red700)",
+  buttonWarningDefaultColor: "var(--color-orange500)",
+  buttonWarningHoverColor: "var(--color-orange600)",
+  buttonWarningFocusedColor: "var(--color-orange500)",
+  buttonWarningPressedColor: "var(--color-orange700)",
+  buttonDefaultColor: "var(--color-blue-grey700)",
+  buttonDefaultHoverColor: "var(--color-blue-grey800)",
+  buttonDefaultFocusedColor: "var(--color-blue-grey700)",
+  buttonDefaultPressedColor: "var(--color-blue-grey800)",
+  buttonFillPrimaryDefaultColor: "var(--button-primary-default-color)",
+  buttonFillPrimaryHoverColor: "var(--button-primary-hover-color)",
+  buttonFillPrimaryFocusedColor: "var(--button-primary-focused-color)",
+  buttonFillPrimaryPressedColor: "var(--button-primary-pressed-color)",
+  buttonFillSuccessDefaultColor: "var(--button-success-default-color)",
+  buttonFillSuccessHoverColor: "var(--button-success-hover-color)",
+  buttonFillSuccessFocusedColor: "var(--button-success-focused-color)",
+  buttonFillSuccessPressedColor: "var(--button-success-pressed-color)",
+  buttonFillDangerDefaultColor: "var(--button-danger-default-color)",
+  buttonFillDangerHoverColor: "var(--button-danger-hover-color)",
+  buttonFillDangerFocusedColor: "var(--button-danger-focused-color)",
+  buttonFillDangerPressedColor: "var(--button-danger-pressed-color)",
+  buttonFillWarningDefaultColor: "var(--button-warning-default-color)",
+  buttonFillWarningHoverColor: "var(--button-warning-hover-color)",
+  buttonFillWarningFocusedColor: "var(--button-warning-focused-color)",
+  buttonFillWarningPressedColor: "var(--button-warning-pressed-color)",
+  buttonFillDefaultDefaultColor: "var(--button-default-default-color)",
+  buttonFillDefaultHoverColor: "var(--button-default-hover-color)",
+  buttonFillDefaultFocusedColor: "var(--button-default-focused-color)",
+  buttonFillDefaultPressedColor: "var(--button-default-pressed-color)",
+  buttonOutlinePrimaryDefaultColor: "var(--button-primary-default-color)",
+  buttonOutlinePrimaryHoverColor: "var(--button-primary-hover-color)",
+  buttonOutlinePrimaryFocusedColor: "var(--button-primary-focused-color)",
+  buttonOutlinePrimaryPressedColor: "var(--button-primary-pressed-color)",
+  buttonOutlineSuccessDefaultColor: "var(--button-success-default-color)",
+  buttonOutlineSuccessHoverColor: "var(--button-success-hover-color)",
+  buttonOutlineSuccessFocusedColor: "var(--button-success-focused-color)",
+  buttonOutlineSuccessPressedColor: "var(--button-success-pressed-color)",
+  buttonOutlineDangerDefaultColor: "var(--button-danger-default-color)",
+  buttonOutlineDangerHoverColor: "var(--button-danger-hover-color)",
+  buttonOutlineDangerFocusedColor: "var(--button-danger-focused-color)",
+  buttonOutlineDangerPressedColor: "var(--button-danger-pressed-color)",
+  buttonOutlineWarningDefaultColor: "var(--button-warning-default-color)",
+  buttonOutlineWarningHoverColor: "var(--button-warning-hover-color)",
+  buttonOutlineWarningFocusedColor: "var(--button-warning-focused-color)",
+  buttonOutlineWarningPressedColor: "var(--button-warning-pressed-color)",
+  buttonOutlineDefaultDefaultColor: "var(--button-default-default-color)",
+  buttonOutlineDefaultHoverColor: "var(--button-default-hover-color)",
+  buttonOutlineDefaultFocusedColor: "var(--button-default-focused-color)",
+  buttonOutlineDefaultPressedColor: "var(--button-default-pressed-color)",
+  buttonTextPrimaryDefaultColor: "var(--button-primary-default-color)",
+  buttonTextPrimaryHoverColor: "var(--button-primary-hover-color)",
+  buttonTextPrimaryFocusedColor: "var(--button-primary-focused-color)",
+  buttonTextPrimaryPressedColor: "var(--button-primary-pressed-color)",
+  buttonTextSuccessDefaultColor: "var(--button-success-default-color)",
+  buttonTextSuccessHoverColor: "var(--button-success-hover-color)",
+  buttonTextSuccessFocusedColor: "var(--button-success-focused-color)",
+  buttonTextSuccessPressedColor: "var(--button-success-pressed-color)",
+  buttonTextDangerDefaultColor: "var(--button-danger-default-color)",
+  buttonTextDangerHoverColor: "var(--button-danger-hover-color)",
+  buttonTextDangerFocusedColor: "var(--button-danger-focused-color)",
+  buttonTextDangerPressedColor: "var(--button-danger-pressed-color)",
+  buttonTextWarningDefaultColor: "var(--button-warning-default-color)",
+  buttonTextWarningHoverColor: "var(--button-warning-hover-color)",
+  buttonTextWarningFocusedColor: "var(--button-warning-focused-color)",
+  buttonTextWarningPressedColor: "var(--button-warning-pressed-color)",
+  buttonTextDefaultDefaultColor: "var(--button-default-default-color)",
+  buttonTextDefaultHoverColor: "var(--button-default-hover-color)",
+  buttonTextDefaultFocusedColor: "var(--button-default-focused-color)",
+  buttonTextDefaultPressedColor: "var(--button-default-pressed-color)"
+};
+export {
+  defaultButtonColors
+};
+//# sourceMappingURL=buttonBaseStyling.es.js.map

package/dist/components/_BaseStyling_/buttonBaseStyling.es.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"buttonBaseStyling.es.js","sources":["../../../src/components/_BaseStyling_/buttonBaseStyling.ts"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\ntype ButtonType = \"primary\" | \"success\" | \"danger\" | \"warning\" | \"default\";\ntype ButtonVariant = \"fill\" | \"outline\" | \"text\";\ntype ButtonState = \"default\" | \"hover\" | \"focused\" | \"pressed\";\n\ntype CapitalizeString<T extends string> = T extends `${infer First}${infer Rest}`\n ? `${Uppercase<First>}${Rest}`\n : T;\n\ntype Flattened<K extends string> = {\n [Key in K]?: string;\n};\n\ntype BaseButtonProps = Omit<\n Flattened<`button${CapitalizeString<ButtonType>}${CapitalizeString<ButtonState>}Color`>,\n \"buttonDefaultDefaultColor\"\n> & { buttonDefaultColor?: string };\n\ntype VariantButtonProps =\n Flattened<`button${CapitalizeString<ButtonVariant>}${CapitalizeString<ButtonType>}${CapitalizeString<ButtonState>}Color`>;\n\nexport type ButtonColorProps = BaseButtonProps & VariantButtonProps;\n\nexport const defaultButtonColors: Required<ButtonColorProps> = {\n buttonPrimaryDefaultColor: \"var(--color-primary500)\",\n buttonPrimaryHoverColor: \"var(--color-primary600)\",\n buttonPrimaryFocusedColor: \"var(--color-primary500)\",\n buttonPrimaryPressedColor: \"var(--color-primary700)\",\n buttonSuccessDefaultColor: \"var(--color-green500)\",\n buttonSuccessHoverColor: \"var(--color-green600)\",\n buttonSuccessFocusedColor: \"var(--color-green500)\",\n buttonSuccessPressedColor: \"var(--color-green700)\",\n buttonDangerDefaultColor: \"var(--color-red500)\",\n buttonDangerHoverColor: \"var(--color-red600)\",\n buttonDangerFocusedColor: \"var(--color-red500)\",\n buttonDangerPressedColor: \"var(--color-red700)\",\n buttonWarningDefaultColor: \"var(--color-orange500)\",\n buttonWarningHoverColor: \"var(--color-orange600)\",\n buttonWarningFocusedColor: \"var(--color-orange500)\",\n buttonWarningPressedColor: \"var(--color-orange700)\",\n buttonDefaultColor: \"var(--color-blue-grey700)\",\n buttonDefaultHoverColor: \"var(--color-blue-grey800)\",\n buttonDefaultFocusedColor: \"var(--color-blue-grey700)\",\n buttonDefaultPressedColor: \"var(--color-blue-grey800)\",\n\n buttonFillPrimaryDefaultColor: \"var(--button-primary-default-color)\",\n buttonFillPrimaryHoverColor: \"var(--button-primary-hover-color)\",\n buttonFillPrimaryFocusedColor: \"var(--button-primary-focused-color)\",\n buttonFillPrimaryPressedColor: \"var(--button-primary-pressed-color)\",\n buttonFillSuccessDefaultColor: \"var(--button-success-default-color)\",\n buttonFillSuccessHoverColor: \"var(--button-success-hover-color)\",\n buttonFillSuccessFocusedColor: \"var(--button-success-focused-color)\",\n buttonFillSuccessPressedColor: \"var(--button-success-pressed-color)\",\n buttonFillDangerDefaultColor: \"var(--button-danger-default-color)\",\n buttonFillDangerHoverColor: \"var(--button-danger-hover-color)\",\n buttonFillDangerFocusedColor: \"var(--button-danger-focused-color)\",\n buttonFillDangerPressedColor: \"var(--button-danger-pressed-color)\",\n buttonFillWarningDefaultColor: \"var(--button-warning-default-color)\",\n buttonFillWarningHoverColor: \"var(--button-warning-hover-color)\",\n buttonFillWarningFocusedColor: \"var(--button-warning-focused-color)\",\n buttonFillWarningPressedColor: \"var(--button-warning-pressed-color)\",\n buttonFillDefaultDefaultColor: \"var(--button-default-default-color)\",\n buttonFillDefaultHoverColor: \"var(--button-default-hover-color)\",\n buttonFillDefaultFocusedColor: \"var(--button-default-focused-color)\",\n buttonFillDefaultPressedColor: \"var(--button-default-pressed-color)\",\n\n buttonOutlinePrimaryDefaultColor: \"var(--button-primary-default-color)\",\n buttonOutlinePrimaryHoverColor: \"var(--button-primary-hover-color)\",\n buttonOutlinePrimaryFocusedColor: \"var(--button-primary-focused-color)\",\n buttonOutlinePrimaryPressedColor: \"var(--button-primary-pressed-color)\",\n buttonOutlineSuccessDefaultColor: \"var(--button-success-default-color)\",\n buttonOutlineSuccessHoverColor: \"var(--button-success-hover-color)\",\n buttonOutlineSuccessFocusedColor: \"var(--button-success-focused-color)\",\n buttonOutlineSuccessPressedColor: \"var(--button-success-pressed-color)\",\n buttonOutlineDangerDefaultColor: \"var(--button-danger-default-color)\",\n buttonOutlineDangerHoverColor: \"var(--button-danger-hover-color)\",\n buttonOutlineDangerFocusedColor: \"var(--button-danger-focused-color)\",\n buttonOutlineDangerPressedColor: \"var(--button-danger-pressed-color)\",\n buttonOutlineWarningDefaultColor: \"var(--button-warning-default-color)\",\n buttonOutlineWarningHoverColor: \"var(--button-warning-hover-color)\",\n buttonOutlineWarningFocusedColor: \"var(--button-warning-focused-color)\",\n buttonOutlineWarningPressedColor: \"var(--button-warning-pressed-color)\",\n buttonOutlineDefaultDefaultColor: \"var(--button-default-default-color)\",\n buttonOutlineDefaultHoverColor: \"var(--button-default-hover-color)\",\n buttonOutlineDefaultFocusedColor: \"var(--button-default-focused-color)\",\n buttonOutlineDefaultPressedColor: \"var(--button-default-pressed-color)\",\n\n buttonTextPrimaryDefaultColor: \"var(--button-primary-default-color)\",\n buttonTextPrimaryHoverColor: \"var(--button-primary-hover-color)\",\n buttonTextPrimaryFocusedColor: \"var(--button-primary-focused-color)\",\n buttonTextPrimaryPressedColor: \"var(--button-primary-pressed-color)\",\n buttonTextSuccessDefaultColor: \"var(--button-success-default-color)\",\n buttonTextSuccessHoverColor: \"var(--button-success-hover-color)\",\n buttonTextSuccessFocusedColor: \"var(--button-success-focused-color)\",\n buttonTextSuccessPressedColor: \"var(--button-success-pressed-color)\",\n buttonTextDangerDefaultColor: \"var(--button-danger-default-color)\",\n buttonTextDangerHoverColor: \"var(--button-danger-hover-color)\",\n buttonTextDangerFocusedColor: \"var(--button-danger-focused-color)\",\n buttonTextDangerPressedColor: \"var(--button-danger-pressed-color)\",\n buttonTextWarningDefaultColor: \"var(--button-warning-default-color)\",\n buttonTextWarningHoverColor: \"var(--button-warning-hover-color)\",\n buttonTextWarningFocusedColor: \"var(--button-warning-focused-color)\",\n buttonTextWarningPressedColor: \"var(--button-warning-pressed-color)\",\n buttonTextDefaultDefaultColor: \"var(--button-default-default-color)\",\n buttonTextDefaultHoverColor: \"var(--button-default-hover-color)\",\n buttonTextDefaultFocusedColor: \"var(--button-default-focused-color)\",\n buttonTextDefaultPressedColor: \"var(--button-default-pressed-color)\"\n};\n"],"names":[],"mappings":"AAsCO,MAAM,sBAAkD;AAAA,EAC7D,2BAA2B;AAAA,EAC3B,yBAAyB;AAAA,EACzB,2BAA2B;AAAA,EAC3B,2BAA2B;AAAA,EAC3B,2BAA2B;AAAA,EAC3B,yBAAyB;AAAA,EACzB,2BAA2B;AAAA,EAC3B,2BAA2B;AAAA,EAC3B,0BAA0B;AAAA,EAC1B,wBAAwB;AAAA,EACxB,0BAA0B;AAAA,EAC1B,0BAA0B;AAAA,EAC1B,2BAA2B;AAAA,EAC3B,yBAAyB;AAAA,EACzB,2BAA2B;AAAA,EAC3B,2BAA2B;AAAA,EAC3B,oBAAoB;AAAA,EACpB,yBAAyB;AAAA,EACzB,2BAA2B;AAAA,EAC3B,2BAA2B;AAAA,EAE3B,+BAA+B;AAAA,EAC/B,6BAA6B;AAAA,EAC7B,+BAA+B;AAAA,EAC/B,+BAA+B;AAAA,EAC/B,+BAA+B;AAAA,EAC/B,6BAA6B;AAAA,EAC7B,+BAA+B;AAAA,EAC/B,+BAA+B;AAAA,EAC/B,8BAA8B;AAAA,EAC9B,4BAA4B;AAAA,EAC5B,8BAA8B;AAAA,EAC9B,8BAA8B;AAAA,EAC9B,+BAA+B;AAAA,EAC/B,6BAA6B;AAAA,EAC7B,+BAA+B;AAAA,EAC/B,+BAA+B;AAAA,EAC/B,+BAA+B;AAAA,EAC/B,6BAA6B;AAAA,EAC7B,+BAA+B;AAAA,EAC/B,+BAA+B;AAAA,EAE/B,kCAAkC;AAAA,EAClC,gCAAgC;AAAA,EAChC,kCAAkC;AAAA,EAClC,kCAAkC;AAAA,EAClC,kCAAkC;AAAA,EAClC,gCAAgC;AAAA,EAChC,kCAAkC;AAAA,EAClC,kCAAkC;AAAA,EAClC,iCAAiC;AAAA,EACjC,+BAA+B;AAAA,EAC/B,iCAAiC;AAAA,EACjC,iCAAiC;AAAA,EACjC,kCAAkC;AAAA,EAClC,gCAAgC;AAAA,EAChC,kCAAkC;AAAA,EAClC,kCAAkC;AAAA,EAClC,kCAAkC;AAAA,EAClC,gCAAgC;AAAA,EAChC,kCAAkC;AAAA,EAClC,kCAAkC;AAAA,EAElC,+BAA+B;AAAA,EAC/B,6BAA6B;AAAA,EAC7B,+BAA+B;AAAA,EAC/B,+BAA+B;AAAA,EAC/B,+BAA+B;AAAA,EAC/B,6BAA6B;AAAA,EAC7B,+BAA+B;AAAA,EAC/B,+BAA+B;AAAA,EAC/B,8BAA8B;AAAA,EAC9B,4BAA4B;AAAA,EAC5B,8BAA8B;AAAA,EAC9B,8BAA8B;AAAA,EAC9B,+BAA+B;AAAA,EAC/B,6BAA6B;AAAA,EAC7B,+BAA+B;AAAA,EAC/B,+BAA+B;AAAA,EAC/B,+BAA+B;AAAA,EAC/B,6BAA6B;AAAA,EAC7B,+BAA+B;AAAA,EAC/B,+BAA+B;AACjC;"}

package/dist/components/admin/layout/LeftNav/LeftNav.cjs.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),t=require("./LeftNav.module.scss.cjs.js"),n=require("./LeftNavItem/LeftNavItem.cjs.js"),r=require("./useRefItems.cjs.js"),a=require("../../../../hooks/useScreenSize.cjs.js"),s=e.forwardRef((({isSideMenuOpen:s,onScreenSizeChange:i,items:l,navigate:c,onItemClick:o,marginTop:u,internalLinkPrefix:m,...f},d)=>{const[S,v]=e.useState(s);a.useScreenSize({onScreenSizeChange:i});const g=r.useRefItems({items:l});return e.createElement("nav",{...f,ref:d},e.createElement("ul",{style:{"--margin-top":u},className:`${t.default.sidenavbar} ${s?"":t.default["sidenavbar--collapsed"]} ${s?t.default.open:""} ${S?"":t.default.hidden}`,onTransitionEnd:()=>{v(s)}},l.length?l.map((t=>e.createElement(n.LeftNavItem,{ref:e=>g.addElementReference(e,t.key),key:t.key,item:t,navigate:c,onItemClick:o,refItems:g,internalLinkPrefix:m}))):null))}));exports.LeftNav=s;
2	+ //# sourceMappingURL=LeftNav.cjs.js.map

package/dist/components/admin/layout/LeftNav/LeftNav.cjs.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"LeftNav.cjs.js","sources":["../../../../../src/components/admin/layout/LeftNav/LeftNav.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, {\n ComponentPropsWithRef,\n CSSProperties,\n ForwardRefRenderFunction,\n useState\n} from \"react\";\nimport classes from \"./LeftNav.module.scss\";\nimport { MenuItem } from \"./LeftNav.interfaces\";\nimport { LeftNavItem } from \"./LeftNavItem/LeftNavItem\";\nimport { useRefItems } from \"./useRefItems\";\nimport { ScreenSize } from \"../../../../variables\";\nimport { useScreenSize } from \"../../../../hooks/useScreenSize\";\n\nexport interface Props extends ComponentPropsWithRef<\"nav\"> {\n isSideMenuOpen?: boolean;\n onScreenSizeChange?: (nextScreenSize: ScreenSize, prevScreenSize?: ScreenSize) => void;\n items: MenuItem[];\n navigate: (path: string) => void;\n onItemClick?: (path?: string, button?: boolean) => void;\n marginTop?: string;\n internalLinkPrefix?: string;\n}\n\nconst LeftNavComponent: ForwardRefRenderFunction<HTMLElement, Props> = (\n {\n isSideMenuOpen,\n onScreenSizeChange,\n items,\n navigate,\n onItemClick,\n marginTop,\n internalLinkPrefix,\n ...rest\n },\n ref\n) => {\n const [isSideNavbarVisible, setIsSideNavbarVisible] = useState(isSideMenuOpen);\n useScreenSize({ onScreenSizeChange });\n const refItems = useRefItems({ items });\n\n const onSideNavbarTransitionEnd: React.TransitionEventHandler<HTMLUListElement> = () => {\n setIsSideNavbarVisible(isSideMenuOpen);\n };\n\n const renderMenuItems = () => {\n if (!items.length) {\n return null;\n }\n\n return items.map(item => {\n return (\n <LeftNavItem\n ref={el => refItems.addElementReference(el, item.key)}\n key={item.key}\n item={item}\n navigate={navigate}\n onItemClick={onItemClick}\n refItems={refItems}\n internalLinkPrefix={internalLinkPrefix}\n />\n );\n });\n };\n\n return (\n <nav {...rest} ref={ref}>\n <ul\n style={{ \"--margin-top\": marginTop } as CSSProperties}\n className={`${classes[\"sidenavbar\"]} ${!isSideMenuOpen ? classes[\"sidenavbar--collapsed\"] : \"\"} ${isSideMenuOpen ? classes[\"open\"] : \"\"} ${\n !isSideNavbarVisible ? classes[\"hidden\"] : \"\"\n }`}\n onTransitionEnd={onSideNavbarTransitionEnd}\n >\n {renderMenuItems()}\n </ul>\n </nav>\n );\n};\n\nexport const LeftNav = React.forwardRef(LeftNavComponent);\n"],"names":["LeftNav","React","forwardRef","isSideMenuOpen","onScreenSizeChange","items","navigate","onItemClick","marginTop","internalLinkPrefix","rest","ref","isSideNavbarVisible","setIsSideNavbarVisible","useState","useScreenSize","refItems","useRefItems","createElement","style","className","classes","default","onTransitionEnd","length","map","item","LeftNavItem","el","addElementReference","key"],"mappings":"uRA+FaA,EAAUC,EAAMC,YAxD0C,EAEnEC,iBACAC,qBACAC,QACAC,WACAC,cACAC,YACAC,wBACGC,GAELC,KAEA,MAAOC,EAAqBC,GAA0BC,EAAAA,SAASX,GACjDY,EAAAA,cAAA,CAAEX,uBAChB,MAAMY,EAAWC,EAAAA,YAAY,CAAEZ,UA2B5B,OAAAJ,EAAAiB,cAAA,MAAA,IAAQR,EAAMC,OACbV,EAAAiB,cAAC,KAAA,CACCC,MAAO,CAAE,eAAgBX,GACzBY,UAAW,GAAGC,UAAoB,cAAMlB,EAAoD,GAAnCkB,EAAQC,QAAA,4BAAiCnB,EAAiBkB,UAAc,KAAI,MAClIT,EAA0C,GAApBS,UAAgB,SAEzCE,gBA/B4E,KAChFV,EAAuBV,EAAc,GAIhCE,EAAMmB,OAIJnB,EAAMoB,KAAYC,GAErBzB,EAAAiB,cAACS,EAAAA,YAAA,CACChB,IAAWiB,GAAAZ,EAASa,oBAAoBD,EAAIF,EAAKI,KACjDA,IAAKJ,EAAKI,IACVJ,OACApB,WACAC,cACAS,WACAP,yBAZG,MA6BT"}

package/dist/components/admin/layout/LeftNav/LeftNav.es.js ADDED Viewed

@@ -0,0 +1,55 @@
+import React, { useState } from "react";
+import classes from "./LeftNav.module.scss.es.js";
+import { LeftNavItem } from "./LeftNavItem/LeftNavItem.es.js";
+import { useRefItems } from "./useRefItems.es.js";
+import { useScreenSize } from "../../../../hooks/useScreenSize.es.js";
+const LeftNavComponent = ({
+  isSideMenuOpen,
+  onScreenSizeChange,
+  items,
+  navigate,
+  onItemClick,
+  marginTop,
+  internalLinkPrefix,
+  ...rest
+}, ref) => {
+  const [isSideNavbarVisible, setIsSideNavbarVisible] = useState(isSideMenuOpen);
+  useScreenSize({ onScreenSizeChange });
+  const refItems = useRefItems({ items });
+  const onSideNavbarTransitionEnd = () => {
+    setIsSideNavbarVisible(isSideMenuOpen);
+  };
+  const renderMenuItems = () => {
+    if (!items.length) {
+      return null;
+    }
+    return items.map((item) => {
+      return /* @__PURE__ */ React.createElement(
+        LeftNavItem,
+        {
+          ref: (el) => refItems.addElementReference(el, item.key),
+          key: item.key,
+          item,
+          navigate,
+          onItemClick,
+          refItems,
+          internalLinkPrefix
+        }
+      );
+    });
+  };
+  return /* @__PURE__ */ React.createElement("nav", { ...rest, ref }, /* @__PURE__ */ React.createElement(
+    "ul",
+    {
+      style: { "--margin-top": marginTop },
+      className: `${classes["sidenavbar"]} ${!isSideMenuOpen ? classes["sidenavbar--collapsed"] : ""} ${isSideMenuOpen ? classes["open"] : ""} ${!isSideNavbarVisible ? classes["hidden"] : ""}`,
+      onTransitionEnd: onSideNavbarTransitionEnd
+    },
+    renderMenuItems()
+  ));
+};
+const LeftNav = React.forwardRef(LeftNavComponent);
+export {
+  LeftNav
+};
+//# sourceMappingURL=LeftNav.es.js.map

package/dist/components/admin/layout/LeftNav/LeftNav.es.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"LeftNav.es.js","sources":["../../../../../src/components/admin/layout/LeftNav/LeftNav.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, {\n ComponentPropsWithRef,\n CSSProperties,\n ForwardRefRenderFunction,\n useState\n} from \"react\";\nimport classes from \"./LeftNav.module.scss\";\nimport { MenuItem } from \"./LeftNav.interfaces\";\nimport { LeftNavItem } from \"./LeftNavItem/LeftNavItem\";\nimport { useRefItems } from \"./useRefItems\";\nimport { ScreenSize } from \"../../../../variables\";\nimport { useScreenSize } from \"../../../../hooks/useScreenSize\";\n\nexport interface Props extends ComponentPropsWithRef<\"nav\"> {\n isSideMenuOpen?: boolean;\n onScreenSizeChange?: (nextScreenSize: ScreenSize, prevScreenSize?: ScreenSize) => void;\n items: MenuItem[];\n navigate: (path: string) => void;\n onItemClick?: (path?: string, button?: boolean) => void;\n marginTop?: string;\n internalLinkPrefix?: string;\n}\n\nconst LeftNavComponent: ForwardRefRenderFunction<HTMLElement, Props> = (\n {\n isSideMenuOpen,\n onScreenSizeChange,\n items,\n navigate,\n onItemClick,\n marginTop,\n internalLinkPrefix,\n ...rest\n },\n ref\n) => {\n const [isSideNavbarVisible, setIsSideNavbarVisible] = useState(isSideMenuOpen);\n useScreenSize({ onScreenSizeChange });\n const refItems = useRefItems({ items });\n\n const onSideNavbarTransitionEnd: React.TransitionEventHandler<HTMLUListElement> = () => {\n setIsSideNavbarVisible(isSideMenuOpen);\n };\n\n const renderMenuItems = () => {\n if (!items.length) {\n return null;\n }\n\n return items.map(item => {\n return (\n <LeftNavItem\n ref={el => refItems.addElementReference(el, item.key)}\n key={item.key}\n item={item}\n navigate={navigate}\n onItemClick={onItemClick}\n refItems={refItems}\n internalLinkPrefix={internalLinkPrefix}\n />\n );\n });\n };\n\n return (\n <nav {...rest} ref={ref}>\n <ul\n style={{ \"--margin-top\": marginTop } as CSSProperties}\n className={`${classes[\"sidenavbar\"]} ${!isSideMenuOpen ? classes[\"sidenavbar--collapsed\"] : \"\"} ${isSideMenuOpen ? classes[\"open\"] : \"\"} ${\n !isSideNavbarVisible ? classes[\"hidden\"] : \"\"\n }`}\n onTransitionEnd={onSideNavbarTransitionEnd}\n >\n {renderMenuItems()}\n </ul>\n </nav>\n );\n};\n\nexport const LeftNav = React.forwardRef(LeftNavComponent);\n"],"names":[],"mappings":";;;;;AAuCA,MAAM,mBAAiE,CACrE;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GACA,QACG;AACH,QAAM,CAAC,qBAAqB,sBAAsB,IAAI,SAAS,cAAc;AAC/D,gBAAA,EAAE,oBAAoB;AACpC,QAAM,WAAW,YAAY,EAAE,OAAO;AAEtC,QAAM,4BAA4E,MAAM;AACtF,2BAAuB,cAAc;AAAA,EACvC;AAEA,QAAM,kBAAkB,MAAM;AACxB,QAAA,CAAC,MAAM,QAAQ;AACV,aAAA;AAAA,IAAA;AAGF,WAAA,MAAM,IAAI,CAAQ,SAAA;AAErB,aAAA,sBAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,KAAK,CAAM,OAAA,SAAS,oBAAoB,IAAI,KAAK,GAAG;AAAA,UACpD,KAAK,KAAK;AAAA,UACV;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,MACF;AAAA,IAAA,CAEH;AAAA,EACH;AAEA,SACG,sBAAA,cAAA,OAAA,EAAK,GAAG,MAAM,IACb,GAAA,sBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAO,EAAE,gBAAgB,UAAU;AAAA,MACnC,WAAW,GAAG,QAAQ,YAAY,CAAC,IAAI,CAAC,iBAAiB,QAAQ,uBAAuB,IAAI,EAAE,IAAI,iBAAiB,QAAQ,MAAM,IAAI,EAAE,IACrI,CAAC,sBAAsB,QAAQ,QAAQ,IAAI,EAC7C;AAAA,MACA,iBAAiB;AAAA,IAAA;AAAA,IAEhB,gBAAgB;AAAA,EAAA,CAErB;AAEJ;AAEa,MAAA,UAAU,MAAM,WAAW,gBAAgB;"}

package/dist/components/admin/layout/LeftNav/LeftNav.module.scss.cjs.js ADDED Viewed

@@ -0,0 +1,3 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode('.LeftNav_sr-only_k4xuc{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.LeftNav_hidden_k4xuc{display:none}.LeftNav_slide-in_k4xuc{animation:LeftNav_slide-in_k4xuc .5s forwards}@media (prefers-reduced-motion: reduce){.LeftNav_slide-in_k4xuc{animation-duration:.1ms}}.LeftNav_slide-out_k4xuc{animation:LeftNav_slide-out_k4xuc .5s forwards}@media (prefers-reduced-motion: reduce){.LeftNav_slide-out_k4xuc{animation-duration:.1ms}}@keyframes LeftNav_slide-in_k4xuc{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes LeftNav_slide-out_k4xuc{0%{transform:translateY(0)}to{transform:translateY(100vh)}}/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the "License");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an "AS IS" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */.LeftNav_sidenavbar_k4xuc{--margin-top: 4rem;position:fixed;z-index:2;display:block;overflow-y:auto;flex-shrink:0;width:15rem;height:calc(100vh - var(--margin-top));padding:0;margin:0;font-family:var(--font-family);background-color:#fff;box-shadow:0 2px 2px #01053205,0 3px 4px #01053205,0 1px 5px #0105320a;transition:transform .2s ease-in-out}@media screen and (max-width: 50em){.LeftNav_sidenavbar_k4xuc{box-shadow:0 30px 50px #00000029;transform:translate(-110%)}.LeftNav_sidenavbar_k4xuc.LeftNav_hidden_k4xuc{visibility:hidden}.LeftNav_sidenavbar_k4xuc.LeftNav_open_k4xuc{visibility:visible;transform:translate(0)}}@media screen and (min-width: 50em){.LeftNav_sidenavbar_k4xuc.LeftNav_sidenavbar--collapsed_k4xuc{box-shadow:0 30px 50px #00000029;transform:translate(-110%)}.LeftNav_sidenavbar_k4xuc.LeftNav_sidenavbar--collapsed_k4xuc.LeftNav_hidden_k4xuc{visibility:hidden}}')),document.head.appendChild(e)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}}();
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e="LeftNav_hidden_k4xuc",a="LeftNav_sidenavbar_k4xuc",d="LeftNav_open_k4xuc",s={hidden:e,sidenavbar:a,open:d,"sidenavbar--collapsed":"LeftNav_sidenavbar--collapsed_k4xuc"};exports.default=s,exports.hidden=e,exports.open=d,exports.sidenavbar=a;
+//# sourceMappingURL=LeftNav.module.scss.cjs.js.map

package/dist/components/admin/layout/LeftNav/LeftNav.module.scss.es.js ADDED Viewed

@@ -0,0 +1,17 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode('.LeftNav_sr-only_k4xuc{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.LeftNav_hidden_k4xuc{display:none}.LeftNav_slide-in_k4xuc{animation:LeftNav_slide-in_k4xuc .5s forwards}@media (prefers-reduced-motion: reduce){.LeftNav_slide-in_k4xuc{animation-duration:.1ms}}.LeftNav_slide-out_k4xuc{animation:LeftNav_slide-out_k4xuc .5s forwards}@media (prefers-reduced-motion: reduce){.LeftNav_slide-out_k4xuc{animation-duration:.1ms}}@keyframes LeftNav_slide-in_k4xuc{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes LeftNav_slide-out_k4xuc{0%{transform:translateY(0)}to{transform:translateY(100vh)}}/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the "License");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an "AS IS" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */.LeftNav_sidenavbar_k4xuc{--margin-top: 4rem;position:fixed;z-index:2;display:block;overflow-y:auto;flex-shrink:0;width:15rem;height:calc(100vh - var(--margin-top));padding:0;margin:0;font-family:var(--font-family);background-color:#fff;box-shadow:0 2px 2px #01053205,0 3px 4px #01053205,0 1px 5px #0105320a;transition:transform .2s ease-in-out}@media screen and (max-width: 50em){.LeftNav_sidenavbar_k4xuc{box-shadow:0 30px 50px #00000029;transform:translate(-110%)}.LeftNav_sidenavbar_k4xuc.LeftNav_hidden_k4xuc{visibility:hidden}.LeftNav_sidenavbar_k4xuc.LeftNav_open_k4xuc{visibility:visible;transform:translate(0)}}@media screen and (min-width: 50em){.LeftNav_sidenavbar_k4xuc.LeftNav_sidenavbar--collapsed_k4xuc{box-shadow:0 30px 50px #00000029;transform:translate(-110%)}.LeftNav_sidenavbar_k4xuc.LeftNav_sidenavbar--collapsed_k4xuc.LeftNav_hidden_k4xuc{visibility:hidden}}')),document.head.appendChild(e)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}}();
+const hidden = "LeftNav_hidden_k4xuc";
+const sidenavbar = "LeftNav_sidenavbar_k4xuc";
+const open = "LeftNav_open_k4xuc";
+const classes = {
+  hidden,
+  sidenavbar,
+  open,
+  "sidenavbar--collapsed": "LeftNav_sidenavbar--collapsed_k4xuc"
+};
+export {
+  classes as default,
+  hidden,
+  open,
+  sidenavbar
+};
+//# sourceMappingURL=LeftNav.module.scss.es.js.map

package/dist/components/admin/layout/LeftNav/LeftNav.module.scss.es.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"LeftNav.module.scss.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}

package/dist/components/admin/layout/LeftNav/LeftNavItem/ButtonLeftNavItem.cjs.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),t=require("./LeftNavItem.module.scss.cjs.js"),a=require("../../../../Icon/Icon.cjs.js"),n=require("./useKeyboardNavigation.cjs.js"),i=e.forwardRef((({item:i,navigate:s,onItemClick:l,refItems:o,NestedComponent:r,closeParentList:c,internalLinkPrefix:u=""},d)=>{var m,p;const[f,v]=e.useState(!1),b=!!(null==(m=i.items)?void 0:m.find((e=>e.active))),h=()=>{v((e=>!e))},{onKeyPressNavigation:k}=n.useKeyboardNavigation({refItems:o,item:i,closeParentList:c,onExpandIconClickHandler:h});e.useEffect((()=>{b&&v(!0)}),[b]);const{buttonClasses:x,buttonWrapperClasses:y}=(()=>{const e=[t.default["menu-item"],t.default["menu-button"]];f&&e.push(t.default.expanded),(i.active\|\|b)&&e.push(t.default["menu-item-active"]),i.disabled&&e.push(t.default.disabled);const a=[t.default["menu-button-wrapper"],t.default["menu-list-item"]];return f&&a.push(t.default.expanded),i.active&&a.push(t.default["menu-item-active"]),{buttonClasses:e,buttonWrapperClasses:a}})(),I=i.active?0:-1,C=i.disabled?-1:I;return e.createElement("li",{className:y.join(" "),"data-testid":i.key},e.createElement("button",{"aria-controls":i.key,"data-testid":`left-nav-item-${i.key}`,"aria-expanded":f,ref:d,onKeyDown:k,onClick:e=>{e.target.dataset.chevronIcon\|\|!i.path\|\|i.disabled\|\|(e.preventDefault(),s(i.path),null==l\|\|l(i.path,!0))},className:x.join(" "),disabled:i.disabled,tabIndex:C},e.createElement("div",{className:t.default["menu-item-text-wrapper"]},i.iconComponent&&e.cloneElement(i.iconComponent,{className:t.default["menu-item-icon"]}),i.path?e.createElement("a",{href:i.path?u+i.path:"","aria-current":!!i.active&&"page",className:t.default["menu-item-text"],onClick:e=>{e.preventDefault()},tabIndex:-1},i.title):e.createElement("span",{className:t.default["menu-item-text"]},i.title)),e.createElement(a.Icon,{onClick:h,className:t.default["menu-item-expand-icon"],icon:a.Icons.ChevronDown,"data-chevron-icon":"true"})),e.createElement("ul",{id:i.key,style:{maxHeight:f?void 0:0},className:t.default["menu-list"]},!i.disabled&&(null==(p=i.items)?void 0:p.map((t=>e.createElement(r,{ref:e=>o.addElementReference(e,t.key),key:t.key,closeParentList:()=>v(!1),onKeyUp:k,item:t,navigate:s,onItemClick:l,refItems:o,internalLinkPrefix:u},t.title))))))}));exports.ButtonLeftNavItem=i;
2	+ //# sourceMappingURL=ButtonLeftNavItem.cjs.js.map

package/dist/components/admin/layout/LeftNav/LeftNavItem/ButtonLeftNavItem.cjs.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"ButtonLeftNavItem.cjs.js","sources":["../../../../../../src/components/admin/layout/LeftNav/LeftNavItem/ButtonLeftNavItem.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, {\n ForwardRefExoticComponent,\n ForwardRefRenderFunction,\n HTMLProps,\n MouseEvent,\n Ref,\n useEffect,\n useState\n} from \"react\";\nimport classes from \"./LeftNavItem.module.scss\";\nimport { MenuItem } from \"../LeftNav.interfaces\";\nimport { Icon, Icons } from \"../../../../Icon/Icon\";\nimport { useKeyboardNavigation } from \"./useKeyboardNavigation\";\nimport { UseRefItemsReturnType } from \"../useRefItems\";\nimport { LeftNavItemProps } from \"./LeftNavItem.interface\";\n\nexport interface Props extends HTMLProps<HTMLElement> {\n item: MenuItem;\n navigate: (path: string) => void;\n onItemClick?: (path?: string, button?: boolean) => void;\n refItems: UseRefItemsReturnType;\n NestedComponent: ForwardRefExoticComponent<LeftNavItemProps>;\n closeParentList?: () => void;\n internalLinkPrefix?: string;\n}\n\nconst chevronIconDataKey = { attributeKey: \"chevron-icon\", objectKey: \"chevronIcon\" };\n\nconst ButtonLeftNavItemComponent: ForwardRefRenderFunction<HTMLElement, Props> = (\n {\n item,\n navigate,\n onItemClick,\n refItems,\n NestedComponent,\n closeParentList,\n internalLinkPrefix = \"\"\n },\n ref\n) => {\n const [expanded, setExpanded] = useState(false);\n const isActiveParent = !!item.items?.find(menuItem => menuItem.active);\n\n const onExpandIconClickHandler = () => {\n setExpanded(expanded => !expanded);\n };\n\n const { onKeyPressNavigation } = useKeyboardNavigation({\n refItems,\n item,\n closeParentList,\n onExpandIconClickHandler\n });\n\n const onButtonClickHandler = (event: MouseEvent<HTMLButtonElement>) => {\n const isChevronIcon = !!(event.target as HTMLElement).dataset[chevronIconDataKey.objectKey];\n if (!isChevronIcon && item.path && !item.disabled) {\n event.preventDefault();\n navigate(item.path);\n onItemClick?.(item.path, true);\n }\n };\n\n const onLinkClickHandler = (event: MouseEvent<HTMLAnchorElement>) => {\n event.preventDefault();\n };\n\n const openParentWithActiveElement = () => {\n if (isActiveParent) {\n setExpanded(true);\n }\n };\n\n useEffect(openParentWithActiveElement, [isActiveParent]);\n\n const getStylingClasses = () => {\n const buttonClasses = [classes[\"menu-item\"], classes[\"menu-button\"]];\n expanded && buttonClasses.push(classes[\"expanded\"]);\n (item.active || isActiveParent) && buttonClasses.push(classes[\"menu-item-active\"]);\n item.disabled && buttonClasses.push(classes[\"disabled\"]);\n const buttonWrapperClasses = [classes[\"menu-button-wrapper\"], classes[\"menu-list-item\"]];\n expanded && buttonWrapperClasses.push(classes[\"expanded\"]);\n item.active && buttonWrapperClasses.push(classes[\"menu-item-active\"]);\n return {\n buttonClasses,\n buttonWrapperClasses\n };\n };\n\n const { buttonClasses, buttonWrapperClasses } = getStylingClasses();\n const tabIndexActive = item.active ? 0 : -1;\n const tabIndex = item.disabled ? -1 : tabIndexActive;\n\n return (\n <li className={buttonWrapperClasses.join(\" \")} data-testid={item.key}>\n <button\n aria-controls={item.key}\n data-testid={`left-nav-item-${item.key}`}\n aria-expanded={expanded}\n ref={ref as Ref<HTMLButtonElement>}\n onKeyDown={onKeyPressNavigation}\n onClick={onButtonClickHandler}\n className={buttonClasses.join(\" \")}\n disabled={item.disabled}\n tabIndex={tabIndex}\n >\n <div className={classes[\"menu-item-text-wrapper\"]}>\n {item.iconComponent &&\n React.cloneElement(item.iconComponent, { className: classes[\"menu-item-icon\"] })}\n {item.path ? (\n <a\n href={item.path ? internalLinkPrefix + item.path : \"\"}\n aria-current={item.active ? \"page\" : false}\n className={classes[\"menu-item-text\"]}\n onClick={onLinkClickHandler}\n tabIndex={-1}\n >\n {item.title}\n </a>\n ) : (\n <span className={classes[\"menu-item-text\"]}>{item.title}</span>\n )}\n </div>\n <Icon\n onClick={onExpandIconClickHandler}\n className={classes[\"menu-item-expand-icon\"]}\n icon={Icons.ChevronDown}\n {...{ [`data-${chevronIconDataKey.attributeKey}`]: \"true\" }}\n />\n </button>\n <ul\n id={item.key}\n style={{ maxHeight: expanded ? undefined : 0 }}\n className={classes[\"menu-list\"]}\n >\n {!item.disabled &&\n item.items?.map(item => (\n <NestedComponent\n ref={el => refItems.addElementReference(el, item.key)}\n key={item.key}\n closeParentList={() => setExpanded(false)}\n onKeyUp={onKeyPressNavigation}\n item={item}\n navigate={navigate}\n onItemClick={onItemClick}\n refItems={refItems}\n internalLinkPrefix={internalLinkPrefix}\n >\n {item.title}\n </NestedComponent>\n ))}\n </ul>\n </li>\n );\n};\n\nexport const ButtonLeftNavItem = React.forwardRef(ButtonLeftNavItemComponent);\n"],"names":["ButtonLeftNavItem","React","forwardRef","item","navigate","onItemClick","refItems","NestedComponent","closeParentList","internalLinkPrefix","ref","expanded","setExpanded","useState","isActiveParent","_a","items","find","menuItem","active","onExpandIconClickHandler","onKeyPressNavigation","useKeyboardNavigation","useEffect","buttonClasses","buttonWrapperClasses","classes","default","push","disabled","getStylingClasses","tabIndexActive","tabIndex","createElement","className","join","key","onKeyDown","onClick","event","target","dataset","path","preventDefault","iconComponent","cloneElement","href","title","Icon","icon","Icons","ChevronDown","id","style","maxHeight","_b","map","el","addElementReference","onKeyUp"],"mappings":"6OA4KaA,EAAoBC,EAAMC,YAhI0C,EAE7EC,OACAC,WACAC,cACAC,WACAC,kBACAC,kBACAC,qBAAqB,IAEvBC,aAEA,MAAOC,EAAUC,GAAeC,EAAAA,UAAS,GACnCC,KAAmB,OAAAC,EAAAZ,EAAKa,YAAO,EAAAD,EAAAE,MAAKC,GAAYA,EAASC,UAEzDC,EAA2B,KACnBR,GAAAD,IAAaA,GAAQ,GAG7BU,qBAAEA,GAAyBC,wBAAsB,CACrDhB,WACAH,OACAK,kBACAY,6BAsBQG,aAN0B,KAC9BT,GACFF,GAAY,EAAI,GAImB,CAACE,IAExC,MAcMU,cAAEA,EAAAC,qBAAeA,GAdG,MAClBD,MAAAA,EAAgB,CAACE,EAAAC,QAAQ,aAAcD,EAAAA,QAAQ,gBACrDf,GAAYa,EAAcI,KAAKF,EAAQC,QAAU,WAChDxB,EAAKgB,QAAUL,IAAmBU,EAAcI,KAAKF,EAAAA,QAAQ,qBAC9DvB,EAAK0B,UAAYL,EAAcI,KAAKF,EAAAC,QAAkB,UAChDF,MAAAA,EAAuB,CAACC,EAAAC,QAAQ,uBAAwBD,EAAAA,QAAQ,mBAG/D,OAFPf,GAAYc,EAAqBG,KAAKF,EAAQC,QAAU,UACxDxB,EAAKgB,QAAUM,EAAqBG,KAAKF,EAAAC,QAAQ,qBAC1C,CACLH,cAAAA,EACAC,qBAAAA,EACF,EAG8CK,GAC1CC,EAAiB5B,EAAKgB,OAAS,GAAI,EACnCa,EAAW7B,EAAK0B,UAAgB,EAAAE,EAGpC,OAAA9B,EAAAgC,cAAC,MAAGC,UAAWT,EAAqBU,KAAK,KAAM,cAAahC,EAAKiC,KAC/DnC,EAAAgC,cAAC,SAAA,CACC,gBAAe9B,EAAKiC,IACpB,cAAa,iBAAiBjC,EAAKiC,MACnC,gBAAezB,EACfD,MACA2B,UAAWhB,EACXiB,QA/CwBC,IACHA,EAAMC,OAAuBC,QAAoC,cACpEtC,EAAKuC,MAASvC,EAAK0B,WACvCU,EAAMI,iBACNvC,EAASD,EAAKuC,MACA,MAAArC,GAAAA,EAAAF,EAAKuC,MAAM,GAAI,EA2C3BR,UAAWV,EAAcW,KAAK,KAC9BN,SAAU1B,EAAK0B,SACfG,YAEA/B,EAAAgC,cAAC,OAAIC,UAAWR,UAAQ,2BACrBvB,EAAKyC,eACJ3C,EAAM4C,aAAa1C,EAAKyC,cAAe,CAAEV,UAAWR,UAAQ,oBAC7DvB,EAAKuC,KACJzC,EAAAgC,cAAC,IAAA,CACCa,KAAM3C,EAAKuC,KAAOjC,EAAqBN,EAAKuC,KAAO,GACnD,iBAAcvC,EAAKgB,QAAS,OAC5Be,UAAWR,UAAQ,kBACnBY,QAnDgBC,IAC1BA,EAAMI,gBAAe,EAmDXX,UAAU,GAET7B,EAAK4C,uBAGP,OAAK,CAAAb,UAAWR,UAAQ,mBAAoBvB,EAAK4C,QAGtD9C,EAAAgC,cAACe,EAAAA,KAAA,CACCV,QAASlB,EACTc,UAAWR,UAAQ,yBACnBuB,KAAMC,EAAMA,MAAAC,YACN,oBAA6C,UAGvDlD,EAAAgC,cAAC,KAAA,CACCmB,GAAIjD,EAAKiC,IACTiB,MAAO,CAAEC,UAAW3C,OAAW,EAAY,GAC3CuB,UAAWR,UAAQ,eAEjBvB,EAAK0B,WACL,OAAA0B,EAAApD,EAAKa,YAAO,EAAAuC,EAAAC,KAAIrD,GACdF,EAAAgC,cAAC1B,EAAA,CACCG,IAAW+C,GAAAnD,EAASoD,oBAAoBD,EAAItD,EAAKiC,KACjDA,IAAKjC,EAAKiC,IACV5B,gBAAiB,IAAMI,GAAY,GACnC+C,QAAStC,EACTlB,KAAMA,EACNC,WACAC,cACAC,WACAG,sBAECN,EAAK4C,WAIhB"}