@fluid-app/portal-sdk 0.1.64 → 0.1.66

package/dist/{AppDownloadScreen-DUGGDlr4.mjs → AppDownloadScreen-BVrUR6lm.mjs}

@@ -31,5 +31,5 @@ import "./SpacerWidget-DgVU58BC.mjs";
 import "./TableWidget-DjYabx1e.mjs";
 import "./ToDoWidget-Cmvf7I6c.mjs";
 import "./VideoWidget-51MxnPRZ.mjs";
-import { n as appDownloadScreenPropertySchema, t as AppDownloadScreen } from "./AppDownloadScreen-pm8fLxZX.mjs";
+import { n as appDownloadScreenPropertySchema, t as AppDownloadScreen } from "./AppDownloadScreen-BXS02LRb.mjs";
 export { AppDownloadScreen, appDownloadScreenPropertySchema };

package/dist/{AppDownloadScreen-pm8fLxZX.mjs → AppDownloadScreen-BXS02LRb.mjs}

@@ -24,7 +24,7 @@ function GooglePlayIcon() {
 }
 function AppStoreButtons({ appstoreUrl, playstoreUrl }) {
 	return /* @__PURE__ */ jsxs("div", {
-		className: `grid gap-4 ${playstoreUrl ? "grid-cols-2" : "grid-cols-1"}`,
+		className: `grid gap-4 ${playstoreUrl ? "grid-cols-1 sm:grid-cols-2" : "grid-cols-1"}`,
 		children: [/* @__PURE__ */ jsx("a", {
 			href: appstoreUrl,
 			target: "_blank",
@@ -208,4 +208,4 @@ function AppDownloadScreen() {
 //#endregion
 export { appDownloadScreenPropertySchema as n, AppDownloadScreen as t };
 
-//# sourceMappingURL=AppDownloadScreen-pm8fLxZX.mjs.map
+//# sourceMappingURL=AppDownloadScreen-BXS02LRb.mjs.map

package/dist/AppDownloadScreen-BXS02LRb.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AppDownloadScreen-BXS02LRb.mjs","names":["AppDownloadScreen","AppDownloadScreenUI"],"sources":["../../app-download-ui/src/components/AppStoreButtons.tsx","../../app-download-ui/src/components/QrCodeSection.tsx","../../app-download-ui/src/components/ImageSection.tsx","../../app-download-ui/src/lib/cn.ts","../../app-download-ui/src/components/AppDownloadScreen.tsx","../src/screens/AppDownloadScreen.tsx"],"sourcesContent":["import { ExternalLink } from \"lucide-react\";\n\nexport interface AppStoreButtonsProps {\n  appstoreUrl: string;\n  playstoreUrl?: string;\n}\n\nfunction AppleIcon() {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 384 512\"\n      fill=\"currentColor\"\n      className=\"size-5\"\n    >\n      <path d=\"M318.7 268.7c-.2-36.7 16.4-64.4 50-84.8-18.8-26.9-47.2-41.7-84.7-44.6-35.5-2.8-74.3 20.7-88.5 20.7-15 0-49.4-19.7-76.4-19.7C63.3 141.2 4 184.8 4 273.5q0 39.3 14.4 81.2c12.8 36.7 59 126.7 107.2 125.2 25.2-.6 43-17.9 75.8-17.9 31.8 0 48.3 17.9 76.4 17.9 48.6-.7 90.4-82.5 102.6-119.3-65.2-30.7-61.7-90-61.7-91.9zm-56.6-164.2c27.3-32.4 24.8-62.1 24-72.5-24.1 1.4-52 16.4-67.9 34.9-17.5 19.8-27.8 44.3-25.6 71.9 26.1 2 49.9-11.4 69.5-34.3z\" />\n    </svg>\n  );\n}\n\nfunction GooglePlayIcon() {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 512 512\"\n      fill=\"currentColor\"\n      className=\"size-5\"\n    >\n      <path d=\"M325.3 234.3L104.6 13l280.8 161.2-60.1 60.1zM47 0C34 6.8 25.3 19.2 25.3 35.3v441.3c0 16.1 8.7 28.5 21.7 35.3l256.6-256L47 0zm425.2 225.6l-58.9-34.1-65.7 64.5 65.7 64.5 60.1-34.1c18-14.3 18-46.5-1.2-60.8zM104.6 499l280.8-161.2-60.1-60.1L104.6 499z\" />\n    </svg>\n  );\n}\n\nexport function AppStoreButtons({\n  appstoreUrl,\n  playstoreUrl,\n}: AppStoreButtonsProps) {\n  return (\n    <div\n      className={`grid gap-4 ${playstoreUrl ? \"grid-cols-1 sm:grid-cols-2\" : \"grid-cols-1\"}`}\n    >\n      <a\n        href={appstoreUrl}\n        target=\"_blank\"\n        rel=\"noopener noreferrer\"\n        className=\"block cursor-pointer rounded-sm border bg-white px-4 py-4 text-gray-900 transition-colors hover:bg-gray-50\"\n      >\n        <div className=\"flex justify-between\">\n          <div className=\"flex flex-col items-baseline\">\n            <AppleIcon />\n            <div className=\"mt-1 text-left text-xs font-semibold\">\n              Open\n              <br />\n              App Store\n            </div>\n          </div>\n          <div className=\"flex items-start\">\n            <ExternalLink className=\"size-4\" />\n          </div>\n        </div>\n      </a>\n\n      {playstoreUrl && (\n        <a\n          href={playstoreUrl}\n          target=\"_blank\"\n          rel=\"noopener noreferrer\"\n          className=\"block cursor-pointer rounded-sm border bg-white px-4 py-4 text-gray-900 transition-colors hover:bg-gray-50\"\n        >\n          <div className=\"flex justify-between\">\n            <div className=\"flex flex-col items-baseline\">\n              <GooglePlayIcon />\n              <div className=\"mt-1 text-left text-xs font-semibold\">\n                Open\n                <br />\n                Play Store\n              </div>\n            </div>\n            <div className=\"flex items-start\">\n              <ExternalLink className=\"size-4\" />\n            </div>\n          </div>\n        </a>\n      )}\n    </div>\n  );\n}\n","export interface QrCodeSectionProps {\n  companyId: number;\n}\n\nexport function QrCodeSection({ companyId }: QrCodeSectionProps) {\n  const redirectUrl = `https://api.fluid.app/mobile_app_download/${companyId}`;\n  const qrCodeUrl = `https://api.qrserver.com/v1/create-qr-code/?size=200x200&data=${encodeURIComponent(redirectUrl)}`;\n\n  return (\n    <a\n      href={redirectUrl}\n      target=\"_blank\"\n      rel=\"noopener noreferrer\"\n      className=\"block cursor-pointer rounded-sm border bg-white px-4 py-4 text-gray-900 transition-colors hover:bg-gray-50\"\n    >\n      <div className=\"flex items-end justify-between\">\n        <div className=\"flex flex-col items-baseline\">\n          <div className=\"mt-1 text-left text-xs font-semibold\">\n            Scan to\n            <br />\n            Download\n          </div>\n        </div>\n        <div className=\"flex\">\n          <img\n            src={qrCodeUrl}\n            alt=\"QR code for mobile app download\"\n            className=\"h-16 w-16\"\n            loading=\"lazy\"\n          />\n        </div>\n      </div>\n    </a>\n  );\n}\n","const DEFAULT_IMAGE =\n  \"https://assets.fluid.app/fluid-admin/images/we-commerce/iphone_product.png\";\n\nconst DEFAULT_LOGO =\n  \"https://assets.fluid.app/fluid-admin/images/we-commerce/we-commerce.png\";\n\nexport interface ImageSectionProps {\n  logoUrl?: string | null;\n  screenshotUrl?: string | null;\n  appName?: string;\n}\n\nexport function ImageSection({\n  logoUrl,\n  screenshotUrl,\n  appName = \"App\",\n}: ImageSectionProps) {\n  return (\n    <div className=\"flex flex-col overflow-hidden\">\n      <div className=\"-mb-px flex flex-1 flex-col\">\n        <div className=\"flex h-20 px-3 pt-8\">\n          <img\n            src={logoUrl || DEFAULT_LOGO}\n            alt={appName}\n            width={150}\n            height={150}\n            className=\"object-contain\"\n          />\n        </div>\n        <div\n          className={\n            screenshotUrl\n              ? \"mt-8 flex flex-1 items-end justify-start\"\n              : \"-ml-20 flex flex-1 items-end justify-start\"\n          }\n        >\n          <img\n            src={screenshotUrl || DEFAULT_IMAGE}\n            alt=\"Mobile app interface\"\n            width={480}\n            height={500}\n            className=\"h-full w-auto object-cover\"\n          />\n        </div>\n      </div>\n    </div>\n  );\n}\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n","import { AppStoreButtons } from \"./AppStoreButtons\";\nimport { QrCodeSection } from \"./QrCodeSection\";\nimport { ImageSection } from \"./ImageSection\";\nimport { cn } from \"../lib/cn\";\n\nconst DEFAULT_APPSTORE_URL =\n  \"https://apps.apple.com/app/wecommerce/id1564463740\";\nconst DEFAULT_PLAYSTORE_URL =\n  \"https://play.google.com/store/apps/details?id=com.fluid.crm\";\n\nexport interface AppDownloadScreenProps {\n  companyId: number;\n  appstoreUrl?: string | null;\n  playstoreUrl?: string | null;\n  logoUrl?: string | null;\n  screenshotUrl?: string | null;\n  appName?: string;\n  className?: string;\n}\n\nexport function AppDownloadScreen({\n  companyId,\n  appstoreUrl,\n  playstoreUrl,\n  logoUrl,\n  screenshotUrl,\n  appName,\n  className,\n}: AppDownloadScreenProps) {\n  const resolvedAppstoreUrl = appstoreUrl?.trim() || DEFAULT_APPSTORE_URL;\n  const resolvedPlaystoreUrl = playstoreUrl?.trim() || DEFAULT_PLAYSTORE_URL;\n\n  return (\n    <div\n      className={cn(\"flex h-full items-center justify-center p-4\", className)}\n    >\n      <div className=\"bg-muted relative mx-4 w-full max-w-6xl overflow-hidden rounded-xl px-6 shadow-xl\">\n        <div className=\"grid h-150 w-full grid-cols-1 lg:grid-cols-2\">\n          {/* Left side - Images */}\n          <ImageSection\n            logoUrl={logoUrl}\n            screenshotUrl={screenshotUrl}\n            appName={appName}\n          />\n\n          {/* Right side - Content */}\n          <div className=\"space-y-2 pt-8 pb-8\">\n            <h1 className=\"mt-12 text-left text-[32px] leading-tight font-black text-gray-900\">\n              EVERYTHING YOU NEED\n            </h1>\n            <h1 className=\"-mt-2 text-left text-[32px] leading-tight font-black text-gray-900\">\n              AT YOUR FINGERTIPS\n            </h1>\n            <p className=\"-mt-1 text-left text-[14px] leading-relaxed text-gray-600\">\n              Everything you need at your fingertips. Run your business from one\n              place while on the go. Share, message, sell, and manage from the\n              mobile app.\n            </p>\n\n            <h3 className=\"mt-16 text-left text-[12px] font-bold text-gray-900\">\n              Download the App\n            </h3>\n\n            <AppStoreButtons\n              appstoreUrl={resolvedAppstoreUrl}\n              playstoreUrl={resolvedPlaystoreUrl}\n            />\n\n            <QrCodeSection companyId={companyId} />\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n}\n","import type { WidgetPropertySchema } from \"../registries/property-schema-types\";\nimport { AppDownloadScreen as AppDownloadScreenUI } from \"@fluid-app/portal-app-download-ui\";\nimport { useCurrentUser } from \"../hooks/use-current-user\";\n\nexport const appDownloadScreenPropertySchema = {\n  widgetType: \"AppDownloadScreen\",\n  displayName: \"App Download Screen\",\n  fields: [],\n} as const satisfies WidgetPropertySchema;\n\nexport function AppDownloadScreen(): React.JSX.Element {\n  const { data: user } = useCurrentUser();\n\n  return (\n    <AppDownloadScreenUI\n      companyId={user?.company?.id ?? 0}\n      appstoreUrl={user?.company?.appstore_url}\n      playstoreUrl={user?.company?.playstore_url}\n      logoUrl={user?.company?.logo_url}\n    />\n  );\n}\n"],"mappings":";;;;;;AAOA,SAAS,YAAY;AACnB,QACE,oBAAC,OAAD;EACE,OAAM;EACN,SAAQ;EACR,MAAK;EACL,WAAU;YAEV,oBAAC,QAAD,EAAM,GAAE,ubAAwb,CAAA;EAC5b,CAAA;;AAIV,SAAS,iBAAiB;AACxB,QACE,oBAAC,OAAD;EACE,OAAM;EACN,SAAQ;EACR,MAAK;EACL,WAAU;YAEV,oBAAC,QAAD,EAAM,GAAE,0PAA2P,CAAA;EAC/P,CAAA;;AAIV,SAAgB,gBAAgB,EAC9B,aACA,gBACuB;AACvB,QACE,qBAAC,OAAD;EACE,WAAW,cAAc,eAAe,+BAA+B;YADzE,CAGE,oBAAC,KAAD;GACE,MAAM;GACN,QAAO;GACP,KAAI;GACJ,WAAU;aAEV,qBAAC,OAAD;IAAK,WAAU;cAAf,CACE,qBAAC,OAAD;KAAK,WAAU;eAAf,CACE,oBAAC,WAAD,EAAa,CAAA,EACb,qBAAC,OAAD;MAAK,WAAU;gBAAf;OAAsD;OAEpD,oBAAC,MAAD,EAAM,CAAA;;OAEF;QACF;QACN,oBAAC,OAAD;KAAK,WAAU;eACb,oBAAC,cAAD,EAAc,WAAU,UAAW,CAAA;KAC/B,CAAA,CACF;;GACJ,CAAA,EAEH,gBACC,oBAAC,KAAD;GACE,MAAM;GACN,QAAO;GACP,KAAI;GACJ,WAAU;aAEV,qBAAC,OAAD;IAAK,WAAU;cAAf,CACE,qBAAC,OAAD;KAAK,WAAU;eAAf,CACE,oBAAC,gBAAD,EAAkB,CAAA,EAClB,qBAAC,OAAD;MAAK,WAAU;gBAAf;OAAsD;OAEpD,oBAAC,MAAD,EAAM,CAAA;;OAEF;QACF;QACN,oBAAC,OAAD;KAAK,WAAU;eACb,oBAAC,cAAD,EAAc,WAAU,UAAW,CAAA;KAC/B,CAAA,CACF;;GACJ,CAAA,CAEF;;;;;AChFV,SAAgB,cAAc,EAAE,aAAiC;CAC/D,MAAM,cAAc,6CAA6C;CACjE,MAAM,YAAY,iEAAiE,mBAAmB,YAAY;AAElH,QACE,oBAAC,KAAD;EACE,MAAM;EACN,QAAO;EACP,KAAI;EACJ,WAAU;YAEV,qBAAC,OAAD;GAAK,WAAU;aAAf,CACE,oBAAC,OAAD;IAAK,WAAU;cACb,qBAAC,OAAD;KAAK,WAAU;eAAf;MAAsD;MAEpD,oBAAC,MAAD,EAAM,CAAA;;MAEF;;IACF,CAAA,EACN,oBAAC,OAAD;IAAK,WAAU;cACb,oBAAC,OAAD;KACE,KAAK;KACL,KAAI;KACJ,WAAU;KACV,SAAQ;KACR,CAAA;IACE,CAAA,CACF;;EACJ,CAAA;;;;AChCR,MAAM,gBACJ;AAEF,MAAM,eACJ;AAQF,SAAgB,aAAa,EAC3B,SACA,eACA,UAAU,SACU;AACpB,QACE,oBAAC,OAAD;EAAK,WAAU;YACb,qBAAC,OAAD;GAAK,WAAU;aAAf,CACE,oBAAC,OAAD;IAAK,WAAU;cACb,oBAAC,OAAD;KACE,KAAK,WAAW;KAChB,KAAK;KACL,OAAO;KACP,QAAQ;KACR,WAAU;KACV,CAAA;IACE,CAAA,EACN,oBAAC,OAAD;IACE,WACE,gBACI,6CACA;cAGN,oBAAC,OAAD;KACE,KAAK,iBAAiB;KACtB,KAAI;KACJ,OAAO;KACP,QAAQ;KACR,WAAU;KACV,CAAA;IACE,CAAA,CACF;;EACF,CAAA;;;;AC1CV,SAAgB,GAAG,GAAG,QAAsB;AAC1C,QAAO,QAAQ,KAAK,OAAO,CAAC;;;;ACC9B,MAAM,uBACJ;AACF,MAAM,wBACJ;AAYF,SAAgBA,oBAAkB,EAChC,WACA,aACA,cACA,SACA,eACA,SACA,aACyB;CACzB,MAAM,sBAAsB,aAAa,MAAM,IAAI;CACnD,MAAM,uBAAuB,cAAc,MAAM,IAAI;AAErD,QACE,oBAAC,OAAD;EACE,WAAW,GAAG,+CAA+C,UAAU;YAEvE,oBAAC,OAAD;GAAK,WAAU;aACb,qBAAC,OAAD;IAAK,WAAU;cAAf,CAEE,oBAAC,cAAD;KACW;KACM;KACN;KACT,CAAA,EAGF,qBAAC,OAAD;KAAK,WAAU;eAAf;MACE,oBAAC,MAAD;OAAI,WAAU;iBAAqE;OAE9E,CAAA;MACL,oBAAC,MAAD;OAAI,WAAU;iBAAqE;OAE9E,CAAA;MACL,oBAAC,KAAD;OAAG,WAAU;iBAA4D;OAIrE,CAAA;MAEJ,oBAAC,MAAD;OAAI,WAAU;iBAAsD;OAE/D,CAAA;MAEL,oBAAC,iBAAD;OACE,aAAa;OACb,cAAc;OACd,CAAA;MAEF,oBAAC,eAAD,EAA0B,WAAa,CAAA;MACnC;OACF;;GACF,CAAA;EACF,CAAA;;;;ACpEV,MAAa,kCAAkC;CAC7C,YAAY;CACZ,aAAa;CACb,QAAQ,EAAE;CACX;AAED,SAAgB,oBAAuC;CACrD,MAAM,EAAE,MAAM,SAAS,gBAAgB;AAEvC,QACE,oBAACC,qBAAD;EACE,WAAW,MAAM,SAAS,MAAM;EAChC,aAAa,MAAM,SAAS;EAC5B,cAAc,MAAM,SAAS;EAC7B,SAAS,MAAM,SAAS;EACxB,CAAA"}

package/dist/{AppDownloadScreen-oMzxBETr.cjs → AppDownloadScreen-BXWBVnQM.cjs}

@@ -25,7 +25,7 @@ function GooglePlayIcon() {
 }
 function AppStoreButtons({ appstoreUrl, playstoreUrl }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: `grid gap-4 ${playstoreUrl ? "grid-cols-2" : "grid-cols-1"}`,
+		className: `grid gap-4 ${playstoreUrl ? "grid-cols-1 sm:grid-cols-2" : "grid-cols-1"}`,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
 			href: appstoreUrl,
 			target: "_blank",
@@ -220,4 +220,4 @@ Object.defineProperty(exports, "appDownloadScreenPropertySchema", {
 	}
 });
 
-//# sourceMappingURL=AppDownloadScreen-oMzxBETr.cjs.map
+//# sourceMappingURL=AppDownloadScreen-BXWBVnQM.cjs.map

package/dist/AppDownloadScreen-BXWBVnQM.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AppDownloadScreen-BXWBVnQM.cjs","names":["ExternalLink","AppDownloadScreen","useCurrentUser","AppDownloadScreenUI"],"sources":["../../app-download-ui/src/components/AppStoreButtons.tsx","../../app-download-ui/src/components/QrCodeSection.tsx","../../app-download-ui/src/components/ImageSection.tsx","../../app-download-ui/src/lib/cn.ts","../../app-download-ui/src/components/AppDownloadScreen.tsx","../src/screens/AppDownloadScreen.tsx"],"sourcesContent":["import { ExternalLink } from \"lucide-react\";\n\nexport interface AppStoreButtonsProps {\n  appstoreUrl: string;\n  playstoreUrl?: string;\n}\n\nfunction AppleIcon() {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 384 512\"\n      fill=\"currentColor\"\n      className=\"size-5\"\n    >\n      <path d=\"M318.7 268.7c-.2-36.7 16.4-64.4 50-84.8-18.8-26.9-47.2-41.7-84.7-44.6-35.5-2.8-74.3 20.7-88.5 20.7-15 0-49.4-19.7-76.4-19.7C63.3 141.2 4 184.8 4 273.5q0 39.3 14.4 81.2c12.8 36.7 59 126.7 107.2 125.2 25.2-.6 43-17.9 75.8-17.9 31.8 0 48.3 17.9 76.4 17.9 48.6-.7 90.4-82.5 102.6-119.3-65.2-30.7-61.7-90-61.7-91.9zm-56.6-164.2c27.3-32.4 24.8-62.1 24-72.5-24.1 1.4-52 16.4-67.9 34.9-17.5 19.8-27.8 44.3-25.6 71.9 26.1 2 49.9-11.4 69.5-34.3z\" />\n    </svg>\n  );\n}\n\nfunction GooglePlayIcon() {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 512 512\"\n      fill=\"currentColor\"\n      className=\"size-5\"\n    >\n      <path d=\"M325.3 234.3L104.6 13l280.8 161.2-60.1 60.1zM47 0C34 6.8 25.3 19.2 25.3 35.3v441.3c0 16.1 8.7 28.5 21.7 35.3l256.6-256L47 0zm425.2 225.6l-58.9-34.1-65.7 64.5 65.7 64.5 60.1-34.1c18-14.3 18-46.5-1.2-60.8zM104.6 499l280.8-161.2-60.1-60.1L104.6 499z\" />\n    </svg>\n  );\n}\n\nexport function AppStoreButtons({\n  appstoreUrl,\n  playstoreUrl,\n}: AppStoreButtonsProps) {\n  return (\n    <div\n      className={`grid gap-4 ${playstoreUrl ? \"grid-cols-1 sm:grid-cols-2\" : \"grid-cols-1\"}`}\n    >\n      <a\n        href={appstoreUrl}\n        target=\"_blank\"\n        rel=\"noopener noreferrer\"\n        className=\"block cursor-pointer rounded-sm border bg-white px-4 py-4 text-gray-900 transition-colors hover:bg-gray-50\"\n      >\n        <div className=\"flex justify-between\">\n          <div className=\"flex flex-col items-baseline\">\n            <AppleIcon />\n            <div className=\"mt-1 text-left text-xs font-semibold\">\n              Open\n              <br />\n              App Store\n            </div>\n          </div>\n          <div className=\"flex items-start\">\n            <ExternalLink className=\"size-4\" />\n          </div>\n        </div>\n      </a>\n\n      {playstoreUrl && (\n        <a\n          href={playstoreUrl}\n          target=\"_blank\"\n          rel=\"noopener noreferrer\"\n          className=\"block cursor-pointer rounded-sm border bg-white px-4 py-4 text-gray-900 transition-colors hover:bg-gray-50\"\n        >\n          <div className=\"flex justify-between\">\n            <div className=\"flex flex-col items-baseline\">\n              <GooglePlayIcon />\n              <div className=\"mt-1 text-left text-xs font-semibold\">\n                Open\n                <br />\n                Play Store\n              </div>\n            </div>\n            <div className=\"flex items-start\">\n              <ExternalLink className=\"size-4\" />\n            </div>\n          </div>\n        </a>\n      )}\n    </div>\n  );\n}\n","export interface QrCodeSectionProps {\n  companyId: number;\n}\n\nexport function QrCodeSection({ companyId }: QrCodeSectionProps) {\n  const redirectUrl = `https://api.fluid.app/mobile_app_download/${companyId}`;\n  const qrCodeUrl = `https://api.qrserver.com/v1/create-qr-code/?size=200x200&data=${encodeURIComponent(redirectUrl)}`;\n\n  return (\n    <a\n      href={redirectUrl}\n      target=\"_blank\"\n      rel=\"noopener noreferrer\"\n      className=\"block cursor-pointer rounded-sm border bg-white px-4 py-4 text-gray-900 transition-colors hover:bg-gray-50\"\n    >\n      <div className=\"flex items-end justify-between\">\n        <div className=\"flex flex-col items-baseline\">\n          <div className=\"mt-1 text-left text-xs font-semibold\">\n            Scan to\n            <br />\n            Download\n          </div>\n        </div>\n        <div className=\"flex\">\n          <img\n            src={qrCodeUrl}\n            alt=\"QR code for mobile app download\"\n            className=\"h-16 w-16\"\n            loading=\"lazy\"\n          />\n        </div>\n      </div>\n    </a>\n  );\n}\n","const DEFAULT_IMAGE =\n  \"https://assets.fluid.app/fluid-admin/images/we-commerce/iphone_product.png\";\n\nconst DEFAULT_LOGO =\n  \"https://assets.fluid.app/fluid-admin/images/we-commerce/we-commerce.png\";\n\nexport interface ImageSectionProps {\n  logoUrl?: string | null;\n  screenshotUrl?: string | null;\n  appName?: string;\n}\n\nexport function ImageSection({\n  logoUrl,\n  screenshotUrl,\n  appName = \"App\",\n}: ImageSectionProps) {\n  return (\n    <div className=\"flex flex-col overflow-hidden\">\n      <div className=\"-mb-px flex flex-1 flex-col\">\n        <div className=\"flex h-20 px-3 pt-8\">\n          <img\n            src={logoUrl || DEFAULT_LOGO}\n            alt={appName}\n            width={150}\n            height={150}\n            className=\"object-contain\"\n          />\n        </div>\n        <div\n          className={\n            screenshotUrl\n              ? \"mt-8 flex flex-1 items-end justify-start\"\n              : \"-ml-20 flex flex-1 items-end justify-start\"\n          }\n        >\n          <img\n            src={screenshotUrl || DEFAULT_IMAGE}\n            alt=\"Mobile app interface\"\n            width={480}\n            height={500}\n            className=\"h-full w-auto object-cover\"\n          />\n        </div>\n      </div>\n    </div>\n  );\n}\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n","import { AppStoreButtons } from \"./AppStoreButtons\";\nimport { QrCodeSection } from \"./QrCodeSection\";\nimport { ImageSection } from \"./ImageSection\";\nimport { cn } from \"../lib/cn\";\n\nconst DEFAULT_APPSTORE_URL =\n  \"https://apps.apple.com/app/wecommerce/id1564463740\";\nconst DEFAULT_PLAYSTORE_URL =\n  \"https://play.google.com/store/apps/details?id=com.fluid.crm\";\n\nexport interface AppDownloadScreenProps {\n  companyId: number;\n  appstoreUrl?: string | null;\n  playstoreUrl?: string | null;\n  logoUrl?: string | null;\n  screenshotUrl?: string | null;\n  appName?: string;\n  className?: string;\n}\n\nexport function AppDownloadScreen({\n  companyId,\n  appstoreUrl,\n  playstoreUrl,\n  logoUrl,\n  screenshotUrl,\n  appName,\n  className,\n}: AppDownloadScreenProps) {\n  const resolvedAppstoreUrl = appstoreUrl?.trim() || DEFAULT_APPSTORE_URL;\n  const resolvedPlaystoreUrl = playstoreUrl?.trim() || DEFAULT_PLAYSTORE_URL;\n\n  return (\n    <div\n      className={cn(\"flex h-full items-center justify-center p-4\", className)}\n    >\n      <div className=\"bg-muted relative mx-4 w-full max-w-6xl overflow-hidden rounded-xl px-6 shadow-xl\">\n        <div className=\"grid h-150 w-full grid-cols-1 lg:grid-cols-2\">\n          {/* Left side - Images */}\n          <ImageSection\n            logoUrl={logoUrl}\n            screenshotUrl={screenshotUrl}\n            appName={appName}\n          />\n\n          {/* Right side - Content */}\n          <div className=\"space-y-2 pt-8 pb-8\">\n            <h1 className=\"mt-12 text-left text-[32px] leading-tight font-black text-gray-900\">\n              EVERYTHING YOU NEED\n            </h1>\n            <h1 className=\"-mt-2 text-left text-[32px] leading-tight font-black text-gray-900\">\n              AT YOUR FINGERTIPS\n            </h1>\n            <p className=\"-mt-1 text-left text-[14px] leading-relaxed text-gray-600\">\n              Everything you need at your fingertips. Run your business from one\n              place while on the go. Share, message, sell, and manage from the\n              mobile app.\n            </p>\n\n            <h3 className=\"mt-16 text-left text-[12px] font-bold text-gray-900\">\n              Download the App\n            </h3>\n\n            <AppStoreButtons\n              appstoreUrl={resolvedAppstoreUrl}\n              playstoreUrl={resolvedPlaystoreUrl}\n            />\n\n            <QrCodeSection companyId={companyId} />\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n}\n","import type { WidgetPropertySchema } from \"../registries/property-schema-types\";\nimport { AppDownloadScreen as AppDownloadScreenUI } from \"@fluid-app/portal-app-download-ui\";\nimport { useCurrentUser } from \"../hooks/use-current-user\";\n\nexport const appDownloadScreenPropertySchema = {\n  widgetType: \"AppDownloadScreen\",\n  displayName: \"App Download Screen\",\n  fields: [],\n} as const satisfies WidgetPropertySchema;\n\nexport function AppDownloadScreen(): React.JSX.Element {\n  const { data: user } = useCurrentUser();\n\n  return (\n    <AppDownloadScreenUI\n      companyId={user?.company?.id ?? 0}\n      appstoreUrl={user?.company?.appstore_url}\n      playstoreUrl={user?.company?.playstore_url}\n      logoUrl={user?.company?.logo_url}\n    />\n  );\n}\n"],"mappings":"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"}

package/dist/{AppDownloadScreen-DW3cBnbI.cjs → AppDownloadScreen-BtwySuUY.cjs}

@@ -32,6 +32,6 @@ require("./SpacerWidget-Br2IZFFv.cjs");
 require("./TableWidget-Cri6r5Yr.cjs");
 require("./ToDoWidget-Bv6POc5R.cjs");
 require("./VideoWidget-DnnuIvW1.cjs");
-const require_AppDownloadScreen = require("./AppDownloadScreen-oMzxBETr.cjs");
+const require_AppDownloadScreen = require("./AppDownloadScreen-BXWBVnQM.cjs");
 exports.AppDownloadScreen = require_AppDownloadScreen.AppDownloadScreen;
 exports.appDownloadScreenPropertySchema = require_AppDownloadScreen.appDownloadScreenPropertySchema;

package/dist/{ShopScreen-DCKr0cbB.cjs → ShopScreen-Bo9Bbpg8.cjs}

@@ -33,6 +33,6 @@ require("./TableWidget-Cri6r5Yr.cjs");
 require("./ToDoWidget-Bv6POc5R.cjs");
 require("./VideoWidget-DnnuIvW1.cjs");
 require("./ScreenHeaderContext-eyKPyDoQ.cjs");
-const require_ShopScreen = require("./ShopScreen-qgOXPdUf.cjs");
+const require_ShopScreen = require("./ShopScreen-D-1WO4sB.cjs");
 exports.ShopScreen = require_ShopScreen.ShopScreen;
 exports.shopScreenPropertySchema = require_ShopScreen.shopScreenPropertySchema;

package/dist/{ShopScreen-Bg696rqv.mjs → ShopScreen-CMkEtT1s.mjs}

@@ -32,5 +32,5 @@ import "./TableWidget-DjYabx1e.mjs";
 import "./ToDoWidget-Cmvf7I6c.mjs";
 import "./VideoWidget-51MxnPRZ.mjs";
 import "./ScreenHeaderContext-CrdfLGKk.mjs";
-import { n as shopScreenPropertySchema, t as ShopScreen } from "./ShopScreen-DFWQY8hT.mjs";
+import { n as shopScreenPropertySchema, t as ShopScreen } from "./ShopScreen-XGC180Ts.mjs";
 export { ShopScreen, shopScreenPropertySchema };

package/dist/{ShopScreen-qgOXPdUf.cjs → ShopScreen-D-1WO4sB.cjs}

@@ -1,4 +1,4 @@
-require("./chunk-DAgNkxik.cjs");
+const require_chunk = require("./chunk-DAgNkxik.cjs");
 const require_FluidProvider = require("./FluidProvider-SnHdl4ww.cjs");
 const require_src = require("./src-DqIS-4ns.cjs");
 const require_use_account_clients = require("./use-account-clients-Bem920_7.cjs");
@@ -7,9 +7,11 @@ const require_use_current_user = require("./use-current-user-Bld9wMVT.cjs");
 const require_AppNavigationContext = require("./AppNavigationContext-B88_pXjo.cjs");
 const require_products = require("./products-BtHCYNv6.cjs");
 let react = require("react");
+react = require_chunk.__toESM(react);
 let _tanstack_react_query = require("@tanstack/react-query");
 let react_jsx_runtime = require("react/jsx-runtime");
 let lucide_react = require("lucide-react");
+let react_dom = require("react-dom");
 let _home_runner__work_fluid_mono_fluid_mono_node_modules__pnpm_zustand_5_0_9__types_react_19_2_13_immer_10_2_0_react_19_2_4_use_sync_external_store_1_6_0_react_19_2_4__node_modules_zustand_esm_index_mjs = require("/home/runner/_work/fluid-mono/fluid-mono/node_modules/.pnpm/zustand@5.0.9_@types+react@19.2.13_immer@10.2.0_react@19.2.4_use-sync-external-store@1.6.0_react@19.2.4_/node_modules/zustand/esm/index.mjs");
 let _home_runner__work_fluid_mono_fluid_mono_node_modules__pnpm_zustand_5_0_9__types_react_19_2_13_immer_10_2_0_react_19_2_4_use_sync_external_store_1_6_0_react_19_2_4__node_modules_zustand_esm_middleware_mjs = require("/home/runner/_work/fluid-mono/fluid-mono/node_modules/.pnpm/zustand@5.0.9_@types+react@19.2.13_immer@10.2.0_react@19.2.4_use-sync-external-store@1.6.0_react@19.2.4_/node_modules/zustand/esm/middleware.mjs");
 //#region ../../products/api-client/src/utils/product-price.ts
@@ -1550,13 +1552,165 @@ function ShopApp({ countryCode, companyLogoUrl, renderImage, onAddToCart, produc
 	});
 }
 //#endregion
+//#region ../../cart/ui/src/components/cart-script.tsx
+const SCRIPT_ID = "fluid-cdn-script";
+const LEAD_CAPTURE_ID = "fluid-lead-capture-suppress";
+const SCRIPT_SRC = "https://assets.fluid.app/scripts/fluid-sdk/latest/web-widgets/index.js";
+function CartScript({ subdomain, authJwt }) {
+	const authJwtRef = (0, react.useRef)(authJwt);
+	authJwtRef.current = authJwt;
+	(0, react.useEffect)(() => {
+		if (!subdomain) return;
+		if (document.getElementById(SCRIPT_ID)) return;
+		const script = document.createElement("script");
+		script.id = SCRIPT_ID;
+		script.src = SCRIPT_SRC;
+		script.type = "module";
+		script.crossOrigin = "anonymous";
+		script.dataset.fluidShop = subdomain;
+		if (authJwtRef.current) script.dataset.authJwt = authJwtRef.current;
+		document.head.appendChild(script);
+		const leadCapture = document.createElement("fluid-lead-capture");
+		leadCapture.id = LEAD_CAPTURE_ID;
+		leadCapture.setAttribute("hide-widget", "true");
+		document.body.appendChild(leadCapture);
+		return () => {
+			const existing = document.getElementById(SCRIPT_ID);
+			if (existing) existing.remove();
+			const existingLeadCapture = document.getElementById(LEAD_CAPTURE_ID);
+			if (existingLeadCapture) existingLeadCapture.remove();
+		};
+	}, [subdomain]);
+	return null;
+}
+//#endregion
+//#region ../../cart/ui/src/components/cart-widget.tsx
+function CartWidget({ theme }) {
+	const [mounted, setMounted] = (0, react.useState)(false);
+	const widgetRef = (0, react.useRef)(null);
+	(0, react.useEffect)(() => {
+		setMounted(true);
+	}, []);
+	(0, react.useEffect)(() => {
+		if (!mounted) return;
+		const el = widgetRef.current;
+		if (!el) return;
+		if (theme) el.setAttribute("theme", JSON.stringify(theme));
+		else el.removeAttribute("theme");
+	}, [theme, mounted]);
+	const widget = react.default.createElement("fluid-cart-widget", {
+		ref: (el) => {
+			widgetRef.current = el;
+		},
+		"data-fluid-widget": "true",
+		"hide-widget": "true",
+		"is-primary": "true"
+	});
+	if (mounted) return (0, react_dom.createPortal)(widget, document.body);
+	return null;
+}
+//#endregion
+//#region ../../cart/ui/src/components/cart-button.tsx
+const MAX_SDK_POLL_ATTEMPTS = 50;
+function CartButton({ onCheckout }) {
+	const [initialCount, setInitialCount] = (0, react.useState)(0);
+	const navigateToCheckout = (0, react.useCallback)(() => {
+		if (!window.FluidCommerceSDK) {
+			console.error("FluidCommerceSDK not available");
+			return;
+		}
+		try {
+			const checkoutUrl = window.FluidCommerceSDK.getCheckoutUrl();
+			if (!checkoutUrl) {
+				console.error("No checkout URL available");
+				return;
+			}
+			onCheckout?.(checkoutUrl);
+		} catch (error) {
+			console.error("Error getting checkout URL:", error);
+		}
+	}, [onCheckout]);
+	(0, react.useEffect)(() => {
+		let timeoutId = null;
+		let attempts = 0;
+		let cancelled = false;
+		const setupSDK = () => {
+			if (cancelled) return;
+			if (window.FluidCommerceSDK) {
+				if (onCheckout) window.FluidCommerceSDK.setOnCheckout(navigateToCheckout);
+				const count = window.FairShareSDK?.getCartItemCount?.();
+				if (count != null) setInitialCount(count);
+			} else if (attempts < MAX_SDK_POLL_ATTEMPTS) {
+				attempts++;
+				timeoutId = setTimeout(setupSDK, 100);
+			}
+		};
+		setupSDK();
+		return () => {
+			cancelled = true;
+			if (timeoutId) clearTimeout(timeoutId);
+		};
+	}, [navigateToCheckout, onCheckout]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.Button, {
+		className: "bg-primary text-primary-foreground hover:bg-primary-700 relative flex items-center gap-4 rounded-sm px-4 py-1.5",
+		onClick: () => {
+			window.fluidCart?.open();
+		},
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "relative",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ShoppingCart, { className: "size-5" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				id: "fluid-cart-count",
+				className: "bg-primary-foreground text-primary absolute -top-1 -right-2 flex h-4 w-4 items-center justify-center rounded-full text-[8px] font-bold",
+				children: initialCount
+			})]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: "Cart" })]
+	});
+}
+//#endregion
+//#region ../../cart/ui/src/components/shop-container.tsx
+function ShopContainer({ children, className = "", cartScript, cartWidget }) {
+	const containerRef = (0, react.useRef)(null);
+	const [portalContainer, setPortalContainer] = (0, react.useState)(null);
+	(0, react.useEffect)(() => {
+		const currentContainer = containerRef.current;
+		if (!currentContainer) return;
+		const reactContentWrapper = document.createElement("div");
+		reactContentWrapper.id = "react-content-wrapper";
+		reactContentWrapper.style.cssText = `
+      position: relative;
+    `;
+		reactContentWrapper.className = "min-h-full";
+		currentContainer.appendChild(reactContentWrapper);
+		setPortalContainer(reactContentWrapper);
+		return () => {
+			if (currentContainer && reactContentWrapper) try {
+				currentContainer.removeChild(reactContentWrapper);
+			} catch (e) {
+				console.warn("Failed to cleanup isolated container:", e);
+			}
+			setPortalContainer(null);
+		};
+	}, []);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		ref: containerRef,
+		className: `isolated-shop-wrapper ${className} h-full`,
+		children: portalContainer && (0, react_dom.createPortal)(/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+			cartScript,
+			cartWidget,
+			children
+		] }), portalContainer)
+	}) });
+}
+//#endregion
 //#region src/screens/ShopScreen.tsx
 function ShopScreen({ background, textColor, accentColor, padding, borderRadius, ...divProps }) {
 	const { config } = require_FluidProvider.useFluidContext();
 	const domainClient = require_use_account_clients.useSdkClient();
+	const { token } = require_use_account_clients.useFluidAuth();
 	const { data: userData } = require_use_current_user.useCurrentUser();
 	const { currentSlug, navigate } = require_AppNavigationContext.useAppNavigation();
 	const countryCode = config.countryIso ?? userData?.country?.iso ?? "US";
+	const subdomain = userData?.company?.subdomain;
 	require_ScreenHeaderContext.useScreenHeaderBreadcrumbs((0, react.useMemo)(() => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Breadcrumb, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.BreadcrumbList, {
 		className: "text-lg",
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.BreadcrumbItem, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.BreadcrumbPage, {
@@ -1564,18 +1718,29 @@ function ShopScreen({ background, textColor, accentColor, padding, borderRadius,
 			children: "Shop"
 		}) })
 	}) }), []));
+	require_ScreenHeaderContext.useScreenHeaderActions((0, react.useMemo)(() => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "flex items-center gap-4",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CartButton, {})
+	}), []));
 	const productId = currentSlug.split("/")[1] ?? null;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		...divProps,
 		className: `h-full ${divProps.className ?? ""}`,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ProductsCoreProvider, {
-			client: domainClient,
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ShopApp, {
-				countryCode,
-				companyLogoUrl: userData?.company?.logo_url,
-				productId,
-				onSelectProduct: (id) => navigate(`shop/${id}`),
-				onBack: () => navigate("shop")
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ShopContainer, {
+			cartScript: subdomain ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CartScript, {
+				subdomain,
+				authJwt: token ?? void 0
+			}) : null,
+			cartWidget: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CartWidget, {}),
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ProductsCoreProvider, {
+				client: domainClient,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ShopApp, {
+					countryCode,
+					companyLogoUrl: userData?.company?.logo_url,
+					productId,
+					onSelectProduct: (id) => navigate(`shop/${id}`),
+					onBack: () => navigate("shop")
+				})
 			})
 		})
 	});
@@ -1603,4 +1768,4 @@ Object.defineProperty(exports, "shopScreenPropertySchema", {
 	}
 });
 
-//# sourceMappingURL=ShopScreen-qgOXPdUf.cjs.map
+//# sourceMappingURL=ShopScreen-D-1WO4sB.cjs.map