@brytdesigns/shopify-product-info-components 1.0.13 → 1.1.0

package/dist/esm/index.js

@@ -1,9 +1,20 @@
-import { customShadowlessElement, correctElementType, getContextFromProvider } from '@brytdesigns/web-component-utils';
-import { splitProps, mergeProps, createEffect, createMemo, on, onCleanup, Show, untrack, observable } from 'solid-js';
+import { createWithElementContext, customShadowlessElement, correctElementType, getContextFromProvider } from '@brytdesigns/web-component-core/utils';
+import { splitProps, mergeProps, createEffect, untrack, createMemo, Show, on, onCleanup, observable } from 'solid-js';
 import { createContext, consume, provide } from 'component-register';
 import html from 'solid-js/html';
 
-// src/index.ts
+var __defProp = Object.defineProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+
+// src/components/product-info.ts
+var product_info_exports = {};
+__export(product_info_exports, {
+  Component: () => Component,
+  Name: () => Name
+});
 function initializeProductContext(props) {
   const [privateProps, publicProps] = splitProps(props, ["root"]);
   const state = mergeProps(publicProps, {});
@@ -64,6 +75,7 @@ var getProductContext = (element) => {
   );
   return useProductContext(context);
 };
+var withProductElementContext = createWithElementContext(ProductContextState);
 function initializeProductOptionsContext(props) {
   const [privateProps, publicProps] = splitProps(props, ["root"]);
   const [context, methods] = useProduct(privateProps.root);
@@ -126,16 +138,18 @@ var getProductOptionsContext = (element) => {
   );
   return useProductOptionsContext(context);
 };
+var withProductOptionsElementContext = createWithElementContext(ProductOptionsContextState);
 
 // src/components/product-info.ts
-var ProductInfo = (props, { element }) => {
+var Name = `product-info`;
+var Component = (props, { element }) => {
   if (!props.product)
-    return console.warn("product-info: product attribute is required");
+    return console.warn(`${Name}: product attribute is required`);
   if (!props.product.variants)
-    return console.warn("product-info: product attribute needs variants array");
+    return console.warn(`${Name}: product attribute needs variants array`);
   if (!props.product.selected_or_first_available_variant)
     return console.warn(
-      "product-info: product attribute needs selected or first available variant object"
+      `${Name}: product attribute needs selected or first available variant object`
     );
   provideProductContext(props, element);
   const url = createMemo(() => {
@@ -159,12 +173,20 @@ var ProductInfo = (props, { element }) => {
     window.history.replaceState(null, "", url());
   });
 };
-var ProductVariantRender = (_, { element }) => {
+
+// src/components/product-variant-render.ts
+var product_variant_render_exports = {};
+__export(product_variant_render_exports, {
+  Component: () => Component2,
+  Name: () => Name2
+});
+var Name2 = `product-variant-render`;
+var Component2 = (_, { element }) => {
   const templates = Array.from(
     element.querySelectorAll("template[variant-id]")
   );
   if (!templates.length)
-    return console.warn("product-variant-render: No variant templates found");
+    return console.warn(`${Name2}: No variant templates found`);
   const [state] = useProduct(element);
   const fallbackChildren = Array.from(element.children);
   const activeVariantTemplate = createMemo(() => {
@@ -189,14 +211,26 @@ var ProductVariantRender = (_, { element }) => {
 };
 
 // src/components/product-options.ts
-var ProductOptions = (props, { element }) => {
+var product_options_exports = {};
+__export(product_options_exports, {
+  Component: () => Component3,
+  Name: () => Name3
+});
+var Name3 = `product-options`;
+var Component3 = (props, { element }) => {
   if (!props.selectedOptions)
-    return console.warn(
-      "product-options: selected-options attribute is required"
-    );
+    return console.warn(`${Name3}: selected-options attribute is required`);
   provideProductOptionsContext(props, element);
 };
-var ProductOptionGroup = (props, { element }) => {
+
+// src/components/product-option-group.ts
+var product_option_group_exports = {};
+__export(product_option_group_exports, {
+  Component: () => Component4,
+  Name: () => Name4
+});
+var Name4 = `product-option-group`;
+var Component4 = (props, { element }) => {
   const [context, methods] = useProductOptions(element);
   createEffect(
     on(
@@ -257,7 +291,15 @@ var ProductOptionGroup = (props, { element }) => {
     });
   });
 };
-var ProductVariantInput = (props, { element }) => {
+
+// src/components/product-variant-input.ts
+var product_variant_input_exports = {};
+__export(product_variant_input_exports, {
+  Component: () => Component5,
+  Name: () => Name5
+});
+var Name5 = `product-variant-input`;
+var Component5 = (props, { element }) => {
   const [productContext, productContextMethods] = useProduct(element);
   const [_, optionsMethods] = useProductOptions(element);
   createEffect(() => {
@@ -290,8 +332,7 @@ var ProductVariantInput = (props, { element }) => {
       target = element.querySelector(props.target);
     if (!target)
       target = element.querySelector("input[name='id']");
-    if (!target)
-      return console.warn("product-variant-input: target input not found");
+    if (!target) return console.warn(`${Name5}: target input not found`);
     const variantId = productContext?.product?.selected_or_first_available_variant?.id;
     if (!variantId) return;
     if (target.value === variantId.toString()) return;
@@ -302,43 +343,43 @@ var ProductVariantInput = (props, { element }) => {
 
 // src/index.ts
 customShadowlessElement(
-  "product-info",
+  product_info_exports.Name,
   {
     product: void 0,
     isProductPage: false
   },
-  correctElementType(ProductInfo)
+  correctElementType(product_info_exports.Component)
 );
 customShadowlessElement(
-  "product-options",
+  product_options_exports.Name,
   {
     selectedOptions: []
   },
-  correctElementType(ProductOptions)
+  correctElementType(product_options_exports.Component)
 );
 customShadowlessElement(
-  "product-option-group",
+  product_option_group_exports.Name,
   {
     position: 0,
     name: "",
     inputType: "radio"
   },
-  correctElementType(ProductOptionGroup)
+  correctElementType(product_option_group_exports.Component)
 );
 customShadowlessElement(
-  "product-variant-input",
+  product_variant_input_exports.Name,
   {
     target: "",
     preventDefault: true
   },
-  correctElementType(ProductVariantInput)
+  correctElementType(product_variant_input_exports.Component)
 );
 customShadowlessElement(
-  "product-variant-render",
+  product_variant_render_exports.Name,
   {},
-  correctElementType(ProductVariantRender)
+  correctElementType(product_variant_render_exports.Component)
 );
 
-export { getProductContext, getProductOptionsContext, useProduct, useProductOptions };
+export { getProductContext, getProductOptionsContext, useProduct, useProductOptions, withProductElementContext, withProductOptionsElementContext };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/hooks/useProduct.ts","../../src/hooks/useProductOptions.ts","../../src/components/product-info.ts","../../src/components/product-variant-render.ts","../../src/components/product-options.ts","../../src/components/product-option-group.ts","../../src/components/product-variant-input.ts","../../src/index.ts"],"names":["splitProps","untrack","variant","createContext","mergeProps","provide","consume","getContextFromProvider","url","createEffect","createMemo","target","onCleanup"],"mappings":"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","file":"index.js","sourcesContent":["import {\n  type ICustomElement,\n  createContext,\n  provide,\n  consume,\n} from \"component-register\";\nimport { mergeProps, splitProps, untrack } from \"solid-js\";\nimport { getContextFromProvider } from \"@brytdesigns/web-component-utils\";\n\nimport type { Product } from \"../types\";\n\ntype CreateContextOptions = {\n  root: HTMLElement & ICustomElement;\n  product: Product;\n};\n\ntype WalkableNode = Parameters<typeof provide>[2];\n\ntype ProductContext = ReturnType<typeof initializeProductContext>;\n\nfunction initializeProductContext(props: CreateContextOptions) {\n  const [privateProps, publicProps] = splitProps(props, [\"root\"]);\n  const state = mergeProps(publicProps, {});\n\n  function updateSelectedVariant(variantId: string | number) {\n    const product = untrack(() => state?.product);\n    if (\n      typeof product?.selected_or_first_available_variant === \"undefined\" ||\n      typeof product === \"undefined\" ||\n      typeof product?.variants === \"undefined\"\n    )\n      return;\n    const newVariant = product.variants.find(\n      (variant) => variant.id.toString() === variantId.toString()\n    );\n\n    if (\n      newVariant?.id.toString() ===\n      product.selected_or_first_available_variant?.id.toString()\n    )\n      return;\n\n    const newState = {\n      ...product,\n      selected_or_first_available_variant: newVariant,\n    };\n\n    privateProps.root.setAttribute(\"product\", JSON.stringify(newState));\n\n    privateProps.root.dispatchEvent(\n      new CustomEvent(\"variant-updated\", {\n        detail: {\n          variant: newVariant,\n          product: newState,\n        },\n        bubbles: true,\n      })\n    );\n  }\n\n  return [\n    state,\n    {\n      variant: {\n        update: updateSelectedVariant,\n      },\n    },\n  ] as const;\n}\n\nconst ProductContextState = createContext(initializeProductContext);\n\nexport const provideProductContext = (\n  initialState: Omit<CreateContextOptions, \"root\">,\n  element: WalkableNode\n): ProductContext => {\n  const props = mergeProps(initialState, { root: element });\n  return provide(ProductContextState, props, element);\n};\n\nexport const useProductContext = (context: ProductContext) => {\n  return context;\n};\n\nexport const useProduct = (element: HTMLElement & ICustomElement) => {\n  const context: ProductContext = consume(ProductContextState, element);\n\n  if (!context) {\n    throw console.error(\n      \"ProductInfoContext not found! Please ensure to wrap your custom element with product-info element.\"\n    );\n  }\n\n  return useProductContext(context);\n};\n\nexport const getProductContext = (element: Element) => {\n  const context = getContextFromProvider<ProductContext>(\n    ProductContextState,\n    element\n  );\n  return useProductContext(context);\n};\n","import {\n  type ICustomElement,\n  createContext,\n  provide,\n  consume,\n} from \"component-register\";\nimport { createEffect, mergeProps, splitProps, untrack } from \"solid-js\";\nimport { getContextFromProvider } from \"@brytdesigns/web-component-utils\";\n\nimport { useProduct } from \"./useProduct.js\";\n\ntype CreateContextOptions = {\n  root: HTMLElement & ICustomElement;\n  selectedOptions: string[];\n};\n\ntype WalkableNode = Parameters<typeof provide>[2];\n\ntype ProductOptionsContext = ReturnType<typeof initializeProductOptionsContext>;\n\nfunction initializeProductOptionsContext(props: CreateContextOptions) {\n  const [privateProps, publicProps] = splitProps(props, [\"root\"]);\n  const [context, methods] = useProduct(privateProps.root);\n\n  function updateSelectedOptions(options: string[]) {\n    privateProps.root.setAttribute(\"selected-options\", JSON.stringify(options));\n  }\n\n  function updateSelectedOption(option: string, index: number) {\n    const current = untrack(() => publicProps.selectedOptions);\n    const options = [...current];\n    options[index] = option;\n    return updateSelectedOptions(options);\n  }\n\n  createEffect(() => {\n    const variant = context.product.variants.find((variant) => {\n      return publicProps.selectedOptions.every((option) =>\n        variant.options.includes(option)\n      );\n    });\n    if (!variant) return;\n    if (variant.id === context.product.selected_or_first_available_variant.id)\n      return;\n    methods.variant.update(variant.id);\n  });\n\n  return [\n    publicProps,\n    {\n      options: {\n        update: updateSelectedOptions,\n        updateOption: updateSelectedOption,\n      },\n    },\n  ] as const;\n}\n\nconst ProductOptionsContextState = createContext(\n  initializeProductOptionsContext\n);\n\nexport const provideProductOptionsContext = (\n  initialState: Omit<CreateContextOptions, \"root\">,\n  element: WalkableNode\n): ProductOptionsContext => {\n  const props = mergeProps(initialState, { root: element });\n  return provide(ProductOptionsContextState, props, element);\n};\n\nexport const useProductOptionsContext = (context: ProductOptionsContext) => {\n  return context;\n};\n\nexport const useProductOptions = (element: HTMLElement & ICustomElement) => {\n  const context: ProductOptionsContext = consume(\n    ProductOptionsContextState,\n    element\n  );\n\n  if (!context) {\n    throw console.error(\n      \"ProductOptionsContext not found! Please ensure to wrap your custom element with product-options element.\"\n    );\n  }\n\n  return useProductOptionsContext(context);\n};\n\nexport const getProductOptionsContext = (element: Element) => {\n  const context = getContextFromProvider<ProductOptionsContext>(\n    ProductOptionsContextState,\n    element\n  );\n  return useProductOptionsContext(context);\n};\n","import type { CorrectComponentType } from \"@brytdesigns/web-component-utils\";\n\nimport { createEffect, createMemo, observable } from \"solid-js\";\n\nimport { provideProductContext } from \"../hooks/index.js\";\n\nimport type { Product } from \"../types.js\";\n\ntype ProductInfoProps = {\n  product?: Product;\n  isProductPage?: boolean;\n};\n\nexport const ProductInfo: CorrectComponentType<ProductInfoProps> = (\n  props,\n  { element },\n) => {\n  if (!props.product)\n    return console.warn(\"product-info: product attribute is required\");\n  if (!props.product.variants)\n    return console.warn(\"product-info: product attribute needs variants array\");\n  if (!props.product.selected_or_first_available_variant)\n    return console.warn(\n      \"product-info: product attribute needs selected or first available variant object\",\n    );\n  provideProductContext(props as any, element);\n\n  const url = createMemo(() => {\n    const url = new URL(window.location.href);\n    if (props.product && props.product.selected_or_first_available_variant) {\n      url.searchParams.set(\n        \"variant\",\n        props.product.selected_or_first_available_variant.id.toString(),\n      );\n    }\n    return url;\n  });\n\n  function subscribe(cb: (product: Product | undefined) => void) {\n    return observable(() => props.product).subscribe(cb).unsubscribe;\n  }\n\n  Object.assign(element, {\n    subscribe,\n  });\n\n  createEffect(() => {\n    if (!props.isProductPage) return;\n    window.history.replaceState(null, \"\", url());\n  });\n};\n","import type { CorrectComponentType } from \"@brytdesigns/web-component-utils\";\n\nimport { createMemo, Show } from \"solid-js\";\nimport html from \"solid-js/html\";\n\nimport { useProduct } from \"../hooks/index.js\";\n\ntype ProductVariantRenderProps = {};\n\nexport const ProductVariantRender: CorrectComponentType<\n  ProductVariantRenderProps\n> = (_, { element }) => {\n  const templates = Array.from(\n    element.querySelectorAll<HTMLTemplateElement>(\"template[variant-id]\"),\n  );\n  if (!templates.length)\n    return console.warn(\"product-variant-render: No variant templates found\");\n  const [state] = useProduct(element);\n\n  const fallbackChildren = Array.from(element.children);\n\n  const activeVariantTemplate = createMemo(() => {\n    const variantId = state.product?.selected_or_first_available_variant?.id;\n    if (!variantId) return null;\n    const template = templates.find(\n      (t) => t.getAttribute(\"variant-id\") === `${variantId}`,\n    );\n    return template || null;\n  });\n\n  element.replaceChildren(...[]);\n\n  return html`\n    <${Show}\n      when=${() => !!activeVariantTemplate()}\n      fallback=${fallbackChildren}\n    >\n      ${() =>\n      Array.from(\n        activeVariantTemplate()?.content.cloneNode(true).childNodes || [],\n      )}\n    <//>\n  `;\n};\n","import type { CorrectComponentType } from \"@brytdesigns/web-component-utils\";\nimport { provideProductOptionsContext } from \"../hooks/index.js\";\n\ntype ProductOptionsProps = {\n  selectedOptions: string[];\n};\n\nexport const ProductOptions: CorrectComponentType<ProductOptionsProps> = (\n  props,\n  { element },\n) => {\n  if (!props.selectedOptions)\n    return console.warn(\n      \"product-options: selected-options attribute is required\",\n    );\n  provideProductOptionsContext(props, element);\n};\n","import type { CorrectComponentType } from \"@brytdesigns/web-component-utils\";\n\nimport { createEffect, on, onCleanup } from \"solid-js\";\n\nimport { useProductOptions } from \"../hooks/index.js\";\n\ntype ProductOptionGroupProps = {\n  position: number;\n  name: string;\n  inputType: \"radio\" | \"select\";\n};\n\nexport const ProductOptionGroup: CorrectComponentType<\n  ProductOptionGroupProps\n> = (props, { element }) => {\n  const [context, methods] = useProductOptions(element);\n\n  createEffect(\n    on(\n      () => ({\n        selectedOption: context.selectedOptions[props.position - 1],\n        position: props.position,\n        name: props.name,\n        inputType: props.inputType,\n      }),\n      ({ selectedOption, position, name, inputType }) => {\n        if (inputType !== \"radio\" && inputType !== \"select\") return;\n\n        const optionName = `${name}-${position}`;\n\n        if (inputType === \"radio\") {\n          const inputs = element.querySelectorAll<HTMLInputElement>(\n            `input[name=\"${optionName}\"]`,\n          );\n          inputs.forEach((input) => {\n            const prevValue = input.checked;\n            if (input.value === selectedOption) input.checked = true;\n            else input.checked = false;\n            if (prevValue !== input.checked) {\n              input.dispatchEvent(new Event(\"change\", { bubbles: true }));\n            }\n          });\n          return;\n        }\n\n        const select = element.querySelector<HTMLSelectElement>(\n          `select[name=\"${optionName}\"]`,\n        );\n        if (!select || !selectedOption) return;\n        select.value = selectedOption;\n        select.dispatchEvent(new Event(\"change\", { bubbles: true }));\n      },\n    ),\n  );\n\n  createEffect(() => {\n    const position = props.position;\n\n    function handleChange(event: Event) {\n      const target = event.target as HTMLInputElement;\n      if (!target) return;\n      const selectedOption = target.value;\n      if (context.selectedOptions[position - 1] === selectedOption) return;\n\n      element.dispatchEvent(\n        new CustomEvent(\"option-updated\", {\n          detail: {\n            group: props.name,\n            position: position,\n            selectedOption,\n          },\n          bubbles: true,\n        }),\n      );\n\n      methods.options.updateOption(selectedOption, position - 1);\n    }\n\n    element.addEventListener(\"change\", handleChange);\n\n    return onCleanup(() => {\n      element.removeEventListener(\"change\", handleChange);\n    });\n  });\n};\n","import type { CorrectComponentType } from \"@brytdesigns/web-component-utils\";\n\nimport { createEffect, onCleanup } from \"solid-js\";\n\nimport { useProduct, useProductOptions } from \"../hooks/index.js\";\n\ntype ProductVariantInputProps = {\n  target: string | null;\n  preventDefault?: boolean;\n};\n\nexport const ProductVariantInput: CorrectComponentType<\n  ProductVariantInputProps\n> = (props, { element }) => {\n  const [productContext, productContextMethods] = useProduct(element);\n  const [_, optionsMethods] = useProductOptions(element);\n\n  createEffect(() => {\n    let target = null;\n    if (props.target) target = element.querySelector(props.target);\n    if (!target) target = element;\n\n    const preventDefault = props.preventDefault;\n\n    function handleChange(event: Event) {\n      if (preventDefault) event.preventDefault();\n      const target = event.target as HTMLInputElement;\n      if (!target) return;\n      const value = target.value;\n      if (\n        value ===\n        productContext?.product?.selected_or_first_available_variant?.id\n      )\n        return;\n      const variant = productContext?.product?.variants.find(\n        (variant) => variant.id.toString() === value.toString(),\n      );\n      if (!variant) return;\n      if (optionsMethods) optionsMethods.options.update(variant.options);\n      else productContextMethods.variant.update(variant.id);\n    }\n\n    target.addEventListener(\"change\", handleChange);\n\n    return onCleanup(() => {\n      target.removeEventListener(\"change\", handleChange);\n    });\n  });\n\n  createEffect(() => {\n    let target = null;\n    if (props.target)\n      target = element.querySelector<HTMLInputElement>(props.target);\n    if (!target)\n      target = element.querySelector<HTMLInputElement>(\"input[name='id']\");\n    if (!target)\n      return console.warn(\"product-variant-input: target input not found\");\n\n    const variantId =\n      productContext?.product?.selected_or_first_available_variant?.id;\n    if (!variantId) return;\n    if (target.value === variantId.toString()) return;\n    target.value = variantId.toString();\n    target.dispatchEvent(new Event(\"change\", { bubbles: true }));\n  });\n};\n","import {\n  customShadowlessElement,\n  correctElementType,\n} from \"@brytdesigns/web-component-utils\";\n\nimport {\n  ProductInfo,\n  ProductOptions,\n  ProductOptionGroup,\n  ProductVariantInput,\n  ProductVariantRender,\n} from \"./components/index.js\";\n\ncustomShadowlessElement(\n  \"product-info\",\n  {\n    product: undefined,\n    isProductPage: false,\n  },\n  correctElementType(ProductInfo),\n);\n\ncustomShadowlessElement(\n  \"product-options\",\n  {\n    selectedOptions: [],\n  },\n  correctElementType(ProductOptions),\n);\n\ncustomShadowlessElement(\n  \"product-option-group\",\n  {\n    position: 0,\n    name: \"\",\n    inputType: \"radio\",\n  },\n  correctElementType(ProductOptionGroup),\n);\n\ncustomShadowlessElement(\n  \"product-variant-input\",\n  {\n    target: \"\",\n    preventDefault: true,\n  },\n  correctElementType(ProductVariantInput),\n);\n\ncustomShadowlessElement(\n  \"product-variant-render\",\n  {},\n  correctElementType(ProductVariantRender),\n);\n\nexport {\n  useProduct,\n  useProductOptions,\n  getProductContext,\n  getProductOptionsContext,\n} from \"./hooks/index.js\";\n"]}
+{"version":3,"sources":["../../src/components/product-info.ts","../../src/hooks/useProduct.ts","../../src/hooks/useProductOptions.ts","../../src/components/product-variant-render.ts","../../src/components/product-options.ts","../../src/components/product-option-group.ts","../../src/components/product-variant-input.ts","../../src/index.ts"],"names":["splitProps","untrack","variant","createContext","mergeProps","provide","consume","getContextFromProvider","createWithElementContext","url","createEffect","Component","Name","createMemo","target","onCleanup"],"mappings":"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","file":"index.js","sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-core/utils\";\n\nimport { createEffect, createMemo, observable } from \"solid-js\";\n\nimport { provideProductContext } from \"../hooks/index.js\";\n\nimport type { Product } from \"../types.js\";\n\ntype Props = {\n  product?: Product;\n  isProductPage?: boolean;\n};\n\nexport const Name = `product-info`;\n\nexport const Component: CorrectComponentType<Props> = (props, { element }) => {\n  if (!props.product)\n    return console.warn(`${Name}: product attribute is required`);\n  if (!props.product.variants)\n    return console.warn(`${Name}: product attribute needs variants array`);\n  if (!props.product.selected_or_first_available_variant)\n    return console.warn(\n      `${Name}: product attribute needs selected or first available variant object`,\n    );\n  provideProductContext(props as any, element);\n\n  const url = createMemo(() => {\n    const url = new URL(window.location.href);\n    if (props.product && props.product.selected_or_first_available_variant) {\n      url.searchParams.set(\n        \"variant\",\n        props.product.selected_or_first_available_variant.id.toString(),\n      );\n    }\n    return url;\n  });\n\n  function subscribe(cb: (product: Product | undefined) => void) {\n    return observable(() => props.product).subscribe(cb).unsubscribe;\n  }\n\n  Object.assign(element, {\n    subscribe,\n  });\n\n  createEffect(() => {\n    if (!props.isProductPage) return;\n    window.history.replaceState(null, \"\", url());\n  });\n};\n","import {\n  type ICustomElement,\n  createContext,\n  provide,\n  consume,\n} from \"component-register\";\nimport { mergeProps, splitProps, untrack } from \"solid-js\";\nimport {\n  getContextFromProvider,\n  createWithElementContext,\n} from \"@brytdesigns/web-component-core/utils\";\n\nimport type { Product } from \"../types\";\n\ntype CreateContextOptions = {\n  root: HTMLElement & ICustomElement;\n  product: Product;\n};\n\ntype WalkableNode = Parameters<typeof provide>[2];\n\ntype ProductContext = ReturnType<typeof initializeProductContext>;\n\nfunction initializeProductContext(props: CreateContextOptions) {\n  const [privateProps, publicProps] = splitProps(props, [\"root\"]);\n  const state = mergeProps(publicProps, {});\n\n  function updateSelectedVariant(variantId: string | number) {\n    const product = untrack(() => state?.product);\n    if (\n      typeof product?.selected_or_first_available_variant === \"undefined\" ||\n      typeof product === \"undefined\" ||\n      typeof product?.variants === \"undefined\"\n    )\n      return;\n    const newVariant = product.variants.find(\n      (variant) => variant.id.toString() === variantId.toString(),\n    );\n\n    if (\n      newVariant?.id.toString() ===\n      product.selected_or_first_available_variant?.id.toString()\n    )\n      return;\n\n    const newState = {\n      ...product,\n      selected_or_first_available_variant: newVariant,\n    };\n\n    privateProps.root.setAttribute(\"product\", JSON.stringify(newState));\n\n    privateProps.root.dispatchEvent(\n      new CustomEvent(\"variant-updated\", {\n        detail: {\n          variant: newVariant,\n          product: newState,\n        },\n        bubbles: true,\n      }),\n    );\n  }\n\n  return [\n    state,\n    {\n      variant: {\n        update: updateSelectedVariant,\n      },\n    },\n  ] as const;\n}\n\nconst ProductContextState = createContext(initializeProductContext);\n\nexport const provideProductContext = (\n  initialState: Omit<CreateContextOptions, \"root\">,\n  element: WalkableNode,\n): ProductContext => {\n  const props = mergeProps(initialState, { root: element });\n  return provide(ProductContextState, props, element);\n};\n\nexport const useProductContext = (context: ProductContext) => {\n  return context;\n};\n\nexport const useProduct = (element: HTMLElement & ICustomElement) => {\n  const context: ProductContext = consume(ProductContextState, element);\n\n  if (!context) {\n    throw console.error(\n      \"ProductInfoContext not found! Please ensure to wrap your custom element with product-info element.\",\n    );\n  }\n\n  return useProductContext(context);\n};\n\nexport const getProductContext = (element: Element) => {\n  const context = getContextFromProvider<ProductContext>(\n    ProductContextState,\n    element,\n  );\n  return useProductContext(context);\n};\n\nexport const withProductElementContext = createWithElementContext<\n  typeof ProductContextState,\n  ProductContext\n>(ProductContextState);\n","import {\n  type ICustomElement,\n  createContext,\n  provide,\n  consume,\n} from \"component-register\";\nimport { createEffect, mergeProps, splitProps, untrack } from \"solid-js\";\nimport {\n  getContextFromProvider,\n  createWithElementContext,\n} from \"@brytdesigns/web-component-core/utils\";\n\nimport { useProduct } from \"./useProduct.js\";\n\ntype CreateContextOptions = {\n  root: HTMLElement & ICustomElement;\n  selectedOptions: string[];\n};\n\ntype WalkableNode = Parameters<typeof provide>[2];\n\ntype ProductOptionsContext = ReturnType<typeof initializeProductOptionsContext>;\n\nfunction initializeProductOptionsContext(props: CreateContextOptions) {\n  const [privateProps, publicProps] = splitProps(props, [\"root\"]);\n  const [context, methods] = useProduct(privateProps.root);\n\n  function updateSelectedOptions(options: string[]) {\n    privateProps.root.setAttribute(\"selected-options\", JSON.stringify(options));\n  }\n\n  function updateSelectedOption(option: string, index: number) {\n    const current = untrack(() => publicProps.selectedOptions);\n    const options = [...current];\n    options[index] = option;\n    return updateSelectedOptions(options);\n  }\n\n  createEffect(() => {\n    const variant = context.product.variants.find((variant) => {\n      return publicProps.selectedOptions.every((option) =>\n        variant.options.includes(option),\n      );\n    });\n    if (!variant) return;\n    if (variant.id === context.product.selected_or_first_available_variant.id)\n      return;\n    methods.variant.update(variant.id);\n  });\n\n  return [\n    publicProps,\n    {\n      options: {\n        update: updateSelectedOptions,\n        updateOption: updateSelectedOption,\n      },\n    },\n  ] as const;\n}\n\nconst ProductOptionsContextState = createContext(\n  initializeProductOptionsContext,\n);\n\nexport const provideProductOptionsContext = (\n  initialState: Omit<CreateContextOptions, \"root\">,\n  element: WalkableNode,\n): ProductOptionsContext => {\n  const props = mergeProps(initialState, { root: element });\n  return provide(ProductOptionsContextState, props, element);\n};\n\nexport const useProductOptionsContext = (context: ProductOptionsContext) => {\n  return context;\n};\n\nexport const useProductOptions = (element: HTMLElement & ICustomElement) => {\n  const context: ProductOptionsContext = consume(\n    ProductOptionsContextState,\n    element,\n  );\n\n  if (!context) {\n    throw console.error(\n      \"ProductOptionsContext not found! Please ensure to wrap your custom element with product-options element.\",\n    );\n  }\n\n  return useProductOptionsContext(context);\n};\n\nexport const getProductOptionsContext = (element: Element) => {\n  const context = getContextFromProvider<ProductOptionsContext>(\n    ProductOptionsContextState,\n    element,\n  );\n  return useProductOptionsContext(context);\n};\n\nexport const withProductOptionsElementContext = createWithElementContext<\n  typeof ProductOptionsContextState,\n  ProductOptionsContext\n>(ProductOptionsContextState);\n","import type { CorrectComponentType } from \"@brytdesigns/web-component-core/utils\";\n\nimport { createMemo, Show } from \"solid-js\";\nimport html from \"solid-js/html\";\n\nimport { useProduct } from \"../hooks/index.js\";\n\ntype Props = {};\n\nexport const Name = `product-variant-render`;\n\nexport const Component: CorrectComponentType<Props> = (_, { element }) => {\n  const templates = Array.from(\n    element.querySelectorAll<HTMLTemplateElement>(\"template[variant-id]\"),\n  );\n  if (!templates.length)\n    return console.warn(`${Name}: No variant templates found`);\n  const [state] = useProduct(element);\n\n  const fallbackChildren = Array.from(element.children);\n\n  const activeVariantTemplate = createMemo(() => {\n    const variantId = state.product?.selected_or_first_available_variant?.id;\n    if (!variantId) return null;\n    const template = templates.find(\n      (t) => t.getAttribute(\"variant-id\") === `${variantId}`,\n    );\n    return template || null;\n  });\n\n  element.replaceChildren(...[]);\n\n  return html`\n    <${Show}\n      when=${() => !!activeVariantTemplate()}\n      fallback=${fallbackChildren}\n    >\n      ${() =>\n        Array.from(\n          activeVariantTemplate()?.content.cloneNode(true).childNodes || [],\n        )}\n    <//>\n  `;\n};\n","import type { CorrectComponentType } from \"@brytdesigns/web-component-core/utils\";\nimport { provideProductOptionsContext } from \"../hooks/index.js\";\n\ntype Props = {\n  selectedOptions: string[];\n};\n\nexport const Name = `product-options`;\n\nexport const Component: CorrectComponentType<Props> = (props, { element }) => {\n  if (!props.selectedOptions)\n    return console.warn(`${Name}: selected-options attribute is required`);\n  provideProductOptionsContext(props, element);\n};\n","import type { CorrectComponentType } from \"@brytdesigns/web-component-core/utils\";\n\nimport { createEffect, on, onCleanup } from \"solid-js\";\n\nimport { useProductOptions } from \"../hooks/index.js\";\n\ntype Props = {\n  position: number;\n  name: string;\n  inputType: \"radio\" | \"select\";\n};\n\nexport const Name = `product-option-group`;\n\nexport const Component: CorrectComponentType<Props> = (props, { element }) => {\n  const [context, methods] = useProductOptions(element);\n\n  createEffect(\n    on(\n      () => ({\n        selectedOption: context.selectedOptions[props.position - 1],\n        position: props.position,\n        name: props.name,\n        inputType: props.inputType,\n      }),\n      ({ selectedOption, position, name, inputType }) => {\n        if (inputType !== \"radio\" && inputType !== \"select\") return;\n\n        const optionName = `${name}-${position}`;\n\n        if (inputType === \"radio\") {\n          const inputs = element.querySelectorAll<HTMLInputElement>(\n            `input[name=\"${optionName}\"]`,\n          );\n          inputs.forEach((input) => {\n            const prevValue = input.checked;\n            if (input.value === selectedOption) input.checked = true;\n            else input.checked = false;\n            if (prevValue !== input.checked) {\n              input.dispatchEvent(new Event(\"change\", { bubbles: true }));\n            }\n          });\n          return;\n        }\n\n        const select = element.querySelector<HTMLSelectElement>(\n          `select[name=\"${optionName}\"]`,\n        );\n        if (!select || !selectedOption) return;\n        select.value = selectedOption;\n        select.dispatchEvent(new Event(\"change\", { bubbles: true }));\n      },\n    ),\n  );\n\n  createEffect(() => {\n    const position = props.position;\n\n    function handleChange(event: Event) {\n      const target = event.target as HTMLInputElement;\n      if (!target) return;\n      const selectedOption = target.value;\n      if (context.selectedOptions[position - 1] === selectedOption) return;\n\n      element.dispatchEvent(\n        new CustomEvent(\"option-updated\", {\n          detail: {\n            group: props.name,\n            position: position,\n            selectedOption,\n          },\n          bubbles: true,\n        }),\n      );\n\n      methods.options.updateOption(selectedOption, position - 1);\n    }\n\n    element.addEventListener(\"change\", handleChange);\n\n    return onCleanup(() => {\n      element.removeEventListener(\"change\", handleChange);\n    });\n  });\n};\n","import type { CorrectComponentType } from \"@brytdesigns/web-component-core/utils\";\n\nimport { createEffect, onCleanup } from \"solid-js\";\n\nimport { useProduct, useProductOptions } from \"../hooks/index.js\";\n\ntype Props = {\n  target: string | null;\n  preventDefault?: boolean;\n};\n\nexport const Name = `product-variant-input`;\n\nexport const Component: CorrectComponentType<Props> = (props, { element }) => {\n  const [productContext, productContextMethods] = useProduct(element);\n  const [_, optionsMethods] = useProductOptions(element);\n\n  createEffect(() => {\n    let target = null;\n    if (props.target) target = element.querySelector(props.target);\n    if (!target) target = element;\n\n    const preventDefault = props.preventDefault;\n\n    function handleChange(event: Event) {\n      if (preventDefault) event.preventDefault();\n      const target = event.target as HTMLInputElement;\n      if (!target) return;\n      const value = target.value;\n      if (\n        value ===\n        productContext?.product?.selected_or_first_available_variant?.id\n      )\n        return;\n      const variant = productContext?.product?.variants.find(\n        (variant) => variant.id.toString() === value.toString(),\n      );\n      if (!variant) return;\n      if (optionsMethods) optionsMethods.options.update(variant.options);\n      else productContextMethods.variant.update(variant.id);\n    }\n\n    target.addEventListener(\"change\", handleChange);\n\n    return onCleanup(() => {\n      target.removeEventListener(\"change\", handleChange);\n    });\n  });\n\n  createEffect(() => {\n    let target = null;\n    if (props.target)\n      target = element.querySelector<HTMLInputElement>(props.target);\n    if (!target)\n      target = element.querySelector<HTMLInputElement>(\"input[name='id']\");\n    if (!target) return console.warn(`${Name}: target input not found`);\n\n    const variantId =\n      productContext?.product?.selected_or_first_available_variant?.id;\n    if (!variantId) return;\n    if (target.value === variantId.toString()) return;\n    target.value = variantId.toString();\n    target.dispatchEvent(new Event(\"change\", { bubbles: true }));\n  });\n};\n","import {\n  customShadowlessElement,\n  correctElementType,\n} from \"@brytdesigns/web-component-core/utils\";\n\nimport {\n  ProductInfo,\n  ProductOptions,\n  ProductOptionGroup,\n  ProductVariantInput,\n  ProductVariantRender,\n} from \"./components/index.js\";\n\ncustomShadowlessElement(\n  ProductInfo.Name,\n  {\n    product: undefined,\n    isProductPage: false,\n  },\n  correctElementType(ProductInfo.Component),\n);\n\ncustomShadowlessElement(\n  ProductOptions.Name,\n  {\n    selectedOptions: [],\n  },\n  correctElementType(ProductOptions.Component),\n);\n\ncustomShadowlessElement(\n  ProductOptionGroup.Name,\n  {\n    position: 0,\n    name: \"\",\n    inputType: \"radio\",\n  },\n  correctElementType(ProductOptionGroup.Component),\n);\n\ncustomShadowlessElement(\n  ProductVariantInput.Name,\n  {\n    target: \"\",\n    preventDefault: true,\n  },\n  correctElementType(ProductVariantInput.Component),\n);\n\ncustomShadowlessElement(\n  ProductVariantRender.Name,\n  {},\n  correctElementType(ProductVariantRender.Component),\n);\n\nexport {\n  useProduct,\n  useProductOptions,\n  getProductContext,\n  getProductOptionsContext,\n  withProductElementContext,\n  withProductOptionsElementContext,\n} from \"./hooks/index.js\";\n"]}

package/dist/main/components/index.js

@@ -1,7 +1,12 @@
-export * from './product-info.js';
-export * from './product-variant-render.js';
-export * from './product-options.js';
-export * from './product-option-group.js';
-export * from './product-variant-input.js';
+import * as productInfo_js from './product-info.js';
+export { productInfo_js as ProductInfo };
+import * as productVariantRender_js from './product-variant-render.js';
+export { productVariantRender_js as ProductVariantRender };
+import * as productOptions_js from './product-options.js';
+export { productOptions_js as ProductOptions };
+import * as productOptionGroup_js from './product-option-group.js';
+export { productOptionGroup_js as ProductOptionGroup };
+import * as productVariantInput_js from './product-variant-input.js';
+export { productVariantInput_js as ProductVariantInput };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/main/components/product-info.js

@@ -1,14 +1,15 @@
 import { createMemo, createEffect, observable } from 'solid-js';
 import { provideProductContext } from '../hooks/index.js';
 
-const ProductInfo = (props, { element }) => {
+const Name = `product-info`;
+const Component = (props, { element }) => {
   if (!props.product)
-    return console.warn("product-info: product attribute is required");
+    return console.warn(`${Name}: product attribute is required`);
   if (!props.product.variants)
-    return console.warn("product-info: product attribute needs variants array");
+    return console.warn(`${Name}: product attribute needs variants array`);
   if (!props.product.selected_or_first_available_variant)
     return console.warn(
-      "product-info: product attribute needs selected or first available variant object"
+      `${Name}: product attribute needs selected or first available variant object`
     );
   provideProductContext(props, element);
   const url = createMemo(() => {
@@ -33,6 +34,6 @@ const ProductInfo = (props, { element }) => {
   });
 };
 
-export { ProductInfo };
+export { Component, Name };
 //# sourceMappingURL=product-info.js.map
 //# sourceMappingURL=product-info.js.map

package/dist/main/components/product-info.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/product-info.ts"],"names":["url"],"mappings":";;;AAaO,MAAM,WAAsD,GAAA,CACjE,KACA,EAAA,EAAE,SACC,KAAA;AACH,EAAA,IAAI,CAAC,KAAM,CAAA,OAAA;AACT,IAAO,OAAA,OAAA,CAAQ,KAAK,6CAA6C,CAAA;AACnE,EAAI,IAAA,CAAC,MAAM,OAAQ,CAAA,QAAA;AACjB,IAAO,OAAA,OAAA,CAAQ,KAAK,sDAAsD,CAAA;AAC5E,EAAI,IAAA,CAAC,MAAM,OAAQ,CAAA,mCAAA;AACjB,IAAA,OAAO,OAAQ,CAAA,IAAA;AAAA,MACb;AAAA,KACF;AACF,EAAA,qBAAA,CAAsB,OAAc,OAAO,CAAA;AAE3C,EAAM,MAAA,GAAA,GAAM,WAAW,MAAM;AAC3B,IAAA,MAAMA,IAAM,GAAA,IAAI,GAAI,CAAA,MAAA,CAAO,SAAS,IAAI,CAAA;AACxC,IAAA,IAAI,KAAM,CAAA,OAAA,IAAW,KAAM,CAAA,OAAA,CAAQ,mCAAqC,EAAA;AACtE,MAAAA,KAAI,YAAa,CAAA,GAAA;AAAA,QACf,SAAA;AAAA,QACA,KAAM,CAAA,OAAA,CAAQ,mCAAoC,CAAA,EAAA,CAAG,QAAS;AAAA,OAChE;AAAA;AAEF,IAAOA,OAAAA,IAAAA;AAAA,GACR,CAAA;AAED,EAAA,SAAS,UAAU,EAA4C,EAAA;AAC7D,IAAA,OAAO,WAAW,MAAM,KAAA,CAAM,OAAO,CAAE,CAAA,SAAA,CAAU,EAAE,CAAE,CAAA,WAAA;AAAA;AAGvD,EAAA,MAAA,CAAO,OAAO,OAAS,EAAA;AAAA,IACrB;AAAA,GACD,CAAA;AAED,EAAA,YAAA,CAAa,MAAM;AACjB,IAAI,IAAA,CAAC,MAAM,aAAe,EAAA;AAC1B,IAAA,MAAA,CAAO,OAAQ,CAAA,YAAA,CAAa,IAAM,EAAA,EAAA,EAAI,KAAK,CAAA;AAAA,GAC5C,CAAA;AACH","file":"product-info.js","sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-utils\";\n\nimport { createEffect, createMemo, observable } from \"solid-js\";\n\nimport { provideProductContext } from \"../hooks/index.js\";\n\nimport type { Product } from \"../types.js\";\n\ntype ProductInfoProps = {\n  product?: Product;\n  isProductPage?: boolean;\n};\n\nexport const ProductInfo: CorrectComponentType<ProductInfoProps> = (\n  props,\n  { element },\n) => {\n  if (!props.product)\n    return console.warn(\"product-info: product attribute is required\");\n  if (!props.product.variants)\n    return console.warn(\"product-info: product attribute needs variants array\");\n  if (!props.product.selected_or_first_available_variant)\n    return console.warn(\n      \"product-info: product attribute needs selected or first available variant object\",\n    );\n  provideProductContext(props as any, element);\n\n  const url = createMemo(() => {\n    const url = new URL(window.location.href);\n    if (props.product && props.product.selected_or_first_available_variant) {\n      url.searchParams.set(\n        \"variant\",\n        props.product.selected_or_first_available_variant.id.toString(),\n      );\n    }\n    return url;\n  });\n\n  function subscribe(cb: (product: Product | undefined) => void) {\n    return observable(() => props.product).subscribe(cb).unsubscribe;\n  }\n\n  Object.assign(element, {\n    subscribe,\n  });\n\n  createEffect(() => {\n    if (!props.isProductPage) return;\n    window.history.replaceState(null, \"\", url());\n  });\n};\n"]}
+{"version":3,"sources":["../../../src/components/product-info.ts"],"names":["url"],"mappings":";;;AAaO,MAAM,IAAO,GAAA,CAAA,YAAA;AAEb,MAAM,SAAyC,GAAA,CAAC,KAAO,EAAA,EAAE,SAAc,KAAA;AAC5E,EAAA,IAAI,CAAC,KAAM,CAAA,OAAA;AACT,IAAA,OAAO,OAAQ,CAAA,IAAA,CAAK,CAAG,EAAA,IAAI,CAAiC,+BAAA,CAAA,CAAA;AAC9D,EAAI,IAAA,CAAC,MAAM,OAAQ,CAAA,QAAA;AACjB,IAAA,OAAO,OAAQ,CAAA,IAAA,CAAK,CAAG,EAAA,IAAI,CAA0C,wCAAA,CAAA,CAAA;AACvE,EAAI,IAAA,CAAC,MAAM,OAAQ,CAAA,mCAAA;AACjB,IAAA,OAAO,OAAQ,CAAA,IAAA;AAAA,MACb,GAAG,IAAI,CAAA,oEAAA;AAAA,KACT;AACF,EAAA,qBAAA,CAAsB,OAAc,OAAO,CAAA;AAE3C,EAAM,MAAA,GAAA,GAAM,WAAW,MAAM;AAC3B,IAAA,MAAMA,IAAM,GAAA,IAAI,GAAI,CAAA,MAAA,CAAO,SAAS,IAAI,CAAA;AACxC,IAAA,IAAI,KAAM,CAAA,OAAA,IAAW,KAAM,CAAA,OAAA,CAAQ,mCAAqC,EAAA;AACtE,MAAAA,KAAI,YAAa,CAAA,GAAA;AAAA,QACf,SAAA;AAAA,QACA,KAAM,CAAA,OAAA,CAAQ,mCAAoC,CAAA,EAAA,CAAG,QAAS;AAAA,OAChE;AAAA;AAEF,IAAOA,OAAAA,IAAAA;AAAA,GACR,CAAA;AAED,EAAA,SAAS,UAAU,EAA4C,EAAA;AAC7D,IAAA,OAAO,WAAW,MAAM,KAAA,CAAM,OAAO,CAAE,CAAA,SAAA,CAAU,EAAE,CAAE,CAAA,WAAA;AAAA;AAGvD,EAAA,MAAA,CAAO,OAAO,OAAS,EAAA;AAAA,IACrB;AAAA,GACD,CAAA;AAED,EAAA,YAAA,CAAa,MAAM;AACjB,IAAI,IAAA,CAAC,MAAM,aAAe,EAAA;AAC1B,IAAA,MAAA,CAAO,OAAQ,CAAA,YAAA,CAAa,IAAM,EAAA,EAAA,EAAI,KAAK,CAAA;AAAA,GAC5C,CAAA;AACH","file":"product-info.js","sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-core/utils\";\n\nimport { createEffect, createMemo, observable } from \"solid-js\";\n\nimport { provideProductContext } from \"../hooks/index.js\";\n\nimport type { Product } from \"../types.js\";\n\ntype Props = {\n  product?: Product;\n  isProductPage?: boolean;\n};\n\nexport const Name = `product-info`;\n\nexport const Component: CorrectComponentType<Props> = (props, { element }) => {\n  if (!props.product)\n    return console.warn(`${Name}: product attribute is required`);\n  if (!props.product.variants)\n    return console.warn(`${Name}: product attribute needs variants array`);\n  if (!props.product.selected_or_first_available_variant)\n    return console.warn(\n      `${Name}: product attribute needs selected or first available variant object`,\n    );\n  provideProductContext(props as any, element);\n\n  const url = createMemo(() => {\n    const url = new URL(window.location.href);\n    if (props.product && props.product.selected_or_first_available_variant) {\n      url.searchParams.set(\n        \"variant\",\n        props.product.selected_or_first_available_variant.id.toString(),\n      );\n    }\n    return url;\n  });\n\n  function subscribe(cb: (product: Product | undefined) => void) {\n    return observable(() => props.product).subscribe(cb).unsubscribe;\n  }\n\n  Object.assign(element, {\n    subscribe,\n  });\n\n  createEffect(() => {\n    if (!props.isProductPage) return;\n    window.history.replaceState(null, \"\", url());\n  });\n};\n"]}

package/dist/main/components/product-option-group.js

@@ -1,7 +1,8 @@
 import { createEffect, on, onCleanup } from 'solid-js';
 import { useProductOptions } from '../hooks/index.js';
 
-const ProductOptionGroup = (props, { element }) => {
+const Name = `product-option-group`;
+const Component = (props, { element }) => {
   const [context, methods] = useProductOptions(element);
   createEffect(
     on(
@@ -63,6 +64,6 @@ const ProductOptionGroup = (props, { element }) => {
   });
 };
 
-export { ProductOptionGroup };
+export { Component, Name };
 //# sourceMappingURL=product-option-group.js.map
 //# sourceMappingURL=product-option-group.js.map

package/dist/main/components/product-option-group.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/product-option-group.ts"],"names":[],"mappings":";;;AAYO,MAAM,kBAET,GAAA,CAAC,KAAO,EAAA,EAAE,SAAc,KAAA;AAC1B,EAAA,MAAM,CAAC,OAAA,EAAS,OAAO,CAAA,GAAI,kBAAkB,OAAO,CAAA;AAEpD,EAAA,YAAA;AAAA,IACE,EAAA;AAAA,MACE,OAAO;AAAA,QACL,cAAgB,EAAA,OAAA,CAAQ,eAAgB,CAAA,KAAA,CAAM,WAAW,CAAC,CAAA;AAAA,QAC1D,UAAU,KAAM,CAAA,QAAA;AAAA,QAChB,MAAM,KAAM,CAAA,IAAA;AAAA,QACZ,WAAW,KAAM,CAAA;AAAA,OACnB,CAAA;AAAA,MACA,CAAC,EAAE,cAAA,EAAgB,QAAU,EAAA,IAAA,EAAM,WAAgB,KAAA;AACjD,QAAI,IAAA,SAAA,KAAc,OAAW,IAAA,SAAA,KAAc,QAAU,EAAA;AAErD,QAAA,MAAM,UAAa,GAAA,CAAA,EAAG,IAAI,CAAA,CAAA,EAAI,QAAQ,CAAA,CAAA;AAEtC,QAAA,IAAI,cAAc,OAAS,EAAA;AACzB,UAAA,MAAM,SAAS,OAAQ,CAAA,gBAAA;AAAA,YACrB,eAAe,UAAU,CAAA,EAAA;AAAA,WAC3B;AACA,UAAO,MAAA,CAAA,OAAA,CAAQ,CAAC,KAAU,KAAA;AACxB,YAAA,MAAM,YAAY,KAAM,CAAA,OAAA;AACxB,YAAA,IAAI,KAAM,CAAA,KAAA,KAAU,cAAgB,EAAA,KAAA,CAAM,OAAU,GAAA,IAAA;AAAA,uBACzC,OAAU,GAAA,KAAA;AACrB,YAAI,IAAA,SAAA,KAAc,MAAM,OAAS,EAAA;AAC/B,cAAM,KAAA,CAAA,aAAA,CAAc,IAAI,KAAM,CAAA,QAAA,EAAU,EAAE,OAAS,EAAA,IAAA,EAAM,CAAC,CAAA;AAAA;AAC5D,WACD,CAAA;AACD,UAAA;AAAA;AAGF,QAAA,MAAM,SAAS,OAAQ,CAAA,aAAA;AAAA,UACrB,gBAAgB,UAAU,CAAA,EAAA;AAAA,SAC5B;AACA,QAAI,IAAA,CAAC,MAAU,IAAA,CAAC,cAAgB,EAAA;AAChC,QAAA,MAAA,CAAO,KAAQ,GAAA,cAAA;AACf,QAAO,MAAA,CAAA,aAAA,CAAc,IAAI,KAAM,CAAA,QAAA,EAAU,EAAE,OAAS,EAAA,IAAA,EAAM,CAAC,CAAA;AAAA;AAC7D;AACF,GACF;AAEA,EAAA,YAAA,CAAa,MAAM;AACjB,IAAA,MAAM,WAAW,KAAM,CAAA,QAAA;AAEvB,IAAA,SAAS,aAAa,KAAc,EAAA;AAClC,MAAA,MAAM,SAAS,KAAM,CAAA,MAAA;AACrB,MAAA,IAAI,CAAC,MAAQ,EAAA;AACb,MAAA,MAAM,iBAAiB,MAAO,CAAA,KAAA;AAC9B,MAAA,IAAI,OAAQ,CAAA,eAAA,CAAgB,QAAW,GAAA,CAAC,MAAM,cAAgB,EAAA;AAE9D,MAAQ,OAAA,CAAA,aAAA;AAAA,QACN,IAAI,YAAY,gBAAkB,EAAA;AAAA,UAChC,MAAQ,EAAA;AAAA,YACN,OAAO,KAAM,CAAA,IAAA;AAAA,YACb,QAAA;AAAA,YACA;AAAA,WACF;AAAA,UACA,OAAS,EAAA;AAAA,SACV;AAAA,OACH;AAEA,MAAA,OAAA,CAAQ,OAAQ,CAAA,YAAA,CAAa,cAAgB,EAAA,QAAA,GAAW,CAAC,CAAA;AAAA;AAG3D,IAAQ,OAAA,CAAA,gBAAA,CAAiB,UAAU,YAAY,CAAA;AAE/C,IAAA,OAAO,UAAU,MAAM;AACrB,MAAQ,OAAA,CAAA,mBAAA,CAAoB,UAAU,YAAY,CAAA;AAAA,KACnD,CAAA;AAAA,GACF,CAAA;AACH","file":"product-option-group.js","sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-utils\";\n\nimport { createEffect, on, onCleanup } from \"solid-js\";\n\nimport { useProductOptions } from \"../hooks/index.js\";\n\ntype ProductOptionGroupProps = {\n  position: number;\n  name: string;\n  inputType: \"radio\" | \"select\";\n};\n\nexport const ProductOptionGroup: CorrectComponentType<\n  ProductOptionGroupProps\n> = (props, { element }) => {\n  const [context, methods] = useProductOptions(element);\n\n  createEffect(\n    on(\n      () => ({\n        selectedOption: context.selectedOptions[props.position - 1],\n        position: props.position,\n        name: props.name,\n        inputType: props.inputType,\n      }),\n      ({ selectedOption, position, name, inputType }) => {\n        if (inputType !== \"radio\" && inputType !== \"select\") return;\n\n        const optionName = `${name}-${position}`;\n\n        if (inputType === \"radio\") {\n          const inputs = element.querySelectorAll<HTMLInputElement>(\n            `input[name=\"${optionName}\"]`,\n          );\n          inputs.forEach((input) => {\n            const prevValue = input.checked;\n            if (input.value === selectedOption) input.checked = true;\n            else input.checked = false;\n            if (prevValue !== input.checked) {\n              input.dispatchEvent(new Event(\"change\", { bubbles: true }));\n            }\n          });\n          return;\n        }\n\n        const select = element.querySelector<HTMLSelectElement>(\n          `select[name=\"${optionName}\"]`,\n        );\n        if (!select || !selectedOption) return;\n        select.value = selectedOption;\n        select.dispatchEvent(new Event(\"change\", { bubbles: true }));\n      },\n    ),\n  );\n\n  createEffect(() => {\n    const position = props.position;\n\n    function handleChange(event: Event) {\n      const target = event.target as HTMLInputElement;\n      if (!target) return;\n      const selectedOption = target.value;\n      if (context.selectedOptions[position - 1] === selectedOption) return;\n\n      element.dispatchEvent(\n        new CustomEvent(\"option-updated\", {\n          detail: {\n            group: props.name,\n            position: position,\n            selectedOption,\n          },\n          bubbles: true,\n        }),\n      );\n\n      methods.options.updateOption(selectedOption, position - 1);\n    }\n\n    element.addEventListener(\"change\", handleChange);\n\n    return onCleanup(() => {\n      element.removeEventListener(\"change\", handleChange);\n    });\n  });\n};\n"]}
+{"version":3,"sources":["../../../src/components/product-option-group.ts"],"names":[],"mappings":";;;AAYO,MAAM,IAAO,GAAA,CAAA,oBAAA;AAEb,MAAM,SAAyC,GAAA,CAAC,KAAO,EAAA,EAAE,SAAc,KAAA;AAC5E,EAAA,MAAM,CAAC,OAAA,EAAS,OAAO,CAAA,GAAI,kBAAkB,OAAO,CAAA;AAEpD,EAAA,YAAA;AAAA,IACE,EAAA;AAAA,MACE,OAAO;AAAA,QACL,cAAgB,EAAA,OAAA,CAAQ,eAAgB,CAAA,KAAA,CAAM,WAAW,CAAC,CAAA;AAAA,QAC1D,UAAU,KAAM,CAAA,QAAA;AAAA,QAChB,MAAM,KAAM,CAAA,IAAA;AAAA,QACZ,WAAW,KAAM,CAAA;AAAA,OACnB,CAAA;AAAA,MACA,CAAC,EAAE,cAAA,EAAgB,QAAU,EAAA,IAAA,EAAM,WAAgB,KAAA;AACjD,QAAI,IAAA,SAAA,KAAc,OAAW,IAAA,SAAA,KAAc,QAAU,EAAA;AAErD,QAAA,MAAM,UAAa,GAAA,CAAA,EAAG,IAAI,CAAA,CAAA,EAAI,QAAQ,CAAA,CAAA;AAEtC,QAAA,IAAI,cAAc,OAAS,EAAA;AACzB,UAAA,MAAM,SAAS,OAAQ,CAAA,gBAAA;AAAA,YACrB,eAAe,UAAU,CAAA,EAAA;AAAA,WAC3B;AACA,UAAO,MAAA,CAAA,OAAA,CAAQ,CAAC,KAAU,KAAA;AACxB,YAAA,MAAM,YAAY,KAAM,CAAA,OAAA;AACxB,YAAA,IAAI,KAAM,CAAA,KAAA,KAAU,cAAgB,EAAA,KAAA,CAAM,OAAU,GAAA,IAAA;AAAA,uBACzC,OAAU,GAAA,KAAA;AACrB,YAAI,IAAA,SAAA,KAAc,MAAM,OAAS,EAAA;AAC/B,cAAM,KAAA,CAAA,aAAA,CAAc,IAAI,KAAM,CAAA,QAAA,EAAU,EAAE,OAAS,EAAA,IAAA,EAAM,CAAC,CAAA;AAAA;AAC5D,WACD,CAAA;AACD,UAAA;AAAA;AAGF,QAAA,MAAM,SAAS,OAAQ,CAAA,aAAA;AAAA,UACrB,gBAAgB,UAAU,CAAA,EAAA;AAAA,SAC5B;AACA,QAAI,IAAA,CAAC,MAAU,IAAA,CAAC,cAAgB,EAAA;AAChC,QAAA,MAAA,CAAO,KAAQ,GAAA,cAAA;AACf,QAAO,MAAA,CAAA,aAAA,CAAc,IAAI,KAAM,CAAA,QAAA,EAAU,EAAE,OAAS,EAAA,IAAA,EAAM,CAAC,CAAA;AAAA;AAC7D;AACF,GACF;AAEA,EAAA,YAAA,CAAa,MAAM;AACjB,IAAA,MAAM,WAAW,KAAM,CAAA,QAAA;AAEvB,IAAA,SAAS,aAAa,KAAc,EAAA;AAClC,MAAA,MAAM,SAAS,KAAM,CAAA,MAAA;AACrB,MAAA,IAAI,CAAC,MAAQ,EAAA;AACb,MAAA,MAAM,iBAAiB,MAAO,CAAA,KAAA;AAC9B,MAAA,IAAI,OAAQ,CAAA,eAAA,CAAgB,QAAW,GAAA,CAAC,MAAM,cAAgB,EAAA;AAE9D,MAAQ,OAAA,CAAA,aAAA;AAAA,QACN,IAAI,YAAY,gBAAkB,EAAA;AAAA,UAChC,MAAQ,EAAA;AAAA,YACN,OAAO,KAAM,CAAA,IAAA;AAAA,YACb,QAAA;AAAA,YACA;AAAA,WACF;AAAA,UACA,OAAS,EAAA;AAAA,SACV;AAAA,OACH;AAEA,MAAA,OAAA,CAAQ,OAAQ,CAAA,YAAA,CAAa,cAAgB,EAAA,QAAA,GAAW,CAAC,CAAA;AAAA;AAG3D,IAAQ,OAAA,CAAA,gBAAA,CAAiB,UAAU,YAAY,CAAA;AAE/C,IAAA,OAAO,UAAU,MAAM;AACrB,MAAQ,OAAA,CAAA,mBAAA,CAAoB,UAAU,YAAY,CAAA;AAAA,KACnD,CAAA;AAAA,GACF,CAAA;AACH","file":"product-option-group.js","sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-core/utils\";\n\nimport { createEffect, on, onCleanup } from \"solid-js\";\n\nimport { useProductOptions } from \"../hooks/index.js\";\n\ntype Props = {\n  position: number;\n  name: string;\n  inputType: \"radio\" | \"select\";\n};\n\nexport const Name = `product-option-group`;\n\nexport const Component: CorrectComponentType<Props> = (props, { element }) => {\n  const [context, methods] = useProductOptions(element);\n\n  createEffect(\n    on(\n      () => ({\n        selectedOption: context.selectedOptions[props.position - 1],\n        position: props.position,\n        name: props.name,\n        inputType: props.inputType,\n      }),\n      ({ selectedOption, position, name, inputType }) => {\n        if (inputType !== \"radio\" && inputType !== \"select\") return;\n\n        const optionName = `${name}-${position}`;\n\n        if (inputType === \"radio\") {\n          const inputs = element.querySelectorAll<HTMLInputElement>(\n            `input[name=\"${optionName}\"]`,\n          );\n          inputs.forEach((input) => {\n            const prevValue = input.checked;\n            if (input.value === selectedOption) input.checked = true;\n            else input.checked = false;\n            if (prevValue !== input.checked) {\n              input.dispatchEvent(new Event(\"change\", { bubbles: true }));\n            }\n          });\n          return;\n        }\n\n        const select = element.querySelector<HTMLSelectElement>(\n          `select[name=\"${optionName}\"]`,\n        );\n        if (!select || !selectedOption) return;\n        select.value = selectedOption;\n        select.dispatchEvent(new Event(\"change\", { bubbles: true }));\n      },\n    ),\n  );\n\n  createEffect(() => {\n    const position = props.position;\n\n    function handleChange(event: Event) {\n      const target = event.target as HTMLInputElement;\n      if (!target) return;\n      const selectedOption = target.value;\n      if (context.selectedOptions[position - 1] === selectedOption) return;\n\n      element.dispatchEvent(\n        new CustomEvent(\"option-updated\", {\n          detail: {\n            group: props.name,\n            position: position,\n            selectedOption,\n          },\n          bubbles: true,\n        }),\n      );\n\n      methods.options.updateOption(selectedOption, position - 1);\n    }\n\n    element.addEventListener(\"change\", handleChange);\n\n    return onCleanup(() => {\n      element.removeEventListener(\"change\", handleChange);\n    });\n  });\n};\n"]}

package/dist/main/components/product-options.js

@@ -1,13 +1,12 @@
 import { provideProductOptionsContext } from '../hooks/index.js';
 
-const ProductOptions = (props, { element }) => {
+const Name = `product-options`;
+const Component = (props, { element }) => {
   if (!props.selectedOptions)
-    return console.warn(
-      "product-options: selected-options attribute is required"
-    );
+    return console.warn(`${Name}: selected-options attribute is required`);
   provideProductOptionsContext(props, element);
 };
 
-export { ProductOptions };
+export { Component, Name };
 //# sourceMappingURL=product-options.js.map
 //# sourceMappingURL=product-options.js.map

package/dist/main/components/product-options.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/product-options.ts"],"names":[],"mappings":";;AAOO,MAAM,cAA4D,GAAA,CACvE,KACA,EAAA,EAAE,SACC,KAAA;AACH,EAAA,IAAI,CAAC,KAAM,CAAA,eAAA;AACT,IAAA,OAAO,OAAQ,CAAA,IAAA;AAAA,MACb;AAAA,KACF;AACF,EAAA,4BAAA,CAA6B,OAAO,OAAO,CAAA;AAC7C","file":"product-options.js","sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-utils\";\nimport { provideProductOptionsContext } from \"../hooks/index.js\";\n\ntype ProductOptionsProps = {\n  selectedOptions: string[];\n};\n\nexport const ProductOptions: CorrectComponentType<ProductOptionsProps> = (\n  props,\n  { element },\n) => {\n  if (!props.selectedOptions)\n    return console.warn(\n      \"product-options: selected-options attribute is required\",\n    );\n  provideProductOptionsContext(props, element);\n};\n"]}
+{"version":3,"sources":["../../../src/components/product-options.ts"],"names":[],"mappings":";;AAOO,MAAM,IAAO,GAAA,CAAA,eAAA;AAEb,MAAM,SAAyC,GAAA,CAAC,KAAO,EAAA,EAAE,SAAc,KAAA;AAC5E,EAAA,IAAI,CAAC,KAAM,CAAA,eAAA;AACT,IAAA,OAAO,OAAQ,CAAA,IAAA,CAAK,CAAG,EAAA,IAAI,CAA0C,wCAAA,CAAA,CAAA;AACvE,EAAA,4BAAA,CAA6B,OAAO,OAAO,CAAA;AAC7C","file":"product-options.js","sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-core/utils\";\nimport { provideProductOptionsContext } from \"../hooks/index.js\";\n\ntype Props = {\n  selectedOptions: string[];\n};\n\nexport const Name = `product-options`;\n\nexport const Component: CorrectComponentType<Props> = (props, { element }) => {\n  if (!props.selectedOptions)\n    return console.warn(`${Name}: selected-options attribute is required`);\n  provideProductOptionsContext(props, element);\n};\n"]}

package/dist/main/components/product-variant-input.js

@@ -1,7 +1,8 @@
 import { createEffect, onCleanup } from 'solid-js';
 import { useProduct, useProductOptions } from '../hooks/index.js';
 
-const ProductVariantInput = (props, { element }) => {
+const Name = `product-variant-input`;
+const Component = (props, { element }) => {
   const [productContext, productContextMethods] = useProduct(element);
   const [_, optionsMethods] = useProductOptions(element);
   createEffect(() => {
@@ -34,8 +35,7 @@ const ProductVariantInput = (props, { element }) => {
       target = element.querySelector(props.target);
     if (!target)
       target = element.querySelector("input[name='id']");
-    if (!target)
-      return console.warn("product-variant-input: target input not found");
+    if (!target) return console.warn(`${Name}: target input not found`);
     const variantId = productContext?.product?.selected_or_first_available_variant?.id;
     if (!variantId) return;
     if (target.value === variantId.toString()) return;
@@ -44,6 +44,6 @@ const ProductVariantInput = (props, { element }) => {
   });
 };
 
-export { ProductVariantInput };
+export { Component, Name };
 //# sourceMappingURL=product-variant-input.js.map
 //# sourceMappingURL=product-variant-input.js.map

package/dist/main/components/product-variant-input.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/product-variant-input.ts"],"names":["target","variant"],"mappings":";;;AAWO,MAAM,mBAET,GAAA,CAAC,KAAO,EAAA,EAAE,SAAc,KAAA;AAC1B,EAAA,MAAM,CAAC,cAAA,EAAgB,qBAAqB,CAAA,GAAI,WAAW,OAAO,CAAA;AAClE,EAAA,MAAM,CAAC,CAAA,EAAG,cAAc,CAAA,GAAI,kBAAkB,OAAO,CAAA;AAErD,EAAA,YAAA,CAAa,MAAM;AACjB,IAAA,IAAI,MAAS,GAAA,IAAA;AACb,IAAA,IAAI,MAAM,MAAQ,EAAA,MAAA,GAAS,OAAQ,CAAA,aAAA,CAAc,MAAM,MAAM,CAAA;AAC7D,IAAI,IAAA,CAAC,QAAiB,MAAA,GAAA,OAAA;AAEtB,IAAA,MAAM,iBAAiB,KAAM,CAAA,cAAA;AAE7B,IAAA,SAAS,aAAa,KAAc,EAAA;AAClC,MAAI,IAAA,cAAA,QAAsB,cAAe,EAAA;AACzC,MAAA,MAAMA,UAAS,KAAM,CAAA,MAAA;AACrB,MAAA,IAAI,CAACA,OAAQ,EAAA;AACb,MAAA,MAAM,QAAQA,OAAO,CAAA,KAAA;AACrB,MACE,IAAA,KAAA,KACA,cAAgB,EAAA,OAAA,EAAS,mCAAqC,EAAA,EAAA;AAE9D,QAAA;AACF,MAAM,MAAA,OAAA,GAAU,cAAgB,EAAA,OAAA,EAAS,QAAS,CAAA,IAAA;AAAA,QAChD,CAACC,QAAYA,KAAAA,QAAAA,CAAQ,GAAG,QAAS,EAAA,KAAM,MAAM,QAAS;AAAA,OACxD;AACA,MAAA,IAAI,CAAC,OAAS,EAAA;AACd,MAAA,IAAI,cAAgB,EAAA,cAAA,CAAe,OAAQ,CAAA,MAAA,CAAO,QAAQ,OAAO,CAAA;AAAA,WACtC,qBAAA,CAAA,OAAA,CAAQ,MAAO,CAAA,OAAA,CAAQ,EAAE,CAAA;AAAA;AAGtD,IAAO,MAAA,CAAA,gBAAA,CAAiB,UAAU,YAAY,CAAA;AAE9C,IAAA,OAAO,UAAU,MAAM;AACrB,MAAO,MAAA,CAAA,mBAAA,CAAoB,UAAU,YAAY,CAAA;AAAA,KAClD,CAAA;AAAA,GACF,CAAA;AAED,EAAA,YAAA,CAAa,MAAM;AACjB,IAAA,IAAI,MAAS,GAAA,IAAA;AACb,IAAA,IAAI,KAAM,CAAA,MAAA;AACR,MAAS,MAAA,GAAA,OAAA,CAAQ,aAAgC,CAAA,KAAA,CAAM,MAAM,CAAA;AAC/D,IAAA,IAAI,CAAC,MAAA;AACH,MAAS,MAAA,GAAA,OAAA,CAAQ,cAAgC,kBAAkB,CAAA;AACrE,IAAA,IAAI,CAAC,MAAA;AACH,MAAO,OAAA,OAAA,CAAQ,KAAK,+CAA+C,CAAA;AAErE,IAAM,MAAA,SAAA,GACJ,cAAgB,EAAA,OAAA,EAAS,mCAAqC,EAAA,EAAA;AAChE,IAAA,IAAI,CAAC,SAAW,EAAA;AAChB,IAAA,IAAI,MAAO,CAAA,KAAA,KAAU,SAAU,CAAA,QAAA,EAAY,EAAA;AAC3C,IAAO,MAAA,CAAA,KAAA,GAAQ,UAAU,QAAS,EAAA;AAClC,IAAO,MAAA,CAAA,aAAA,CAAc,IAAI,KAAM,CAAA,QAAA,EAAU,EAAE,OAAS,EAAA,IAAA,EAAM,CAAC,CAAA;AAAA,GAC5D,CAAA;AACH","file":"product-variant-input.js","sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-utils\";\n\nimport { createEffect, onCleanup } from \"solid-js\";\n\nimport { useProduct, useProductOptions } from \"../hooks/index.js\";\n\ntype ProductVariantInputProps = {\n  target: string | null;\n  preventDefault?: boolean;\n};\n\nexport const ProductVariantInput: CorrectComponentType<\n  ProductVariantInputProps\n> = (props, { element }) => {\n  const [productContext, productContextMethods] = useProduct(element);\n  const [_, optionsMethods] = useProductOptions(element);\n\n  createEffect(() => {\n    let target = null;\n    if (props.target) target = element.querySelector(props.target);\n    if (!target) target = element;\n\n    const preventDefault = props.preventDefault;\n\n    function handleChange(event: Event) {\n      if (preventDefault) event.preventDefault();\n      const target = event.target as HTMLInputElement;\n      if (!target) return;\n      const value = target.value;\n      if (\n        value ===\n        productContext?.product?.selected_or_first_available_variant?.id\n      )\n        return;\n      const variant = productContext?.product?.variants.find(\n        (variant) => variant.id.toString() === value.toString(),\n      );\n      if (!variant) return;\n      if (optionsMethods) optionsMethods.options.update(variant.options);\n      else productContextMethods.variant.update(variant.id);\n    }\n\n    target.addEventListener(\"change\", handleChange);\n\n    return onCleanup(() => {\n      target.removeEventListener(\"change\", handleChange);\n    });\n  });\n\n  createEffect(() => {\n    let target = null;\n    if (props.target)\n      target = element.querySelector<HTMLInputElement>(props.target);\n    if (!target)\n      target = element.querySelector<HTMLInputElement>(\"input[name='id']\");\n    if (!target)\n      return console.warn(\"product-variant-input: target input not found\");\n\n    const variantId =\n      productContext?.product?.selected_or_first_available_variant?.id;\n    if (!variantId) return;\n    if (target.value === variantId.toString()) return;\n    target.value = variantId.toString();\n    target.dispatchEvent(new Event(\"change\", { bubbles: true }));\n  });\n};\n"]}
+{"version":3,"sources":["../../../src/components/product-variant-input.ts"],"names":["target","variant"],"mappings":";;;AAWO,MAAM,IAAO,GAAA,CAAA,qBAAA;AAEb,MAAM,SAAyC,GAAA,CAAC,KAAO,EAAA,EAAE,SAAc,KAAA;AAC5E,EAAA,MAAM,CAAC,cAAA,EAAgB,qBAAqB,CAAA,GAAI,WAAW,OAAO,CAAA;AAClE,EAAA,MAAM,CAAC,CAAA,EAAG,cAAc,CAAA,GAAI,kBAAkB,OAAO,CAAA;AAErD,EAAA,YAAA,CAAa,MAAM;AACjB,IAAA,IAAI,MAAS,GAAA,IAAA;AACb,IAAA,IAAI,MAAM,MAAQ,EAAA,MAAA,GAAS,OAAQ,CAAA,aAAA,CAAc,MAAM,MAAM,CAAA;AAC7D,IAAI,IAAA,CAAC,QAAiB,MAAA,GAAA,OAAA;AAEtB,IAAA,MAAM,iBAAiB,KAAM,CAAA,cAAA;AAE7B,IAAA,SAAS,aAAa,KAAc,EAAA;AAClC,MAAI,IAAA,cAAA,QAAsB,cAAe,EAAA;AACzC,MAAA,MAAMA,UAAS,KAAM,CAAA,MAAA;AACrB,MAAA,IAAI,CAACA,OAAQ,EAAA;AACb,MAAA,MAAM,QAAQA,OAAO,CAAA,KAAA;AACrB,MACE,IAAA,KAAA,KACA,cAAgB,EAAA,OAAA,EAAS,mCAAqC,EAAA,EAAA;AAE9D,QAAA;AACF,MAAM,MAAA,OAAA,GAAU,cAAgB,EAAA,OAAA,EAAS,QAAS,CAAA,IAAA;AAAA,QAChD,CAACC,QAAYA,KAAAA,QAAAA,CAAQ,GAAG,QAAS,EAAA,KAAM,MAAM,QAAS;AAAA,OACxD;AACA,MAAA,IAAI,CAAC,OAAS,EAAA;AACd,MAAA,IAAI,cAAgB,EAAA,cAAA,CAAe,OAAQ,CAAA,MAAA,CAAO,QAAQ,OAAO,CAAA;AAAA,WACtC,qBAAA,CAAA,OAAA,CAAQ,MAAO,CAAA,OAAA,CAAQ,EAAE,CAAA;AAAA;AAGtD,IAAO,MAAA,CAAA,gBAAA,CAAiB,UAAU,YAAY,CAAA;AAE9C,IAAA,OAAO,UAAU,MAAM;AACrB,MAAO,MAAA,CAAA,mBAAA,CAAoB,UAAU,YAAY,CAAA;AAAA,KAClD,CAAA;AAAA,GACF,CAAA;AAED,EAAA,YAAA,CAAa,MAAM;AACjB,IAAA,IAAI,MAAS,GAAA,IAAA;AACb,IAAA,IAAI,KAAM,CAAA,MAAA;AACR,MAAS,MAAA,GAAA,OAAA,CAAQ,aAAgC,CAAA,KAAA,CAAM,MAAM,CAAA;AAC/D,IAAA,IAAI,CAAC,MAAA;AACH,MAAS,MAAA,GAAA,OAAA,CAAQ,cAAgC,kBAAkB,CAAA;AACrE,IAAA,IAAI,CAAC,MAAQ,EAAA,OAAO,QAAQ,IAAK,CAAA,CAAA,EAAG,IAAI,CAA0B,wBAAA,CAAA,CAAA;AAElE,IAAM,MAAA,SAAA,GACJ,cAAgB,EAAA,OAAA,EAAS,mCAAqC,EAAA,EAAA;AAChE,IAAA,IAAI,CAAC,SAAW,EAAA;AAChB,IAAA,IAAI,MAAO,CAAA,KAAA,KAAU,SAAU,CAAA,QAAA,EAAY,EAAA;AAC3C,IAAO,MAAA,CAAA,KAAA,GAAQ,UAAU,QAAS,EAAA;AAClC,IAAO,MAAA,CAAA,aAAA,CAAc,IAAI,KAAM,CAAA,QAAA,EAAU,EAAE,OAAS,EAAA,IAAA,EAAM,CAAC,CAAA;AAAA,GAC5D,CAAA;AACH","file":"product-variant-input.js","sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-core/utils\";\n\nimport { createEffect, onCleanup } from \"solid-js\";\n\nimport { useProduct, useProductOptions } from \"../hooks/index.js\";\n\ntype Props = {\n  target: string | null;\n  preventDefault?: boolean;\n};\n\nexport const Name = `product-variant-input`;\n\nexport const Component: CorrectComponentType<Props> = (props, { element }) => {\n  const [productContext, productContextMethods] = useProduct(element);\n  const [_, optionsMethods] = useProductOptions(element);\n\n  createEffect(() => {\n    let target = null;\n    if (props.target) target = element.querySelector(props.target);\n    if (!target) target = element;\n\n    const preventDefault = props.preventDefault;\n\n    function handleChange(event: Event) {\n      if (preventDefault) event.preventDefault();\n      const target = event.target as HTMLInputElement;\n      if (!target) return;\n      const value = target.value;\n      if (\n        value ===\n        productContext?.product?.selected_or_first_available_variant?.id\n      )\n        return;\n      const variant = productContext?.product?.variants.find(\n        (variant) => variant.id.toString() === value.toString(),\n      );\n      if (!variant) return;\n      if (optionsMethods) optionsMethods.options.update(variant.options);\n      else productContextMethods.variant.update(variant.id);\n    }\n\n    target.addEventListener(\"change\", handleChange);\n\n    return onCleanup(() => {\n      target.removeEventListener(\"change\", handleChange);\n    });\n  });\n\n  createEffect(() => {\n    let target = null;\n    if (props.target)\n      target = element.querySelector<HTMLInputElement>(props.target);\n    if (!target)\n      target = element.querySelector<HTMLInputElement>(\"input[name='id']\");\n    if (!target) return console.warn(`${Name}: target input not found`);\n\n    const variantId =\n      productContext?.product?.selected_or_first_available_variant?.id;\n    if (!variantId) return;\n    if (target.value === variantId.toString()) return;\n    target.value = variantId.toString();\n    target.dispatchEvent(new Event(\"change\", { bubbles: true }));\n  });\n};\n"]}

package/dist/main/components/product-variant-render.js

@@ -2,12 +2,13 @@ import { createMemo, Show } from 'solid-js';
 import html from 'solid-js/html';
 import { useProduct } from '../hooks/index.js';
 
-const ProductVariantRender = (_, { element }) => {
+const Name = `product-variant-render`;
+const Component = (_, { element }) => {
   const templates = Array.from(
     element.querySelectorAll("template[variant-id]")
   );
   if (!templates.length)
-    return console.warn("product-variant-render: No variant templates found");
+    return console.warn(`${Name}: No variant templates found`);
   const [state] = useProduct(element);
   const fallbackChildren = Array.from(element.children);
   const activeVariantTemplate = createMemo(() => {
@@ -31,6 +32,6 @@ const ProductVariantRender = (_, { element }) => {
   `;
 };
 
-export { ProductVariantRender };
+export { Component, Name };
 //# sourceMappingURL=product-variant-render.js.map
 //# sourceMappingURL=product-variant-render.js.map

package/dist/main/components/product-variant-render.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/product-variant-render.ts"],"names":[],"mappings":";;;;AASO,MAAM,oBAET,GAAA,CAAC,CAAG,EAAA,EAAE,SAAc,KAAA;AACtB,EAAA,MAAM,YAAY,KAAM,CAAA,IAAA;AAAA,IACtB,OAAA,CAAQ,iBAAsC,sBAAsB;AAAA,GACtE;AACA,EAAA,IAAI,CAAC,SAAU,CAAA,MAAA;AACb,IAAO,OAAA,OAAA,CAAQ,KAAK,oDAAoD,CAAA;AAC1E,EAAA,MAAM,CAAC,KAAK,CAAI,GAAA,UAAA,CAAW,OAAO,CAAA;AAElC,EAAA,MAAM,gBAAmB,GAAA,KAAA,CAAM,IAAK,CAAA,OAAA,CAAQ,QAAQ,CAAA;AAEpD,EAAM,MAAA,qBAAA,GAAwB,WAAW,MAAM;AAC7C,IAAM,MAAA,SAAA,GAAY,KAAM,CAAA,OAAA,EAAS,mCAAqC,EAAA,EAAA;AACtE,IAAI,IAAA,CAAC,WAAkB,OAAA,IAAA;AACvB,IAAA,MAAM,WAAW,SAAU,CAAA,IAAA;AAAA,MACzB,CAAC,CAAM,KAAA,CAAA,CAAE,aAAa,YAAY,CAAA,KAAM,GAAG,SAAS,CAAA;AAAA,KACtD;AACA,IAAA,OAAO,QAAY,IAAA,IAAA;AAAA,GACpB,CAAA;AAED,EAAQ,OAAA,CAAA,eAAA,CAAgB,GAAG,EAAE,CAAA;AAE7B,EAAO,OAAA,IAAA;AAAA,KAAA,EACF,IAAI;AAAA,WAAA,EACE,MAAM,CAAC,CAAC,qBAAA,EAAuB;AAAA,eAAA,EAC3B,gBAAgB;AAAA;AAAA,MAAA,EAEzB,MACF,KAAM,CAAA,IAAA;AAAA,IACJ,uBAAyB,EAAA,OAAA,CAAQ,UAAU,IAAI,CAAA,CAAE,cAAc;AAAC,GACjE;AAAA;AAAA,EAAA,CAAA;AAGP","file":"product-variant-render.js","sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-utils\";\n\nimport { createMemo, Show } from \"solid-js\";\nimport html from \"solid-js/html\";\n\nimport { useProduct } from \"../hooks/index.js\";\n\ntype ProductVariantRenderProps = {};\n\nexport const ProductVariantRender: CorrectComponentType<\n  ProductVariantRenderProps\n> = (_, { element }) => {\n  const templates = Array.from(\n    element.querySelectorAll<HTMLTemplateElement>(\"template[variant-id]\"),\n  );\n  if (!templates.length)\n    return console.warn(\"product-variant-render: No variant templates found\");\n  const [state] = useProduct(element);\n\n  const fallbackChildren = Array.from(element.children);\n\n  const activeVariantTemplate = createMemo(() => {\n    const variantId = state.product?.selected_or_first_available_variant?.id;\n    if (!variantId) return null;\n    const template = templates.find(\n      (t) => t.getAttribute(\"variant-id\") === `${variantId}`,\n    );\n    return template || null;\n  });\n\n  element.replaceChildren(...[]);\n\n  return html`\n    <${Show}\n      when=${() => !!activeVariantTemplate()}\n      fallback=${fallbackChildren}\n    >\n      ${() =>\n      Array.from(\n        activeVariantTemplate()?.content.cloneNode(true).childNodes || [],\n      )}\n    <//>\n  `;\n};\n"]}
+{"version":3,"sources":["../../../src/components/product-variant-render.ts"],"names":[],"mappings":";;;;AASO,MAAM,IAAO,GAAA,CAAA,sBAAA;AAEb,MAAM,SAAyC,GAAA,CAAC,CAAG,EAAA,EAAE,SAAc,KAAA;AACxE,EAAA,MAAM,YAAY,KAAM,CAAA,IAAA;AAAA,IACtB,OAAA,CAAQ,iBAAsC,sBAAsB;AAAA,GACtE;AACA,EAAA,IAAI,CAAC,SAAU,CAAA,MAAA;AACb,IAAA,OAAO,OAAQ,CAAA,IAAA,CAAK,CAAG,EAAA,IAAI,CAA8B,4BAAA,CAAA,CAAA;AAC3D,EAAA,MAAM,CAAC,KAAK,CAAI,GAAA,UAAA,CAAW,OAAO,CAAA;AAElC,EAAA,MAAM,gBAAmB,GAAA,KAAA,CAAM,IAAK,CAAA,OAAA,CAAQ,QAAQ,CAAA;AAEpD,EAAM,MAAA,qBAAA,GAAwB,WAAW,MAAM;AAC7C,IAAM,MAAA,SAAA,GAAY,KAAM,CAAA,OAAA,EAAS,mCAAqC,EAAA,EAAA;AACtE,IAAI,IAAA,CAAC,WAAkB,OAAA,IAAA;AACvB,IAAA,MAAM,WAAW,SAAU,CAAA,IAAA;AAAA,MACzB,CAAC,CAAM,KAAA,CAAA,CAAE,aAAa,YAAY,CAAA,KAAM,GAAG,SAAS,CAAA;AAAA,KACtD;AACA,IAAA,OAAO,QAAY,IAAA,IAAA;AAAA,GACpB,CAAA;AAED,EAAQ,OAAA,CAAA,eAAA,CAAgB,GAAG,EAAE,CAAA;AAE7B,EAAO,OAAA,IAAA;AAAA,KAAA,EACF,IAAI;AAAA,WAAA,EACE,MAAM,CAAC,CAAC,qBAAA,EAAuB;AAAA,eAAA,EAC3B,gBAAgB;AAAA;AAAA,MAAA,EAEzB,MACA,KAAM,CAAA,IAAA;AAAA,IACJ,uBAAyB,EAAA,OAAA,CAAQ,UAAU,IAAI,CAAA,CAAE,cAAc;AAAC,GACjE;AAAA;AAAA,EAAA,CAAA;AAGT","file":"product-variant-render.js","sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-core/utils\";\n\nimport { createMemo, Show } from \"solid-js\";\nimport html from \"solid-js/html\";\n\nimport { useProduct } from \"../hooks/index.js\";\n\ntype Props = {};\n\nexport const Name = `product-variant-render`;\n\nexport const Component: CorrectComponentType<Props> = (_, { element }) => {\n  const templates = Array.from(\n    element.querySelectorAll<HTMLTemplateElement>(\"template[variant-id]\"),\n  );\n  if (!templates.length)\n    return console.warn(`${Name}: No variant templates found`);\n  const [state] = useProduct(element);\n\n  const fallbackChildren = Array.from(element.children);\n\n  const activeVariantTemplate = createMemo(() => {\n    const variantId = state.product?.selected_or_first_available_variant?.id;\n    if (!variantId) return null;\n    const template = templates.find(\n      (t) => t.getAttribute(\"variant-id\") === `${variantId}`,\n    );\n    return template || null;\n  });\n\n  element.replaceChildren(...[]);\n\n  return html`\n    <${Show}\n      when=${() => !!activeVariantTemplate()}\n      fallback=${fallbackChildren}\n    >\n      ${() =>\n        Array.from(\n          activeVariantTemplate()?.content.cloneNode(true).childNodes || [],\n        )}\n    <//>\n  `;\n};\n"]}

package/dist/main/hooks/useProduct.js

@@ -1,6 +1,6 @@
 import { createContext, provide, consume } from 'component-register';
 import { splitProps, mergeProps, untrack } from 'solid-js';
-import { getContextFromProvider } from '@brytdesigns/web-component-utils';
+import { createWithElementContext, getContextFromProvider } from '@brytdesigns/web-component-core/utils';
 
 function initializeProductContext(props) {
   const [privateProps, publicProps] = splitProps(props, ["root"]);
@@ -62,7 +62,8 @@ const getProductContext = (element) => {
   );
   return useProductContext(context);
 };
+const withProductElementContext = createWithElementContext(ProductContextState);
 
-export { getProductContext, provideProductContext, useProduct, useProductContext };
+export { getProductContext, provideProductContext, useProduct, useProductContext, withProductElementContext };
 //# sourceMappingURL=useProduct.js.map
 //# sourceMappingURL=useProduct.js.map

package/dist/main/hooks/useProduct.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/hooks/useProduct.ts"],"names":[],"mappings":";;;;AAoBA,SAAS,yBAAyB,KAA6B,EAAA;AAC7D,EAAM,MAAA,CAAC,cAAc,WAAW,CAAA,GAAI,WAAW,KAAO,EAAA,CAAC,MAAM,CAAC,CAAA;AAC9D,EAAA,MAAM,KAAQ,GAAA,UAAA,CAAW,WAAa,EAAA,EAAE,CAAA;AAExC,EAAA,SAAS,sBAAsB,SAA4B,EAAA;AACzD,IAAA,MAAM,OAAU,GAAA,OAAA,CAAQ,MAAM,KAAA,EAAO,OAAO,CAAA;AAC5C,IACE,IAAA,OAAO,SAAS,mCAAwC,KAAA,WAAA,IACxD,OAAO,OAAY,KAAA,WAAA,IACnB,OAAO,OAAA,EAAS,QAAa,KAAA,WAAA;AAE7B,MAAA;AACF,IAAM,MAAA,UAAA,GAAa,QAAQ,QAAS,CAAA,IAAA;AAAA,MAClC,CAAC,OAAY,KAAA,OAAA,CAAQ,GAAG,QAAS,EAAA,KAAM,UAAU,QAAS;AAAA,KAC5D;AAEA,IAAA,IACE,YAAY,EAAG,CAAA,QAAA,OACf,OAAQ,CAAA,mCAAA,EAAqC,GAAG,QAAS,EAAA;AAEzD,MAAA;AAEF,IAAA,MAAM,QAAW,GAAA;AAAA,MACf,GAAG,OAAA;AAAA,MACH,mCAAqC,EAAA;AAAA,KACvC;AAEA,IAAA,YAAA,CAAa,KAAK,YAAa,CAAA,SAAA,EAAW,IAAK,CAAA,SAAA,CAAU,QAAQ,CAAC,CAAA;AAElE,IAAA,YAAA,CAAa,IAAK,CAAA,aAAA;AAAA,MAChB,IAAI,YAAY,iBAAmB,EAAA;AAAA,QACjC,MAAQ,EAAA;AAAA,UACN,OAAS,EAAA,UAAA;AAAA,UACT,OAAS,EAAA;AAAA,SACX;AAAA,QACA,OAAS,EAAA;AAAA,OACV;AAAA,KACH;AAAA;AAGF,EAAO,OAAA;AAAA,IACL,KAAA;AAAA,IACA;AAAA,MACE,OAAS,EAAA;AAAA,QACP,MAAQ,EAAA;AAAA;AACV;AACF,GACF;AACF;AAEA,MAAM,mBAAA,GAAsB,cAAc,wBAAwB,CAAA;AAErD,MAAA,qBAAA,GAAwB,CACnC,YAAA,EACA,OACmB,KAAA;AACnB,EAAA,MAAM,QAAQ,UAAW,CAAA,YAAA,EAAc,EAAE,IAAA,EAAM,SAAS,CAAA;AACxD,EAAO,OAAA,OAAA,CAAQ,mBAAqB,EAAA,KAAA,EAAO,OAAO,CAAA;AACpD;AAEa,MAAA,iBAAA,GAAoB,CAAC,OAA4B,KAAA;AAC5D,EAAO,OAAA,OAAA;AACT;AAEa,MAAA,UAAA,GAAa,CAAC,OAA0C,KAAA;AACnE,EAAM,MAAA,OAAA,GAA0B,OAAQ,CAAA,mBAAA,EAAqB,OAAO,CAAA;AAEpE,EAAA,IAAI,CAAC,OAAS,EAAA;AACZ,IAAA,MAAM,OAAQ,CAAA,KAAA;AAAA,MACZ;AAAA,KACF;AAAA;AAGF,EAAA,OAAO,kBAAkB,OAAO,CAAA;AAClC;AAEa,MAAA,iBAAA,GAAoB,CAAC,OAAqB,KAAA;AACrD,EAAA,MAAM,OAAU,GAAA,sBAAA;AAAA,IACd,mBAAA;AAAA,IACA;AAAA,GACF;AACA,EAAA,OAAO,kBAAkB,OAAO,CAAA;AAClC","file":"useProduct.js","sourcesContent":["import {\n  type ICustomElement,\n  createContext,\n  provide,\n  consume,\n} from \"component-register\";\nimport { mergeProps, splitProps, untrack } from \"solid-js\";\nimport { getContextFromProvider } from \"@brytdesigns/web-component-utils\";\n\nimport type { Product } from \"../types\";\n\ntype CreateContextOptions = {\n  root: HTMLElement & ICustomElement;\n  product: Product;\n};\n\ntype WalkableNode = Parameters<typeof provide>[2];\n\ntype ProductContext = ReturnType<typeof initializeProductContext>;\n\nfunction initializeProductContext(props: CreateContextOptions) {\n  const [privateProps, publicProps] = splitProps(props, [\"root\"]);\n  const state = mergeProps(publicProps, {});\n\n  function updateSelectedVariant(variantId: string | number) {\n    const product = untrack(() => state?.product);\n    if (\n      typeof product?.selected_or_first_available_variant === \"undefined\" ||\n      typeof product === \"undefined\" ||\n      typeof product?.variants === \"undefined\"\n    )\n      return;\n    const newVariant = product.variants.find(\n      (variant) => variant.id.toString() === variantId.toString()\n    );\n\n    if (\n      newVariant?.id.toString() ===\n      product.selected_or_first_available_variant?.id.toString()\n    )\n      return;\n\n    const newState = {\n      ...product,\n      selected_or_first_available_variant: newVariant,\n    };\n\n    privateProps.root.setAttribute(\"product\", JSON.stringify(newState));\n\n    privateProps.root.dispatchEvent(\n      new CustomEvent(\"variant-updated\", {\n        detail: {\n          variant: newVariant,\n          product: newState,\n        },\n        bubbles: true,\n      })\n    );\n  }\n\n  return [\n    state,\n    {\n      variant: {\n        update: updateSelectedVariant,\n      },\n    },\n  ] as const;\n}\n\nconst ProductContextState = createContext(initializeProductContext);\n\nexport const provideProductContext = (\n  initialState: Omit<CreateContextOptions, \"root\">,\n  element: WalkableNode\n): ProductContext => {\n  const props = mergeProps(initialState, { root: element });\n  return provide(ProductContextState, props, element);\n};\n\nexport const useProductContext = (context: ProductContext) => {\n  return context;\n};\n\nexport const useProduct = (element: HTMLElement & ICustomElement) => {\n  const context: ProductContext = consume(ProductContextState, element);\n\n  if (!context) {\n    throw console.error(\n      \"ProductInfoContext not found! Please ensure to wrap your custom element with product-info element.\"\n    );\n  }\n\n  return useProductContext(context);\n};\n\nexport const getProductContext = (element: Element) => {\n  const context = getContextFromProvider<ProductContext>(\n    ProductContextState,\n    element\n  );\n  return useProductContext(context);\n};\n"]}
+{"version":3,"sources":["../../../src/hooks/useProduct.ts"],"names":[],"mappings":";;;;AAuBA,SAAS,yBAAyB,KAA6B,EAAA;AAC7D,EAAM,MAAA,CAAC,cAAc,WAAW,CAAA,GAAI,WAAW,KAAO,EAAA,CAAC,MAAM,CAAC,CAAA;AAC9D,EAAA,MAAM,KAAQ,GAAA,UAAA,CAAW,WAAa,EAAA,EAAE,CAAA;AAExC,EAAA,SAAS,sBAAsB,SAA4B,EAAA;AACzD,IAAA,MAAM,OAAU,GAAA,OAAA,CAAQ,MAAM,KAAA,EAAO,OAAO,CAAA;AAC5C,IACE,IAAA,OAAO,SAAS,mCAAwC,KAAA,WAAA,IACxD,OAAO,OAAY,KAAA,WAAA,IACnB,OAAO,OAAA,EAAS,QAAa,KAAA,WAAA;AAE7B,MAAA;AACF,IAAM,MAAA,UAAA,GAAa,QAAQ,QAAS,CAAA,IAAA;AAAA,MAClC,CAAC,OAAY,KAAA,OAAA,CAAQ,GAAG,QAAS,EAAA,KAAM,UAAU,QAAS;AAAA,KAC5D;AAEA,IAAA,IACE,YAAY,EAAG,CAAA,QAAA,OACf,OAAQ,CAAA,mCAAA,EAAqC,GAAG,QAAS,EAAA;AAEzD,MAAA;AAEF,IAAA,MAAM,QAAW,GAAA;AAAA,MACf,GAAG,OAAA;AAAA,MACH,mCAAqC,EAAA;AAAA,KACvC;AAEA,IAAA,YAAA,CAAa,KAAK,YAAa,CAAA,SAAA,EAAW,IAAK,CAAA,SAAA,CAAU,QAAQ,CAAC,CAAA;AAElE,IAAA,YAAA,CAAa,IAAK,CAAA,aAAA;AAAA,MAChB,IAAI,YAAY,iBAAmB,EAAA;AAAA,QACjC,MAAQ,EAAA;AAAA,UACN,OAAS,EAAA,UAAA;AAAA,UACT,OAAS,EAAA;AAAA,SACX;AAAA,QACA,OAAS,EAAA;AAAA,OACV;AAAA,KACH;AAAA;AAGF,EAAO,OAAA;AAAA,IACL,KAAA;AAAA,IACA;AAAA,MACE,OAAS,EAAA;AAAA,QACP,MAAQ,EAAA;AAAA;AACV;AACF,GACF;AACF;AAEA,MAAM,mBAAA,GAAsB,cAAc,wBAAwB,CAAA;AAErD,MAAA,qBAAA,GAAwB,CACnC,YAAA,EACA,OACmB,KAAA;AACnB,EAAA,MAAM,QAAQ,UAAW,CAAA,YAAA,EAAc,EAAE,IAAA,EAAM,SAAS,CAAA;AACxD,EAAO,OAAA,OAAA,CAAQ,mBAAqB,EAAA,KAAA,EAAO,OAAO,CAAA;AACpD;AAEa,MAAA,iBAAA,GAAoB,CAAC,OAA4B,KAAA;AAC5D,EAAO,OAAA,OAAA;AACT;AAEa,MAAA,UAAA,GAAa,CAAC,OAA0C,KAAA;AACnE,EAAM,MAAA,OAAA,GAA0B,OAAQ,CAAA,mBAAA,EAAqB,OAAO,CAAA;AAEpE,EAAA,IAAI,CAAC,OAAS,EAAA;AACZ,IAAA,MAAM,OAAQ,CAAA,KAAA;AAAA,MACZ;AAAA,KACF;AAAA;AAGF,EAAA,OAAO,kBAAkB,OAAO,CAAA;AAClC;AAEa,MAAA,iBAAA,GAAoB,CAAC,OAAqB,KAAA;AACrD,EAAA,MAAM,OAAU,GAAA,sBAAA;AAAA,IACd,mBAAA;AAAA,IACA;AAAA,GACF;AACA,EAAA,OAAO,kBAAkB,OAAO,CAAA;AAClC;AAEa,MAAA,yBAAA,GAA4B,yBAGvC,mBAAmB","file":"useProduct.js","sourcesContent":["import {\n  type ICustomElement,\n  createContext,\n  provide,\n  consume,\n} from \"component-register\";\nimport { mergeProps, splitProps, untrack } from \"solid-js\";\nimport {\n  getContextFromProvider,\n  createWithElementContext,\n} from \"@brytdesigns/web-component-core/utils\";\n\nimport type { Product } from \"../types\";\n\ntype CreateContextOptions = {\n  root: HTMLElement & ICustomElement;\n  product: Product;\n};\n\ntype WalkableNode = Parameters<typeof provide>[2];\n\ntype ProductContext = ReturnType<typeof initializeProductContext>;\n\nfunction initializeProductContext(props: CreateContextOptions) {\n  const [privateProps, publicProps] = splitProps(props, [\"root\"]);\n  const state = mergeProps(publicProps, {});\n\n  function updateSelectedVariant(variantId: string | number) {\n    const product = untrack(() => state?.product);\n    if (\n      typeof product?.selected_or_first_available_variant === \"undefined\" ||\n      typeof product === \"undefined\" ||\n      typeof product?.variants === \"undefined\"\n    )\n      return;\n    const newVariant = product.variants.find(\n      (variant) => variant.id.toString() === variantId.toString(),\n    );\n\n    if (\n      newVariant?.id.toString() ===\n      product.selected_or_first_available_variant?.id.toString()\n    )\n      return;\n\n    const newState = {\n      ...product,\n      selected_or_first_available_variant: newVariant,\n    };\n\n    privateProps.root.setAttribute(\"product\", JSON.stringify(newState));\n\n    privateProps.root.dispatchEvent(\n      new CustomEvent(\"variant-updated\", {\n        detail: {\n          variant: newVariant,\n          product: newState,\n        },\n        bubbles: true,\n      }),\n    );\n  }\n\n  return [\n    state,\n    {\n      variant: {\n        update: updateSelectedVariant,\n      },\n    },\n  ] as const;\n}\n\nconst ProductContextState = createContext(initializeProductContext);\n\nexport const provideProductContext = (\n  initialState: Omit<CreateContextOptions, \"root\">,\n  element: WalkableNode,\n): ProductContext => {\n  const props = mergeProps(initialState, { root: element });\n  return provide(ProductContextState, props, element);\n};\n\nexport const useProductContext = (context: ProductContext) => {\n  return context;\n};\n\nexport const useProduct = (element: HTMLElement & ICustomElement) => {\n  const context: ProductContext = consume(ProductContextState, element);\n\n  if (!context) {\n    throw console.error(\n      \"ProductInfoContext not found! Please ensure to wrap your custom element with product-info element.\",\n    );\n  }\n\n  return useProductContext(context);\n};\n\nexport const getProductContext = (element: Element) => {\n  const context = getContextFromProvider<ProductContext>(\n    ProductContextState,\n    element,\n  );\n  return useProductContext(context);\n};\n\nexport const withProductElementContext = createWithElementContext<\n  typeof ProductContextState,\n  ProductContext\n>(ProductContextState);\n"]}

package/dist/main/hooks/useProductOptions.js

@@ -1,6 +1,6 @@
 import { createContext, provide, consume } from 'component-register';
 import { splitProps, createEffect, untrack, mergeProps } from 'solid-js';
-import { getContextFromProvider } from '@brytdesigns/web-component-utils';
+import { createWithElementContext, getContextFromProvider } from '@brytdesigns/web-component-core/utils';
 import { useProduct } from './useProduct.js';
 
 function initializeProductOptionsContext(props) {
@@ -65,7 +65,8 @@ const getProductOptionsContext = (element) => {
   );
   return useProductOptionsContext(context);
 };
+const withProductOptionsElementContext = createWithElementContext(ProductOptionsContextState);
 
-export { getProductOptionsContext, provideProductOptionsContext, useProductOptions, useProductOptionsContext };
+export { getProductOptionsContext, provideProductOptionsContext, useProductOptions, useProductOptionsContext, withProductOptionsElementContext };
 //# sourceMappingURL=useProductOptions.js.map
 //# sourceMappingURL=useProductOptions.js.map

package/dist/main/hooks/useProductOptions.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/hooks/useProductOptions.ts"],"names":["variant"],"mappings":";;;;;AAoBA,SAAS,gCAAgC,KAA6B,EAAA;AACpE,EAAM,MAAA,CAAC,cAAc,WAAW,CAAA,GAAI,WAAW,KAAO,EAAA,CAAC,MAAM,CAAC,CAAA;AAC9D,EAAA,MAAM,CAAC,OAAS,EAAA,OAAO,CAAI,GAAA,UAAA,CAAW,aAAa,IAAI,CAAA;AAEvD,EAAA,SAAS,sBAAsB,OAAmB,EAAA;AAChD,IAAA,YAAA,CAAa,KAAK,YAAa,CAAA,kBAAA,EAAoB,IAAK,CAAA,SAAA,CAAU,OAAO,CAAC,CAAA;AAAA;AAG5E,EAAS,SAAA,oBAAA,CAAqB,QAAgB,KAAe,EAAA;AAC3D,IAAA,MAAM,OAAU,GAAA,OAAA,CAAQ,MAAM,WAAA,CAAY,eAAe,CAAA;AACzD,IAAM,MAAA,OAAA,GAAU,CAAC,GAAG,OAAO,CAAA;AAC3B,IAAA,OAAA,CAAQ,KAAK,CAAI,GAAA,MAAA;AACjB,IAAA,OAAO,sBAAsB,OAAO,CAAA;AAAA;AAGtC,EAAA,YAAA,CAAa,MAAM;AACjB,IAAA,MAAM,UAAU,OAAQ,CAAA,OAAA,CAAQ,QAAS,CAAA,IAAA,CAAK,CAACA,QAAY,KAAA;AACzD,MAAA,OAAO,YAAY,eAAgB,CAAA,KAAA;AAAA,QAAM,CAAC,MAAA,KACxCA,QAAQ,CAAA,OAAA,CAAQ,SAAS,MAAM;AAAA,OACjC;AAAA,KACD,CAAA;AACD,IAAA,IAAI,CAAC,OAAS,EAAA;AACd,IAAA,IAAI,OAAQ,CAAA,EAAA,KAAO,OAAQ,CAAA,OAAA,CAAQ,mCAAoC,CAAA,EAAA;AACrE,MAAA;AACF,IAAQ,OAAA,CAAA,OAAA,CAAQ,MAAO,CAAA,OAAA,CAAQ,EAAE,CAAA;AAAA,GAClC,CAAA;AAED,EAAO,OAAA;AAAA,IACL,WAAA;AAAA,IACA;AAAA,MACE,OAAS,EAAA;AAAA,QACP,MAAQ,EAAA,qBAAA;AAAA,QACR,YAAc,EAAA;AAAA;AAChB;AACF,GACF;AACF;AAEA,MAAM,0BAA6B,GAAA,aAAA;AAAA,EACjC;AACF,CAAA;AAEa,MAAA,4BAAA,GAA+B,CAC1C,YAAA,EACA,OAC0B,KAAA;AAC1B,EAAA,MAAM,QAAQ,UAAW,CAAA,YAAA,EAAc,EAAE,IAAA,EAAM,SAAS,CAAA;AACxD,EAAO,OAAA,OAAA,CAAQ,0BAA4B,EAAA,KAAA,EAAO,OAAO,CAAA;AAC3D;AAEa,MAAA,wBAAA,GAA2B,CAAC,OAAmC,KAAA;AAC1E,EAAO,OAAA,OAAA;AACT;AAEa,MAAA,iBAAA,GAAoB,CAAC,OAA0C,KAAA;AAC1E,EAAA,MAAM,OAAiC,GAAA,OAAA;AAAA,IACrC,0BAAA;AAAA,IACA;AAAA,GACF;AAEA,EAAA,IAAI,CAAC,OAAS,EAAA;AACZ,IAAA,MAAM,OAAQ,CAAA,KAAA;AAAA,MACZ;AAAA,KACF;AAAA;AAGF,EAAA,OAAO,yBAAyB,OAAO,CAAA;AACzC;AAEa,MAAA,wBAAA,GAA2B,CAAC,OAAqB,KAAA;AAC5D,EAAA,MAAM,OAAU,GAAA,sBAAA;AAAA,IACd,0BAAA;AAAA,IACA;AAAA,GACF;AACA,EAAA,OAAO,yBAAyB,OAAO,CAAA;AACzC","file":"useProductOptions.js","sourcesContent":["import {\n  type ICustomElement,\n  createContext,\n  provide,\n  consume,\n} from \"component-register\";\nimport { createEffect, mergeProps, splitProps, untrack } from \"solid-js\";\nimport { getContextFromProvider } from \"@brytdesigns/web-component-utils\";\n\nimport { useProduct } from \"./useProduct.js\";\n\ntype CreateContextOptions = {\n  root: HTMLElement & ICustomElement;\n  selectedOptions: string[];\n};\n\ntype WalkableNode = Parameters<typeof provide>[2];\n\ntype ProductOptionsContext = ReturnType<typeof initializeProductOptionsContext>;\n\nfunction initializeProductOptionsContext(props: CreateContextOptions) {\n  const [privateProps, publicProps] = splitProps(props, [\"root\"]);\n  const [context, methods] = useProduct(privateProps.root);\n\n  function updateSelectedOptions(options: string[]) {\n    privateProps.root.setAttribute(\"selected-options\", JSON.stringify(options));\n  }\n\n  function updateSelectedOption(option: string, index: number) {\n    const current = untrack(() => publicProps.selectedOptions);\n    const options = [...current];\n    options[index] = option;\n    return updateSelectedOptions(options);\n  }\n\n  createEffect(() => {\n    const variant = context.product.variants.find((variant) => {\n      return publicProps.selectedOptions.every((option) =>\n        variant.options.includes(option)\n      );\n    });\n    if (!variant) return;\n    if (variant.id === context.product.selected_or_first_available_variant.id)\n      return;\n    methods.variant.update(variant.id);\n  });\n\n  return [\n    publicProps,\n    {\n      options: {\n        update: updateSelectedOptions,\n        updateOption: updateSelectedOption,\n      },\n    },\n  ] as const;\n}\n\nconst ProductOptionsContextState = createContext(\n  initializeProductOptionsContext\n);\n\nexport const provideProductOptionsContext = (\n  initialState: Omit<CreateContextOptions, \"root\">,\n  element: WalkableNode\n): ProductOptionsContext => {\n  const props = mergeProps(initialState, { root: element });\n  return provide(ProductOptionsContextState, props, element);\n};\n\nexport const useProductOptionsContext = (context: ProductOptionsContext) => {\n  return context;\n};\n\nexport const useProductOptions = (element: HTMLElement & ICustomElement) => {\n  const context: ProductOptionsContext = consume(\n    ProductOptionsContextState,\n    element\n  );\n\n  if (!context) {\n    throw console.error(\n      \"ProductOptionsContext not found! Please ensure to wrap your custom element with product-options element.\"\n    );\n  }\n\n  return useProductOptionsContext(context);\n};\n\nexport const getProductOptionsContext = (element: Element) => {\n  const context = getContextFromProvider<ProductOptionsContext>(\n    ProductOptionsContextState,\n    element\n  );\n  return useProductOptionsContext(context);\n};\n"]}
+{"version":3,"sources":["../../../src/hooks/useProductOptions.ts"],"names":["variant"],"mappings":";;;;;AAuBA,SAAS,gCAAgC,KAA6B,EAAA;AACpE,EAAM,MAAA,CAAC,cAAc,WAAW,CAAA,GAAI,WAAW,KAAO,EAAA,CAAC,MAAM,CAAC,CAAA;AAC9D,EAAA,MAAM,CAAC,OAAS,EAAA,OAAO,CAAI,GAAA,UAAA,CAAW,aAAa,IAAI,CAAA;AAEvD,EAAA,SAAS,sBAAsB,OAAmB,EAAA;AAChD,IAAA,YAAA,CAAa,KAAK,YAAa,CAAA,kBAAA,EAAoB,IAAK,CAAA,SAAA,CAAU,OAAO,CAAC,CAAA;AAAA;AAG5E,EAAS,SAAA,oBAAA,CAAqB,QAAgB,KAAe,EAAA;AAC3D,IAAA,MAAM,OAAU,GAAA,OAAA,CAAQ,MAAM,WAAA,CAAY,eAAe,CAAA;AACzD,IAAM,MAAA,OAAA,GAAU,CAAC,GAAG,OAAO,CAAA;AAC3B,IAAA,OAAA,CAAQ,KAAK,CAAI,GAAA,MAAA;AACjB,IAAA,OAAO,sBAAsB,OAAO,CAAA;AAAA;AAGtC,EAAA,YAAA,CAAa,MAAM;AACjB,IAAA,MAAM,UAAU,OAAQ,CAAA,OAAA,CAAQ,QAAS,CAAA,IAAA,CAAK,CAACA,QAAY,KAAA;AACzD,MAAA,OAAO,YAAY,eAAgB,CAAA,KAAA;AAAA,QAAM,CAAC,MAAA,KACxCA,QAAQ,CAAA,OAAA,CAAQ,SAAS,MAAM;AAAA,OACjC;AAAA,KACD,CAAA;AACD,IAAA,IAAI,CAAC,OAAS,EAAA;AACd,IAAA,IAAI,OAAQ,CAAA,EAAA,KAAO,OAAQ,CAAA,OAAA,CAAQ,mCAAoC,CAAA,EAAA;AACrE,MAAA;AACF,IAAQ,OAAA,CAAA,OAAA,CAAQ,MAAO,CAAA,OAAA,CAAQ,EAAE,CAAA;AAAA,GAClC,CAAA;AAED,EAAO,OAAA;AAAA,IACL,WAAA;AAAA,IACA;AAAA,MACE,OAAS,EAAA;AAAA,QACP,MAAQ,EAAA,qBAAA;AAAA,QACR,YAAc,EAAA;AAAA;AAChB;AACF,GACF;AACF;AAEA,MAAM,0BAA6B,GAAA,aAAA;AAAA,EACjC;AACF,CAAA;AAEa,MAAA,4BAAA,GAA+B,CAC1C,YAAA,EACA,OAC0B,KAAA;AAC1B,EAAA,MAAM,QAAQ,UAAW,CAAA,YAAA,EAAc,EAAE,IAAA,EAAM,SAAS,CAAA;AACxD,EAAO,OAAA,OAAA,CAAQ,0BAA4B,EAAA,KAAA,EAAO,OAAO,CAAA;AAC3D;AAEa,MAAA,wBAAA,GAA2B,CAAC,OAAmC,KAAA;AAC1E,EAAO,OAAA,OAAA;AACT;AAEa,MAAA,iBAAA,GAAoB,CAAC,OAA0C,KAAA;AAC1E,EAAA,MAAM,OAAiC,GAAA,OAAA;AAAA,IACrC,0BAAA;AAAA,IACA;AAAA,GACF;AAEA,EAAA,IAAI,CAAC,OAAS,EAAA;AACZ,IAAA,MAAM,OAAQ,CAAA,KAAA;AAAA,MACZ;AAAA,KACF;AAAA;AAGF,EAAA,OAAO,yBAAyB,OAAO,CAAA;AACzC;AAEa,MAAA,wBAAA,GAA2B,CAAC,OAAqB,KAAA;AAC5D,EAAA,MAAM,OAAU,GAAA,sBAAA;AAAA,IACd,0BAAA;AAAA,IACA;AAAA,GACF;AACA,EAAA,OAAO,yBAAyB,OAAO,CAAA;AACzC;AAEa,MAAA,gCAAA,GAAmC,yBAG9C,0BAA0B","file":"useProductOptions.js","sourcesContent":["import {\n  type ICustomElement,\n  createContext,\n  provide,\n  consume,\n} from \"component-register\";\nimport { createEffect, mergeProps, splitProps, untrack } from \"solid-js\";\nimport {\n  getContextFromProvider,\n  createWithElementContext,\n} from \"@brytdesigns/web-component-core/utils\";\n\nimport { useProduct } from \"./useProduct.js\";\n\ntype CreateContextOptions = {\n  root: HTMLElement & ICustomElement;\n  selectedOptions: string[];\n};\n\ntype WalkableNode = Parameters<typeof provide>[2];\n\ntype ProductOptionsContext = ReturnType<typeof initializeProductOptionsContext>;\n\nfunction initializeProductOptionsContext(props: CreateContextOptions) {\n  const [privateProps, publicProps] = splitProps(props, [\"root\"]);\n  const [context, methods] = useProduct(privateProps.root);\n\n  function updateSelectedOptions(options: string[]) {\n    privateProps.root.setAttribute(\"selected-options\", JSON.stringify(options));\n  }\n\n  function updateSelectedOption(option: string, index: number) {\n    const current = untrack(() => publicProps.selectedOptions);\n    const options = [...current];\n    options[index] = option;\n    return updateSelectedOptions(options);\n  }\n\n  createEffect(() => {\n    const variant = context.product.variants.find((variant) => {\n      return publicProps.selectedOptions.every((option) =>\n        variant.options.includes(option),\n      );\n    });\n    if (!variant) return;\n    if (variant.id === context.product.selected_or_first_available_variant.id)\n      return;\n    methods.variant.update(variant.id);\n  });\n\n  return [\n    publicProps,\n    {\n      options: {\n        update: updateSelectedOptions,\n        updateOption: updateSelectedOption,\n      },\n    },\n  ] as const;\n}\n\nconst ProductOptionsContextState = createContext(\n  initializeProductOptionsContext,\n);\n\nexport const provideProductOptionsContext = (\n  initialState: Omit<CreateContextOptions, \"root\">,\n  element: WalkableNode,\n): ProductOptionsContext => {\n  const props = mergeProps(initialState, { root: element });\n  return provide(ProductOptionsContextState, props, element);\n};\n\nexport const useProductOptionsContext = (context: ProductOptionsContext) => {\n  return context;\n};\n\nexport const useProductOptions = (element: HTMLElement & ICustomElement) => {\n  const context: ProductOptionsContext = consume(\n    ProductOptionsContextState,\n    element,\n  );\n\n  if (!context) {\n    throw console.error(\n      \"ProductOptionsContext not found! Please ensure to wrap your custom element with product-options element.\",\n    );\n  }\n\n  return useProductOptionsContext(context);\n};\n\nexport const getProductOptionsContext = (element: Element) => {\n  const context = getContextFromProvider<ProductOptionsContext>(\n    ProductOptionsContextState,\n    element,\n  );\n  return useProductOptionsContext(context);\n};\n\nexport const withProductOptionsElementContext = createWithElementContext<\n  typeof ProductOptionsContextState,\n  ProductOptionsContext\n>(ProductOptionsContextState);\n"]}

package/dist/main/index.d.ts

@@ -31,6 +31,16 @@ export declare const getProductContext: (element: Element) => readonly [
 		};
 	}
 ];
+export declare const withProductElementContext: <D extends unknown>(selector: string | import("solid-js").Accessor<string>, dependencies: import("solid-js").Accessor<D> | undefined, cb: (context: readonly [
+	{
+		product: Product;
+	},
+	{
+		readonly variant: {
+			readonly update: (variantId: string | number) => void;
+		};
+	}
+], dependencies: D) => void | (() => void)) => void;
 export declare const useProductOptions: (element: HTMLElement & ICustomElement) => readonly [
 	{
 		selectedOptions: string[];
@@ -53,5 +63,16 @@ export declare const getProductOptionsContext: (element: Element) => readonly [
 		};
 	}
 ];
+export declare const withProductOptionsElementContext: <D extends unknown>(selector: string | import("solid-js").Accessor<string>, dependencies: import("solid-js").Accessor<D> | undefined, cb: (context: readonly [
+	{
+		selectedOptions: string[];
+	},
+	{
+		readonly options: {
+			readonly update: (options: string[]) => void;
+			readonly updateOption: (option: string, index: number) => void;
+		};
+	}
+], dependencies: D) => void | (() => void)) => void;
 
 export {};

package/dist/main/index.js

@@ -1,43 +1,43 @@
-import { customShadowlessElement, correctElementType } from '@brytdesigns/web-component-utils';
+import { customShadowlessElement, correctElementType } from '@brytdesigns/web-component-core/utils';
 import { ProductInfo, ProductOptions, ProductOptionGroup, ProductVariantInput, ProductVariantRender } from './components/index.js';
-export { getProductContext, getProductOptionsContext, useProduct, useProductOptions } from './hooks/index.js';
+export { getProductContext, getProductOptionsContext, useProduct, useProductOptions, withProductElementContext, withProductOptionsElementContext } from './hooks/index.js';
 
 customShadowlessElement(
-  "product-info",
+  ProductInfo.Name,
   {
     product: void 0,
     isProductPage: false
   },
-  correctElementType(ProductInfo)
+  correctElementType(ProductInfo.Component)
 );
 customShadowlessElement(
-  "product-options",
+  ProductOptions.Name,
   {
     selectedOptions: []
   },
-  correctElementType(ProductOptions)
+  correctElementType(ProductOptions.Component)
 );
 customShadowlessElement(
-  "product-option-group",
+  ProductOptionGroup.Name,
   {
     position: 0,
     name: "",
     inputType: "radio"
   },
-  correctElementType(ProductOptionGroup)
+  correctElementType(ProductOptionGroup.Component)
 );
 customShadowlessElement(
-  "product-variant-input",
+  ProductVariantInput.Name,
   {
     target: "",
     preventDefault: true
   },
-  correctElementType(ProductVariantInput)
+  correctElementType(ProductVariantInput.Component)
 );
 customShadowlessElement(
-  "product-variant-render",
+  ProductVariantRender.Name,
   {},
-  correctElementType(ProductVariantRender)
+  correctElementType(ProductVariantRender.Component)
 );
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/main/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/index.ts"],"names":[],"mappings":";;;;AAaA,uBAAA;AAAA,EACE,cAAA;AAAA,EACA;AAAA,IACE,OAAS,EAAA,MAAA;AAAA,IACT,aAAe,EAAA;AAAA,GACjB;AAAA,EACA,mBAAmB,WAAW;AAChC,CAAA;AAEA,uBAAA;AAAA,EACE,iBAAA;AAAA,EACA;AAAA,IACE,iBAAiB;AAAC,GACpB;AAAA,EACA,mBAAmB,cAAc;AACnC,CAAA;AAEA,uBAAA;AAAA,EACE,sBAAA;AAAA,EACA;AAAA,IACE,QAAU,EAAA,CAAA;AAAA,IACV,IAAM,EAAA,EAAA;AAAA,IACN,SAAW,EAAA;AAAA,GACb;AAAA,EACA,mBAAmB,kBAAkB;AACvC,CAAA;AAEA,uBAAA;AAAA,EACE,uBAAA;AAAA,EACA;AAAA,IACE,MAAQ,EAAA,EAAA;AAAA,IACR,cAAgB,EAAA;AAAA,GAClB;AAAA,EACA,mBAAmB,mBAAmB;AACxC,CAAA;AAEA,uBAAA;AAAA,EACE,wBAAA;AAAA,EACA,EAAC;AAAA,EACD,mBAAmB,oBAAoB;AACzC,CAAA","file":"index.js","sourcesContent":["import {\n  customShadowlessElement,\n  correctElementType,\n} from \"@brytdesigns/web-component-utils\";\n\nimport {\n  ProductInfo,\n  ProductOptions,\n  ProductOptionGroup,\n  ProductVariantInput,\n  ProductVariantRender,\n} from \"./components/index.js\";\n\ncustomShadowlessElement(\n  \"product-info\",\n  {\n    product: undefined,\n    isProductPage: false,\n  },\n  correctElementType(ProductInfo),\n);\n\ncustomShadowlessElement(\n  \"product-options\",\n  {\n    selectedOptions: [],\n  },\n  correctElementType(ProductOptions),\n);\n\ncustomShadowlessElement(\n  \"product-option-group\",\n  {\n    position: 0,\n    name: \"\",\n    inputType: \"radio\",\n  },\n  correctElementType(ProductOptionGroup),\n);\n\ncustomShadowlessElement(\n  \"product-variant-input\",\n  {\n    target: \"\",\n    preventDefault: true,\n  },\n  correctElementType(ProductVariantInput),\n);\n\ncustomShadowlessElement(\n  \"product-variant-render\",\n  {},\n  correctElementType(ProductVariantRender),\n);\n\nexport {\n  useProduct,\n  useProductOptions,\n  getProductContext,\n  getProductOptionsContext,\n} from \"./hooks/index.js\";\n"]}
+{"version":3,"sources":["../../src/index.ts"],"names":[],"mappings":";;;;AAaA,uBAAA;AAAA,EACE,WAAY,CAAA,IAAA;AAAA,EACZ;AAAA,IACE,OAAS,EAAA,MAAA;AAAA,IACT,aAAe,EAAA;AAAA,GACjB;AAAA,EACA,kBAAA,CAAmB,YAAY,SAAS;AAC1C,CAAA;AAEA,uBAAA;AAAA,EACE,cAAe,CAAA,IAAA;AAAA,EACf;AAAA,IACE,iBAAiB;AAAC,GACpB;AAAA,EACA,kBAAA,CAAmB,eAAe,SAAS;AAC7C,CAAA;AAEA,uBAAA;AAAA,EACE,kBAAmB,CAAA,IAAA;AAAA,EACnB;AAAA,IACE,QAAU,EAAA,CAAA;AAAA,IACV,IAAM,EAAA,EAAA;AAAA,IACN,SAAW,EAAA;AAAA,GACb;AAAA,EACA,kBAAA,CAAmB,mBAAmB,SAAS;AACjD,CAAA;AAEA,uBAAA;AAAA,EACE,mBAAoB,CAAA,IAAA;AAAA,EACpB;AAAA,IACE,MAAQ,EAAA,EAAA;AAAA,IACR,cAAgB,EAAA;AAAA,GAClB;AAAA,EACA,kBAAA,CAAmB,oBAAoB,SAAS;AAClD,CAAA;AAEA,uBAAA;AAAA,EACE,oBAAqB,CAAA,IAAA;AAAA,EACrB,EAAC;AAAA,EACD,kBAAA,CAAmB,qBAAqB,SAAS;AACnD,CAAA","file":"index.js","sourcesContent":["import {\n  customShadowlessElement,\n  correctElementType,\n} from \"@brytdesigns/web-component-core/utils\";\n\nimport {\n  ProductInfo,\n  ProductOptions,\n  ProductOptionGroup,\n  ProductVariantInput,\n  ProductVariantRender,\n} from \"./components/index.js\";\n\ncustomShadowlessElement(\n  ProductInfo.Name,\n  {\n    product: undefined,\n    isProductPage: false,\n  },\n  correctElementType(ProductInfo.Component),\n);\n\ncustomShadowlessElement(\n  ProductOptions.Name,\n  {\n    selectedOptions: [],\n  },\n  correctElementType(ProductOptions.Component),\n);\n\ncustomShadowlessElement(\n  ProductOptionGroup.Name,\n  {\n    position: 0,\n    name: \"\",\n    inputType: \"radio\",\n  },\n  correctElementType(ProductOptionGroup.Component),\n);\n\ncustomShadowlessElement(\n  ProductVariantInput.Name,\n  {\n    target: \"\",\n    preventDefault: true,\n  },\n  correctElementType(ProductVariantInput.Component),\n);\n\ncustomShadowlessElement(\n  ProductVariantRender.Name,\n  {},\n  correctElementType(ProductVariantRender.Component),\n);\n\nexport {\n  useProduct,\n  useProductOptions,\n  getProductContext,\n  getProductOptionsContext,\n  withProductElementContext,\n  withProductOptionsElementContext,\n} from \"./hooks/index.js\";\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@brytdesigns/shopify-product-info-components",
-  "version": "1.0.13",
+  "version": "1.1.0",
   "description": "Headless web components used to render product information based on active product variants",
   "main": "./dist/main/index.js",
   "module": "./dist/main/index.js",
@@ -22,7 +22,7 @@
     "component-register": "^0.8.7",
     "solid-element": "^1.9.1",
     "solid-js": "^1.9.7",
-    "@brytdesigns/web-component-utils": "0.1.14"
+    "@brytdesigns/web-component-core": "1.1.0"
   },
   "devDependencies": {
     "dts-bundle-generator": "^9.5.1",