@sc-360-v2/storefront-cms-library 0.3.6 → 0.3.8

package/dist/modal.scss

@@ -191,6 +191,8 @@ $shadow-md: 0 8px 20px rgba(0, 0, 0, 0.1);
 
 .modalV2-main {
   .modalV2-wrapper {
+    min-height: 50%;
+    overflow: hidden !important;
     position: fixed;
     left: 50%;
     transition:
@@ -198,7 +200,7 @@ $shadow-md: 0 8px 20px rgba(0, 0, 0, 0.1);
       transform 0.4s ease-in-out;
     background: $white;
     border-radius: $radius-lg;
-    padding: 0px 20px;
+    // padding: 0px 20px;
     width: 850px;
     font-family: $font-base;
     box-shadow: $shadow-md;
@@ -207,15 +209,17 @@ $shadow-md: 0 8px 20px rgba(0, 0, 0, 0.1);
     overflow: scroll;
     display: flex;
     flex-direction: column;
-
+    .modal-body {
+      height: calc(100% - 61px);
+    }
     &.fullscreen {
       transition:
         all 0.5s ease-in-out,
         transform 0.5s ease-in-out;
       top: 50%;
       left: 50%;
-      width: 95vw;
-      height: 95vh;
+      width: 99vw;
+      height: 98vh;
       border-radius: $radius-lg;
       transform: translate(-50%, -50%);
       box-shadow: none;
@@ -245,6 +249,7 @@ $shadow-md: 0 8px 20px rgba(0, 0, 0, 0.1);
     &.bottom {
       bottom: 5%;
       transform: translate(-50%, 0%);
+      height: 100%;
     }
 
     .top-bar {
@@ -252,12 +257,14 @@ $shadow-md: 0 8px 20px rgba(0, 0, 0, 0.1);
       top: 0;
       background: $white;
       z-index: 1;
-      padding-bottom: 12px;
+      padding: 0 16px;
+      border-bottom: 1px solid #d0d5dd;
       .title-bar {
         display: flex;
         justify-content: space-between;
         align-items: center;
-        padding: 15px 0px;
+        // padding: 15px 0px;
+        height: 60px;
 
         .left-col {
           display: flex;

package/dist/product-options.scss

@@ -338,6 +338,7 @@
         .product-select-image {
           height: 100%;
           width: 100%;
+          object-fit: cover;
         }
 
         &[data-background-shape="circle"] {

package/dist/toggle-button.scss

@@ -0,0 +1,32 @@
+.toggle__button {
+  position: relative;
+  width: 36px;
+  height: 20px;
+  background-color: #d0d5dd;
+  border-radius: 12px;
+  cursor: pointer;
+
+  .toggle__slider {
+    position: absolute;
+    top: 2px;
+    left: 2px;
+    transform: translateY(0%);
+    width: 16px;
+    height: 16px;
+    background-color: #fff;
+    border-radius: 50%;
+    transition: transform 0.3s ease;
+    fill: var(--_base-white);
+    filter: drop-shadow(0px 1px 2px rgba(16, 24, 40, 0.06))
+      drop-shadow(0px 1px 3px rgba(16, 24, 40, 0.1));
+  }
+
+  &.toggle__active {
+    background: #132067;
+
+    .toggle__slider {
+      top: 2px;
+      transform: translateX(16px);
+    }
+  }
+}

package/dist/types/builder/constants/data-connectors.d.ts

@@ -0,0 +1,55 @@
+import { ApiMethods } from "../enums/data-connectors";
+export declare const dataConnectorApisData: {
+    PRODUST: {
+        url: string;
+        method: ApiMethods;
+    };
+    PRODUCT_BY_ID: {
+        url: string;
+        method: ApiMethods;
+    };
+    CATEGORIES: {
+        url: string;
+        method: ApiMethods;
+    };
+    CATegory_BY_ID: {
+        url: string;
+        method: ApiMethods;
+    };
+    BRANDS: {
+        url: string;
+        method: ApiMethods;
+    };
+    BRAND_BY_ID: {
+        url: string;
+        method: ApiMethods;
+    };
+    SUB_CATEGORY: {
+        url: string;
+        method: ApiMethods;
+    };
+    MARCHANDISER_SETS: {
+        url: string;
+        method: ApiMethods;
+    };
+    BUNDLES: {
+        url: string;
+        method: ApiMethods;
+    };
+    BUNLES_BY_ID: {
+        url: string;
+        method: ApiMethods;
+    };
+    BUNDLE_BY_TYPE: {
+        url: string;
+        method: ApiMethods;
+    };
+    PRODUCT_BUNDLE_DETAILS: {
+        url: string;
+        method: ApiMethods;
+    };
+    CATEGORY_BUNDLE_DETAILS: {
+        url: string;
+        method: ApiMethods;
+    };
+};

package/dist/types/builder/elements/form-builder/index.d.ts

@@ -155,3 +155,18 @@ export declare enum FormMessageDisplay {
     Custom = 1,
     Always = 2
 }
+export declare enum FormRequiredFieldStyle {
+    Character = 1,
+    SVG = 2,
+    Label = 3,
+    None = 4
+}
+export declare enum FormSpamFilterMethod {
+    None = 0,
+    GoogleRecaptchaV2 = 2,
+    GoogleRecaptchaV3 = 3
+}
+export declare enum FormRequiredFieldPlacement {
+    BeforeField = 1,
+    AfterField = 2
+}

package/dist/types/builder/enums/data-connectors.d.ts

@@ -0,0 +1,21 @@
+export declare enum ApiMethods {
+    GET = "GET",
+    POST = "POST",
+    PUT = "PUT",
+    DELETE = "DELETE"
+}
+export declare enum dataConnectorapis {
+    PRODUST = "PRODUST",
+    CATEGORIES = "CATEGORIES",
+    BRANDS = "BRANDS",
+    PRODUCT_BY_ID = "PRODUCT_BY_ID",
+    CATEGORY_BY_ID = "CATegory_BY_ID",
+    BRAND_BY_ID = "BRAND_BY_ID",
+    SUB_CATEGORY = "SUB_CATEGORY",
+    MARCHANDISER_SETS = "MARCHANDISER_SETS",
+    BUNDLES = "BUNDLES",
+    BUNLES_BY_ID = "BUNLES_BY_ID",
+    BUNDLE_BY_TYPE = "BUNDLE_BY_TYPE",
+    PRODUCT_BUNDLE_DETAILS = "PRODUCT_BUNDLE_DETAILS",
+    CATEGORY_BUNDLE_DETAILS = "CATEGORY_BUNDLE_DETAILS"
+}

package/dist/types/builder/enums/index.d.ts

@@ -1,3 +1,4 @@
+export * as dataConnectorsEnums from "./data-connectors";
 export declare enum CMSToolIdTypes {
     playgroundWrapper = "playground_wrapper",
     layers = "CMS Layers",

package/dist/types/builder/index.d.ts

@@ -80,4 +80,5 @@ import * as layouterProItemSchema from "./elements/layouter-pro-item/index";
 import * as userElementsSchema from "./elements/user-elements/index";
 import * as filterResultsSchema from "./elements/filter-results/index";
 import * as productSizeChartSchema from "./elements/product-sizechart/index";
-export { ElementEditSchema, amountEstimatorSchema, bulkVariantPickerSchema, buttonSchema, cmsTypes, codeSchema, commonFunctions, containerSchema, countdownSchema, embedSchema, enums, faqSchema, gallerySliderSchema, gridSchema, imageHotspotSchema, imageSchema, interfaces, mapSchema, paymentMethodsSchema, pickupLocationsSchema, priceSchema, productActionsSchema, productHighlightsSchema, productImageSchema, productInventorySchema, productPromotionsSchema, quantitySelectorSchema, scrollSchema, sectionSchema, shippingEstimatorSchema, socialIconsSchema, stackSchema, storeLocationsSchema, tabSchema, tableSchema, textSchema, uomSelectorSchema, variantPickerSchema, videoSChema, volumePricingSchema, lightboxSchema, cartSchema, profileSchema, productSchema, repeaterSchema, brandSchema, bundleSchema, bundleDetailsSchema, brandImageSchema, lightBoxV2Schema, searchSchema, layouterSchema, layouterItemSchema, categoryDetailsSchema, contactUsSchema, loginSchema, createFormSchema, resetPasswordSchema, searchResultsHeadingSchema, itemStockSchema, lineItemSchema, tabsV2Schema, tabsContainerSchema, marchandiserSetsSchema, formBuilder, quickLinksSchema, addOrderSchema, buyForTabsSchema, buyForTabsContainerSchema, checkoutSchema, toasterSchema, spotlightSchema, productCustomizationsSchema, iconListSchema, orderStatusSchema, menuV2Schema, menuItemSchema, layouterProSchema, layouterProItemSchema, userElementsSchema, filterResultsSchema, productSizeChartSchema, };
+import * as dataConnectorContants from "./constants/data-connectors";
+export { ElementEditSchema, amountEstimatorSchema, bulkVariantPickerSchema, buttonSchema, cmsTypes, codeSchema, commonFunctions, containerSchema, countdownSchema, embedSchema, enums, faqSchema, gallerySliderSchema, gridSchema, imageHotspotSchema, imageSchema, interfaces, mapSchema, paymentMethodsSchema, pickupLocationsSchema, priceSchema, productActionsSchema, productHighlightsSchema, productImageSchema, productInventorySchema, productPromotionsSchema, quantitySelectorSchema, scrollSchema, sectionSchema, shippingEstimatorSchema, socialIconsSchema, stackSchema, storeLocationsSchema, tabSchema, tableSchema, textSchema, uomSelectorSchema, variantPickerSchema, videoSChema, volumePricingSchema, lightboxSchema, cartSchema, profileSchema, productSchema, repeaterSchema, brandSchema, bundleSchema, bundleDetailsSchema, brandImageSchema, lightBoxV2Schema, searchSchema, layouterSchema, layouterItemSchema, categoryDetailsSchema, contactUsSchema, loginSchema, createFormSchema, resetPasswordSchema, searchResultsHeadingSchema, itemStockSchema, lineItemSchema, tabsV2Schema, tabsContainerSchema, marchandiserSetsSchema, formBuilder, quickLinksSchema, addOrderSchema, buyForTabsSchema, buyForTabsContainerSchema, checkoutSchema, toasterSchema, spotlightSchema, productCustomizationsSchema, iconListSchema, orderStatusSchema, menuV2Schema, menuItemSchema, layouterProSchema, layouterProItemSchema, userElementsSchema, filterResultsSchema, productSizeChartSchema, dataConnectorContants, };

package/dist/types/builder/tools/element-edit/common.d.ts

@@ -14,6 +14,14 @@ export interface CMSElementEditPopupLayoutInterface {
     displayScrollbar?: CMSIBCommonInterface;
     positionType?: CMSIBCommonInterface;
     pinTo?: CMSIBCommonInterface;
+    dropdownOptionsSpacing?: CMSIBSizeInterface;
+    dropdownOptionsPadding?: CMSIBSizeInterface;
+    dropdownStyle?: CMSIBCommonInterface;
+    optionAndListSpacing?: CMSIBSizeInterface;
+    dropdownListItemSpacing?: CMSIBSizeInterface;
+    dropdownListItemPadding?: CMSIBSizeInterface;
+    dividerBetweenListItems?: CMSIBSizeInterface;
+    maxItemsToDisplay?: CMSIBSizeInterface;
 }
 export interface CMSElementEditPopupDesignInterface {
     backgroundColor: CMSIBCommonInterface;

package/dist/types/builder/tools/element-edit/productActions.d.ts

@@ -1,3 +1,4 @@
+import { CMSElementEditTypes } from "../../enums/index";
 import { CMSIBCommonInterface } from "../../interfaces/global";
 import { CMSElementEditPopupDesignInterface, CMSElementEditPopupInterface, CMSElementEditPopupLayoutInterface } from "./common";
 export interface ButtonLayoutInterface {
@@ -64,4 +65,97 @@ export declare enum ButtonSelectorKeysEnum {
     WIDGET_STYLE = "widgetStyle",
     DROPDOWN_STYLE = "dropdownStyle"
 }
+export declare const ButtonProperties: {
+    buttonStyle: {
+        value: string;
+        parentRef: string;
+        propertyType: CMSElementEditTypes;
+    };
+    buttonText: {
+        value: string;
+        property: string;
+        propertyType: CMSElementEditTypes;
+    };
+    icon: {
+        value: string;
+        property: string;
+        propertyType: CMSElementEditTypes;
+    };
+    iconPadding: {
+        value: number;
+        property: string;
+        parentRef: string;
+        propertyType: CMSElementEditTypes;
+    };
+    iconPosition: {
+        value: string;
+        parentRef: string;
+        propertyType: CMSElementEditTypes;
+    };
+    iconAndTextSpacing: {
+        value: number;
+        property: string;
+        unit: number;
+        parentRef: string;
+        propertyType: CMSElementEditTypes;
+    };
+    alignment: {
+        value: string;
+        property: string;
+        parentRef: string;
+        propertyType: CMSElementEditTypes;
+    };
+    buttonType: {
+        value: string;
+        propertyType: CMSElementEditTypes;
+    };
+    showIcon: {
+        value: boolean;
+        property: string;
+        propertyType: CMSElementEditTypes;
+    };
+    backgroundColor: CMSIBCommonInterface;
+    borderColor: CMSIBCommonInterface;
+    borderStyle: CMSIBCommonInterface;
+    borderPerSlide: import("../../interfaces/global").CSSPaddingValues;
+    showBorder: CMSIBCommonInterface;
+    showShadow: CMSIBCommonInterface;
+    shadowColor: CMSIBCommonInterface;
+    blur: import("../../interfaces/global").CMSIBSizeInterface;
+    spread: import("../../interfaces/global").CMSIBSizeInterface;
+    angle: import("../../interfaces/global").CMSIBSizeInterface;
+    borderRadius: import("../../interfaces/global").CSSPaddingValues;
+    theme: CMSIBCommonInterface;
+    font: CMSIBCommonInterface;
+    fontSize: import("../../interfaces/global").CMSIBSizeInterface;
+    textColor: CMSIBCommonInterface;
+    bold: CMSIBCommonInterface;
+    italic: CMSIBCommonInterface;
+    linethrough: CMSIBCommonInterface;
+    underline: CMSIBCommonInterface;
+    textAlign: CMSIBCommonInterface;
+    characterSpacing: import("../../interfaces/global").CMSIBSizeInterface;
+    lineHeight: import("../../interfaces/global").CMSIBSizeInterface;
+    iconSize: import("../../interfaces/global").CMSIBSizeInterface;
+    width: {
+        value: string;
+        unit: number;
+    };
+    padding: import("../../interfaces/global").CSSPaddingValues | undefined;
+    iconColor: {
+        value: {
+            rgb: {
+                r: number;
+                g: number;
+                b: number;
+                a: number;
+            };
+            hex: string;
+        };
+        property?: any;
+        propertyType?: any;
+        isReadOnly?: boolean | undefined;
+        parentRef?: string | undefined;
+    };
+};
 export declare const getDefaultData: () => CMSElementEditPopupInterface<ButtonLayoutInterface & CMSElementEditPopupLayoutInterface, selfDesignInterface & CMSElementEditPopupDesignInterface>;

package/dist/types/builder/tools/element-edit/productSizeChart.d.ts

@@ -1,16 +1,84 @@
-import { CMSIBCommonInterface } from "../../interfaces/global";
+import { CMSIBCommonInterface, CMSIBSizeInterface } from "../../interfaces/global";
 import { CMSElementEditPopupDesignInterface, CMSElementEditPopupInterface, CMSElementEditPopupLayoutInterface } from "./common";
 export interface ButtonLayoutInterface {
     selectorKey: string;
     sizeChart: CMSIBCommonInterface;
-    sizeChartValue: CMSIBCommonInterface;
-    sizeChartWhenClicked: CMSIBCommonInterface;
-    sizeChartMetaData: CMSIBCommonInterface;
+    zoomType: CMSIBCommonInterface;
+    displayStyle: CMSIBCommonInterface;
+    scrollDirection: CMSIBCommonInterface;
+    noOfItemsToLoad: CMSIBCommonInterface;
+    scrollControl: CMSIBCommonInterface;
+    itemsPerSlide: CMSIBSizeInterface;
+    itemsPerRow: CMSIBSizeInterface;
+    itemsPerColumn: CMSIBSizeInterface;
+    itemGap: CMSIBSizeInterface;
+    rowGap: CMSIBSizeInterface;
+    sliderControl: CMSIBCommonInterface;
+    controlPosition: CMSIBCommonInterface;
+    loopImages: CMSIBCommonInterface;
+    setItemsPerRow: CMSIBCommonInterface;
+    sliderDisplayScrollbar: CMSIBCommonInterface;
+    autoplay: CMSIBCommonInterface;
+    autoplayStyle: CMSIBCommonInterface;
+    autoplayDuration: CMSIBSizeInterface;
+    sliderSpeed: CMSIBSizeInterface;
 }
 export interface selfDesignInterface {
     selectorKey: string;
     defaultState: any;
     sizeChart: any;
+    galleryWidgetStyle: {
+        selectorKey: string;
+        backgroundColor: CMSIBCommonInterface;
+        borderColor: CMSIBCommonInterface;
+        borderStyle: CMSIBCommonInterface;
+        borderPerSlide: CMSIBCommonInterface;
+        showBorder: CMSIBCommonInterface;
+        showShadow: CMSIBCommonInterface;
+        shadowColor: CMSIBCommonInterface;
+        blur: CMSIBCommonInterface;
+        spread: CMSIBCommonInterface;
+        angle: CMSIBCommonInterface;
+        borderRadius: CMSIBCommonInterface;
+        [key: string]: any;
+    };
+    itemStyle: {
+        selectorKey: string;
+        backgroundColor: CMSIBCommonInterface;
+        borderColor: CMSIBCommonInterface;
+        borderStyle: CMSIBCommonInterface;
+        borderPerSlide: CMSIBCommonInterface;
+        showBorder: CMSIBCommonInterface;
+        showShadow: CMSIBCommonInterface;
+        shadowColor: CMSIBCommonInterface;
+        blur: CMSIBCommonInterface;
+        spread: CMSIBCommonInterface;
+        angle: CMSIBCommonInterface;
+        borderRadius: CMSIBCommonInterface;
+        [key: string]: any;
+    };
+    paginationArrows: {
+        selectorKey: string;
+        arrowIconStyle: CMSIBCommonInterface;
+        leftArrowIconStyle: CMSIBCommonInterface;
+        rightArrowIconStyle: CMSIBCommonInterface;
+        backgroundShape: CMSIBCommonInterface;
+        arrowSize: CMSIBCommonInterface;
+        arrowColor: CMSIBCommonInterface;
+    };
+    paginationDots: {
+        selectorKey: string;
+        dotSize: CMSIBCommonInterface;
+        currentDotColor: CMSIBCommonInterface;
+        otherDotColor: CMSIBCommonInterface;
+    };
+    paginationLine: {
+        selectorKey: string;
+        currentLineColor: CMSIBCommonInterface;
+        otherLineColor: CMSIBCommonInterface;
+        lineHeight: CMSIBCommonInterface;
+        lineWidth: CMSIBCommonInterface;
+    };
 }
 export declare enum ButtonSelectorKeysEnum {
     HOVER_STATE = "hover",
@@ -19,6 +87,12 @@ export declare enum ButtonSelectorKeysEnum {
     LAYOUT = "layout",
     DESIGN = "design",
     SIZE_CHART = "sizeChart",
+    GALLERY_WIDGET_STYLE = "gallery-widget-style",
+    GALLERY_LAYOUT = "gallery-layout",
+    ITEM_STYLE = "item-style",
+    PAGINATION_ARROWS = "pagination-arrows",
+    PAGINATION_DOTS = "pagination-dots",
+    PAGINATION_LINE = "pagination-lines",
     DATA_CONNECTOR = "dataConnector"
 }
 export declare const getDefaultData: () => CMSElementEditPopupInterface<ButtonLayoutInterface & CMSElementEditPopupLayoutInterface, selfDesignInterface & CMSElementEditPopupDesignInterface>;

package/dist/types/builder/tools/element-edit/profile.d.ts

@@ -4,6 +4,15 @@ interface selfLayoutInterface {
     selectorKey: string;
     loggedInButtonStyle: CMSIBCommonInterface;
     beforeLoginText: CMSIBCommonInterface;
+    showdDropdown: CMSIBCommonInterface;
+    dropdownWidth: CMSIBCommonInterface;
+    openDropdown: CMSIBCommonInterface;
+    showProfileIcon: CMSIBCommonInterface;
+    showTextFields: CMSIBCommonInterface;
+    contentData: CMSIBCommonInterface;
+    showDropdownIcon: CMSIBCommonInterface;
+    dropdownIcon: CMSIBCommonInterface;
+    profileSettings: CMSIBCommonInterface;
 }
 interface selfContentInterface {
     selectorKey: string;
@@ -20,6 +29,18 @@ export interface selfDesignInterface {
         iconSize: CMSIBCommonInterface;
         iconColor: CMSIBCommonInterface;
     };
+    dropdownItems: {
+        selectorKey: string;
+        [key: string]: any;
+    };
+    profileWidget: {
+        selectorKey: string;
+        [key: string]: any;
+    };
+    profileDropdownIcon: {
+        selectorKey: string;
+        [key: string]: any;
+    };
     profileMenuItems: {
         selectorKey: string;
         backgroundColor: CMSIBCommonInterface;
@@ -52,9 +73,12 @@ export declare enum profileSelectorKeysEnum {
     LAYOUT = "layout",
     DESIGN = "design",
     CONTENT = "content",
-    profile_ICON = "profileMenuItems",
+    profile_ELEMENT = "profileWidget",
     MINI_profile_TEXT = "profileNameText",
-    PROFILE_AVATAR = "profileAvatar"
+    PROFILE_AVATAR = "profileAvatar",
+    DROPDOWN_ITEMS = "dropdownItems",
+    DROPDOWN_ITEMS_HOVER_STYLE = "dropdownItemsHoverStyle",
+    DROPDOWN_ITEMS_DEFAULT_STYLE = "dropdownItemsDefaultStyle"
 }
 export declare const getDefaultData: () => CMSElementEditPopupInterface<selfLayoutInterface & CMSElementEditPopupLayoutInterface, selfDesignInterface & selfContentInterface & CMSElementEditPopupDesignInterface>;
 export {};

package/dist/types/builder/tools/element-edit/quantitySelector.d.ts

@@ -4,15 +4,29 @@ interface selfLayoutInterface {
     selectorKey: string;
     displayStyle: CMSIBCommonInterface;
     displayMinQtyToPurchase: CMSIBCommonInterface;
+    labelAndInputSpacing: CMSIBCommonInterface;
+    inputAndMinQuantitySpacing: CMSIBCommonInterface;
+    [key: string]: any;
 }
 interface selfDesignInterface {
     selectorKey: string;
+    [key: string]: any;
+    widgetStyle: any;
 }
-export declare enum QuantitySelectorSelectorKeysEnum {
+export declare enum selfEnums {
     LAYOUT = "layout",
     CONTENT = "content",
     DESIGN = "design",
-    DATA_CONNECTOR = "dataConnector"
+    DATA_CONNECTOR = "dataConnector",
+    WIDGET_STYLE = "widgetStyle",
+    SEARCHBAR = "searchBar",
+    PLACEHOLDER_TEXT = "placeholderText",
+    DROPDOWN_STYLE = "dropdownStyle",
+    INCREMENT_BUTTON = "incrementButton",
+    DECREMENT_BUTTON = "decrementButton",
+    HOVER_STATE = "hover",
+    DEFAULT_STATE = "default",
+    SELECTED_STATE = "selected"
 }
 export declare const getDefaultData: () => CMSElementEditPopupInterface<selfLayoutInterface & CMSElementEditPopupLayoutInterface, selfDesignInterface & CMSElementEditPopupDesignInterface>;
 export {};

package/dist/variant-picker.scss

@@ -230,6 +230,11 @@ $minWidth: 70px;
 
               cursor: pointer;
               overflow: hidden;
+              .product-select-image {
+                object-fit: cover;
+                width: 100%;
+                height: 100%;
+              }
               &[data-background-shape="circle"] {
                 border-radius: 50%;
               }

package/dist/widget.scss

@@ -108,3 +108,6 @@
 @use "./layouter-pro-item.scss";
 @use "./user-elements.scss";
 @use "./filter-results.scss";
+@use "./toggle-button.scss";
+@use "./employee-bulk-order.scss";
+@use "./confirmationModal.scss";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sc-360-v2/storefront-cms-library",
-  "version": "0.3.6",
+  "version": "0.3.8",
   "main": "/dist/index.js",
   "types": "./dist/index.d.ts",
   "exports": {
@@ -12,6 +12,10 @@
       "import": "./dist/htmlElement.js",
       "types": "./dist/types/html-elements/elements.d.ts"
     },
+    "./dataConnectors": {
+      "import": "./dist/htmlElement.js",
+      "types": "./dist/types/html-elements/elements.d.ts"
+    },
     "./css": {
       "import": "./dist/css.js",
       "types": "./dist/types/css/cssVariables.d.ts"