@weaverse/core 0.7.18 → 0.7.20

package/dist/index.d.ts

@@ -99,7 +99,7 @@ interface ChildElement {
     label: string;
     selector: string;
 }
-declare type ParentType = 'container' | 'layout' | 'root' | 'product-details' | 'product-info' | 'collection.box' | 'collection-box' | 'article-box' | 'article-list' | 'slider' | 'tab' | 'accordion' | 'accordion.wrapper';
+declare type ParentType = "container" | "layout" | "root" | "product-details" | "product-info" | "collection.box" | "collection-box" | "article-box" | "article-list" | "slider" | "tab" | "accordion" | "accordion.wrapper";
 declare type GridSize = {
     rowSpan: number;
     colSpan: number;
@@ -145,40 +145,27 @@ interface BasicGroup {
     inputs: BasicInput[];
 }
 declare type AdvancedGroupType = "border" | "alignment" | "background" | "dimensions" | "spacing" | "typography" | "visibility" | "shadows-and-effects";
-interface BasicInput {
+interface BasicInput<ConfigsType = AdditionalInputConfigs> {
     type: InputType;
     label?: string;
     binding?: "style" | "data";
     /**
-     * The key of the value in the element data or css
+     * The key of the value in the element data or styles
+     * @example
+     * // Bind to `element.data.title`
+     * name: "title"
+     * // Bind to `element.css["@desktop"].backgroundColor`
+     * name: "backgroundColor"
      */
     name?: string;
-    defaultValue?: string | number | boolean;
-    placeholder?: string;
-    helpText?: string;
-    /**
-     * For `select` or `toggle-group` input
-     */
-    options?: {
-        value: string;
-        label: string;
-        icon?: string;
-        weight?: string;
-    }[];
-    /**
-     * For `range` input
-     */
-    min?: number;
-    max?: number;
-    step?: number;
     /**
-     * For `sortable` input
+     * Additional options for inputs that require more configuration
      */
-    visibleType?: boolean;
+    configs?: ConfigsType;
     /**
      * Only display if condition matches.
      *
-     * Format: `bindingName.conditionalOperator.value`
+     * Format: `dataBindingKey.conditionalOperator.value`
      *
      * Supported operators: `eq`, `ne`, `gt`, `gte`, `lt`, `lte`
      *
@@ -188,19 +175,38 @@ interface BasicInput {
      * `imagesPerRow.gt.1`
      */
     condition?: string;
-    default?: string | number | boolean;
+    defaultValue?: string | number | boolean;
+    placeholder?: string;
+}
+declare type AdditionalInputConfigs = SelectInputConfigs | ToggleGroupConfigs | RangeInputConfigs | SortableInputConfigs;
+interface SelectInputConfigs {
+    options?: {
+        value: string;
+        label: string;
+        icon?: string;
+        weight?: string;
+    }[];
+}
+interface ToggleGroupConfigs {
+    options?: {
+        value: string;
+        label: string;
+        icon?: string;
+        weight?: string;
+    }[];
+}
+interface RangeInputConfigs {
+    min?: number;
+    max?: number;
+    step?: number;
+}
+interface SortableInputConfigs {
+    visibleType?: boolean;
 }
-declare type InputType = 'color' | 'datepicker' | 'image' | 'range' | 'select' | 'sortable' | 'switch' | 'text' | 'textarea' | 'toggle-group' | 'form' | 'product' | 'product-swatches' | 'custom.html' | 'instagram' | 'collection-list' | 'collection' | 'article-list';
+declare type InputType = "color" | "datepicker" | "image" | "range" | "select" | "sortable" | "switch" | "text" | "textarea" | "toggle-group" | "form" | "product" | "product-swatches" | "custom.html" | "instagram" | "collection-list" | "collection" | "article-list";
 declare global {
     interface Window {
         WeaverseStudioBridge: any;
-        weaverseShopifyConfigs: any;
-        weaverseShopifyProducts: any;
-        weaverseShopifyProductsByCollection: any;
-        weaverseShopifyCollections: any;
-        weaverseShopifyArticles: any;
-        weaverseShopifyBlogs: any;
-        weaverseCartHelpers: any;
         Blinkloader: any;
     }
 }
@@ -328,4 +334,4 @@ declare class Weaverse {
     initProjectItemData(): void;
 }
 
-export { AdvancedGroup, AdvancedGroupType, BasicGroup, BasicInput, BreakPoints, CatalogGroup, ChildElement, ChildElementCSS, ElementCSS, ElementCatalog, ElementData, ElementDataInCatalog, ElementFlags, ElementInspector, ElementSchema, FlagType, GridSize, InitializeData, InputType, ParentType, ProjectDataType, ToolbarAction, Weaverse, WeaverseCSSProperties, WeaverseElement, WeaverseItemStore, WeaverseType, createGlobalStyles, isBrowser, isIframe, isReactNative, loadScript, stichesUtils };
+export { AdditionalInputConfigs, AdvancedGroup, AdvancedGroupType, BasicGroup, BasicInput, BreakPoints, CatalogGroup, ChildElement, ChildElementCSS, ElementCSS, ElementCatalog, ElementData, ElementDataInCatalog, ElementFlags, ElementInspector, ElementSchema, FlagType, GridSize, InitializeData, InputType, ParentType, ProjectDataType, RangeInputConfigs, SelectInputConfigs, SortableInputConfigs, ToggleGroupConfigs, ToolbarAction, Weaverse, WeaverseCSSProperties, WeaverseElement, WeaverseItemStore, WeaverseType, createGlobalStyles, isBrowser, isIframe, isReactNative, loadScript, stichesUtils };

package/dist/index.js

@@ -96,13 +96,32 @@ function createGlobalStyles(stitches2) {
       from: { transform: "rotate(0deg)" },
       to: { transform: "rotate(360deg)" }
     },
-    input: {
-      "&::-webkit-outer-spin-button, &::-webkit-inner-spin-button": {
-        "-webkit-appearance": "none",
-        margin: 0
+    ".weaverse-content-root": {
+      input: {
+        "&::-webkit-outer-spin-button, &::-webkit-inner-spin-button": {
+          "-webkit-appearance": "none",
+          margin: 0
+        },
+        "&[type=number]": {
+          "-moz-appearance": "textfield"
+        }
       },
-      "&[type=number]": {
-        "-moz-appearance": "textfield"
+      select: {
+        WebkitAppearance: "none",
+        MozAppearance: "none",
+        appearance: "none",
+        outline: "none",
+        boxShadow: "none",
+        color: "currentColor",
+        verticalAlign: "middle",
+        backgroundPosition: "center",
+        backgroundRepeat: "no-repeat",
+        backgroundImage: "url(https://ucarecdn.com/4bb6a6e7-1ce8-4201-8f2d-da00a50105f3/ardown.svg)",
+        backgroundSize: "10px",
+        backgroundPositionX: "calc(100% - 12px)",
+        paddingLeft: "12px",
+        paddingRight: "35px !important",
+        cursor: "pointer"
       }
     },
     ".wv-spinner-wrapper": {

package/dist/index.mjs

@@ -57,13 +57,32 @@ function createGlobalStyles(stitches2) {
       from: { transform: "rotate(0deg)" },
       to: { transform: "rotate(360deg)" }
     },
-    input: {
-      "&::-webkit-outer-spin-button, &::-webkit-inner-spin-button": {
-        "-webkit-appearance": "none",
-        margin: 0
+    ".weaverse-content-root": {
+      input: {
+        "&::-webkit-outer-spin-button, &::-webkit-inner-spin-button": {
+          "-webkit-appearance": "none",
+          margin: 0
+        },
+        "&[type=number]": {
+          "-moz-appearance": "textfield"
+        }
       },
-      "&[type=number]": {
-        "-moz-appearance": "textfield"
+      select: {
+        WebkitAppearance: "none",
+        MozAppearance: "none",
+        appearance: "none",
+        outline: "none",
+        boxShadow: "none",
+        color: "currentColor",
+        verticalAlign: "middle",
+        backgroundPosition: "center",
+        backgroundRepeat: "no-repeat",
+        backgroundImage: "url(https://ucarecdn.com/4bb6a6e7-1ce8-4201-8f2d-da00a50105f3/ardown.svg)",
+        backgroundSize: "10px",
+        backgroundPositionX: "calc(100% - 12px)",
+        paddingLeft: "12px",
+        paddingRight: "35px !important",
+        cursor: "pointer"
       }
     },
     ".wv-spinner-wrapper": {

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.7.18",
+  "version": "0.7.20",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",