@wix/auto-patterns 1.8.0 → 1.10.0

package/dist/cjs/utils/media/getImageUrl.js

@@ -5,6 +5,9 @@ exports.getImageUrl = void 0;
 exports.isAbsoluteUrl = isAbsoluteUrl;
 var _sdk = require("@wix/sdk");
 const getImageUrl = image => {
+  if (!image) {
+    return undefined;
+  }
   if (isAbsoluteUrl(image)) {
     return image;
   }

package/dist/cjs/utils/media/getImageUrl.js.map

@@ -1 +1 @@
-{"version":3,"names":["_sdk","require","getImageUrl","image","isAbsoluteUrl","media","url","exports","parsed","URL","protocol","host"],"sources":["../../../../src/utils/media/getImageUrl.ts"],"sourcesContent":["import { media } from '@wix/sdk';\n\nexport const getImageUrl = (image: string) => {\n  if (isAbsoluteUrl(image)) {\n    return image;\n  }\n\n  return media.getImageUrl(image).url;\n};\n\nexport function isAbsoluteUrl(url: string): boolean {\n  try {\n    const parsed = new URL(url);\n    return !!parsed.protocol && !!parsed.host;\n  } catch {\n    return false;\n  }\n}\n"],"mappings":";;;;;AAAA,IAAAA,IAAA,GAAAC,OAAA;AAEO,MAAMC,WAAW,GAAIC,KAAa,IAAK;EAC5C,IAAIC,aAAa,CAACD,KAAK,CAAC,EAAE;IACxB,OAAOA,KAAK;EACd;EAEA,OAAOE,UAAK,CAACH,WAAW,CAACC,KAAK,CAAC,CAACG,GAAG;AACrC,CAAC;AAACC,OAAA,CAAAL,WAAA,GAAAA,WAAA;AAEK,SAASE,aAAaA,CAACE,GAAW,EAAW;EAClD,IAAI;IACF,MAAME,MAAM,GAAG,IAAIC,GAAG,CAACH,GAAG,CAAC;IAC3B,OAAO,CAAC,CAACE,MAAM,CAACE,QAAQ,IAAI,CAAC,CAACF,MAAM,CAACG,IAAI;EAC3C,CAAC,CAAC,MAAM;IACN,OAAO,KAAK;EACd;AACF","ignoreList":[]}
+{"version":3,"names":["_sdk","require","getImageUrl","image","undefined","isAbsoluteUrl","media","url","exports","parsed","URL","protocol","host"],"sources":["../../../../src/utils/media/getImageUrl.ts"],"sourcesContent":["import { media } from '@wix/sdk';\n\nexport const getImageUrl = (image: string | undefined | null) => {\n  if (!image) {\n    return undefined;\n  }\n\n  if (isAbsoluteUrl(image)) {\n    return image;\n  }\n\n  return media.getImageUrl(image).url;\n};\n\nexport function isAbsoluteUrl(url: string): boolean {\n  try {\n    const parsed = new URL(url);\n    return !!parsed.protocol && !!parsed.host;\n  } catch {\n    return false;\n  }\n}\n"],"mappings":";;;;;AAAA,IAAAA,IAAA,GAAAC,OAAA;AAEO,MAAMC,WAAW,GAAIC,KAAgC,IAAK;EAC/D,IAAI,CAACA,KAAK,EAAE;IACV,OAAOC,SAAS;EAClB;EAEA,IAAIC,aAAa,CAACF,KAAK,CAAC,EAAE;IACxB,OAAOA,KAAK;EACd;EAEA,OAAOG,UAAK,CAACJ,WAAW,CAACC,KAAK,CAAC,CAACI,GAAG;AACrC,CAAC;AAACC,OAAA,CAAAN,WAAA,GAAAA,WAAA;AAEK,SAASG,aAAaA,CAACE,GAAW,EAAW;EAClD,IAAI;IACF,MAAME,MAAM,GAAG,IAAIC,GAAG,CAACH,GAAG,CAAC;IAC3B,OAAO,CAAC,CAACE,MAAM,CAACE,QAAQ,IAAI,CAAC,CAACF,MAAM,CAACG,IAAI;EAC3C,CAAC,CAAC,MAAM;IACN,OAAO,KAAK;EACd;AACF","ignoreList":[]}

package/dist/esm/components/AutoPatternsApp/AutoPatternsApp.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","RootAppProvider","AutoPatternsRoutes","AutoPatternsApp","_ref","configuration","createElement","appConfig","config"],"sources":["../../../../src/components/AutoPatternsApp/AutoPatternsApp.tsx"],"sourcesContent":["import React from 'react';\nimport { AppConfig } from '../../types';\nimport { RootAppProvider } from '../../providers/RootAppProvider';\nimport { AutoPatternsRoutes } from '../AutoPatternsRoute/AutoPatternsRoutes';\n\nexport interface AutoPatternsAppPageProps {\n  configuration: AppConfig;\n}\n\nexport const AutoPatternsApp: React.FC<AutoPatternsAppPageProps> = ({\n  configuration,\n}) => {\n  return (\n    <RootAppProvider appConfig={configuration}>\n      <AutoPatternsRoutes config={configuration} />\n    </RootAppProvider>\n  );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,eAAe,QAAQ,iCAAiC;AACjE,SAASC,kBAAkB,QAAQ,yCAAyC;AAM5E,OAAO,MAAMC,eAAmD,GAAGC,IAAA,IAE7D;EAAA,IAF8D;IAClEC;EACF,CAAC,GAAAD,IAAA;EACC,oBACEJ,KAAA,CAAAM,aAAA,CAACL,eAAe;IAACM,SAAS,EAAEF;EAAc,gBACxCL,KAAA,CAAAM,aAAA,CAACJ,kBAAkB;IAACM,MAAM,EAAEH;EAAc,CAAE,CAC7B,CAAC;AAEtB,CAAC","ignoreList":[]}
+{"version":3,"names":["React","RootAppProvider","AutoPatternsRoutes","AutoPatternsApp","_ref","configuration","createElement","appConfig","config"],"sources":["../../../../src/components/AutoPatternsApp/AutoPatternsApp.tsx"],"sourcesContent":["import React from 'react';\nimport { AppConfig } from '../../types';\nimport { RootAppProvider } from '../../providers/RootAppProvider';\nimport { AutoPatternsRoutes } from '../AutoPatternsRoute/AutoPatternsRoutes';\n\nexport interface AutoPatternsAppProps {\n  configuration: AppConfig;\n}\n\nexport const AutoPatternsApp: React.FC<AutoPatternsAppProps> = ({\n  configuration,\n}) => {\n  return (\n    <RootAppProvider appConfig={configuration}>\n      <AutoPatternsRoutes config={configuration} />\n    </RootAppProvider>\n  );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,eAAe,QAAQ,iCAAiC;AACjE,SAASC,kBAAkB,QAAQ,yCAAyC;AAM5E,OAAO,MAAMC,eAA+C,GAAGC,IAAA,IAEzD;EAAA,IAF0D;IAC9DC;EACF,CAAC,GAAAD,IAAA;EACC,oBACEJ,KAAA,CAAAM,aAAA,CAACL,eAAe;IAACM,SAAS,EAAEF;EAAc,gBACxCL,KAAA,CAAAM,aAAA,CAACJ,kBAAkB;IAACM,MAAM,EAAEH;EAAc,CAAE,CAC7B,CAAC;AAEtB,CAAC","ignoreList":[]}

package/dist/esm/components/AutoPatternsCollectionPage/AutoPatternsCollectionPage.js

@@ -2,7 +2,7 @@ import React from 'react';
 import { CollectionPage } from '@wix/patterns/page';
 import { AutoPatternsCollectionPageContent } from '../AutoPatternsCollectionPageContent';
 import { usePatternsWizardOverridesContext } from '../../providers';
-import { PrimaryActions, SecondaryActions } from '@wix/patterns';
+import { useCollectionPageActions } from '../../hooks/useCollectionPageActions';
 export const AutoPatternsCollectionPage = _ref => {
   let {
     configuration
@@ -11,17 +11,18 @@ export const AutoPatternsCollectionPage = _ref => {
     title,
     subtitle
   } = configuration;
+  const actions = useCollectionPageActions({
+    collectionPageActions: configuration.actions
+  });
   const context = usePatternsWizardOverridesContext();
-  const primaryActionProps = context == null || context.usePagePrimaryAction == null ? void 0 : context.usePagePrimaryAction();
-  const secondaryActionProps = context == null || context.usePageSecondaryAction == null ? void 0 : context.usePageSecondaryAction();
   return /*#__PURE__*/React.createElement(CollectionPage, {
     height: "100vh",
     dataHook: "auto-patterns-page"
   }, /*#__PURE__*/React.createElement(CollectionPage.Header, {
     title: title,
     subtitle: subtitle,
-    primaryAction: primaryActionProps ? /*#__PURE__*/React.createElement(PrimaryActions, primaryActionProps) : undefined,
-    secondaryActions: secondaryActionProps ? /*#__PURE__*/React.createElement(SecondaryActions, secondaryActionProps) : undefined
+    primaryAction: actions.primaryActions,
+    secondaryActions: actions.secondaryActions
   }), /*#__PURE__*/React.createElement(CollectionPage.Content, null, context != null && context.HeaderAddon ? /*#__PURE__*/React.createElement(context.HeaderAddon, null) : null, /*#__PURE__*/React.createElement(AutoPatternsCollectionPageContent, {
     configuration: configuration
   })));

package/dist/esm/components/AutoPatternsCollectionPage/AutoPatternsCollectionPage.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","CollectionPage","AutoPatternsCollectionPageContent","usePatternsWizardOverridesContext","PrimaryActions","SecondaryActions","AutoPatternsCollectionPage","_ref","configuration","title","subtitle","context","primaryActionProps","usePagePrimaryAction","secondaryActionProps","usePageSecondaryAction","createElement","height","dataHook","Header","primaryAction","undefined","secondaryActions","Content","HeaderAddon"],"sources":["../../../../src/components/AutoPatternsCollectionPage/AutoPatternsCollectionPage.tsx"],"sourcesContent":["import React from 'react';\nimport { CollectionPage } from '@wix/patterns/page';\nimport { AutoPatternsCollectionPageContent } from '../AutoPatternsCollectionPageContent';\nimport { usePatternsWizardOverridesContext } from '../../providers';\nimport { PrimaryActions, SecondaryActions } from '@wix/patterns';\nimport { CollectionPageConfig } from '../../types/CollectionPageConfig';\n\nexport interface AutoPatternsCollectionPageProps {\n  configuration: CollectionPageConfig;\n}\n\nexport const AutoPatternsCollectionPage: React.FC<\n  AutoPatternsCollectionPageProps\n> = ({ configuration }) => {\n  const { title, subtitle } = configuration;\n  const context = usePatternsWizardOverridesContext();\n  const primaryActionProps = context?.usePagePrimaryAction?.();\n  const secondaryActionProps = context?.usePageSecondaryAction?.();\n\n  return (\n    <CollectionPage height=\"100vh\" dataHook=\"auto-patterns-page\">\n      <CollectionPage.Header\n        title={title}\n        subtitle={subtitle}\n        primaryAction={\n          primaryActionProps ? (\n            <PrimaryActions {...primaryActionProps} />\n          ) : undefined\n        }\n        secondaryActions={\n          secondaryActionProps ? (\n            <SecondaryActions {...secondaryActionProps} />\n          ) : undefined\n        }\n      />\n      <CollectionPage.Content>\n        {context?.HeaderAddon ? <context.HeaderAddon /> : null}\n        <AutoPatternsCollectionPageContent configuration={configuration} />\n      </CollectionPage.Content>\n    </CollectionPage>\n  );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,cAAc,QAAQ,oBAAoB;AACnD,SAASC,iCAAiC,QAAQ,sCAAsC;AACxF,SAASC,iCAAiC,QAAQ,iBAAiB;AACnE,SAASC,cAAc,EAAEC,gBAAgB,QAAQ,eAAe;AAOhE,OAAO,MAAMC,0BAEZ,GAAGC,IAAA,IAAuB;EAAA,IAAtB;IAAEC;EAAc,CAAC,GAAAD,IAAA;EACpB,MAAM;IAAEE,KAAK;IAAEC;EAAS,CAAC,GAAGF,aAAa;EACzC,MAAMG,OAAO,GAAGR,iCAAiC,CAAC,CAAC;EACnD,MAAMS,kBAAkB,GAAGD,OAAO,YAAPA,OAAO,CAAEE,oBAAoB,oBAA7BF,OAAO,CAAEE,oBAAoB,CAAG,CAAC;EAC5D,MAAMC,oBAAoB,GAAGH,OAAO,YAAPA,OAAO,CAAEI,sBAAsB,oBAA/BJ,OAAO,CAAEI,sBAAsB,CAAG,CAAC;EAEhE,oBACEf,KAAA,CAAAgB,aAAA,CAACf,cAAc;IAACgB,MAAM,EAAC,OAAO;IAACC,QAAQ,EAAC;EAAoB,gBAC1DlB,KAAA,CAAAgB,aAAA,CAACf,cAAc,CAACkB,MAAM;IACpBV,KAAK,EAAEA,KAAM;IACbC,QAAQ,EAAEA,QAAS;IACnBU,aAAa,EACXR,kBAAkB,gBAChBZ,KAAA,CAAAgB,aAAA,CAACZ,cAAc,EAAKQ,kBAAqB,CAAC,GACxCS,SACL;IACDC,gBAAgB,EACdR,oBAAoB,gBAClBd,KAAA,CAAAgB,aAAA,CAACX,gBAAgB,EAAKS,oBAAuB,CAAC,GAC5CO;EACL,CACF,CAAC,eACFrB,KAAA,CAAAgB,aAAA,CAACf,cAAc,CAACsB,OAAO,QACpBZ,OAAO,YAAPA,OAAO,CAAEa,WAAW,gBAAGxB,KAAA,CAAAgB,aAAA,CAACL,OAAO,CAACa,WAAW,MAAE,CAAC,GAAG,IAAI,eACtDxB,KAAA,CAAAgB,aAAA,CAACd,iCAAiC;IAACM,aAAa,EAAEA;EAAc,CAAE,CAC5C,CACV,CAAC;AAErB,CAAC","ignoreList":[]}
+{"version":3,"names":["React","CollectionPage","AutoPatternsCollectionPageContent","usePatternsWizardOverridesContext","useCollectionPageActions","AutoPatternsCollectionPage","_ref","configuration","title","subtitle","actions","collectionPageActions","context","createElement","height","dataHook","Header","primaryAction","primaryActions","secondaryActions","Content","HeaderAddon"],"sources":["../../../../src/components/AutoPatternsCollectionPage/AutoPatternsCollectionPage.tsx"],"sourcesContent":["import React from 'react';\nimport { CollectionPage } from '@wix/patterns/page';\nimport { AutoPatternsCollectionPageContent } from '../AutoPatternsCollectionPageContent';\nimport { usePatternsWizardOverridesContext } from '../../providers';\nimport { CollectionPageConfig } from '../../types/CollectionPageConfig';\nimport { useCollectionPageActions } from '../../hooks/useCollectionPageActions';\n\nexport interface AutoPatternsCollectionPageProps {\n  configuration: CollectionPageConfig;\n}\n\nexport const AutoPatternsCollectionPage: React.FC<\n  AutoPatternsCollectionPageProps\n> = ({ configuration }) => {\n  const { title, subtitle } = configuration;\n\n  const actions = useCollectionPageActions({\n    collectionPageActions: configuration.actions,\n  });\n\n  const context = usePatternsWizardOverridesContext();\n\n  return (\n    <CollectionPage height=\"100vh\" dataHook=\"auto-patterns-page\">\n      <CollectionPage.Header\n        title={title}\n        subtitle={subtitle}\n        primaryAction={actions.primaryActions}\n        secondaryActions={actions.secondaryActions}\n      />\n      <CollectionPage.Content>\n        {context?.HeaderAddon ? <context.HeaderAddon /> : null}\n        <AutoPatternsCollectionPageContent configuration={configuration} />\n      </CollectionPage.Content>\n    </CollectionPage>\n  );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,cAAc,QAAQ,oBAAoB;AACnD,SAASC,iCAAiC,QAAQ,sCAAsC;AACxF,SAASC,iCAAiC,QAAQ,iBAAiB;AAEnE,SAASC,wBAAwB,QAAQ,sCAAsC;AAM/E,OAAO,MAAMC,0BAEZ,GAAGC,IAAA,IAAuB;EAAA,IAAtB;IAAEC;EAAc,CAAC,GAAAD,IAAA;EACpB,MAAM;IAAEE,KAAK;IAAEC;EAAS,CAAC,GAAGF,aAAa;EAEzC,MAAMG,OAAO,GAAGN,wBAAwB,CAAC;IACvCO,qBAAqB,EAAEJ,aAAa,CAACG;EACvC,CAAC,CAAC;EAEF,MAAME,OAAO,GAAGT,iCAAiC,CAAC,CAAC;EAEnD,oBACEH,KAAA,CAAAa,aAAA,CAACZ,cAAc;IAACa,MAAM,EAAC,OAAO;IAACC,QAAQ,EAAC;EAAoB,gBAC1Df,KAAA,CAAAa,aAAA,CAACZ,cAAc,CAACe,MAAM;IACpBR,KAAK,EAAEA,KAAM;IACbC,QAAQ,EAAEA,QAAS;IACnBQ,aAAa,EAAEP,OAAO,CAACQ,cAAe;IACtCC,gBAAgB,EAAET,OAAO,CAACS;EAAiB,CAC5C,CAAC,eACFnB,KAAA,CAAAa,aAAA,CAACZ,cAAc,CAACmB,OAAO,QACpBR,OAAO,YAAPA,OAAO,CAAES,WAAW,gBAAGrB,KAAA,CAAAa,aAAA,CAACD,OAAO,CAACS,WAAW,MAAE,CAAC,GAAG,IAAI,eACtDrB,KAAA,CAAAa,aAAA,CAACX,iCAAiC;IAACK,aAAa,EAAEA;EAAc,CAAE,CAC5C,CACV,CAAC;AAErB,CAAC","ignoreList":[]}

package/dist/esm/components/AutoPatternsCollectionPageContent/AutoPatternsCollectionPageContent.js

@@ -1,6 +1,8 @@
 import React from 'react';
 import { AutoPatternsTable } from '../AutoPatternsTable';
 import { AutoPatternsGrid } from '../AutoPatternsGrid';
+import { AutoPatternsTableGridSwitch } from '../AutoPatternsTableGridSwitch/AutoPatternsTableGridSwitch';
+import { SchemaProvider } from '../../providers';
 export const AutoPatternsCollectionPageContent = _ref => {
   let {
     configuration
@@ -16,7 +18,6 @@ export const AutoPatternsCollectionPageContent = _ref => {
       case 'Table':
         if (component.table) {
           return /*#__PURE__*/React.createElement(AutoPatternsTable, {
-            key: component.table.collection.collectionId,
             configuration: component.table
           });
         }
@@ -24,14 +25,30 @@ export const AutoPatternsCollectionPageContent = _ref => {
       case 'Grid':
         if (component.grid) {
           return /*#__PURE__*/React.createElement(AutoPatternsGrid, {
-            key: component.grid.collection.collectionId,
             configuration: component.grid
           });
         }
         return null;
+      case 'TableGridSwitch':
+        if (component.tableGridSwitch) {
+          return /*#__PURE__*/React.createElement(AutoPatternsTableGridSwitch, {
+            configuration: component.tableGridSwitch
+          });
+        }
+        return null;
       default:
         return null;
     }
+  }).map(element => {
+    if (element == null) {
+      return null;
+    }
+    const configuration = element.props.configuration;
+    return /*#__PURE__*/React.createElement(SchemaProvider, {
+      key: configuration.collection.collectionId,
+      collectionId: configuration.collection.collectionId,
+      entityTypeSource: configuration.collection.entityTypeSource
+    }, element);
   }));
 };
 //# sourceMappingURL=AutoPatternsCollectionPageContent.js.map

package/dist/esm/components/AutoPatternsCollectionPageContent/AutoPatternsCollectionPageContent.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","AutoPatternsTable","AutoPatternsGrid","AutoPatternsCollectionPageContent","_ref","configuration","components","createElement","Fragment","map","component","type","table","key","collection","collectionId","grid"],"sources":["../../../../src/components/AutoPatternsCollectionPageContent/AutoPatternsCollectionPageContent.tsx"],"sourcesContent":["import React from 'react';\nimport { AutoPatternsTable } from '../AutoPatternsTable';\nimport { CollectionPageConfig } from '../../types';\nimport { AutoPatternsGrid } from '../AutoPatternsGrid';\n\nexport interface AutoPatternsCollectionPageContentProps {\n  configuration: CollectionPageConfig;\n}\n\nexport const AutoPatternsCollectionPageContent = ({\n  configuration,\n}: AutoPatternsCollectionPageContentProps) => {\n  const { components } = configuration;\n  return (\n    <>\n      {components.map((component) => {\n        const { type } = component;\n        switch (type) {\n          case 'Table':\n            if (component.table) {\n              return (\n                <AutoPatternsTable\n                  key={component.table.collection.collectionId}\n                  configuration={component.table}\n                />\n              );\n            }\n            return null;\n          case 'Grid':\n            if (component.grid) {\n              return (\n                <AutoPatternsGrid\n                  key={component.grid.collection.collectionId}\n                  configuration={component.grid}\n                />\n              );\n            }\n            return null;\n          default:\n            return null;\n        }\n      })}\n    </>\n  );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,iBAAiB,QAAQ,sBAAsB;AAExD,SAASC,gBAAgB,QAAQ,qBAAqB;AAMtD,OAAO,MAAMC,iCAAiC,GAAGC,IAAA,IAEH;EAAA,IAFI;IAChDC;EACsC,CAAC,GAAAD,IAAA;EACvC,MAAM;IAAEE;EAAW,CAAC,GAAGD,aAAa;EACpC,oBACEL,KAAA,CAAAO,aAAA,CAAAP,KAAA,CAAAQ,QAAA,QACGF,UAAU,CAACG,GAAG,CAAEC,SAAS,IAAK;IAC7B,MAAM;MAAEC;IAAK,CAAC,GAAGD,SAAS;IAC1B,QAAQC,IAAI;MACV,KAAK,OAAO;QACV,IAAID,SAAS,CAACE,KAAK,EAAE;UACnB,oBACEZ,KAAA,CAAAO,aAAA,CAACN,iBAAiB;YAChBY,GAAG,EAAEH,SAAS,CAACE,KAAK,CAACE,UAAU,CAACC,YAAa;YAC7CV,aAAa,EAAEK,SAAS,CAACE;UAAM,CAChC,CAAC;QAEN;QACA,OAAO,IAAI;MACb,KAAK,MAAM;QACT,IAAIF,SAAS,CAACM,IAAI,EAAE;UAClB,oBACEhB,KAAA,CAAAO,aAAA,CAACL,gBAAgB;YACfW,GAAG,EAAEH,SAAS,CAACM,IAAI,CAACF,UAAU,CAACC,YAAa;YAC5CV,aAAa,EAAEK,SAAS,CAACM;UAAK,CAC/B,CAAC;QAEN;QACA,OAAO,IAAI;MACb;QACE,OAAO,IAAI;IACf;EACF,CAAC,CACD,CAAC;AAEP,CAAC","ignoreList":[]}
+{"version":3,"names":["React","AutoPatternsTable","AutoPatternsGrid","AutoPatternsTableGridSwitch","SchemaProvider","AutoPatternsCollectionPageContent","_ref","configuration","components","createElement","Fragment","map","component","type","table","grid","tableGridSwitch","element","props","key","collection","collectionId","entityTypeSource"],"sources":["../../../../src/components/AutoPatternsCollectionPageContent/AutoPatternsCollectionPageContent.tsx"],"sourcesContent":["import React, { ReactElement } from 'react';\nimport { AutoPatternsTable } from '../AutoPatternsTable';\nimport {\n  BaseCollectionComponentConfig,\n  CollectionPageConfig,\n} from '../../types';\nimport { AutoPatternsGrid } from '../AutoPatternsGrid';\nimport { AutoPatternsTableGridSwitch } from '../AutoPatternsTableGridSwitch/AutoPatternsTableGridSwitch';\nimport { SchemaProvider } from '../../providers';\n\nexport interface AutoPatternsCollectionPageContentProps {\n  configuration: CollectionPageConfig;\n}\n\nexport const AutoPatternsCollectionPageContent = ({\n  configuration,\n}: AutoPatternsCollectionPageContentProps) => {\n  const { components } = configuration;\n  return (\n    <>\n      {components\n        .map(\n          (\n            component,\n          ): ReactElement<{\n            configuration: BaseCollectionComponentConfig;\n          }> | null => {\n            const { type } = component;\n            switch (type) {\n              case 'Table':\n                if (component.table) {\n                  return <AutoPatternsTable configuration={component.table} />;\n                }\n                return null;\n              case 'Grid':\n                if (component.grid) {\n                  return <AutoPatternsGrid configuration={component.grid} />;\n                }\n                return null;\n              case 'TableGridSwitch':\n                if (component.tableGridSwitch) {\n                  return (\n                    <AutoPatternsTableGridSwitch\n                      configuration={component.tableGridSwitch}\n                    />\n                  );\n                }\n                return null;\n              default:\n                return null;\n            }\n          },\n        )\n        .map((element) => {\n          if (element == null) {\n            return null;\n          }\n\n          const configuration = element.props.configuration;\n\n          return (\n            <SchemaProvider\n              key={configuration.collection.collectionId}\n              collectionId={configuration.collection.collectionId}\n              entityTypeSource={configuration.collection.entityTypeSource}\n            >\n              {element}\n            </SchemaProvider>\n          );\n        })}\n    </>\n  );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAwB,OAAO;AAC3C,SAASC,iBAAiB,QAAQ,sBAAsB;AAKxD,SAASC,gBAAgB,QAAQ,qBAAqB;AACtD,SAASC,2BAA2B,QAAQ,4DAA4D;AACxG,SAASC,cAAc,QAAQ,iBAAiB;AAMhD,OAAO,MAAMC,iCAAiC,GAAGC,IAAA,IAEH;EAAA,IAFI;IAChDC;EACsC,CAAC,GAAAD,IAAA;EACvC,MAAM;IAAEE;EAAW,CAAC,GAAGD,aAAa;EACpC,oBACEP,KAAA,CAAAS,aAAA,CAAAT,KAAA,CAAAU,QAAA,QACGF,UAAU,CACRG,GAAG,CAEAC,SAAS,IAGE;IACX,MAAM;MAAEC;IAAK,CAAC,GAAGD,SAAS;IAC1B,QAAQC,IAAI;MACV,KAAK,OAAO;QACV,IAAID,SAAS,CAACE,KAAK,EAAE;UACnB,oBAAOd,KAAA,CAAAS,aAAA,CAACR,iBAAiB;YAACM,aAAa,EAAEK,SAAS,CAACE;UAAM,CAAE,CAAC;QAC9D;QACA,OAAO,IAAI;MACb,KAAK,MAAM;QACT,IAAIF,SAAS,CAACG,IAAI,EAAE;UAClB,oBAAOf,KAAA,CAAAS,aAAA,CAACP,gBAAgB;YAACK,aAAa,EAAEK,SAAS,CAACG;UAAK,CAAE,CAAC;QAC5D;QACA,OAAO,IAAI;MACb,KAAK,iBAAiB;QACpB,IAAIH,SAAS,CAACI,eAAe,EAAE;UAC7B,oBACEhB,KAAA,CAAAS,aAAA,CAACN,2BAA2B;YAC1BI,aAAa,EAAEK,SAAS,CAACI;UAAgB,CAC1C,CAAC;QAEN;QACA,OAAO,IAAI;MACb;QACE,OAAO,IAAI;IACf;EACF,CACF,CAAC,CACAL,GAAG,CAAEM,OAAO,IAAK;IAChB,IAAIA,OAAO,IAAI,IAAI,EAAE;MACnB,OAAO,IAAI;IACb;IAEA,MAAMV,aAAa,GAAGU,OAAO,CAACC,KAAK,CAACX,aAAa;IAEjD,oBACEP,KAAA,CAAAS,aAAA,CAACL,cAAc;MACbe,GAAG,EAAEZ,aAAa,CAACa,UAAU,CAACC,YAAa;MAC3CA,YAAY,EAAEd,aAAa,CAACa,UAAU,CAACC,YAAa;MACpDC,gBAAgB,EAAEf,aAAa,CAACa,UAAU,CAACE;IAAiB,GAE3DL,OACa,CAAC;EAErB,CAAC,CACH,CAAC;AAEP,CAAC","ignoreList":[]}

package/dist/esm/components/AutoPatternsEntityPage/AutoPatternsEntityPage.js

@@ -5,7 +5,7 @@ import { Card, Cell, Layout } from '@wix/design-system';
 import { useParams } from 'react-router-dom';
 import { useSchema } from '../../providers/SchemaContext';
 import { FormFieldInput } from './Fields/FormFieldInput';
-import { useNavigation } from '../../hooks';
+import { useEntityPageHeaderTexts, useNavigation } from '../../hooks';
 import { usePatternsWizardOverridesContext } from '../../providers';
 const RenderLayoutContent = _ref => {
   var _content$container$ch, _overrides$components;
@@ -103,16 +103,17 @@ export const AutoPatternsEntityPage = _ref3 => {
     configuration
   } = _ref3;
   const {
-    title,
-    subtitle,
     layout: pageLayout,
     parentPageId,
     route
   } = configuration;
-  const form = useForm();
+  const form = useForm({
+    mode: 'onChange'
+  });
   const params = useParams();
   const entityId = params[route.params.id];
   const schema = useSchema();
+  const isCreateMode = !entityId;
   const inputRefs = useRef({});
   const setInputRef = (id, input) => {
     inputRefs.current[id] = input;
@@ -161,13 +162,19 @@ export const AutoPatternsEntityPage = _ref3 => {
     }
   });
   const entity = useEntity(state);
+  const {
+    title,
+    subtitle
+  } = useEntityPageHeaderTexts({
+    config: configuration,
+    isCreateMode,
+    entityDisplayName: entity == null ? void 0 : entity[schema.displayField]
+  });
   return /*#__PURE__*/React.createElement(EntityPage, {
     state: state,
     dataHook: "auto-patterns-entity-page"
   }, /*#__PURE__*/React.createElement(EntityPage.Header, {
-    title: title ?? {
-      text: (entity == null ? void 0 : entity[schema.displayField]) ?? 'Edit Entity'
-    },
+    title: title,
     subtitle: subtitle
   }), /*#__PURE__*/React.createElement(EntityPage.Content, null, /*#__PURE__*/React.createElement(EntityPage.MainContent, null, pageLayout == null || (_pageLayout$main = pageLayout.main) == null ? void 0 : _pageLayout$main.map((layout, layoutIndex) => /*#__PURE__*/React.createElement(RenderLayoutCard, {
     key: `main-section-card-${layoutIndex}`,

package/dist/esm/components/AutoPatternsEntityPage/AutoPatternsEntityPage.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useMemo","useRef","EntityPage","useEntity","useEntityPage","useEntityPageContext","useForm","Card","Cell","Layout","useParams","useSchema","FormFieldInput","useNavigation","usePatternsWizardOverridesContext","RenderLayoutContent","_ref","_content$container$ch","_overrides$components","content","level","sectionId","cardIndex","contentIndex","setInputRef","schema","overrides","pageState","type","field","fieldId","fields","createElement","span","key","inputRef","ref","container","children","length","map","child","index","component","componentId","Component","components","form","entity","RenderLayoutCard","_ref2","_layout$card$subtitle","layout","minHeight","Header","title","card","text","subtitle","Divider","Content","AutoPatternsEntityPage","_ref3","_pageLayout$main","_pageLayout$sidebar","configuration","pageLayout","parentPageId","route","params","entityId","id","inputRefs","input","current","validate","invalidFieldId","Object","keys","find","_inputRefs$current$fi","invalid","_inputRefs$current$in","focus","Error","getParentPagePath","parentPath","state","onSave","formValues","getValues","baseEntity","updatedEntity","newEntity","actions","update","create","fetch","undefined","get","dataHook","displayField","MainContent","main","layoutIndex","sidebar","AdditionalContent"],"sources":["../../../../src/components/AutoPatternsEntityPage/AutoPatternsEntityPage.tsx"],"sourcesContent":["import React, { useMemo, useRef } from 'react';\nimport { CardLayout, EntityPageConfig, LayoutContent } from '../../types';\nimport {\n  EntityPage,\n  EntityPageState,\n  useEntity,\n  useEntityPage,\n  useEntityPageContext,\n} from '@wix/patterns';\nimport { useForm } from '@wix/patterns/form';\nimport { Card, Cell, Layout } from '@wix/design-system';\nimport { useParams } from 'react-router-dom';\nimport { useSchema } from '../../providers/SchemaContext';\nimport { BaseInputRef } from './Fields/types';\nimport { FormFieldInput } from './Fields/FormFieldInput';\nimport { useNavigation } from '../../hooks';\nimport { usePatternsWizardOverridesContext } from '../../providers';\n\nconst RenderLayoutContent: React.FC<{\n  content: LayoutContent;\n  level: number;\n  sectionId: string;\n  cardIndex: number;\n  contentIndex: number;\n  setInputRef: (id: string, input: BaseInputRef) => void;\n}> = ({ content, level, sectionId, cardIndex, contentIndex, setInputRef }) => {\n  const schema = useSchema();\n  const overrides = usePatternsWizardOverridesContext();\n  const pageState = useEntityPageContext();\n\n  switch (content.type) {\n    case 'field':\n      if (!content.field.fieldId) {\n        return null;\n      }\n\n      const field = schema.fields[content.field.fieldId];\n\n      if (!field) {\n        return null;\n      }\n\n      return (\n        <Cell span={content.field.span}>\n          <FormFieldInput\n            key={content.field.fieldId}\n            field={field}\n            inputRef={(ref) => setInputRef(content.field.fieldId, ref)}\n          />\n        </Cell>\n      );\n\n    case 'container':\n      if (!content.container.children?.length) {\n        return null;\n      }\n\n      return (\n        <Cell span={content.container.span}>\n          <Layout>\n            {content.container.children.map((child, index) => (\n              <RenderLayoutContent\n                key={`${sectionId}-card-${cardIndex}-content-${contentIndex}-level-${level}-child-${index}`}\n                content={child}\n                level={level + 1}\n                sectionId={sectionId}\n                cardIndex={cardIndex}\n                contentIndex={index}\n                setInputRef={setInputRef}\n              />\n            ))}\n          </Layout>\n        </Cell>\n      );\n\n    case 'component':\n      if (!content.component.componentId) {\n        return null;\n      }\n\n      const Component = overrides?.components?.[content.component.componentId];\n\n      if (!Component) {\n        return null;\n      }\n\n      return (\n        <Cell span={content.component.span}>\n          <Component\n            form={pageState.form as any}\n            entity={pageState.entity as any as Record<string, any>}\n          />\n        </Cell>\n      );\n\n    default:\n      return null;\n  }\n};\n\nconst RenderLayoutCard: React.FC<{\n  layout: CardLayout;\n  sectionId: string;\n  cardIndex: number;\n  setInputRef: (id: string, input: BaseInputRef) => void;\n}> = ({ layout, sectionId, cardIndex, setInputRef }) => {\n  switch (layout.type) {\n    case 'card':\n      return (\n        <EntityPage.Card minHeight=\"50px\">\n          <Card.Header\n            title={layout.card.title.text}\n            subtitle={layout.card.subtitle?.text}\n          />\n          <Card.Divider />\n          <Card.Content>\n            <Layout>\n              {layout.card.children.map((child, index: number) => (\n                <RenderLayoutContent\n                  key={`${sectionId}-card-${cardIndex}-content-${index}`}\n                  content={child}\n                  level={0}\n                  sectionId={sectionId}\n                  cardIndex={cardIndex}\n                  contentIndex={index}\n                  setInputRef={setInputRef}\n                />\n              ))}\n            </Layout>\n          </Card.Content>\n        </EntityPage.Card>\n      );\n    default:\n      return null;\n  }\n};\n\nexport interface AutoPatternsEntityPageProps {\n  configuration: EntityPageConfig;\n}\n\nexport const AutoPatternsEntityPage: React.FC<AutoPatternsEntityPageProps> = ({\n  configuration,\n}) => {\n  const {\n    title,\n    subtitle,\n    layout: pageLayout,\n    parentPageId,\n    route,\n  } = configuration;\n\n  const form = useForm<any>();\n  const params = useParams();\n  const entityId = params[route.params.id];\n  const schema = useSchema();\n\n  const inputRefs = useRef<{ [fieldId: string]: BaseInputRef }>({});\n\n  const setInputRef = (id: string, input: BaseInputRef) => {\n    inputRefs.current[id] = input;\n  };\n\n  const validate = () => {\n    const invalidFieldId = Object.keys(inputRefs.current).find((fieldId) => {\n      return inputRefs.current[fieldId]?.invalid;\n    });\n\n    if (invalidFieldId) {\n      inputRefs.current[invalidFieldId]?.focus?.();\n      throw new Error('Invalid form');\n    }\n  };\n  const { getParentPagePath } = useNavigation();\n\n  const parentPath = useMemo(\n    () => getParentPagePath(parentPageId),\n    [parentPageId, getParentPagePath],\n  );\n\n  const state: EntityPageState<any> = useEntityPage<any, any>({\n    parentPath,\n    form,\n    onSave: async () => {\n      validate();\n\n      const formValues = form.getValues();\n      const baseEntity = state.entity || {};\n      const updatedEntity = {\n        ...baseEntity,\n        ...formValues,\n      };\n\n      const newEntity = entityId\n        ? await schema.actions.update(updatedEntity)\n        : await schema.actions.create(updatedEntity);\n\n      return { updatedEntity: newEntity };\n    },\n    fetch: async () => {\n      if (!entityId) {\n        return { entity: undefined };\n      }\n      const entity = await schema.actions.get(entityId);\n      return { entity };\n    },\n  });\n\n  const entity = useEntity(state);\n\n  return (\n    <EntityPage state={state} dataHook=\"auto-patterns-entity-page\">\n      <EntityPage.Header\n        title={\n          title ?? { text: entity?.[schema.displayField] ?? 'Edit Entity' }\n        }\n        subtitle={subtitle}\n      />\n      <EntityPage.Content>\n        <EntityPage.MainContent>\n          {pageLayout?.main?.map((layout, layoutIndex) => (\n            <RenderLayoutCard\n              key={`main-section-card-${layoutIndex}`}\n              layout={layout}\n              sectionId=\"main\"\n              cardIndex={layoutIndex}\n              setInputRef={setInputRef}\n            />\n          ))}\n        </EntityPage.MainContent>\n        {pageLayout?.sidebar ? (\n          <EntityPage.AdditionalContent>\n            {pageLayout.sidebar?.map((layout, layoutIndex) => (\n              <RenderLayoutCard\n                key={`sidebar-section-card-${layoutIndex}`}\n                layout={layout}\n                sectionId=\"sidebar\"\n                cardIndex={layoutIndex}\n                setInputRef={setInputRef}\n              />\n            ))}\n          </EntityPage.AdditionalContent>\n        ) : null}\n      </EntityPage.Content>\n    </EntityPage>\n  );\n};\n\n/*\n  Key structure explanation:\n\n  Main cards: main-section-card-{layoutIndex}\n  Sidebar cards: sidebar-section-card-{layoutIndex}\n\n  Layout content:\n  {sectionId}-card-{cardIndex}-content-{contentIndex}\n\n  Nested children:\n  {sectionId}-card-{cardIndex}-content-{parentContentIndex}-level-{level}-child-{childIndex}\n\n  This ensures uniqueness across all levels and sections.\n*/\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useMemo","useRef","EntityPage","useEntity","useEntityPage","useEntityPageContext","useForm","Card","Cell","Layout","useParams","useSchema","FormFieldInput","useEntityPageHeaderTexts","useNavigation","usePatternsWizardOverridesContext","RenderLayoutContent","_ref","_content$container$ch","_overrides$components","content","level","sectionId","cardIndex","contentIndex","setInputRef","schema","overrides","pageState","type","field","fieldId","fields","createElement","span","key","inputRef","ref","container","children","length","map","child","index","component","componentId","Component","components","form","entity","RenderLayoutCard","_ref2","_layout$card$subtitle","layout","minHeight","Header","title","card","text","subtitle","Divider","Content","AutoPatternsEntityPage","_ref3","_pageLayout$main","_pageLayout$sidebar","configuration","pageLayout","parentPageId","route","mode","params","entityId","id","isCreateMode","inputRefs","input","current","validate","invalidFieldId","Object","keys","find","_inputRefs$current$fi","invalid","_inputRefs$current$in","focus","Error","getParentPagePath","parentPath","state","onSave","formValues","getValues","baseEntity","updatedEntity","newEntity","actions","update","create","fetch","undefined","get","config","entityDisplayName","displayField","dataHook","MainContent","main","layoutIndex","sidebar","AdditionalContent"],"sources":["../../../../src/components/AutoPatternsEntityPage/AutoPatternsEntityPage.tsx"],"sourcesContent":["import React, { useMemo, useRef } from 'react';\nimport { CardLayout, EntityPageConfig, LayoutContent } from '../../types';\nimport {\n  EntityPage,\n  EntityPageState,\n  useEntity,\n  useEntityPage,\n  useEntityPageContext,\n} from '@wix/patterns';\nimport { useForm } from '@wix/patterns/form';\nimport { Card, Cell, Layout } from '@wix/design-system';\nimport { useParams } from 'react-router-dom';\nimport { useSchema } from '../../providers/SchemaContext';\nimport { BaseInputRef } from './Fields/types';\nimport { FormFieldInput } from './Fields/FormFieldInput';\nimport { useEntityPageHeaderTexts, useNavigation } from '../../hooks';\nimport { usePatternsWizardOverridesContext } from '../../providers';\n\nconst RenderLayoutContent: React.FC<{\n  content: LayoutContent;\n  level: number;\n  sectionId: string;\n  cardIndex: number;\n  contentIndex: number;\n  setInputRef: (id: string, input: BaseInputRef) => void;\n}> = ({ content, level, sectionId, cardIndex, contentIndex, setInputRef }) => {\n  const schema = useSchema();\n  const overrides = usePatternsWizardOverridesContext();\n  const pageState = useEntityPageContext();\n\n  switch (content.type) {\n    case 'field':\n      if (!content.field.fieldId) {\n        return null;\n      }\n\n      const field = schema.fields[content.field.fieldId];\n\n      if (!field) {\n        return null;\n      }\n\n      return (\n        <Cell span={content.field.span}>\n          <FormFieldInput\n            key={content.field.fieldId}\n            field={field}\n            inputRef={(ref) => setInputRef(content.field.fieldId, ref)}\n          />\n        </Cell>\n      );\n\n    case 'container':\n      if (!content.container.children?.length) {\n        return null;\n      }\n\n      return (\n        <Cell span={content.container.span}>\n          <Layout>\n            {content.container.children.map((child, index) => (\n              <RenderLayoutContent\n                key={`${sectionId}-card-${cardIndex}-content-${contentIndex}-level-${level}-child-${index}`}\n                content={child}\n                level={level + 1}\n                sectionId={sectionId}\n                cardIndex={cardIndex}\n                contentIndex={index}\n                setInputRef={setInputRef}\n              />\n            ))}\n          </Layout>\n        </Cell>\n      );\n\n    case 'component':\n      if (!content.component.componentId) {\n        return null;\n      }\n\n      const Component = overrides?.components?.[content.component.componentId];\n\n      if (!Component) {\n        return null;\n      }\n\n      return (\n        <Cell span={content.component.span}>\n          <Component\n            form={pageState.form as any}\n            entity={pageState.entity as any as Record<string, any>}\n          />\n        </Cell>\n      );\n\n    default:\n      return null;\n  }\n};\n\nconst RenderLayoutCard: React.FC<{\n  layout: CardLayout;\n  sectionId: string;\n  cardIndex: number;\n  setInputRef: (id: string, input: BaseInputRef) => void;\n}> = ({ layout, sectionId, cardIndex, setInputRef }) => {\n  switch (layout.type) {\n    case 'card':\n      return (\n        <EntityPage.Card minHeight=\"50px\">\n          <Card.Header\n            title={layout.card.title.text}\n            subtitle={layout.card.subtitle?.text}\n          />\n          <Card.Divider />\n          <Card.Content>\n            <Layout>\n              {layout.card.children.map((child, index: number) => (\n                <RenderLayoutContent\n                  key={`${sectionId}-card-${cardIndex}-content-${index}`}\n                  content={child}\n                  level={0}\n                  sectionId={sectionId}\n                  cardIndex={cardIndex}\n                  contentIndex={index}\n                  setInputRef={setInputRef}\n                />\n              ))}\n            </Layout>\n          </Card.Content>\n        </EntityPage.Card>\n      );\n    default:\n      return null;\n  }\n};\n\nexport interface AutoPatternsEntityPageProps {\n  configuration: EntityPageConfig;\n}\n\nexport const AutoPatternsEntityPage: React.FC<AutoPatternsEntityPageProps> = ({\n  configuration,\n}) => {\n  const { layout: pageLayout, parentPageId, route } = configuration;\n\n  const form = useForm<any>({\n    mode: 'onChange',\n  });\n  const params = useParams();\n  const entityId = params[route.params.id];\n  const schema = useSchema();\n  const isCreateMode = !entityId;\n\n  const inputRefs = useRef<{ [fieldId: string]: BaseInputRef }>({});\n\n  const setInputRef = (id: string, input: BaseInputRef) => {\n    inputRefs.current[id] = input;\n  };\n\n  const validate = () => {\n    const invalidFieldId = Object.keys(inputRefs.current).find((fieldId) => {\n      return inputRefs.current[fieldId]?.invalid;\n    });\n\n    if (invalidFieldId) {\n      inputRefs.current[invalidFieldId]?.focus?.();\n      throw new Error('Invalid form');\n    }\n  };\n  const { getParentPagePath } = useNavigation();\n\n  const parentPath = useMemo(\n    () => getParentPagePath(parentPageId),\n    [parentPageId, getParentPagePath],\n  );\n\n  const state: EntityPageState<any> = useEntityPage<any, any>({\n    parentPath,\n    form,\n    onSave: async () => {\n      validate();\n\n      const formValues = form.getValues();\n      const baseEntity = state.entity || {};\n      const updatedEntity = {\n        ...baseEntity,\n        ...formValues,\n      };\n\n      const newEntity = entityId\n        ? await schema.actions.update(updatedEntity)\n        : await schema.actions.create(updatedEntity);\n\n      return { updatedEntity: newEntity };\n    },\n    fetch: async () => {\n      if (!entityId) {\n        return { entity: undefined };\n      }\n      const entity = await schema.actions.get(entityId);\n      return { entity };\n    },\n  });\n\n  const entity = useEntity(state);\n\n  const { title, subtitle } = useEntityPageHeaderTexts({\n    config: configuration,\n    isCreateMode,\n    entityDisplayName: entity?.[schema.displayField],\n  });\n\n  return (\n    <EntityPage state={state} dataHook=\"auto-patterns-entity-page\">\n      <EntityPage.Header title={title} subtitle={subtitle} />\n      <EntityPage.Content>\n        <EntityPage.MainContent>\n          {pageLayout?.main?.map((layout, layoutIndex) => (\n            <RenderLayoutCard\n              key={`main-section-card-${layoutIndex}`}\n              layout={layout}\n              sectionId=\"main\"\n              cardIndex={layoutIndex}\n              setInputRef={setInputRef}\n            />\n          ))}\n        </EntityPage.MainContent>\n        {pageLayout?.sidebar ? (\n          <EntityPage.AdditionalContent>\n            {pageLayout.sidebar?.map((layout, layoutIndex) => (\n              <RenderLayoutCard\n                key={`sidebar-section-card-${layoutIndex}`}\n                layout={layout}\n                sectionId=\"sidebar\"\n                cardIndex={layoutIndex}\n                setInputRef={setInputRef}\n              />\n            ))}\n          </EntityPage.AdditionalContent>\n        ) : null}\n      </EntityPage.Content>\n    </EntityPage>\n  );\n};\n\n/*\n  Key structure explanation:\n\n  Main cards: main-section-card-{layoutIndex}\n  Sidebar cards: sidebar-section-card-{layoutIndex}\n\n  Layout content:\n  {sectionId}-card-{cardIndex}-content-{contentIndex}\n\n  Nested children:\n  {sectionId}-card-{cardIndex}-content-{parentContentIndex}-level-{level}-child-{childIndex}\n\n  This ensures uniqueness across all levels and sections.\n*/\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/components/AutoPatternsEntityPage/Fields/DateInput.js

@@ -1,13 +1,22 @@
-import React, { useRef, useState } from 'react';
+import React, { useState, useRef } from 'react';
 import { FormField, DatePicker } from '@wix/design-system';
 import { getDateWithoutTimezone, getISODateStringWithFixedTimezone } from './utils/dates';
-import { useSelector, useWixPatternsContainer } from '@wix/patterns';
+import { useSelector, useWixPatternsContainer, useEntityPageContext } from '@wix/patterns';
+import { useController } from '@wix/patterns/form';
+function validateDateField(value, validation, t, format, validationType) {
+  if (validation != null && validation.required && (value === null || value === undefined || value === '')) {
+    return t('cairo.fieldValidation.requiredField');
+  } else if (validationType === 'formatError' && format) {
+    return t('cairo.customFields.fieldType.date.invalid.value', {
+      dateFormat: format
+    });
+  }
+  return '';
+}
 export const DateInput = props => {
-  var _field$validation;
+  var _pageState$entity, _field$validation;
   const {
     field,
-    value,
-    onChange,
     dataHook,
     inputRef
   } = props;
@@ -16,9 +25,26 @@ export const DateInput = props => {
     ...container
   } = useWixPatternsContainer();
   useSelector(() => container.initTask.status);
-  const [date, setDate] = useState(() => value ? getDateWithoutTimezone(getISODateStringWithFixedTimezone(value)) : undefined);
+  const pageState = useEntityPageContext();
+  const controller = useController({
+    name: (field == null ? void 0 : field.id) ?? '',
+    control: pageState.form.control,
+    defaultValue: (_pageState$entity = pageState.entity) == null ? void 0 : _pageState$entity[(field == null ? void 0 : field.id) ?? ''],
+    rules: {
+      validate: value => {
+        const error = validateDateField(value, field.validation, t);
+        return error || true;
+      }
+    }
+  });
+  const [date, setDate] = useState(() => {
+    if (controller.field.value) {
+      return getDateWithoutTimezone(getISODateStringWithFixedTimezone(controller.field.value));
+    }
+    return undefined;
+  });
   const ref = useRef({});
-  const [statusMessage, setStatusMessage] = useState('');
+  const [errorMessage, setErrorMessage] = useState('');
   return /*#__PURE__*/React.createElement(FormField, {
     label: field.displayName,
     required: (_field$validation = field.validation) == null ? void 0 : _field$validation.required,
@@ -26,8 +52,7 @@ export const DateInput = props => {
   }, /*#__PURE__*/React.createElement(DatePicker, {
     ref: internalRef => {
       inputRef == null || inputRef(ref.current);
-      // TODO: PR to WSR needed to expose as public API
-      // @ts-expect-error
+      // @ts-expect-error: WSR internal API hack for focusing
       ref.current.focus = () => {
         var _internalRef$state;
         return internalRef == null || (_internalRef$state = internalRef.state) == null || (_internalRef$state = _internalRef$state.inputRef) == null || _internalRef$state.focus == null ? void 0 : _internalRef$state.focus();
@@ -37,9 +62,13 @@ export const DateInput = props => {
     width: "100%",
     value: date,
     onChange: newValue => {
-      const formattedDate = getISODateStringWithFixedTimezone(newValue);
       setDate(newValue);
-      onChange(formattedDate.split('T')[0]);
+      if (newValue) {
+        const formattedDate = getISODateStringWithFixedTimezone(newValue);
+        controller.field.onChange(formattedDate.split('T')[0]);
+      } else {
+        controller.field.onChange(null);
+      }
     },
     onValidate: _ref => {
       let {
@@ -47,23 +76,16 @@ export const DateInput = props => {
         value: newValue,
         format
       } = _ref;
-      if (validationType === 'valid') {
-        setStatusMessage('');
-        ref.current.invalid = false;
-      } else if (validationType === 'formatError' && newValue === '') {
+      const error = validateDateField(newValue, field.validation, t, format, validationType);
+      setErrorMessage(error);
+      ref.current.invalid = !!error;
+      if (validationType === 'formatError' && newValue === '') {
         setDate(undefined);
-        onChange(null);
-        setStatusMessage('');
-        ref.current.invalid = false;
-      } else {
-        setStatusMessage(t('cairo.customFields.fieldType.date.invalid.value', {
-          dateFormat: format ?? ''
-        }));
-        ref.current.invalid = true;
+        controller.field.onChange(null);
       }
     },
-    status: ref.current.invalid ? 'error' : undefined,
-    statusMessage: statusMessage
+    status: errorMessage ? 'error' : undefined,
+    statusMessage: errorMessage
   }));
 };
 //# sourceMappingURL=DateInput.js.map

package/dist/esm/components/AutoPatternsEntityPage/Fields/DateInput.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useRef","useState","FormField","DatePicker","getDateWithoutTimezone","getISODateStringWithFixedTimezone","useSelector","useWixPatternsContainer","DateInput","props","_field$validation","field","value","onChange","dataHook","inputRef","translate","t","container","initTask","status","date","setDate","undefined","ref","statusMessage","setStatusMessage","createElement","label","displayName","required","validation","internalRef","current","focus","_internalRef$state","state","id","width","newValue","formattedDate","split","onValidate","_ref","validationType","format","invalid","dateFormat"],"sources":["../../../../../src/components/AutoPatternsEntityPage/Fields/DateInput.tsx"],"sourcesContent":["import React, { useRef, useState } from 'react';\nimport { FormField, DatePicker } from '@wix/design-system';\nimport {\n  getDateWithoutTimezone,\n  getISODateStringWithFixedTimezone,\n} from './utils/dates';\nimport { BaseInputProps, BaseInputRef } from './types';\nimport { useSelector, useWixPatternsContainer } from '@wix/patterns';\n\nexport interface DateProps extends BaseInputProps<string | null> {}\n\nexport const DateInput = (props: DateProps) => {\n  const { field, value, onChange, dataHook, inputRef } = props;\n  const { translate: t, ...container } = useWixPatternsContainer();\n  useSelector(() => container.initTask.status);\n\n  const [date, setDate] = useState<Date | undefined>(() =>\n    value\n      ? getDateWithoutTimezone(getISODateStringWithFixedTimezone(value))\n      : undefined,\n  );\n\n  const ref = useRef<BaseInputRef>({});\n  const [statusMessage, setStatusMessage] = useState('');\n\n  return (\n    <FormField\n      label={field.displayName}\n      required={field.validation?.required}\n      dataHook={dataHook}\n    >\n      <DatePicker\n        ref={(internalRef) => {\n          inputRef?.(ref.current);\n          // TODO: PR to WSR needed to expose as public API\n          // @ts-expect-error\n          ref.current.focus = () => internalRef?.state?.inputRef?.focus?.();\n        }}\n        dataHook={`date-${field.id}`}\n        width=\"100%\"\n        value={date}\n        onChange={(newValue: Date) => {\n          const formattedDate = getISODateStringWithFixedTimezone(newValue);\n          setDate(newValue);\n          onChange(formattedDate.split('T')[0]);\n        }}\n        onValidate={({ validationType, value: newValue, format }) => {\n          if (validationType === 'valid') {\n            setStatusMessage('');\n            ref.current.invalid = false;\n          } else if (validationType === 'formatError' && newValue === '') {\n            setDate(undefined);\n            onChange(null);\n            setStatusMessage('');\n            ref.current.invalid = false;\n          } else {\n            setStatusMessage(\n              t('cairo.customFields.fieldType.date.invalid.value', {\n                dateFormat: format ?? '',\n              }),\n            );\n            ref.current.invalid = true;\n          }\n        }}\n        status={ref.current.invalid ? 'error' : undefined}\n        statusMessage={statusMessage}\n      />\n    </FormField>\n  );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useState","useRef","FormField","DatePicker","getDateWithoutTimezone","getISODateStringWithFixedTimezone","useSelector","useWixPatternsContainer","useEntityPageContext","useController","validateDateField","value","validation","t","format","validationType","required","undefined","dateFormat","DateInput","props","_pageState$entity","_field$validation","field","dataHook","inputRef","translate","container","initTask","status","pageState","controller","name","id","control","form","defaultValue","entity","rules","validate","error","date","setDate","ref","errorMessage","setErrorMessage","createElement","label","displayName","internalRef","current","focus","_internalRef$state","state","width","onChange","newValue","formattedDate","split","onValidate","_ref","invalid","statusMessage"],"sources":["../../../../../src/components/AutoPatternsEntityPage/Fields/DateInput.tsx"],"sourcesContent":["import React, { useState, useRef } from 'react';\nimport { FormField, DatePicker } from '@wix/design-system';\nimport {\n  getDateWithoutTimezone,\n  getISODateStringWithFixedTimezone,\n} from './utils/dates';\nimport { BaseInputProps, BaseInputRef } from './types';\nimport {\n  useSelector,\n  useWixPatternsContainer,\n  useEntityPageContext,\n} from '@wix/patterns';\nimport { useController } from '@wix/patterns/form';\nimport { Translate } from '@wix/patterns/core';\n\nexport interface DateProps extends BaseInputProps<string | null> {}\n\nfunction validateDateField(\n  value: string | null | undefined,\n  validation: DateProps['field']['validation'],\n  t: Translate,\n  format?: string,\n  validationType?: 'outOfBoundsError' | 'formatError' | 'valid',\n) {\n  if (\n    validation?.required &&\n    (value === null || value === undefined || value === '')\n  ) {\n    return t('cairo.fieldValidation.requiredField');\n  } else if (validationType === 'formatError' && format) {\n    return t('cairo.customFields.fieldType.date.invalid.value', {\n      dateFormat: format,\n    });\n  }\n\n  return '';\n}\n\nexport const DateInput = (props: DateProps) => {\n  const { field, dataHook, inputRef } = props;\n  const { translate: t, ...container } = useWixPatternsContainer();\n  useSelector(() => container.initTask.status);\n  const pageState = useEntityPageContext();\n\n  const controller = useController({\n    name: field?.id ?? '',\n    control: pageState.form.control,\n    defaultValue: (pageState.entity as any)?.[field?.id ?? ''],\n    rules: {\n      validate: (value) => {\n        const error = validateDateField(value, field.validation, t);\n        return error || true;\n      },\n    },\n  });\n\n  const [date, setDate] = useState<Date | undefined>(() => {\n    if (controller.field.value) {\n      return getDateWithoutTimezone(\n        getISODateStringWithFixedTimezone(controller.field.value),\n      );\n    }\n    return undefined;\n  });\n\n  const ref = useRef<BaseInputRef>({});\n  const [errorMessage, setErrorMessage] = useState<string>('');\n\n  return (\n    <FormField\n      label={field.displayName}\n      required={field.validation?.required}\n      dataHook={dataHook}\n    >\n      <DatePicker\n        ref={(internalRef) => {\n          inputRef?.(ref.current);\n          // @ts-expect-error: WSR internal API hack for focusing\n          ref.current.focus = () => internalRef?.state?.inputRef?.focus?.();\n        }}\n        dataHook={`date-${field.id}`}\n        width=\"100%\"\n        value={date}\n        onChange={(newValue: Date) => {\n          setDate(newValue);\n          if (newValue) {\n            const formattedDate = getISODateStringWithFixedTimezone(newValue);\n            controller.field.onChange(formattedDate.split('T')[0]);\n          } else {\n            controller.field.onChange(null);\n          }\n        }}\n        onValidate={({ validationType, value: newValue, format }) => {\n          const error = validateDateField(\n            newValue,\n            field.validation,\n            t,\n            format,\n            validationType,\n          );\n          setErrorMessage(error);\n          ref.current.invalid = !!error;\n\n          if (validationType === 'formatError' && newValue === '') {\n            setDate(undefined);\n            controller.field.onChange(null);\n          }\n        }}\n        status={errorMessage ? 'error' : undefined}\n        statusMessage={errorMessage}\n      />\n    </FormField>\n  );\n};\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/components/AutoPatternsEntityPage/Fields/DateTime.js

@@ -1,12 +1,11 @@
 import React, { useRef, useMemo, useState, useEffect } from 'react';
 import { Cell, DatePicker, FormField, Layout, TimeInput } from '@wix/design-system';
-import { useWixPatternsContainer, useSelector } from '@wix/patterns';
+import { useWixPatternsContainer, useSelector, useEntityPageContext } from '@wix/patterns';
+import { useController } from '@wix/patterns/form';
 export const DateTime = props => {
-  var _field$validation;
+  var _pageState$entity, _field$validation2;
   const {
     field,
-    value,
-    onChange,
     dataHook,
     inputRef
   } = props;
@@ -15,14 +14,30 @@ export const DateTime = props => {
     ...container
   } = useWixPatternsContainer();
   useSelector(() => container.initTask.status);
+  const pageState = useEntityPageContext();
+  const controller = useController({
+    name: (field == null ? void 0 : field.id) ?? '',
+    control: pageState.form.control,
+    defaultValue: (_pageState$entity = pageState.entity) == null ? void 0 : _pageState$entity[(field == null ? void 0 : field.id) ?? ''],
+    rules: {
+      validate: v => {
+        var _field$validation;
+        if (field != null && (_field$validation = field.validation) != null && _field$validation.required && (v === null || v === undefined || v === '')) {
+          return t('cairo.fieldValidation.requiredField');
+        }
+        return true;
+      }
+    }
+  });
   const date = useMemo(() => {
-    if (!value) {
+    if (!controller.field.value) {
       return undefined;
     }
-    const d = new Date(value);
+    const d = new Date(controller.field.value);
     return isNaN(d.getTime()) ? undefined : d;
-  }, [value]);
-  const [statusMessage, setStatusMessage] = useState('');
+  }, [controller.field.value]);
+  const [dateStatusMessage, setDateStatusMessage] = useState('');
+  const [timeStatusMessage, setTimeStatusMessage] = useState('');
   const ref = useRef({});
   const dateRef = useRef({});
   const timeRef = useRef({});
@@ -39,7 +54,7 @@ export const DateTime = props => {
   }, [inputRef]);
   return /*#__PURE__*/React.createElement(FormField, {
     label: field.displayName,
-    required: (_field$validation = field.validation) == null ? void 0 : _field$validation.required,
+    required: (_field$validation2 = field.validation) == null ? void 0 : _field$validation2.required,
     dataHook: dataHook
   }, /*#__PURE__*/React.createElement(Layout, null, /*#__PURE__*/React.createElement(Cell, {
     span: 6
@@ -55,7 +70,7 @@ export const DateTime = props => {
     },
     width: "100%",
     value: date
-    // onChange is triggered only when you have valid, non-empty value. and onValidate is triggered on every change to we use onValidate
+    // onChange is triggered only when you have valid, non-empty value. and onValidate is triggered on every change so we use onValidate
     ,
     onChange: () => {},
     onValidate: _ref => {
@@ -70,27 +85,33 @@ export const DateTime = props => {
         dateWithNewDate.setFullYear(_value.getFullYear());
         dateWithNewDate.setMonth(_value.getMonth());
         dateWithNewDate.setDate(_value.getDate());
-        onChange(dateWithNewDate.toISOString());
+        controller.field.onChange(dateWithNewDate.toISOString());
         setDateValue(new Date(newValue).getDate());
-        setStatusMessage('');
-        dateRef.current.invalid = false;
-      } else if (validationType === 'formatError' && value === '') {
-        setStatusMessage('');
+        setDateStatusMessage('');
         dateRef.current.invalid = false;
-        setDateValue(value);
+      } else if (validationType === 'formatError' && newValue === '') {
+        var _field$validation3;
+        if ((_field$validation3 = field.validation) != null && _field$validation3.required) {
+          setDateStatusMessage(t('cairo.fieldValidation.requiredField'));
+          dateRef.current.invalid = true;
+        } else {
+          setDateStatusMessage('');
+          dateRef.current.invalid = false;
+        }
+        setDateValue(newValue);
         if (!timeValue) {
-          onChange(null);
+          controller.field.onChange(null);
         }
       } else {
-        setStatusMessage(t('cairo.customFields.fieldType.date.invalid.value', {
+        setDateStatusMessage(t('cairo.customFields.fieldType.date.invalid.value', {
           dateFormat: format ?? ''
         }));
         dateRef.current.invalid = true;
       }
       ref.current.invalid = dateRef.current.invalid || timeRef.current.invalid;
     },
-    status: ref.current.invalid ? 'error' : undefined,
-    statusMessage: statusMessage,
+    status: controller.fieldState.error || dateStatusMessage ? 'error' : undefined,
+    statusMessage: controller.fieldState.error || dateStatusMessage,
     dataHook: `datetime-date-${field.id}`
   })), /*#__PURE__*/React.createElement(Cell, {
     span: 6
@@ -100,15 +121,18 @@ export const DateTime = props => {
     },
     dataHook: `datetime-time-${field.id}`,
     value: date ?? null,
-    invalidMessage: t('cairo.customFields.fieldType.dateAndTime.invalid.value'),
+    status: controller.fieldState.error || timeStatusMessage ? 'error' : undefined,
+    statusMessage: controller.fieldState.error || timeStatusMessage,
     onInvalid: () => {
       timeRef.current.invalid = true;
+      setTimeStatusMessage(t('cairo.customFields.fieldType.dateAndTime.invalid.value'));
       ref.current.invalid = dateRef.current.invalid || timeRef.current.invalid;
     },
     onChange: _ref2 => {
       let {
         date: newValue
       } = _ref2;
+      debugger;
       timeRef.current.invalid = false;
       ref.current.invalid = dateRef.current.invalid || timeRef.current.invalid;
       if (newValue) {
@@ -117,12 +141,24 @@ export const DateTime = props => {
         dateWithNewTime.setMinutes(newValue.getMinutes());
         dateWithNewTime.setSeconds(newValue.getSeconds());
         dateWithNewTime.setMilliseconds(newValue.getMilliseconds());
-        onChange(dateWithNewTime.toISOString());
-      } else if (!ref.current.invalid) {
+        controller.field.onChange(dateWithNewTime.toISOString());
+        setTimeStatusMessage('');
+        setDateStatusMessage('');
+      } else {
         if (!newValue) {
+          var _field$validation4;
           setTimeValue('');
-          if (!dateValue) {
-            onChange(null);
+          if ((_field$validation4 = field.validation) != null && _field$validation4.required) {
+            setTimeStatusMessage(t('cairo.fieldValidation.requiredField'));
+            timeRef.current.invalid = true;
+          } else {
+            setTimeStatusMessage('');
+            timeRef.current.invalid = false;
+          }
+          if (!ref.current.invalid) {
+            if (!dateValue) {
+              controller.field.onChange(null);
+            }
           }
         }
       }