@jay-framework/wix-stores 0.15.0

package/dist/contracts/product-page.jay-contract.d.ts

@@ -0,0 +1,218 @@
+import {HTMLElementCollectionProxy, HTMLElementProxy, JayContract} from "@jay-framework/runtime";
+import {MediaGalleryViewState, MediaGalleryRefs, MediaGalleryRepeatedRefs} from "./media-gallery.jay-contract";
+
+export enum ProductType {
+  PHYSICAL,
+  DIGITAL
+}
+
+export enum StockStatus {
+  OUT_OF_STOCK,
+  IN_STOCK
+}
+
+export interface QuantityOfProductPageViewState {
+  quantity: number
+}
+
+export enum OptionRenderType {
+  TEXT_CHOICES,
+  COLOR_SWATCH_CHOICES
+}
+
+export enum ChoiceType {
+  CHOICE_TEXT,
+  ONE_COLOR
+}
+
+export interface ChoiceOfOptionOfProductPageViewState {
+  choiceId: string,
+  choiceType: ChoiceType,
+  name: string,
+  colorCode: string,
+  inStock: boolean,
+  isSelected: boolean
+}
+
+export interface OptionOfProductPageViewState {
+  _id: string,
+  name: string,
+  optionRenderType: OptionRenderType,
+  textChoiceSelection: string,
+  choices: Array<ChoiceOfOptionOfProductPageViewState>
+}
+
+export interface InfoSectionOfProductPageViewState {
+  _id: string,
+  title: string,
+  plainDescription: string
+}
+
+export enum ModifierType {
+  TEXT_CHOICES,
+  COLOR_SWATCH_CHOICES,
+  FREE_TEXT
+}
+
+export enum ChoiceType {
+  CHOICE_TEXT,
+  ONE_COLOR
+}
+
+export interface ChoiceOfModifierOfProductPageViewState {
+  choiceId: string,
+  choiceType: ChoiceType,
+  name: string,
+  colorCode: string,
+  isSelected: boolean
+}
+
+export interface ModifierOfProductPageViewState {
+  _id: string,
+  name: string,
+  modifierType: ModifierType,
+  textModifierSelection: string,
+  textInputLength: number,
+  textInputRequired: boolean,
+  choices: Array<ChoiceOfModifierOfProductPageViewState>
+}
+
+export interface PropOfTagOfSeoDatumOfProductPageViewState {
+  key: string,
+  value: string
+}
+
+export interface MetaOfTagOfSeoDatumOfProductPageViewState {
+  key: string,
+  value: string
+}
+
+export interface TagOfSeoDatumOfProductPageViewState {
+  position: string,
+  type: string,
+  props: Array<PropOfTagOfSeoDatumOfProductPageViewState>,
+  meta: Array<MetaOfTagOfSeoDatumOfProductPageViewState>,
+  children: string
+}
+
+export interface KeywordOfSettingOfSeoDatumOfProductPageViewState {
+  term: string,
+  isMain: boolean,
+  origin: string
+}
+
+export interface SettingOfSeoDatumOfProductPageViewState {
+  preventAutoRedirect: boolean,
+  keywords: Array<KeywordOfSettingOfSeoDatumOfProductPageViewState>
+}
+
+export interface SeoDatumOfProductPageViewState {
+  tags: Array<TagOfSeoDatumOfProductPageViewState>,
+  settings: SettingOfSeoDatumOfProductPageViewState
+}
+
+export interface ProductPageViewState {
+  _id: string,
+  productName: string,
+  mediaGallery: MediaGalleryViewState,
+  description: string,
+  brand: string,
+  ribbon: string,
+  productType: ProductType,
+  sku: string,
+  price: string,
+  strikethroughPrice: string,
+  pricePerUnit: string,
+  stockStatus: StockStatus,
+  quantity: QuantityOfProductPageViewState,
+  actionsEnabled: boolean,
+  options: Array<OptionOfProductPageViewState>,
+  infoSections: Array<InfoSectionOfProductPageViewState>,
+  modifiers: Array<ModifierOfProductPageViewState>,
+  seoData: SeoDatumOfProductPageViewState
+}
+
+export type ProductPageSlowViewState = Pick<ProductPageViewState, '_id' | 'productName' | 'description' | 'brand' | 'ribbon' | 'productType'> & {
+    options: Array<Pick<ProductPageViewState['options'][number], '_id' | 'name' | 'optionRenderType'> & {
+    choices: Array<Pick<ProductPageViewState['options'][number]['choices'][number], 'choiceId' | 'choiceType' | 'name' | 'colorCode' | 'inStock'>>;
+}>;
+    infoSections: Array<ProductPageViewState['infoSections'][number]>;
+    modifiers: Array<Pick<ProductPageViewState['modifiers'][number], '_id' | 'name' | 'modifierType' | 'textInputLength' | 'textInputRequired'> & {
+    choices: Array<Pick<ProductPageViewState['modifiers'][number]['choices'][number], 'choiceId' | 'choiceType' | 'name' | 'colorCode'>>;
+}>;
+    seoData: ProductPageViewState['seoData'];
+};
+
+export type ProductPageFastViewState = Pick<ProductPageViewState, 'sku' | 'price' | 'strikethroughPrice' | 'pricePerUnit' | 'stockStatus' | 'actionsEnabled'> & {
+    mediaGallery: ProductPageViewState['mediaGallery'];
+    quantity: ProductPageViewState['quantity'];
+    options: Array<Pick<ProductPageViewState['options'][number], '_id' | 'textChoiceSelection'> & {
+    choices: Array<Pick<ProductPageViewState['options'][number]['choices'][number], 'choiceId' | 'isSelected'>>;
+}>;
+    modifiers: Array<Pick<ProductPageViewState['modifiers'][number], '_id' | 'textModifierSelection'> & {
+    choices: Array<Pick<ProductPageViewState['modifiers'][number]['choices'][number], 'choiceId' | 'isSelected'>>;
+}>;
+};
+
+export type ProductPageInteractiveViewState = Pick<ProductPageViewState, 'sku' | 'price' | 'strikethroughPrice' | 'pricePerUnit' | 'stockStatus' | 'actionsEnabled'> & {
+    mediaGallery: ProductPageViewState['mediaGallery'];
+    quantity: ProductPageViewState['quantity'];
+    options: Array<Pick<ProductPageViewState['options'][number], '_id' | 'textChoiceSelection'> & {
+    choices: Array<Pick<ProductPageViewState['options'][number]['choices'][number], 'choiceId' | 'isSelected'>>;
+}>;
+    modifiers: Array<Pick<ProductPageViewState['modifiers'][number], '_id' | 'textModifierSelection'> & {
+    choices: Array<Pick<ProductPageViewState['modifiers'][number]['choices'][number], 'choiceId' | 'isSelected'>>;
+}>;
+};
+
+
+export interface ProductPageRefs {
+  addToCartButton: HTMLElementProxy<ProductPageViewState, HTMLButtonElement>,
+  buyNowButton: HTMLElementProxy<ProductPageViewState, HTMLButtonElement>,
+  mediaGallery: MediaGalleryRefs,
+  quantity: {
+    decrementButton: HTMLElementProxy<QuantityOfProductPageViewState, HTMLButtonElement>,
+    incrementButton: HTMLElementProxy<QuantityOfProductPageViewState, HTMLButtonElement>,
+    quantity: HTMLElementProxy<QuantityOfProductPageViewState, HTMLInputElement>
+  },
+  options: {
+    textChoice: HTMLElementCollectionProxy<OptionOfProductPageViewState, HTMLSelectElement>,
+    choices: {
+      choiceButton: HTMLElementCollectionProxy<ChoiceOfOptionOfProductPageViewState, HTMLButtonElement>
+    }
+  },
+  modifiers: {
+    textModifier: HTMLElementCollectionProxy<ModifierOfProductPageViewState, HTMLSelectElement>,
+    textInput: HTMLElementCollectionProxy<ModifierOfProductPageViewState, HTMLInputElement | HTMLAreaElement>,
+    choices: {
+      choiceButton: HTMLElementCollectionProxy<ChoiceOfModifierOfProductPageViewState, HTMLButtonElement>
+    }
+  }
+}
+
+
+export interface ProductPageRepeatedRefs {
+  addToCartButton: HTMLElementCollectionProxy<ProductPageViewState, HTMLButtonElement>,
+  buyNowButton: HTMLElementCollectionProxy<ProductPageViewState, HTMLButtonElement>,
+  mediaGallery: MediaGalleryRepeatedRefs,
+  quantity: {
+    decrementButton: HTMLElementCollectionProxy<QuantityOfProductPageViewState, HTMLButtonElement>,
+    incrementButton: HTMLElementCollectionProxy<QuantityOfProductPageViewState, HTMLButtonElement>,
+    quantity: HTMLElementCollectionProxy<QuantityOfProductPageViewState, HTMLInputElement>
+  },
+  options: {
+    textChoice: HTMLElementCollectionProxy<OptionOfProductPageViewState, HTMLSelectElement>,
+    choices: {
+      choiceButton: HTMLElementCollectionProxy<ChoiceOfOptionOfProductPageViewState, HTMLButtonElement>
+    }
+  },
+  modifiers: {
+    textModifier: HTMLElementCollectionProxy<ModifierOfProductPageViewState, HTMLSelectElement>,
+    textInput: HTMLElementCollectionProxy<ModifierOfProductPageViewState, HTMLInputElement | HTMLAreaElement>,
+    choices: {
+      choiceButton: HTMLElementCollectionProxy<ChoiceOfModifierOfProductPageViewState, HTMLButtonElement>
+    }
+  }
+}
+
+export type ProductPageContract = JayContract<ProductPageViewState, ProductPageRefs, ProductPageSlowViewState, ProductPageFastViewState, ProductPageInteractiveViewState>

package/dist/contracts/product-search.jay-contract

@@ -0,0 +1,252 @@
+name: product-search
+tags:
+  # Search input (matches Wix searchProducts search.search parameter)
+  - tag: searchExpression
+    type: [data, interactive]
+    dataType: string
+    elementType: HTMLInputElement
+    description: Search term or expression
+    
+  - tag: searchFields
+    type: data
+    dataType: string
+    description: Comma-separated list of fields to search in (name, description, sku, etc.)
+    
+  - tag: fuzzySearch
+    type: data
+    dataType: boolean
+    description: Whether to enable fuzzy search for typos and declensions
+    
+  - tag: searchButton
+    type: interactive
+    elementType: HTMLButtonElement
+    description: Search submit button
+    
+  - tag: clearSearchButton
+    type: interactive
+    elementType: HTMLButtonElement
+    description: Clear search input button
+    
+  # Search state (fast+interactive for dynamic updates)
+  - tag: isSearching
+    type: variant
+    dataType: boolean
+    phase: fast+interactive
+    description: Whether search is in progress
+    
+  - tag: hasSearched
+    type: variant
+    dataType: boolean
+    phase: fast+interactive
+    description: Whether a search has been performed
+    
+  # Search results (fast+interactive for dynamic loading)
+  - tag: searchResults
+    type: sub-contract
+    repeated: true
+    trackBy: _id
+    phase: fast+interactive
+    description: Product search results (loaded dynamically)
+    link: ./product-card
+    
+  - tag: resultCount
+    type: data
+    dataType: number
+    phase: fast+interactive
+    description: Total number of search results
+    
+  - tag: hasResults
+    type: variant
+    dataType: boolean
+    phase: fast+interactive
+    description: Whether search returned any results
+    
+  # Empty state message
+  - tag: emptyStateMessage
+    type: data
+    dataType: string
+    description: Message to show when no results found
+    
+  # Search filters
+  - tag: filters
+    type: sub-contract
+    description: Search result filters
+    tags:
+      # Price range filter (fast+interactive)
+      - tag: priceRange
+        type: sub-contract
+        phase: fast+interactive
+        description: Price range filter
+        tags:
+          - tag: minPrice
+            type: [data, interactive]
+            dataType: number
+            elementType: HTMLInputElement
+            description: Current minimum price filter (works with number input or range slider)
+            
+          - tag: maxPrice
+            type: [data, interactive]
+            dataType: number
+            elementType: HTMLInputElement
+            description: Current maximum price filter (works with number input or range slider)
+            
+          - tag: minBound
+            type: data
+            dataType: number
+            description: Absolute minimum price from product catalog (for slider min attribute)
+            
+          - tag: maxBound
+            type: data
+            dataType: number
+            description: Absolute maximum price from product catalog (for slider max attribute)
+            
+          - tag: ranges
+            type: sub-contract
+            repeated: true
+            trackBy: rangeId
+            description: Predefined price range options with product counts
+            tags:
+              - tag: rangeId
+                type: data
+                dataType: string
+                description: Unique range identifier
+                
+              - tag: label
+                type: data
+                dataType: string
+                description: Display label (e.g., "$0 - $100")
+                
+              - tag: minValue
+                type: data
+                dataType: number
+                description: Range minimum (null for "Show all")
+                
+              - tag: maxValue
+                type: data
+                dataType: number
+                description: Range maximum (null for open-ended like "$400+")
+                
+              - tag: productCount
+                type: data
+                dataType: number
+                description: Number of products in this price range
+                
+              - tag: isSelected
+                type: [data, interactive]
+                dataType: boolean
+                elementType: HTMLInputElement
+                description: Radio button for this range
+      
+      # Category filter (slow for category list, fast+interactive for selection)
+      - tag: categoryFilter
+        type: sub-contract
+        description: Filter by category
+        tags:
+          - tag: categories
+            type: sub-contract
+            repeated: true
+            trackBy: categoryId
+            description: Available categories for filtering
+            tags:
+              - tag: categoryId
+                type: data
+                dataType: string
+                description: Category GUID
+                
+              - tag: categoryName
+                type: data
+                dataType: string
+                description: Category name
+                
+              - tag: categorySlug
+                type: data
+                dataType: string
+                description: Category slug for URL
+                
+              - tag: isSelected
+                type: [data, interactive]
+                dataType: boolean
+                elementType: HTMLInputElement
+                description: Category checkbox
+      
+      # Availability filter (fast+interactive)
+      - tag: inStockOnly
+        type: [data, interactive]
+        dataType: boolean
+        elementType: HTMLInputElement
+        description: Show only in-stock products checkbox
+        
+      - tag: clearFilters
+        type: interactive
+        elementType: HTMLButtonElement
+        description: Clear all filters button
+  
+  # Sorting (fast+interactive)
+  - tag: sortBy
+    type: sub-contract
+    phase: fast+interactive
+    description: Sort search results
+    tags:
+      - tag: currentSort
+        type: data
+        dataType: enum (relevance | priceAsc | priceDesc | newest | nameAsc | nameDesc)
+        description: Current sort option
+        
+      - tag: sortDropdown
+        type: interactive
+        elementType: HTMLSelectElement
+        description: Dropdown to select sort option
+  
+  # Load more (replaces pagination)
+  - tag: hasMore
+    type: variant
+    dataType: boolean
+    phase: fast+interactive
+    description: Whether there are more products to load
+    
+  - tag: loadMoreButton
+    type: interactive
+    elementType: HTMLButtonElement
+    description: Button to load more products
+    
+  - tag: loadedCount
+    type: data
+    dataType: number
+    phase: fast+interactive
+    description: Number of products currently loaded
+    
+  - tag: totalCount
+    type: data
+    dataType: number
+    phase: fast+interactive
+    description: Total number of products matching search
+  
+  # Search suggestions (fast+interactive)
+  - tag: hasSuggestions
+    type: variant
+    dataType: boolean
+    phase: fast+interactive
+    description: Whether search suggestions are available
+    
+  - tag: suggestions
+    type: sub-contract
+    repeated: true
+    trackBy: suggestionId
+    phase: fast+interactive
+    description: Search term suggestions
+    tags:
+      - tag: suggestionId
+        type: data
+        dataType: string
+        description: Suggested id
+
+      - tag: suggestionText
+        type: data
+        dataType: string
+        description: Suggested search term
+        
+      - tag: suggestionButton
+        type: interactive
+        elementType: HTMLButtonElement
+        description: Button to use this suggestion
+

package/dist/contracts/product-search.jay-contract.d.ts

@@ -0,0 +1,169 @@
+import {HTMLElementCollectionProxy, HTMLElementProxy, JayContract} from "@jay-framework/runtime";
+import {ProductCardViewState, ProductCardRefs, ProductCardRepeatedRefs} from "./product-card.jay-contract";
+
+export interface RangeOfPriceRangeOfFilterOfProductSearchViewState {
+  rangeId: string,
+  label: string,
+  minValue: number,
+  maxValue: number,
+  productCount: number,
+  isSelected: boolean
+}
+
+export interface PriceRangeOfFilterOfProductSearchViewState {
+  minPrice: number,
+  maxPrice: number,
+  minBound: number,
+  maxBound: number,
+  ranges: Array<RangeOfPriceRangeOfFilterOfProductSearchViewState>
+}
+
+export interface CategoryOfCategoryFilterOfFilterOfProductSearchViewState {
+  categoryId: string,
+  categoryName: string,
+  categorySlug: string,
+  isSelected: boolean
+}
+
+export interface CategoryFilterOfFilterOfProductSearchViewState {
+  categories: Array<CategoryOfCategoryFilterOfFilterOfProductSearchViewState>
+}
+
+export interface FilterOfProductSearchViewState {
+  priceRange: PriceRangeOfFilterOfProductSearchViewState,
+  categoryFilter: CategoryFilterOfFilterOfProductSearchViewState,
+  inStockOnly: boolean
+}
+
+export enum CurrentSort {
+  relevance,
+  priceAsc,
+  priceDesc,
+  newest,
+  nameAsc,
+  nameDesc
+}
+
+export interface SortByOfProductSearchViewState {
+  currentSort: CurrentSort
+}
+
+export interface SuggestionOfProductSearchViewState {
+  suggestionId: string,
+  suggestionText: string
+}
+
+export interface ProductSearchViewState {
+  searchExpression: string,
+  searchFields: string,
+  fuzzySearch: boolean,
+  isSearching: boolean,
+  hasSearched: boolean,
+  searchResults: Array<ProductCardViewState>,
+  resultCount: number,
+  hasResults: boolean,
+  emptyStateMessage: string,
+  filters: FilterOfProductSearchViewState,
+  sortBy: SortByOfProductSearchViewState,
+  hasMore: boolean,
+  loadedCount: number,
+  totalCount: number,
+  hasSuggestions: boolean,
+  suggestions: Array<SuggestionOfProductSearchViewState>
+}
+
+export type ProductSearchSlowViewState = Pick<ProductSearchViewState, 'searchFields' | 'fuzzySearch' | 'emptyStateMessage'> & {
+    filters: {
+    categoryFilter: {
+    categories: Array<Pick<ProductSearchViewState['filters']['categoryFilter']['categories'][number], 'categoryId' | 'categoryName' | 'categorySlug'>>;
+};
+};
+};
+
+export type ProductSearchFastViewState = Pick<ProductSearchViewState, 'searchExpression' | 'isSearching' | 'hasSearched' | 'resultCount' | 'hasResults' | 'hasMore' | 'loadedCount' | 'totalCount' | 'hasSuggestions'> & {
+    searchResults: Array<ProductSearchViewState['searchResults'][number]>;
+    filters: Pick<ProductSearchViewState['filters'], 'inStockOnly'> & {
+    priceRange: ProductSearchViewState['filters']['priceRange'];
+    categoryFilter: {
+    categories: Array<Pick<ProductSearchViewState['filters']['categoryFilter']['categories'][number], 'categoryId' | 'isSelected'>>;
+};
+};
+    sortBy: ProductSearchViewState['sortBy'];
+    suggestions: Array<ProductSearchViewState['suggestions'][number]>;
+};
+
+export type ProductSearchInteractiveViewState = Pick<ProductSearchViewState, 'searchExpression' | 'isSearching' | 'hasSearched' | 'resultCount' | 'hasResults' | 'hasMore' | 'loadedCount' | 'totalCount' | 'hasSuggestions'> & {
+    searchResults: Array<ProductSearchViewState['searchResults'][number]>;
+    filters: Pick<ProductSearchViewState['filters'], 'inStockOnly'> & {
+    priceRange: ProductSearchViewState['filters']['priceRange'];
+    categoryFilter: {
+    categories: Array<Pick<ProductSearchViewState['filters']['categoryFilter']['categories'][number], 'categoryId' | 'isSelected'>>;
+};
+};
+    sortBy: ProductSearchViewState['sortBy'];
+    suggestions: Array<ProductSearchViewState['suggestions'][number]>;
+};
+
+
+export interface ProductSearchRefs {
+  searchExpression: HTMLElementProxy<ProductSearchViewState, HTMLInputElement>,
+  searchButton: HTMLElementProxy<ProductSearchViewState, HTMLButtonElement>,
+  clearSearchButton: HTMLElementProxy<ProductSearchViewState, HTMLButtonElement>,
+  loadMoreButton: HTMLElementProxy<ProductSearchViewState, HTMLButtonElement>,
+  searchResults: ProductCardRepeatedRefs,
+  filters: {
+    inStockOnly: HTMLElementProxy<FilterOfProductSearchViewState, HTMLInputElement>,
+    clearFilters: HTMLElementProxy<FilterOfProductSearchViewState, HTMLButtonElement>,
+    priceRange: {
+      minPrice: HTMLElementProxy<PriceRangeOfFilterOfProductSearchViewState, HTMLInputElement>,
+      maxPrice: HTMLElementProxy<PriceRangeOfFilterOfProductSearchViewState, HTMLInputElement>,
+      ranges: {
+        isSelected: HTMLElementCollectionProxy<RangeOfPriceRangeOfFilterOfProductSearchViewState, HTMLInputElement>
+      }
+    },
+    categoryFilter: {
+      categories: {
+        isSelected: HTMLElementCollectionProxy<CategoryOfCategoryFilterOfFilterOfProductSearchViewState, HTMLInputElement>
+      }
+    }
+  },
+  sortBy: {
+    sortDropdown: HTMLElementProxy<SortByOfProductSearchViewState, HTMLSelectElement>
+  },
+  suggestions: {
+    suggestionButton: HTMLElementCollectionProxy<SuggestionOfProductSearchViewState, HTMLButtonElement>
+  }
+}
+
+
+export interface ProductSearchRepeatedRefs {
+  searchExpression: HTMLElementCollectionProxy<ProductSearchViewState, HTMLInputElement>,
+  searchButton: HTMLElementCollectionProxy<ProductSearchViewState, HTMLButtonElement>,
+  clearSearchButton: HTMLElementCollectionProxy<ProductSearchViewState, HTMLButtonElement>,
+  loadMoreButton: HTMLElementCollectionProxy<ProductSearchViewState, HTMLButtonElement>,
+  searchResults: ProductCardRepeatedRefs,
+  filters: {
+    inStockOnly: HTMLElementCollectionProxy<FilterOfProductSearchViewState, HTMLInputElement>,
+    clearFilters: HTMLElementCollectionProxy<FilterOfProductSearchViewState, HTMLButtonElement>,
+    priceRange: {
+      minPrice: HTMLElementCollectionProxy<PriceRangeOfFilterOfProductSearchViewState, HTMLInputElement>,
+      maxPrice: HTMLElementCollectionProxy<PriceRangeOfFilterOfProductSearchViewState, HTMLInputElement>,
+      ranges: {
+        isSelected: HTMLElementCollectionProxy<RangeOfPriceRangeOfFilterOfProductSearchViewState, HTMLInputElement>
+      }
+    },
+    categoryFilter: {
+      categories: {
+        isSelected: HTMLElementCollectionProxy<CategoryOfCategoryFilterOfFilterOfProductSearchViewState, HTMLInputElement>
+      }
+    }
+  },
+  sortBy: {
+    sortDropdown: HTMLElementCollectionProxy<SortByOfProductSearchViewState, HTMLSelectElement>
+  },
+  suggestions: {
+    suggestionButton: HTMLElementCollectionProxy<SuggestionOfProductSearchViewState, HTMLButtonElement>
+  }
+}
+
+export type ProductSearchContract = JayContract<ProductSearchViewState, ProductSearchRefs, ProductSearchSlowViewState, ProductSearchFastViewState, ProductSearchInteractiveViewState>