@licklist/design 0.44.485-dev.59 → 0.44.485-dev.6

package/src/typeahead/Typeahead.tsx

@@ -1,54 +1,47 @@
 import React from "react";
 import Select from "react-select";
-import { Controller, useFormContext } from "react-hook-form";
+import { useForm, Controller } from "react-hook-form";
 
 export type TypeaheadOptions = {
-  id: number | string;
-  value: any;
+  id: number;
+  value: string;
   label: string;
 };
 
 export interface TypeaheadProps {
   options: TypeaheadOptions[];
+  setValue: (value: string | any) => void;
   placeholder: string;
   isRequired?: boolean;
   name: string;
-  isMultipleChoise?: boolean;
   noOptionsMessage: string;
-  isInvalid?: boolean;
 }
 
 function Typeahead({
   options,
+  setValue,
   placeholder,
   isRequired = false,
-  isMultipleChoise,
   name = "",
   noOptionsMessage = "",
-  isInvalid,
-}: TypeaheadProps) {
-  const { control } = useFormContext();
-
-  const getErrorStyle = () => (isInvalid ? { borderColor: "red" } : {});
+}) {
+  const { control } = useForm({
+    mode: "onChange",
+  });
+  const prefix = "id";
 
   return (
     <>
       <Controller
-        name={name}
+        name={`${name}.${prefix as string}` as const}
         control={control}
         rules={{ required: isRequired }}
         render={({ field }) => (
           <Select
             placeholder={placeholder}
             value={field.value}
-            isMulti={isMultipleChoise}
-            styles={{
-              control: (base) => ({
-                ...base,
-                ...getErrorStyle(),
-              }),
-            }}
             onChange={(value) => {
+              setValue(`${name}.${prefix}`, value.id);
               field.onChange(value);
             }}
             options={options}

package/src/types/iframe.ts

@@ -6,10 +6,8 @@ export interface Product {
   description: string;
   deposit: number;
   price: number;
-  minSub?: number;
   minAmount?: number;
   maxAmount?: number;
-  minSpend?: number | null;
   isSoldOut?: boolean;
   isRequired?: boolean;
   isUnlimited?: boolean;

package/tests/Snippets/Snippets.test.tsx

@@ -35,7 +35,7 @@ describe("Snippets", () => {
       <SnippetForm
         isLoading={false}
         onSubmit={() => {}}
-        templates={[{ id: "1", name: "test", colors: [], type: "event_list" }]}
+        templates={[{ id: "1", name: "test", colors: [], type: "event" }]}
       />
     );
 
@@ -57,12 +57,12 @@ describe("Snippets", () => {
       <SnippetForm
         isLoading={false}
         onSubmit={() => {}}
-        templates={[{ id: "1", name: "test", colors: [], type: "event_list" }]}
+        templates={[{ id: "1", name: "test", colors: [], type: "event" }]}
         defaultValues={{
           name: "",
-          type: "event_list",
-          designId: "",
-          widgetSetting: {
+          type: "event",
+          templateId: "",
+          snippetSetting: {
             displayDescription: false,
             displayCost: true,
             displayType: true,

package/dist/events/event-venue-map/components/MapPoint/components/ProductTooltip/ProductTooltip.d.ts

@@ -1,9 +0,0 @@
-/// <reference types="react" />
-type ProductTooltipProps = {
-    x: number;
-    y: number;
-    text: string;
-};
-export declare const ProductTooltip: ({ x, y, text }: ProductTooltipProps) => JSX.Element;
-export {};
-//# sourceMappingURL=ProductTooltip.d.ts.map

package/dist/events/event-venue-map/components/MapPoint/components/ProductTooltip/ProductTooltip.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ProductTooltip.d.ts","sourceRoot":"","sources":["../../../../../../src/events/event-venue-map/components/MapPoint/components/ProductTooltip/ProductTooltip.tsx"],"names":[],"mappings":";AAkBA,KAAK,mBAAmB,GAAG;IACzB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,eAAO,MAAM,cAAc,mBAAoB,mBAAmB,gBA2CjE,CAAC"}

package/dist/events/event-venue-map/components/MapPoint/components/ProductTooltip/ProductTooltip.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),r=(e=t)&&"object"==typeof e&&"default"in e?e.default:e,i=require("react-konva"),l="#000";exports.ProductTooltip=function(e){var t=e.x,o=e.y,c=e.text;return r.createElement(i.Group,{width:60,height:20,x:t+30,y:o-1},r.createElement(i.Rect,{x:-5,y:5,sceneFunc:function(e){e.beginPath(),e.moveTo(0,5),e.lineTo(5,0),e.lineTo(5,10),e.closePath(),e.fill()},fill:l,borderColor:l,opacity:.8}),r.createElement(i.Rect,{x:0,y:0,width:60,height:20,fill:l,cornerRadius:5,opacity:.8}),r.createElement(i.Text,{y:4,text:c,strokeWidth:5,width:60,align:"center",verticalAlign:"middle",fill:"#FFF"}))};

package/dist/events/event-venue-map/components/MapPoint/components/ProductTooltip/index.d.ts

@@ -1,2 +0,0 @@
-export { ProductTooltip } from "./ProductTooltip";
-//# sourceMappingURL=index.d.ts.map

package/dist/events/event-venue-map/components/MapPoint/components/ProductTooltip/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/events/event-venue-map/components/MapPoint/components/ProductTooltip/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC"}

package/dist/notification/hooks/useTranslatedParameters.d.ts

@@ -1,7 +0,0 @@
-type UseTranslatedParametersProps = {
-    isDefault: boolean;
-    isActive: boolean;
-};
-export declare const useTranslatedParameters: ({ isActive, isDefault, }: UseTranslatedParametersProps) => string;
-export {};
-//# sourceMappingURL=useTranslatedParameters.d.ts.map

package/dist/notification/hooks/useTranslatedParameters.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useTranslatedParameters.d.ts","sourceRoot":"","sources":["../../../src/notification/hooks/useTranslatedParameters.ts"],"names":[],"mappings":"AAEA,KAAK,4BAA4B,GAAG;IAClC,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,eAAO,MAAM,uBAAuB,6BAGjC,4BAA4B,WAgB9B,CAAC"}

package/dist/notification/hooks/useTranslatedParameters.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react-i18next");exports.useTranslatedParameters=function(t){var s,r=t.isActive,i=t.isDefault,a=e.useTranslation(["Design"]).t;return s=[],i&&s.push(a("Design:default")),r&&s.push(a("Design:active")),s.join(", ")};

package/dist/product-set/hooks/useSortableTreeFunctions.d.ts

@@ -1,11 +0,0 @@
-interface useSortableTreeFunctionsProps {
-    fieldName: string;
-    remove: (index?: number | number[]) => void;
-}
-export declare const useSortableTreeFunctions: ({ fieldName, remove, }: useSortableTreeFunctionsProps) => {
-    edit: (index: number) => void;
-    cancelChanges: (index: number) => void;
-    saveValidField: () => void;
-};
-export {};
-//# sourceMappingURL=useSortableTreeFunctions.d.ts.map

package/dist/product-set/hooks/useSortableTreeFunctions.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useSortableTreeFunctions.d.ts","sourceRoot":"","sources":["../../../src/product-set/hooks/useSortableTreeFunctions.ts"],"names":[],"mappings":"AAGA,UAAU,6BAA6B;IACrC,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,CAAC,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,KAAK,IAAI,CAAC;CAC7C;AACD,eAAO,MAAM,wBAAwB,2BAGlC,6BAA6B;kBAIT,MAAM;2BAMG,MAAM;;CAgBrC,CAAC"}

package/dist/product-set/hooks/useSortableTreeFunctions.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("tslib"),r=require("react"),n=((e=r)&&"object"==typeof e&&"default"in e&&e.default,require("react-hook-form"));exports.useSortableTreeFunctions=function(e){var u=e.fieldName,o=e.remove,a=n.useFormContext(),c=a.getValues,l=a.setValue,i=t.__read(r.useState(null),2),s=i[0],d=i[1];return{edit:function(e){var t=c("".concat(u,".").concat(e)),r=structuredClone(t);d(r)},cancelChanges:function(e){return s?l("".concat(u,".").concat(e),s):o(e)},saveValidField:function(){d(null)}}};

package/dist/provider/constants.d.ts

@@ -1,2 +0,0 @@
-export declare const MAX_DESCRIPTION_CHARACTERS_LENGTH = 25256;
-//# sourceMappingURL=constants.d.ts.map

package/dist/provider/constants.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../src/provider/constants.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,iCAAiC,QAAQ,CAAC"}

package/dist/provider/constants.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.MAX_DESCRIPTION_CHARACTERS_LENGTH=25256;

package/dist/striped-static-table/StripedStaticTable.d.ts

@@ -1,7 +0,0 @@
-/// <reference types="react" />
-import { StaticTableProps, StaticTableData } from "../table";
-export type StripedStaticTableProps = Omit<StaticTableProps, "data"> & {
-    data: StaticTableData[][];
-};
-export declare const StripedStaticTable: ({ columns, className, data, ...props }: StripedStaticTableProps) => JSX.Element;
-//# sourceMappingURL=StripedStaticTable.d.ts.map

package/dist/striped-static-table/StripedStaticTable.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"StripedStaticTable.d.ts","sourceRoot":"","sources":["../../src/striped-static-table/StripedStaticTable.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,gBAAgB,EAAe,eAAe,EAAE,MAAM,UAAU,CAAC;AAE1E,MAAM,MAAM,uBAAuB,GAAG,IAAI,CAAC,gBAAgB,EAAE,MAAM,CAAC,GAAG;IACrE,IAAI,EAAE,eAAe,EAAE,EAAE,CAAC;CAC3B,CAAC;AAEF,eAAO,MAAM,kBAAkB,2CAK5B,uBAAuB,gBAiDzB,CAAC"}

package/dist/striped-static-table/StripedStaticTable.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("tslib"),a=require("react"),r=(e=a)&&"object"==typeof e&&"default"in e?e.default:e;require("../table/MenuButton.js"),require("../table/FilterHelperComponent.js"),require("../table/PaginationHelperComponent.js"),require("../table/PerPageHelperComponent.js");var l=require("../table/StaticTable.js");require("../table/TableHelperComponent.js"),require("../table/ReactTableHelperComponent.js");exports.StripedStaticTable=function(e){var a=e.columns,n=e.className,s=void 0===n?"":n,i=e.data,o=t.__rest(e,["columns","className","data"]),c=i.map((function(e){return e.map((function(e,a,l){var n=l.length;return Object.fromEntries(Object.entries(e).map((function(e){var l=t.__read(e,2),s=l[0],i=l[1];return"key"===s?[s,i]:0===a?[s,r.createElement("div",{key:s,className:"bold header-row"},i)]:a===n-1?[s,r.createElement("div",{key:s,className:"bold"},i)]:[s,i]})))}))})).flat();return r.createElement(l.StaticTable,t.__assign({columns:a,data:c,className:"striped-static-table ".concat(s),displayHeader:!1},o))};

package/dist/striped-static-table/index.d.ts

@@ -1,2 +0,0 @@
-export * from "./StripedStaticTable";
-//# sourceMappingURL=index.d.ts.map

package/dist/striped-static-table/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/striped-static-table/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC"}

package/dist/styles/striped-static-table/_index.scss

@@ -1,33 +0,0 @@
-table.striped-static-table {
-  tbody {
-    tr {
-      border-bottom: 1px solid $gray-500;
-      td {
-        text-transform: capitalize;
-
-        &:nth-child(2),
-        &:nth-child(3) {
-          text-align: right;
-        }
-        &:nth-child(2) {
-          width: 20%;
-        }
-        &:nth-child(3) {
-          width: 35%;
-        }
-      }
-
-      td:has(div.header-row) {
-        background-color: #d8ecf7;
-      }
-
-      &:first-child {
-        border-top: 1px solid $gray-500;
-      }
-    }
-  }
-
-  .bold {
-    font-weight: 600;
-  }
-}

package/src/events/event-venue-map/components/MapPoint/components/ProductTooltip/ProductTooltip.tsx

@@ -1,68 +0,0 @@
-import React from "react";
-import { Group, Rect, Text } from "react-konva";
-
-const TOOLTIP_WIDTH = 60;
-const TOOLTIP_HEIGHT = 20;
-
-const BACKGROUND_COLOR = "#000";
-const BACKGROUND_Y_OFFSET = 1;
-const BACKGROUND_X_OFFSET = 30;
-const BACKGROUND_RADIUS = 5;
-const BACKGROUND_OPACITY = 0.8;
-
-const TEXT_Y_OFFSET = 4;
-const TEXT_STROKE_WIDTH = 5;
-const TEXT_COLOR = "#FFF";
-const TEXT_ALIGN = "center";
-const TEXT_VERTICAL_ALIGN = "middle";
-
-type ProductTooltipProps = {
-  x: number;
-  y: number;
-  text: string;
-};
-
-export const ProductTooltip = ({ x, y, text }: ProductTooltipProps) => {
-  return (
-    <Group
-      width={TOOLTIP_WIDTH}
-      height={TOOLTIP_HEIGHT}
-      x={x + BACKGROUND_X_OFFSET}
-      y={y - BACKGROUND_Y_OFFSET}
-    >
-      <Rect
-        x={-5}
-        y={5}
-        sceneFunc={(context) => {
-          context.beginPath();
-          context.moveTo(0, 5);
-          context.lineTo(5, 0);
-          context.lineTo(5, 10);
-          context.closePath();
-          context.fill();
-        }}
-        fill={BACKGROUND_COLOR}
-        borderColor={BACKGROUND_COLOR}
-        opacity={BACKGROUND_OPACITY}
-      />
-      <Rect
-        x={0}
-        y={0}
-        width={TOOLTIP_WIDTH}
-        height={TOOLTIP_HEIGHT}
-        fill={BACKGROUND_COLOR}
-        cornerRadius={BACKGROUND_RADIUS}
-        opacity={BACKGROUND_OPACITY}
-      />
-      <Text
-        y={TEXT_Y_OFFSET}
-        text={text}
-        strokeWidth={TEXT_STROKE_WIDTH}
-        width={TOOLTIP_WIDTH}
-        align={TEXT_ALIGN}
-        verticalAlign={TEXT_VERTICAL_ALIGN}
-        fill={TEXT_COLOR}
-      />
-    </Group>
-  );
-};

package/src/events/event-venue-map/components/MapPoint/components/ProductTooltip/index.ts

@@ -1 +0,0 @@
-export { ProductTooltip } from "./ProductTooltip";

package/src/notification/hooks/useTranslatedParameters.ts

@@ -1,27 +0,0 @@
-import { useTranslation } from "react-i18next";
-
-type UseTranslatedParametersProps = {
-  isDefault: boolean;
-  isActive: boolean;
-};
-
-export const useTranslatedParameters = ({
-  isActive,
-  isDefault,
-}: UseTranslatedParametersProps) => {
-  const { t } = useTranslation(["Design"]);
-
-  const translatedParameters = () => {
-    const texts: string[] = [];
-    if (isDefault) {
-      texts.push(t("Design:default"));
-    }
-    if (isActive) {
-      texts.push(t("Design:active"));
-    }
-
-    return texts.join(", ");
-  };
-
-  return translatedParameters();
-};

package/src/product-set/hooks/useSortableTreeFunctions.ts

@@ -1,37 +0,0 @@
-import { useState } from "react";
-import { useFormContext } from "react-hook-form";
-
-interface useSortableTreeFunctionsProps {
-  fieldName: string;
-  remove: (index?: number | number[]) => void;
-}
-export const useSortableTreeFunctions = ({
-  fieldName,
-  remove,
-}: useSortableTreeFunctionsProps) => {
-  const { getValues, setValue } = useFormContext();
-  const [previousValue, setEditValue] = useState(null);
-
-  const edit = (index: number) => {
-    const currentCategoryProduct = getValues(`${fieldName}.${index}` as const);
-    const cloneCategoryProduct = structuredClone(currentCategoryProduct);
-    setEditValue(cloneCategoryProduct);
-  };
-
-  const cancelChanges = (index: number) => {
-    if (!previousValue) {
-      return remove(index);
-    }
-    return setValue(`${fieldName}.${index}` as const, previousValue);
-  };
-
-  const saveValidField = () => {
-    setEditValue(null);
-  };
-
-  return {
-    edit,
-    cancelChanges,
-    saveValidField,
-  };
-};

package/src/provider/constants.ts

@@ -1 +0,0 @@
-export const MAX_DESCRIPTION_CHARACTERS_LENGTH = 25256;

package/src/striped-static-table/StripedStaticTable.stories.tsx

@@ -1,71 +0,0 @@
-import React from "react";
-import { Meta, Story } from "@storybook/react";
-import {
-  StripedStaticTable,
-  StripedStaticTableProps,
-} from "./StripedStaticTable";
-
-export default {
-  title: "StripedStaticTable",
-  component: StripedStaticTable,
-} as Meta;
-
-export const Default: Story<StripedStaticTableProps> = (args) => {
-  return <StripedStaticTable {...args} />;
-};
-
-Default.args = {
-  columns: [
-    { key: "name", label: "" },
-    { key: "quantity", label: "" },
-    { key: "total", label: "" },
-  ],
-  data: [
-    [
-      {
-        key: 1,
-        name: "test category",
-        quantity: "Qty",
-        total: "Total",
-      },
-      {
-        key: 2,
-        name: "product",
-        quantity: "2/16",
-        total: "160",
-      },
-      {
-        key: 4,
-        name: "total per category",
-        quantity: "2/16",
-        total: "160",
-      },
-    ],
-    [
-      {
-        key: 1,
-        name: "test category",
-        quantity: "Qty",
-        total: "Total",
-      },
-      {
-        key: 2,
-        name: "product",
-        quantity: "2/16",
-        total: "160",
-      },
-      {
-        key: 5,
-        name: "product",
-        quantity: "2/16",
-        total: "160",
-      },
-      {
-        key: 4,
-        name: "total per category",
-        quantity: "2/16",
-        total: "160",
-      },
-    ],
-  ],
-};

package/src/striped-static-table/StripedStaticTable.tsx

@@ -1,63 +0,0 @@
-import React from "react";
-
-import { StaticTableProps, StaticTable, StaticTableData } from "../table";
-
-export type StripedStaticTableProps = Omit<StaticTableProps, "data"> & {
-  data: StaticTableData[][];
-};
-
-export const StripedStaticTable = ({
-  columns,
-  className = "",
-  data,
-  ...props
-}: StripedStaticTableProps) => {
-  const styledData = data
-    .map(
-      (section) =>
-        section.map((row, rowIndex, array) => {
-          const { length } = array;
-
-          return Object.fromEntries(
-            Object.entries(row).map(([key, value]) => {
-              if (key === "key") {
-                return [key, value];
-              }
-
-              // make first row blue and bold
-              if (rowIndex === 0) {
-                return [
-                  key,
-                  <div key={key} className="bold header-row">
-                    {value}
-                  </div>,
-                ];
-              }
-
-              // make last row bold
-              if (rowIndex === length - 1) {
-                return [
-                  key,
-                  <div key={key} className="bold">
-                    {value}
-                  </div>,
-                ];
-              }
-
-              return [key, value];
-            })
-          );
-        }) as StaticTableData[]
-    )
-    .flat();
-
-  return (
-    <StaticTable
-      columns={columns}
-      data={styledData}
-      className={`striped-static-table ${className}`}
-      displayHeader={false}
-      {...props}
-    />
-  );
-};

package/src/striped-static-table/index.ts

@@ -1 +0,0 @@
-export * from "./StripedStaticTable";

package/src/styles/striped-static-table/_index.scss

@@ -1,33 +0,0 @@
-table.striped-static-table {
-  tbody {
-    tr {
-      border-bottom: 1px solid $gray-500;
-      td {
-        text-transform: capitalize;
-
-        &:nth-child(2),
-        &:nth-child(3) {
-          text-align: right;
-        }
-        &:nth-child(2) {
-          width: 20%;
-        }
-        &:nth-child(3) {
-          width: 35%;
-        }
-      }
-
-      td:has(div.header-row) {
-        background-color: #d8ecf7;
-      }
-
-      &:first-child {
-        border-top: 1px solid $gray-500;
-      }
-    }
-  }
-
-  .bold {
-    font-weight: 600;
-  }
-}