@sonic-equipment/ui 0.0.9 → 0.0.11

package/dist/button.css

@@ -1,49 +0,0 @@
-.button-module-YrVJX {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  flex-shrink: 0;
-  -webkit-user-select: none;
-     -moz-user-select: none;
-          user-select: none;
-  vertical-align: top;
-  text-transform: uppercase;
-  font-style: italic;
-  font-weight: var(--font-weight-bold);
-}
-
-/*********************************************************
- *
- *  Sizes
- *
-*********************************************************/
-
-.button-module-JKC7O {
-  min-height: 40px;
-  border-radius: var(--border-radius-7);
-  padding-inline: var(--space-20);
-}
-
-.button-module-QYp75 {
-  min-height: 44px;  
-  border-radius: var(--border-radius-8);
-  padding-inline: var(--space-20);
-}
-
-/*********************************************************
- *
- *  Variants
- *
-*********************************************************/
-
-/* Solid */
-
-.button-module-trXaT:where(.button-module-2nlh8) {
-    background-color: var(--brand-color-red);
-    color: var(--white);
-  }
-
-.button-module-trXaT:where(.button-module-2nlh8):where([data-hovered]),
-    .button-module-trXaT:where(.button-module-2nlh8):where([data-pressed]) {
-      background-color: var(--brand-color-dark-red);
-    }

package/dist/button.js

@@ -1,12 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import clsx from 'clsx';
-import { Button as Button$1 } from 'react-aria-components';
-
-var styles = {"button":"button-module-YrVJX","md":"button-module-JKC7O","lg":"button-module-QYp75","solid":"button-module-trXaT","primary":"button-module-2nlh8"};
-
-function Button({ children, variant = "solid", size = "md", color = "primary", className, ...props }) {
-    return (jsx(Button$1, { ...props, className: clsx(styles.button, styles[variant], styles[size], styles[color], className), children: children }));
-}
-Button.displayName = "Button";
-
-export { Button };

package/dist/checkbox.css

@@ -1,63 +0,0 @@
-.checkbox-module-FLuy1 {
-  --selected-color: var(--brand-color-red);
-  --selected-color-pressed: var(--brand-color-dark-red);
-  --checkmark-color: var(--white);
-
-  display: flex;
-  align-items: center;
-  gap: 0.571rem;
-  font-size: var(--font-size-24);
-  line-height: 14px;
-  color: var(--brand-color-black);
-  forced-color-adjust: none;
-}
-
-  .checkbox-module-FLuy1 .checkbox-module-v6JLF {
-    width: 16px;
-    height: 16px;
-    border: 2px solid var(--brand-color-medium-gray);
-    border-radius: var(--border-radius-1);
-    transition: all 200ms;
-    display: flex;
-    align-items: center;
-    justify-content: center;    
-  }
-
-  .checkbox-module-FLuy1 svg {
-    width: 1rem;
-    height: 1rem;
-    fill: none;
-    stroke: var(--checkmark-color);
-    stroke-width: 3px;
-    stroke-dasharray: 22px;
-    stroke-dashoffset: 66;
-    transition: all 200ms;
-  }
-
-  .checkbox-module-FLuy1[data-pressed] .checkbox-module-v6JLF {
-    border-color: var(--brand-color-dark-gray);
-  }
-
-  .checkbox-module-FLuy1[data-focus-visible] .checkbox-module-v6JLF {
-    outline: 2px solid var(--focus-ring-color);
-    outline-offset: 2px;
-  }
-
-  .checkbox-module-FLuy1[data-selected] .checkbox-module-v6JLF, .checkbox-module-FLuy1[data-indeterminate] .checkbox-module-v6JLF {
-      border-color: var(--selected-color);
-      background: var(--selected-color);
-    }
-
-  .checkbox-module-FLuy1[data-selected][data-pressed] .checkbox-module-v6JLF, .checkbox-module-FLuy1[data-indeterminate][data-pressed] .checkbox-module-v6JLF {
-      border-color: var(--selected-color-pressed);
-      background: var(--selected-color-pressed);
-    }
-
-  .checkbox-module-FLuy1[data-selected] svg, .checkbox-module-FLuy1[data-indeterminate] svg {
-      stroke-dashoffset: 44;
-    }
-
-  .checkbox-module-FLuy1[data-indeterminate] svg {
-      stroke: none;
-      fill: var(--checkmark-color);
-    }

package/dist/checkbox.js

@@ -1,10 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { Checkbox as Checkbox$1 } from 'react-aria-components';
-
-var styles = {"checkbox":"checkbox-module-FLuy1","box":"checkbox-module-v6JLF"};
-
-function Checkbox({ children, ...props }) {
-    return (jsxs(Checkbox$1, { ...props, className: styles.checkbox, children: [jsx("div", { className: styles.box, children: jsx("svg", { viewBox: "0 0 18 18", "aria-hidden": "true", children: jsx("polyline", { points: "1 9 7 14 15 4" }) }) }), children] }));
-}
-
-export { Checkbox };

package/dist/dts/button/button.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/button/button.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAE7D,OAAO,EAAE,wBAAwB,EAAE,MAAM,OAAO,CAAC;AAGjD,MAAM,MAAM,WAAW,GAAG,wBAAwB,CAAC,OAAO,UAAU,CAAC,GAAG;IACtE,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,GAAG,OAAO,CAAC;IACxC,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,YAAY,CAAC;CAC7D,CAAC;AAEF,wBAAgB,MAAM,CAAC,EACrB,QAAQ,EACR,OAAiB,EACjB,IAAW,EACX,KAAiB,EACjB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,WAAW,2CAeb;yBAtBe,MAAM"}

package/dist/dts/checkbox/checkbox.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../src/checkbox/checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,IAAI,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAEjE,OAAO,EAAE,wBAAwB,EAAa,MAAM,OAAO,CAAC;AAG5D,MAAM,MAAM,aAAa,GAAG,wBAAwB,CAAC,OAAO,YAAY,CAAC,CAAC;AAE1E,wBAAgB,QAAQ,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,2CAW7D"}

package/dist/dts/color-filter/color-filter.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"color-filter.d.ts","sourceRoot":"","sources":["../../../src/color-filter/color-filter.tsx"],"names":[],"mappings":"AACA,OAAO,EAAU,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAEvD,MAAM,MAAM,gBAAgB,GAAG,WAAW,GAAG;IAC3C,OAAO,EAAE;QACP;YACE,KAAK,EAAE,MAAM,CAAC;YACd,KAAK,EAAE,MAAM,CAAC;YACd,KAAK,EAAE,MAAM,CAAC;SACf;KACF,CAAC;IACF,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CACrC,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,gBAAgB,2CAwBzE"}

package/dist/dts/filter/filter.d.ts

@@ -1,8 +0,0 @@
-import { PropsWithChildren } from "react";
-export type FilterProps = PropsWithChildren<{
-    title?: string;
-    isCollapseable?: boolean;
-    initialIsCollapsed?: boolean;
-}>;
-export declare function Filter({ title, children, isCollapseable, initialIsCollapsed, }: FilterProps): import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=filter.d.ts.map

package/dist/dts/filter/filter.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"filter.d.ts","sourceRoot":"","sources":["../../../src/filter/filter.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE1C,MAAM,MAAM,WAAW,GAAG,iBAAiB,CAAC;IAC1C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B,CAAC,CAAC;AAEH,wBAAgB,MAAM,CAAC,EACrB,KAAK,EACL,QAAQ,EACR,cAAqB,EACrB,kBAA0B,GAC3B,EAAE,WAAW,2CASb"}

package/dist/dts/product-card/product-card.d.ts

@@ -1,10 +0,0 @@
-export type ProductCardProps = {
-    product: {
-        id: string;
-        title: string;
-    };
-    onAddToCart?: (productId: string) => void;
-    onAddToList?: (productId: string) => void;
-};
-export declare function ProductCard({ product }: ProductCardProps): import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=product-card.d.ts.map

package/dist/dts/product-card/product-card.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"product-card.d.ts","sourceRoot":"","sources":["../../../src/product-card/product-card.tsx"],"names":[],"mappings":"AAAA,MAAM,MAAM,gBAAgB,GAAG;IAC7B,OAAO,EAAE;QACP,EAAE,EAAE,MAAM,CAAC;QACX,KAAK,EAAE,MAAM,CAAC;KACf,CAAC;IACF,WAAW,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,WAAW,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;CAC3C,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAAE,OAAO,EAAE,EAAE,gBAAgB,2CAMxD"}

package/dist/dts/product-listing/product-listing.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"product-listing.d.ts","sourceRoot":"","sources":["../../../src/product-listing/product-listing.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAEtC,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAEhE,MAAM,MAAM,OAAO,GAAG;IACpB,KAAK,EAAE;QACL,OAAO,EAAE;YACP,KAAK,EAAE,MAAM,CAAC;YACd,KAAK,EAAE,MAAM,CAAC;YACd,KAAK,EAAE,MAAM,CAAC;SACf,EAAE,CAAC;KACL,CAAC;CACH,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAC1B,MAAM,EAAE,MAAM,EAAE,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,IAAI,GAAG;IACjB,EAAE,EAAE,MAAM,CAAC;IACX,SAAS,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,WAAW,EAAE,aAAa,CAAC,gBAAgB,CAAC,CAAC;IAC7C,QAAQ,EAAE;QACR,EAAE,EAAE,MAAM,CAAC;QACX,KAAK,EAAE,MAAM,CAAC;KACf,EAAE,CAAC;IACJ,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,OAAO,CAAC;IACjB,aAAa,EAAE,aAAa,CAAC;IAC7B,IAAI,EAAE;QACJ,EAAE,EAAE,MAAM,CAAC;QACX,SAAS,EAAE,MAAM,CAAC;KACnB,CAAC;IACF,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,EAAE,CAAC,OAAO,EAAE,aAAa,KAAK,IAAI,CAAC;IACjD,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;CACpC,CAAC;AAEF,wBAAgB,cAAc,CAAC,EAC7B,WAAW,EAAE,WAAW,EACxB,QAAQ,EACR,OAAO,EACP,SAAiB,EACjB,aAAa,EACb,cAAc,EACd,YAAY,GACb,EAAE,mBAAmB,2CAsCrB"}

package/dist/dts/product-listing/search-params.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"search-params.d.ts","sourceRoot":"","sources":["../../../src/product-listing/search-params.ts"],"names":[],"mappings":"AAAA,wBAAgB,kBAAkB,CAAC,KAAK,EAAE;IACxC,IAAI,EAAE;QACJ,EAAE,EAAE,MAAM,CAAC;QACX,SAAS,EAAE,MAAM,CAAC;KACnB,CAAC;IACF,OAAO,EAAE;QACP,MAAM,EAAE,MAAM,EAAE,CAAC;KAClB,CAAC;CACH,mBAWA;AAED,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,eAAe;;;;;;;;EAQxD"}

package/dist/product-card.js

@@ -1,7 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-
-function ProductCard({ product }) {
-    return (jsx("div", { children: jsxs("h1", { children: [product.title, " 2"] }) }));
-}
-
-export { ProductCard };

package/dist/product-listing.css

@@ -1,63 +0,0 @@
-.checkbox-module-FLuy1 {
-  --selected-color: var(--brand-color-red);
-  --selected-color-pressed: var(--brand-color-dark-red);
-  --checkmark-color: var(--white);
-
-  display: flex;
-  align-items: center;
-  gap: 0.571rem;
-  font-size: var(--font-size-24);
-  line-height: 14px;
-  color: var(--brand-color-black);
-  forced-color-adjust: none;
-}
-
-  .checkbox-module-FLuy1 .checkbox-module-v6JLF {
-    width: 16px;
-    height: 16px;
-    border: 2px solid var(--brand-color-medium-gray);
-    border-radius: var(--border-radius-1);
-    transition: all 200ms;
-    display: flex;
-    align-items: center;
-    justify-content: center;    
-  }
-
-  .checkbox-module-FLuy1 svg {
-    width: 1rem;
-    height: 1rem;
-    fill: none;
-    stroke: var(--checkmark-color);
-    stroke-width: 3px;
-    stroke-dasharray: 22px;
-    stroke-dashoffset: 66;
-    transition: all 200ms;
-  }
-
-  .checkbox-module-FLuy1[data-pressed] .checkbox-module-v6JLF {
-    border-color: var(--brand-color-dark-gray);
-  }
-
-  .checkbox-module-FLuy1[data-focus-visible] .checkbox-module-v6JLF {
-    outline: 2px solid var(--focus-ring-color);
-    outline-offset: 2px;
-  }
-
-  .checkbox-module-FLuy1[data-selected] .checkbox-module-v6JLF, .checkbox-module-FLuy1[data-indeterminate] .checkbox-module-v6JLF {
-      border-color: var(--selected-color);
-      background: var(--selected-color);
-    }
-
-  .checkbox-module-FLuy1[data-selected][data-pressed] .checkbox-module-v6JLF, .checkbox-module-FLuy1[data-indeterminate][data-pressed] .checkbox-module-v6JLF {
-      border-color: var(--selected-color-pressed);
-      background: var(--selected-color-pressed);
-    }
-
-  .checkbox-module-FLuy1[data-selected] svg, .checkbox-module-FLuy1[data-indeterminate] svg {
-      stroke-dashoffset: 44;
-    }
-
-  .checkbox-module-FLuy1[data-indeterminate] svg {
-      stroke: none;
-      fill: var(--checkmark-color);
-    }

package/dist/product-listing.js

@@ -1,25 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { Checkbox as Checkbox$1 } from 'react-aria-components';
-
-var styles = {"checkbox":"checkbox-module-FLuy1","box":"checkbox-module-v6JLF"};
-
-function Checkbox({ children, ...props }) {
-    return (jsxs(Checkbox$1, { ...props, className: styles.checkbox, children: [jsx("div", { className: styles.box, children: jsx("svg", { viewBox: "0 0 18 18", "aria-hidden": "true", children: jsx("polyline", { points: "1 9 7 14 15 4" }) }) }), children] }));
-}
-
-function Filter({ title, children, isCollapseable = true, initialIsCollapsed = false, }) {
-    return (jsxs("div", { children: [jsx("div", { children: jsx("h3", { children: title }) }), jsx("div", { children: children })] }));
-}
-
-function ColorFilter({ options, value, onChange }) {
-    return (jsx(Filter, { title: "Color", children: jsx("ul", { children: options.map((option) => (jsx("li", { children: jsx(Checkbox, { onChange: (isSelected) => onChange(isSelected
-                        ? [...value, option.value]
-                        : value.filter((v) => v !== option.value)), value: option.value, isSelected: value.includes(option.value), children: option.label }) }, option.value))) }) }));
-}
-
-function ProductListing({ productCard: ProductCard, products, filters, isLoading = false, activeFilters, onFilterChange, onSortChange, }) {
-    return (jsxs("div", { children: [jsx("h1", { children: "Product listing" }), jsxs("aside", { children: [jsx("h2", { children: "Filter" }), jsx("div", { children: jsx(ColorFilter, { options: filters.color.options, value: activeFilters.colors, onChange: (colors) => onFilterChange({ colors }) }) })] }), jsx("main", { children: jsxs("select", { onChange: (e) => onSortChange({ by: e.target.value, direction: "asc" }), children: [jsx("option", { value: "", children: "Sort By" }) // translations
-                        , " // translations", jsx("option", { value: "price", children: "Price" }), jsx("option", { value: "title", children: "Title" })] }) }), isLoading ? (jsx("p", { children: "Loading..." })) : (jsx("ul", { children: products.map((product) => (jsx("li", { children: jsx(ProductCard, { product: product }) }, product.id))) }))] }));
-}
-
-export { ProductListing };

package/dist/search-params.ts

@@ -1,20 +0,0 @@
-function createSearchParams(state) {
-    const params = new URLSearchParams();
-    if (state.filters.colors.length > 0) {
-        params.set("colors", state.filters.colors.join(","));
-    }
-    params.set("sortBy", state.sort.by);
-    params.set("sortDirection", state.sort.direction);
-    return params;
-}
-function parseSearchParams(params) {
-    return {
-        filters: { colors: params.get("colors")?.split(",") ?? [] },
-        sort: {
-            by: params.get("sortBy") ?? "relevance",
-            direction: params.get("sortDirection") ?? "asc",
-        },
-    };
-}
-
-export { createSearchParams, parseSearchParams };