@keboola/design 6.3.0 → 6.4.0

package/dist/icons.cjs

@@ -78,9 +78,33 @@ var Keboola = react.forwardRef(
   )
 );
 Keboola.displayName = "Keboola";
+var Microsoft = react.forwardRef(
+  ({ size = 24, className, children, ...rest }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      ref,
+      xmlns: "http://www.w3.org/2000/svg",
+      width: size,
+      height: size,
+      viewBox: "0 0 21 21",
+      fill: "none",
+      className: cn("lucide", className),
+      ...rest,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "0", y: "0", width: "10", height: "10", fill: "#F25022" }),
+        /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "11", y: "0", width: "10", height: "10", fill: "#7FBA00" }),
+        /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "0", y: "11", width: "10", height: "10", fill: "#00A4EF" }),
+        /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "11", y: "11", width: "10", height: "10", fill: "#FFB900" }),
+        children
+      ]
+    }
+  )
+);
+Microsoft.displayName = "Microsoft";
 
 exports.Google = Google;
 exports.Keboola = Keboola;
+exports.Microsoft = Microsoft;
 Object.keys(lucideReact).forEach(function (k) {
   if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
     enumerable: true,

package/dist/icons.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/utils/classNames.ts","../src/icons/Google.tsx","../src/icons/Keboola.tsx"],"names":["extendTailwindMerge","clsx","forwardRef","jsxs","jsx"],"mappings":";;;;;;;;;AAGA,IAAM,UAAUA,iCAAA,CAAoB;AAAA,EAClC,MAAA,EAAQ;AACV,CAAC,CAAA;AAEM,IAAM,KAAK,CAAA,GAAI,OAAA,KAA0B,QAAQC,SAAA,CAAK,GAAG,OAAO,CAAC,CAAA;ACGjE,IAAM,MAAA,GAAqBC,gBAAA;AAAA,EAChC,CAAC,EAAE,IAAA,GAAO,EAAA,EAAI,WAAW,QAAA,EAAU,GAAG,IAAA,EAAK,EAAG,GAAA,qBAC5CC,eAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,KAAA,EAAM,4BAAA;AAAA,MACN,KAAA,EAAO,IAAA;AAAA,MACP,MAAA,EAAQ,IAAA;AAAA,MACR,OAAA,EAAQ,aAAA;AAAA,MACR,IAAA,EAAK,MAAA;AAAA,MACL,SAAA,EAAW,EAAA,CAAG,QAAA,EAAU,SAAS,CAAA;AAAA,MAChC,GAAG,IAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAAAC,cAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,CAAA,EAAE,mLAAA;AAAA,YACF,IAAA,EAAK;AAAA;AAAA,SACP;AAAA,wBACAA,cAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,CAAA,EAAE,0MAAA;AAAA,YACF,IAAA,EAAK;AAAA;AAAA,SACP;AAAA,wBACAA,cAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,CAAA,EAAE,2MAAA;AAAA,YACF,IAAA,EAAK;AAAA;AAAA,SACP;AAAA,wBACAA,cAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,CAAA,EAAE,kNAAA;AAAA,YACF,IAAA,EAAK;AAAA;AAAA,SACP;AAAA,QACC;AAAA;AAAA;AAAA;AAGP;AAEA,MAAA,CAAO,WAAA,GAAc,QAAA;AChCd,IAAM,OAAA,GAAsBF,gBAAAA;AAAA,EACjC,CAAC,EAAE,IAAA,GAAO,EAAA,EAAI,KAAA,GAAQ,cAAA,EAAgB,SAAA,EAAW,QAAA,EAAU,GAAG,IAAA,EAAK,EAAG,GAAA,qBACpEC,eAAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,KAAA,EAAM,4BAAA;AAAA,MACN,KAAA,EAAO,IAAA;AAAA,MACP,MAAA,EAAQ,IAAA;AAAA,MACR,OAAA,EAAQ,aAAA;AAAA,MACR,IAAA,EAAM,KAAA;AAAA,MACN,SAAA,EAAW,EAAA,CAAG,QAAA,EAAU,SAAS,CAAA;AAAA,MAChC,GAAG,IAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAAAC,cAAAA,CAAC,MAAA,EAAA,EAAK,CAAA,EAAE,ihDAAA,EAAkhD,CAAA;AAAA,QACzhD;AAAA;AAAA;AAAA;AAGP;AAEA,OAAA,CAAQ,WAAA,GAAc,SAAA","file":"icons.cjs","sourcesContent":["import { type ClassValue, clsx } from 'clsx';\nimport { extendTailwindMerge } from 'tailwind-merge';\n\nconst twMerge = extendTailwindMerge({\n  prefix: 'tw-',\n});\n\nexport const cn = (...classes: ClassValue[]) => twMerge(clsx(...classes));\n","import { forwardRef } from 'react';\nimport type { LucideIcon, LucideProps } from 'lucide-react';\n\nimport { cn } from '../utils';\n\n// `forwardRef` here is required for type compatibility with `LucideIcon` — see\n// `Keboola.tsx` for the full rationale. The Google \"G\" is a fixed four-color\n// vendor mark (`#4285F4 / #34A853 / #FBBC04 / #EA4335`): its paths keep their\n// own fills and ignore `color`, and it must NOT re-skin under a customer brand.\n// oxlint-disable-next-line react-x/no-forward-ref\nexport const Google: LucideIcon = forwardRef<SVGSVGElement, LucideProps>(\n  ({ size = 24, className, children, ...rest }, ref) => (\n    <svg\n      ref={ref}\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width={size}\n      height={size}\n      viewBox=\"12 10 20 20\"\n      fill=\"none\"\n      className={cn('lucide', className)}\n      {...rest}\n    >\n      <path\n        d=\"M31.6 20.2273C31.6 19.5182 31.5364 18.8364 31.4182 18.1818H22V22.05H27.3818C27.15 23.3 26.4455 24.3591 25.3864 25.0682V27.5773H28.6182C30.5091 25.8364 31.6 23.2727 31.6 20.2273Z\"\n        fill=\"#4285F4\"\n      />\n      <path\n        d=\"M22 30C24.7 30 26.9636 29.1045 28.6181 27.5773L25.3863 25.0682C24.4909 25.6682 23.3454 26.0227 22 26.0227C19.3954 26.0227 17.1909 24.2636 16.4045 21.9H13.0636V24.4909C14.7091 27.7591 18.0909 30 22 30Z\"\n        fill=\"#34A853\"\n      />\n      <path\n        d=\"M16.4045 21.9C16.2045 21.3 16.0909 20.6591 16.0909 20C16.0909 19.3409 16.2045 18.7 16.4045 18.1V15.5091H13.0636C12.3864 16.8591 12 18.3864 12 20C12 21.6136 12.3864 23.1409 13.0636 24.4909L16.4045 21.9Z\"\n        fill=\"#FBBC04\"\n      />\n      <path\n        d=\"M22 13.9773C23.4681 13.9773 24.7863 14.4818 25.8227 15.4727L28.6909 12.6045C26.9591 10.9909 24.6954 10 22 10C18.0909 10 14.7091 12.2409 13.0636 15.5091L16.4045 18.1C17.1909 15.7364 19.3954 13.9773 22 13.9773Z\"\n        fill=\"#EA4335\"\n      />\n      {children}\n    </svg>\n  ),\n);\n\nGoogle.displayName = 'Google';\n","import { forwardRef } from 'react';\nimport type { LucideIcon, LucideProps } from 'lucide-react';\n\nimport { cn } from '../utils';\n\n// `forwardRef` here is required for type compatibility with `LucideIcon`\n// (a `ForwardRefExoticComponent` from lucide-react). React 19's ref-as-prop\n// pattern produces a plain function component which isn't structurally\n// assignable to `LucideIcon`, so consumers couldn't pass `Keboola`\n// interchangeably with imported Lucide icons (e.g. `<Button><Keboola className=\"tw-size-4\" /></Button>`).\n// oxlint-disable-next-line react-x/no-forward-ref\nexport const Keboola: LucideIcon = forwardRef<SVGSVGElement, LucideProps>(\n  ({ size = 24, color = 'currentColor', className, children, ...rest }, ref) => (\n    <svg\n      ref={ref}\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width={size}\n      height={size}\n      viewBox=\"0 0 300 512\"\n      fill={color}\n      className={cn('lucide', className)}\n      {...rest}\n    >\n      <path d=\"M152 320C79.7 320 24.5 233.9 24.5 124.7C24.5 15.6 70.5 0 152 0s123.6 15.6 123.6 124.7C275.5 233.9 217.7 320 152 320zm-8.7-50.5c0-11.2-9.5-20.3-21.2-20.3s-21.2 9.1-21.2 20.3c0 11.2 9.5 20.3 21.2 20.3s21.2-9.1 21.2-20.3zm55.7 0c0-11.2-9.5-20.3-21.2-20.3s-21.2 9.1-21.2 20.3c0 11.2 9.5 20.3 21.2 20.3s21.2-9.1 21.2-20.3zm68.9 115.1c10.2 9.3 20.2 20.5 29 35c5.9 9.7 2.6 22.1-7.5 27.8c-3.4 1.9-7.1 2.8-10.7 2.8c-7.2 0-14.3-3.6-18.3-10c-6.8-11.1-13.8-18.9-21.7-26.1c-7.3-6.7-15.6-12.7-24.9-19.5c-.7-.5-1.4-1-2.1-1.5c-5-3.6-10-6.8-14.9-9.4c.6 1 1.2 2.1 1.8 3.2c14.4 26.4 29.2 63.1 29.2 104.9c0 11.2-9.5 20.3-21.2 20.3c-11.7 0-21.2-9.1-21.2-20.3c.1-31.8-11.6-62.3-23.8-84.9c-4-7.4-8-13.9-11.6-19.3c-3.4 5.2-7.2 11.3-11 18.3c-12.5 22.7-24.5 53.8-24.4 86c0 11.2-9.5 20.3-21.2 20.3s-21.2-9.1-21.2-20.3c.1-41.8 14.9-78.4 29.2-104.9c.6-1.1 1.2-2.1 1.8-3.2c-5 2.7-9.9 5.8-14.9 9.4c-.6 .5-1.3 .9-1.9 1.4c-9.5 6.9-17.8 12.9-25.1 19.7c-7.9 7.2-14.9 15.1-21.7 26.1c-5.9 9.7-18.9 12.9-29 7.2C.5 441.8-2.9 429.3 3.1 419.7c8.9-14.4 18.8-25.7 29-35c9.2-8.4 18.5-15.1 27.6-21.7c1-.7 2-1.4 3-2.2c4.7-3.5 9.6-6.7 14.6-9.6c-5-2.9-9.8-6.1-14.6-9.6C39.8 325 19.9 302.5 3.1 275.1c-5.9-9.7-2.6-22.1 7.5-27.8c10.1-5.7 23.1-2.5 29 7.2c14.6 23.7 31.1 42 48.7 54.9c18.9 13.7 37.4 20.5 56.5 21.5c1.7-.1 3.5-.1 5.2-.1c1.8 0 3.5 .1 5.2 .1c0 0 0 0 0 0c19.1-1.1 37.6-7.9 56.5-21.5c17.6-12.8 34.2-31.2 48.7-54.9c6-9.7 18.9-12.9 29-7.2c10.1 5.7 13.4 18.1 7.5 27.8c-16.8 27.4-36.7 49.9-59.6 66.6c-4.7 3.5-9.6 6.7-14.5 9.6c4.9 2.9 9.8 6.1 14.5 9.6c.9 .7 1.8 1.3 2.7 2c9.2 6.7 18.5 13.5 27.9 22z\" />\n      {children}\n    </svg>\n  ),\n);\n\nKeboola.displayName = 'Keboola';\n"]}
+{"version":3,"sources":["../src/utils/classNames.ts","../src/icons/Google.tsx","../src/icons/Keboola.tsx","../src/icons/Microsoft.tsx"],"names":["extendTailwindMerge","clsx","forwardRef","jsxs","jsx"],"mappings":"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","file":"icons.cjs","sourcesContent":["import { type ClassValue, clsx } from 'clsx';\nimport { extendTailwindMerge } from 'tailwind-merge';\n\nconst twMerge = extendTailwindMerge({\n  prefix: 'tw-',\n});\n\nexport const cn = (...classes: ClassValue[]) => twMerge(clsx(...classes));\n","import { forwardRef } from 'react';\nimport type { LucideIcon, LucideProps } from 'lucide-react';\n\nimport { cn } from '../utils';\n\n// `forwardRef` here is required for type compatibility with `LucideIcon` — see\n// `Keboola.tsx` for the full rationale. The Google \"G\" is a fixed four-color\n// vendor mark (`#4285F4 / #34A853 / #FBBC04 / #EA4335`): its paths keep their\n// own fills and ignore `color`, and it must NOT re-skin under a customer brand.\n// oxlint-disable-next-line react-x/no-forward-ref\nexport const Google: LucideIcon = forwardRef<SVGSVGElement, LucideProps>(\n  ({ size = 24, className, children, ...rest }, ref) => (\n    <svg\n      ref={ref}\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width={size}\n      height={size}\n      viewBox=\"12 10 20 20\"\n      fill=\"none\"\n      className={cn('lucide', className)}\n      {...rest}\n    >\n      <path\n        d=\"M31.6 20.2273C31.6 19.5182 31.5364 18.8364 31.4182 18.1818H22V22.05H27.3818C27.15 23.3 26.4455 24.3591 25.3864 25.0682V27.5773H28.6182C30.5091 25.8364 31.6 23.2727 31.6 20.2273Z\"\n        fill=\"#4285F4\"\n      />\n      <path\n        d=\"M22 30C24.7 30 26.9636 29.1045 28.6181 27.5773L25.3863 25.0682C24.4909 25.6682 23.3454 26.0227 22 26.0227C19.3954 26.0227 17.1909 24.2636 16.4045 21.9H13.0636V24.4909C14.7091 27.7591 18.0909 30 22 30Z\"\n        fill=\"#34A853\"\n      />\n      <path\n        d=\"M16.4045 21.9C16.2045 21.3 16.0909 20.6591 16.0909 20C16.0909 19.3409 16.2045 18.7 16.4045 18.1V15.5091H13.0636C12.3864 16.8591 12 18.3864 12 20C12 21.6136 12.3864 23.1409 13.0636 24.4909L16.4045 21.9Z\"\n        fill=\"#FBBC04\"\n      />\n      <path\n        d=\"M22 13.9773C23.4681 13.9773 24.7863 14.4818 25.8227 15.4727L28.6909 12.6045C26.9591 10.9909 24.6954 10 22 10C18.0909 10 14.7091 12.2409 13.0636 15.5091L16.4045 18.1C17.1909 15.7364 19.3954 13.9773 22 13.9773Z\"\n        fill=\"#EA4335\"\n      />\n      {children}\n    </svg>\n  ),\n);\n\nGoogle.displayName = 'Google';\n","import { forwardRef } from 'react';\nimport type { LucideIcon, LucideProps } from 'lucide-react';\n\nimport { cn } from '../utils';\n\n// `forwardRef` here is required for type compatibility with `LucideIcon`\n// (a `ForwardRefExoticComponent` from lucide-react). React 19's ref-as-prop\n// pattern produces a plain function component which isn't structurally\n// assignable to `LucideIcon`, so consumers couldn't pass `Keboola`\n// interchangeably with imported Lucide icons (e.g. `<Button><Keboola className=\"tw-size-4\" /></Button>`).\n// oxlint-disable-next-line react-x/no-forward-ref\nexport const Keboola: LucideIcon = forwardRef<SVGSVGElement, LucideProps>(\n  ({ size = 24, color = 'currentColor', className, children, ...rest }, ref) => (\n    <svg\n      ref={ref}\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width={size}\n      height={size}\n      viewBox=\"0 0 300 512\"\n      fill={color}\n      className={cn('lucide', className)}\n      {...rest}\n    >\n      <path d=\"M152 320C79.7 320 24.5 233.9 24.5 124.7C24.5 15.6 70.5 0 152 0s123.6 15.6 123.6 124.7C275.5 233.9 217.7 320 152 320zm-8.7-50.5c0-11.2-9.5-20.3-21.2-20.3s-21.2 9.1-21.2 20.3c0 11.2 9.5 20.3 21.2 20.3s21.2-9.1 21.2-20.3zm55.7 0c0-11.2-9.5-20.3-21.2-20.3s-21.2 9.1-21.2 20.3c0 11.2 9.5 20.3 21.2 20.3s21.2-9.1 21.2-20.3zm68.9 115.1c10.2 9.3 20.2 20.5 29 35c5.9 9.7 2.6 22.1-7.5 27.8c-3.4 1.9-7.1 2.8-10.7 2.8c-7.2 0-14.3-3.6-18.3-10c-6.8-11.1-13.8-18.9-21.7-26.1c-7.3-6.7-15.6-12.7-24.9-19.5c-.7-.5-1.4-1-2.1-1.5c-5-3.6-10-6.8-14.9-9.4c.6 1 1.2 2.1 1.8 3.2c14.4 26.4 29.2 63.1 29.2 104.9c0 11.2-9.5 20.3-21.2 20.3c-11.7 0-21.2-9.1-21.2-20.3c.1-31.8-11.6-62.3-23.8-84.9c-4-7.4-8-13.9-11.6-19.3c-3.4 5.2-7.2 11.3-11 18.3c-12.5 22.7-24.5 53.8-24.4 86c0 11.2-9.5 20.3-21.2 20.3s-21.2-9.1-21.2-20.3c.1-41.8 14.9-78.4 29.2-104.9c.6-1.1 1.2-2.1 1.8-3.2c-5 2.7-9.9 5.8-14.9 9.4c-.6 .5-1.3 .9-1.9 1.4c-9.5 6.9-17.8 12.9-25.1 19.7c-7.9 7.2-14.9 15.1-21.7 26.1c-5.9 9.7-18.9 12.9-29 7.2C.5 441.8-2.9 429.3 3.1 419.7c8.9-14.4 18.8-25.7 29-35c9.2-8.4 18.5-15.1 27.6-21.7c1-.7 2-1.4 3-2.2c4.7-3.5 9.6-6.7 14.6-9.6c-5-2.9-9.8-6.1-14.6-9.6C39.8 325 19.9 302.5 3.1 275.1c-5.9-9.7-2.6-22.1 7.5-27.8c10.1-5.7 23.1-2.5 29 7.2c14.6 23.7 31.1 42 48.7 54.9c18.9 13.7 37.4 20.5 56.5 21.5c1.7-.1 3.5-.1 5.2-.1c1.8 0 3.5 .1 5.2 .1c0 0 0 0 0 0c19.1-1.1 37.6-7.9 56.5-21.5c17.6-12.8 34.2-31.2 48.7-54.9c6-9.7 18.9-12.9 29-7.2c10.1 5.7 13.4 18.1 7.5 27.8c-16.8 27.4-36.7 49.9-59.6 66.6c-4.7 3.5-9.6 6.7-14.5 9.6c4.9 2.9 9.8 6.1 14.5 9.6c.9 .7 1.8 1.3 2.7 2c9.2 6.7 18.5 13.5 27.9 22z\" />\n      {children}\n    </svg>\n  ),\n);\n\nKeboola.displayName = 'Keboola';\n","import { forwardRef } from 'react';\nimport type { LucideIcon, LucideProps } from 'lucide-react';\n\nimport { cn } from '../utils';\n\n// `forwardRef` here is required for type compatibility with `LucideIcon`\n// (a `ForwardRefExoticComponent` from lucide-react). React 19's ref-as-prop\n// pattern produces a plain function component which isn't structurally\n// assignable to `LucideIcon`, so consumers couldn't pass `Microsoft`\n// interchangeably with imported Lucide icons. The four-square mark carries\n// fixed Microsoft brand colors and deliberately ignores `color` — it must NOT\n// re-skin under a customer brand.\n// oxlint-disable-next-line react-x/no-forward-ref\nexport const Microsoft: LucideIcon = forwardRef<SVGSVGElement, LucideProps>(\n  ({ size = 24, className, children, ...rest }, ref) => (\n    <svg\n      ref={ref}\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width={size}\n      height={size}\n      viewBox=\"0 0 21 21\"\n      fill=\"none\"\n      className={cn('lucide', className)}\n      {...rest}\n    >\n      <rect x=\"0\" y=\"0\" width=\"10\" height=\"10\" fill=\"#F25022\" />\n      <rect x=\"11\" y=\"0\" width=\"10\" height=\"10\" fill=\"#7FBA00\" />\n      <rect x=\"0\" y=\"11\" width=\"10\" height=\"10\" fill=\"#00A4EF\" />\n      <rect x=\"11\" y=\"11\" width=\"10\" height=\"10\" fill=\"#FFB900\" />\n      {children}\n    </svg>\n  ),\n);\n\nMicrosoft.displayName = 'Microsoft';\n"]}

package/dist/icons.d.cts

@@ -6,4 +6,6 @@ declare const Google: LucideIcon;
 
 declare const Keboola: LucideIcon;
 
-export { Google, Keboola };
+declare const Microsoft: LucideIcon;
+
+export { Google, Keboola, Microsoft };

package/dist/icons.d.ts

@@ -6,4 +6,6 @@ declare const Google: LucideIcon;
 
 declare const Keboola: LucideIcon;
 
-export { Google, Keboola };
+declare const Microsoft: LucideIcon;
+
+export { Google, Keboola, Microsoft };

package/dist/icons.js

@@ -76,7 +76,30 @@ var Keboola = forwardRef(
   )
 );
 Keboola.displayName = "Keboola";
+var Microsoft = forwardRef(
+  ({ size = 24, className, children, ...rest }, ref) => /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      ref,
+      xmlns: "http://www.w3.org/2000/svg",
+      width: size,
+      height: size,
+      viewBox: "0 0 21 21",
+      fill: "none",
+      className: cn("lucide", className),
+      ...rest,
+      children: [
+        /* @__PURE__ */ jsx("rect", { x: "0", y: "0", width: "10", height: "10", fill: "#F25022" }),
+        /* @__PURE__ */ jsx("rect", { x: "11", y: "0", width: "10", height: "10", fill: "#7FBA00" }),
+        /* @__PURE__ */ jsx("rect", { x: "0", y: "11", width: "10", height: "10", fill: "#00A4EF" }),
+        /* @__PURE__ */ jsx("rect", { x: "11", y: "11", width: "10", height: "10", fill: "#FFB900" }),
+        children
+      ]
+    }
+  )
+);
+Microsoft.displayName = "Microsoft";
 
-export { Google, Keboola };
+export { Google, Keboola, Microsoft };
 //# sourceMappingURL=icons.js.map
 //# sourceMappingURL=icons.js.map

package/dist/icons.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/utils/classNames.ts","../src/icons/Google.tsx","../src/icons/Keboola.tsx"],"names":["forwardRef","jsxs","jsx"],"mappings":";;;;;;;AAGA,IAAM,UAAU,mBAAA,CAAoB;AAAA,EAClC,MAAA,EAAQ;AACV,CAAC,CAAA;AAEM,IAAM,KAAK,CAAA,GAAI,OAAA,KAA0B,QAAQ,IAAA,CAAK,GAAG,OAAO,CAAC,CAAA;ACGjE,IAAM,MAAA,GAAqB,UAAA;AAAA,EAChC,CAAC,EAAE,IAAA,GAAO,EAAA,EAAI,WAAW,QAAA,EAAU,GAAG,IAAA,EAAK,EAAG,GAAA,qBAC5C,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,KAAA,EAAM,4BAAA;AAAA,MACN,KAAA,EAAO,IAAA;AAAA,MACP,MAAA,EAAQ,IAAA;AAAA,MACR,OAAA,EAAQ,aAAA;AAAA,MACR,IAAA,EAAK,MAAA;AAAA,MACL,SAAA,EAAW,EAAA,CAAG,QAAA,EAAU,SAAS,CAAA;AAAA,MAChC,GAAG,IAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,CAAA,EAAE,mLAAA;AAAA,YACF,IAAA,EAAK;AAAA;AAAA,SACP;AAAA,wBACA,GAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,CAAA,EAAE,0MAAA;AAAA,YACF,IAAA,EAAK;AAAA;AAAA,SACP;AAAA,wBACA,GAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,CAAA,EAAE,2MAAA;AAAA,YACF,IAAA,EAAK;AAAA;AAAA,SACP;AAAA,wBACA,GAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,CAAA,EAAE,kNAAA;AAAA,YACF,IAAA,EAAK;AAAA;AAAA,SACP;AAAA,QACC;AAAA;AAAA;AAAA;AAGP;AAEA,MAAA,CAAO,WAAA,GAAc,QAAA;AChCd,IAAM,OAAA,GAAsBA,UAAAA;AAAA,EACjC,CAAC,EAAE,IAAA,GAAO,EAAA,EAAI,KAAA,GAAQ,cAAA,EAAgB,SAAA,EAAW,QAAA,EAAU,GAAG,IAAA,EAAK,EAAG,GAAA,qBACpEC,IAAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,KAAA,EAAM,4BAAA;AAAA,MACN,KAAA,EAAO,IAAA;AAAA,MACP,MAAA,EAAQ,IAAA;AAAA,MACR,OAAA,EAAQ,aAAA;AAAA,MACR,IAAA,EAAM,KAAA;AAAA,MACN,SAAA,EAAW,EAAA,CAAG,QAAA,EAAU,SAAS,CAAA;AAAA,MAChC,GAAG,IAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAAAC,GAAAA,CAAC,MAAA,EAAA,EAAK,CAAA,EAAE,ihDAAA,EAAkhD,CAAA;AAAA,QACzhD;AAAA;AAAA;AAAA;AAGP;AAEA,OAAA,CAAQ,WAAA,GAAc,SAAA","file":"icons.js","sourcesContent":["import { type ClassValue, clsx } from 'clsx';\nimport { extendTailwindMerge } from 'tailwind-merge';\n\nconst twMerge = extendTailwindMerge({\n  prefix: 'tw-',\n});\n\nexport const cn = (...classes: ClassValue[]) => twMerge(clsx(...classes));\n","import { forwardRef } from 'react';\nimport type { LucideIcon, LucideProps } from 'lucide-react';\n\nimport { cn } from '../utils';\n\n// `forwardRef` here is required for type compatibility with `LucideIcon` — see\n// `Keboola.tsx` for the full rationale. The Google \"G\" is a fixed four-color\n// vendor mark (`#4285F4 / #34A853 / #FBBC04 / #EA4335`): its paths keep their\n// own fills and ignore `color`, and it must NOT re-skin under a customer brand.\n// oxlint-disable-next-line react-x/no-forward-ref\nexport const Google: LucideIcon = forwardRef<SVGSVGElement, LucideProps>(\n  ({ size = 24, className, children, ...rest }, ref) => (\n    <svg\n      ref={ref}\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width={size}\n      height={size}\n      viewBox=\"12 10 20 20\"\n      fill=\"none\"\n      className={cn('lucide', className)}\n      {...rest}\n    >\n      <path\n        d=\"M31.6 20.2273C31.6 19.5182 31.5364 18.8364 31.4182 18.1818H22V22.05H27.3818C27.15 23.3 26.4455 24.3591 25.3864 25.0682V27.5773H28.6182C30.5091 25.8364 31.6 23.2727 31.6 20.2273Z\"\n        fill=\"#4285F4\"\n      />\n      <path\n        d=\"M22 30C24.7 30 26.9636 29.1045 28.6181 27.5773L25.3863 25.0682C24.4909 25.6682 23.3454 26.0227 22 26.0227C19.3954 26.0227 17.1909 24.2636 16.4045 21.9H13.0636V24.4909C14.7091 27.7591 18.0909 30 22 30Z\"\n        fill=\"#34A853\"\n      />\n      <path\n        d=\"M16.4045 21.9C16.2045 21.3 16.0909 20.6591 16.0909 20C16.0909 19.3409 16.2045 18.7 16.4045 18.1V15.5091H13.0636C12.3864 16.8591 12 18.3864 12 20C12 21.6136 12.3864 23.1409 13.0636 24.4909L16.4045 21.9Z\"\n        fill=\"#FBBC04\"\n      />\n      <path\n        d=\"M22 13.9773C23.4681 13.9773 24.7863 14.4818 25.8227 15.4727L28.6909 12.6045C26.9591 10.9909 24.6954 10 22 10C18.0909 10 14.7091 12.2409 13.0636 15.5091L16.4045 18.1C17.1909 15.7364 19.3954 13.9773 22 13.9773Z\"\n        fill=\"#EA4335\"\n      />\n      {children}\n    </svg>\n  ),\n);\n\nGoogle.displayName = 'Google';\n","import { forwardRef } from 'react';\nimport type { LucideIcon, LucideProps } from 'lucide-react';\n\nimport { cn } from '../utils';\n\n// `forwardRef` here is required for type compatibility with `LucideIcon`\n// (a `ForwardRefExoticComponent` from lucide-react). React 19's ref-as-prop\n// pattern produces a plain function component which isn't structurally\n// assignable to `LucideIcon`, so consumers couldn't pass `Keboola`\n// interchangeably with imported Lucide icons (e.g. `<Button><Keboola className=\"tw-size-4\" /></Button>`).\n// oxlint-disable-next-line react-x/no-forward-ref\nexport const Keboola: LucideIcon = forwardRef<SVGSVGElement, LucideProps>(\n  ({ size = 24, color = 'currentColor', className, children, ...rest }, ref) => (\n    <svg\n      ref={ref}\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width={size}\n      height={size}\n      viewBox=\"0 0 300 512\"\n      fill={color}\n      className={cn('lucide', className)}\n      {...rest}\n    >\n      <path d=\"M152 320C79.7 320 24.5 233.9 24.5 124.7C24.5 15.6 70.5 0 152 0s123.6 15.6 123.6 124.7C275.5 233.9 217.7 320 152 320zm-8.7-50.5c0-11.2-9.5-20.3-21.2-20.3s-21.2 9.1-21.2 20.3c0 11.2 9.5 20.3 21.2 20.3s21.2-9.1 21.2-20.3zm55.7 0c0-11.2-9.5-20.3-21.2-20.3s-21.2 9.1-21.2 20.3c0 11.2 9.5 20.3 21.2 20.3s21.2-9.1 21.2-20.3zm68.9 115.1c10.2 9.3 20.2 20.5 29 35c5.9 9.7 2.6 22.1-7.5 27.8c-3.4 1.9-7.1 2.8-10.7 2.8c-7.2 0-14.3-3.6-18.3-10c-6.8-11.1-13.8-18.9-21.7-26.1c-7.3-6.7-15.6-12.7-24.9-19.5c-.7-.5-1.4-1-2.1-1.5c-5-3.6-10-6.8-14.9-9.4c.6 1 1.2 2.1 1.8 3.2c14.4 26.4 29.2 63.1 29.2 104.9c0 11.2-9.5 20.3-21.2 20.3c-11.7 0-21.2-9.1-21.2-20.3c.1-31.8-11.6-62.3-23.8-84.9c-4-7.4-8-13.9-11.6-19.3c-3.4 5.2-7.2 11.3-11 18.3c-12.5 22.7-24.5 53.8-24.4 86c0 11.2-9.5 20.3-21.2 20.3s-21.2-9.1-21.2-20.3c.1-41.8 14.9-78.4 29.2-104.9c.6-1.1 1.2-2.1 1.8-3.2c-5 2.7-9.9 5.8-14.9 9.4c-.6 .5-1.3 .9-1.9 1.4c-9.5 6.9-17.8 12.9-25.1 19.7c-7.9 7.2-14.9 15.1-21.7 26.1c-5.9 9.7-18.9 12.9-29 7.2C.5 441.8-2.9 429.3 3.1 419.7c8.9-14.4 18.8-25.7 29-35c9.2-8.4 18.5-15.1 27.6-21.7c1-.7 2-1.4 3-2.2c4.7-3.5 9.6-6.7 14.6-9.6c-5-2.9-9.8-6.1-14.6-9.6C39.8 325 19.9 302.5 3.1 275.1c-5.9-9.7-2.6-22.1 7.5-27.8c10.1-5.7 23.1-2.5 29 7.2c14.6 23.7 31.1 42 48.7 54.9c18.9 13.7 37.4 20.5 56.5 21.5c1.7-.1 3.5-.1 5.2-.1c1.8 0 3.5 .1 5.2 .1c0 0 0 0 0 0c19.1-1.1 37.6-7.9 56.5-21.5c17.6-12.8 34.2-31.2 48.7-54.9c6-9.7 18.9-12.9 29-7.2c10.1 5.7 13.4 18.1 7.5 27.8c-16.8 27.4-36.7 49.9-59.6 66.6c-4.7 3.5-9.6 6.7-14.5 9.6c4.9 2.9 9.8 6.1 14.5 9.6c.9 .7 1.8 1.3 2.7 2c9.2 6.7 18.5 13.5 27.9 22z\" />\n      {children}\n    </svg>\n  ),\n);\n\nKeboola.displayName = 'Keboola';\n"]}
+{"version":3,"sources":["../src/utils/classNames.ts","../src/icons/Google.tsx","../src/icons/Keboola.tsx","../src/icons/Microsoft.tsx"],"names":["forwardRef","jsxs","jsx"],"mappings":"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","file":"icons.js","sourcesContent":["import { type ClassValue, clsx } from 'clsx';\nimport { extendTailwindMerge } from 'tailwind-merge';\n\nconst twMerge = extendTailwindMerge({\n  prefix: 'tw-',\n});\n\nexport const cn = (...classes: ClassValue[]) => twMerge(clsx(...classes));\n","import { forwardRef } from 'react';\nimport type { LucideIcon, LucideProps } from 'lucide-react';\n\nimport { cn } from '../utils';\n\n// `forwardRef` here is required for type compatibility with `LucideIcon` — see\n// `Keboola.tsx` for the full rationale. The Google \"G\" is a fixed four-color\n// vendor mark (`#4285F4 / #34A853 / #FBBC04 / #EA4335`): its paths keep their\n// own fills and ignore `color`, and it must NOT re-skin under a customer brand.\n// oxlint-disable-next-line react-x/no-forward-ref\nexport const Google: LucideIcon = forwardRef<SVGSVGElement, LucideProps>(\n  ({ size = 24, className, children, ...rest }, ref) => (\n    <svg\n      ref={ref}\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width={size}\n      height={size}\n      viewBox=\"12 10 20 20\"\n      fill=\"none\"\n      className={cn('lucide', className)}\n      {...rest}\n    >\n      <path\n        d=\"M31.6 20.2273C31.6 19.5182 31.5364 18.8364 31.4182 18.1818H22V22.05H27.3818C27.15 23.3 26.4455 24.3591 25.3864 25.0682V27.5773H28.6182C30.5091 25.8364 31.6 23.2727 31.6 20.2273Z\"\n        fill=\"#4285F4\"\n      />\n      <path\n        d=\"M22 30C24.7 30 26.9636 29.1045 28.6181 27.5773L25.3863 25.0682C24.4909 25.6682 23.3454 26.0227 22 26.0227C19.3954 26.0227 17.1909 24.2636 16.4045 21.9H13.0636V24.4909C14.7091 27.7591 18.0909 30 22 30Z\"\n        fill=\"#34A853\"\n      />\n      <path\n        d=\"M16.4045 21.9C16.2045 21.3 16.0909 20.6591 16.0909 20C16.0909 19.3409 16.2045 18.7 16.4045 18.1V15.5091H13.0636C12.3864 16.8591 12 18.3864 12 20C12 21.6136 12.3864 23.1409 13.0636 24.4909L16.4045 21.9Z\"\n        fill=\"#FBBC04\"\n      />\n      <path\n        d=\"M22 13.9773C23.4681 13.9773 24.7863 14.4818 25.8227 15.4727L28.6909 12.6045C26.9591 10.9909 24.6954 10 22 10C18.0909 10 14.7091 12.2409 13.0636 15.5091L16.4045 18.1C17.1909 15.7364 19.3954 13.9773 22 13.9773Z\"\n        fill=\"#EA4335\"\n      />\n      {children}\n    </svg>\n  ),\n);\n\nGoogle.displayName = 'Google';\n","import { forwardRef } from 'react';\nimport type { LucideIcon, LucideProps } from 'lucide-react';\n\nimport { cn } from '../utils';\n\n// `forwardRef` here is required for type compatibility with `LucideIcon`\n// (a `ForwardRefExoticComponent` from lucide-react). React 19's ref-as-prop\n// pattern produces a plain function component which isn't structurally\n// assignable to `LucideIcon`, so consumers couldn't pass `Keboola`\n// interchangeably with imported Lucide icons (e.g. `<Button><Keboola className=\"tw-size-4\" /></Button>`).\n// oxlint-disable-next-line react-x/no-forward-ref\nexport const Keboola: LucideIcon = forwardRef<SVGSVGElement, LucideProps>(\n  ({ size = 24, color = 'currentColor', className, children, ...rest }, ref) => (\n    <svg\n      ref={ref}\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width={size}\n      height={size}\n      viewBox=\"0 0 300 512\"\n      fill={color}\n      className={cn('lucide', className)}\n      {...rest}\n    >\n      <path d=\"M152 320C79.7 320 24.5 233.9 24.5 124.7C24.5 15.6 70.5 0 152 0s123.6 15.6 123.6 124.7C275.5 233.9 217.7 320 152 320zm-8.7-50.5c0-11.2-9.5-20.3-21.2-20.3s-21.2 9.1-21.2 20.3c0 11.2 9.5 20.3 21.2 20.3s21.2-9.1 21.2-20.3zm55.7 0c0-11.2-9.5-20.3-21.2-20.3s-21.2 9.1-21.2 20.3c0 11.2 9.5 20.3 21.2 20.3s21.2-9.1 21.2-20.3zm68.9 115.1c10.2 9.3 20.2 20.5 29 35c5.9 9.7 2.6 22.1-7.5 27.8c-3.4 1.9-7.1 2.8-10.7 2.8c-7.2 0-14.3-3.6-18.3-10c-6.8-11.1-13.8-18.9-21.7-26.1c-7.3-6.7-15.6-12.7-24.9-19.5c-.7-.5-1.4-1-2.1-1.5c-5-3.6-10-6.8-14.9-9.4c.6 1 1.2 2.1 1.8 3.2c14.4 26.4 29.2 63.1 29.2 104.9c0 11.2-9.5 20.3-21.2 20.3c-11.7 0-21.2-9.1-21.2-20.3c.1-31.8-11.6-62.3-23.8-84.9c-4-7.4-8-13.9-11.6-19.3c-3.4 5.2-7.2 11.3-11 18.3c-12.5 22.7-24.5 53.8-24.4 86c0 11.2-9.5 20.3-21.2 20.3s-21.2-9.1-21.2-20.3c.1-41.8 14.9-78.4 29.2-104.9c.6-1.1 1.2-2.1 1.8-3.2c-5 2.7-9.9 5.8-14.9 9.4c-.6 .5-1.3 .9-1.9 1.4c-9.5 6.9-17.8 12.9-25.1 19.7c-7.9 7.2-14.9 15.1-21.7 26.1c-5.9 9.7-18.9 12.9-29 7.2C.5 441.8-2.9 429.3 3.1 419.7c8.9-14.4 18.8-25.7 29-35c9.2-8.4 18.5-15.1 27.6-21.7c1-.7 2-1.4 3-2.2c4.7-3.5 9.6-6.7 14.6-9.6c-5-2.9-9.8-6.1-14.6-9.6C39.8 325 19.9 302.5 3.1 275.1c-5.9-9.7-2.6-22.1 7.5-27.8c10.1-5.7 23.1-2.5 29 7.2c14.6 23.7 31.1 42 48.7 54.9c18.9 13.7 37.4 20.5 56.5 21.5c1.7-.1 3.5-.1 5.2-.1c1.8 0 3.5 .1 5.2 .1c0 0 0 0 0 0c19.1-1.1 37.6-7.9 56.5-21.5c17.6-12.8 34.2-31.2 48.7-54.9c6-9.7 18.9-12.9 29-7.2c10.1 5.7 13.4 18.1 7.5 27.8c-16.8 27.4-36.7 49.9-59.6 66.6c-4.7 3.5-9.6 6.7-14.5 9.6c4.9 2.9 9.8 6.1 14.5 9.6c.9 .7 1.8 1.3 2.7 2c9.2 6.7 18.5 13.5 27.9 22z\" />\n      {children}\n    </svg>\n  ),\n);\n\nKeboola.displayName = 'Keboola';\n","import { forwardRef } from 'react';\nimport type { LucideIcon, LucideProps } from 'lucide-react';\n\nimport { cn } from '../utils';\n\n// `forwardRef` here is required for type compatibility with `LucideIcon`\n// (a `ForwardRefExoticComponent` from lucide-react). React 19's ref-as-prop\n// pattern produces a plain function component which isn't structurally\n// assignable to `LucideIcon`, so consumers couldn't pass `Microsoft`\n// interchangeably with imported Lucide icons. The four-square mark carries\n// fixed Microsoft brand colors and deliberately ignores `color` — it must NOT\n// re-skin under a customer brand.\n// oxlint-disable-next-line react-x/no-forward-ref\nexport const Microsoft: LucideIcon = forwardRef<SVGSVGElement, LucideProps>(\n  ({ size = 24, className, children, ...rest }, ref) => (\n    <svg\n      ref={ref}\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width={size}\n      height={size}\n      viewBox=\"0 0 21 21\"\n      fill=\"none\"\n      className={cn('lucide', className)}\n      {...rest}\n    >\n      <rect x=\"0\" y=\"0\" width=\"10\" height=\"10\" fill=\"#F25022\" />\n      <rect x=\"11\" y=\"0\" width=\"10\" height=\"10\" fill=\"#7FBA00\" />\n      <rect x=\"0\" y=\"11\" width=\"10\" height=\"10\" fill=\"#00A4EF\" />\n      <rect x=\"11\" y=\"11\" width=\"10\" height=\"10\" fill=\"#FFB900\" />\n      {children}\n    </svg>\n  ),\n);\n\nMicrosoft.displayName = 'Microsoft';\n"]}

package/dist/index.cjs

@@ -1080,7 +1080,8 @@ var require_es = __commonJS({
 var icons_exports = {};
 __export(icons_exports, {
   Google: () => Google,
-  Keboola: () => Keboola
+  Keboola: () => Keboola,
+  Microsoft: () => Microsoft
 });
 __reExport(icons_exports, lucide_react_star__namespace);
 var twMerge = tailwindMerge.extendTailwindMerge({
@@ -1507,6 +1508,29 @@ var Keboola = React26.forwardRef(
   )
 );
 Keboola.displayName = "Keboola";
+var Microsoft = React26.forwardRef(
+  ({ size = 24, className, children, ...rest }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      ref,
+      xmlns: "http://www.w3.org/2000/svg",
+      width: size,
+      height: size,
+      viewBox: "0 0 21 21",
+      fill: "none",
+      className: cn("lucide", className),
+      ...rest,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "0", y: "0", width: "10", height: "10", fill: "#F25022" }),
+        /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "11", y: "0", width: "10", height: "10", fill: "#7FBA00" }),
+        /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "0", y: "11", width: "10", height: "10", fill: "#00A4EF" }),
+        /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "11", y: "11", width: "10", height: "10", fill: "#FFB900" }),
+        children
+      ]
+    }
+  )
+);
+Microsoft.displayName = "Microsoft";
 var variants = classVarianceAuthority.cva(
   [
     "tailwindcss-preflight",
@@ -3161,6 +3185,75 @@ var CopyField = {
   Footer: CopyFooter
 };
 var LABELS = {
+  signin: "Sign in with Microsoft",
+  signup: "Sign up with Microsoft",
+  continue: "Continue with Microsoft"
+};
+var MICROSOFT_FONT_STACK = "'Segoe UI', 'Helvetica Neue', Arial, sans-serif";
+var CLASSES = [
+  "tailwindcss-preflight",
+  "tw-inline-flex",
+  "tw-items-center",
+  "tw-justify-center",
+  "tw-gap-3",
+  "tw-h-[41px]",
+  "tw-px-3",
+  "tw-rounded-none",
+  "tw-border",
+  "tw-text-[15px]",
+  "tw-font-normal",
+  "tw-leading-none",
+  "tw-whitespace-nowrap",
+  "tw-select-none",
+  "tw-cursor-pointer",
+  "tw-transition-colors",
+  "[&_svg]:tw-shrink-0",
+  // focus — Microsoft's brand blue ring, independent of the active brand.
+  "focus-visible:tw-outline-none",
+  "focus-visible:tw-ring-2",
+  "focus-visible:tw-ring-[#0067b8]/60",
+  // disabled
+  "disabled:tw-cursor-not-allowed",
+  "disabled:tw-opacity-60",
+  // light treatment — the base.
+  "tw-bg-white",
+  "tw-text-[#5e5e5e]",
+  "tw-border-[#8c8c8c]",
+  "hover:not-disabled:tw-bg-[#f3f3f3]",
+  // dark treatment — auto-applied under html[data-theme=dark] (the ancestor
+  // selector out-specifies the plain light classes above).
+  "[[data-theme=dark]_&]:tw-bg-[#2f2f2f]",
+  "[[data-theme=dark]_&]:tw-text-white",
+  "[[data-theme=dark]_&]:tw-border-[#2f2f2f]",
+  "[[data-theme=dark]_&]:hover:not-disabled:tw-bg-[#3b3b3b]"
+];
+var MicrosoftButton = ({
+  ref,
+  label = "signin",
+  isLoading = false,
+  disabled = false,
+  type = "button",
+  className,
+  children,
+  style,
+  ...buttonProps
+}) => /* @__PURE__ */ jsxRuntime.jsxs(
+  "button",
+  {
+    ...buttonProps,
+    ref,
+    type,
+    disabled: disabled || isLoading,
+    "aria-disabled": disabled || isLoading,
+    style: { fontFamily: MICROSOFT_FONT_STACK, ...style },
+    className: cn(CLASSES, className),
+    children: [
+      isLoading ? /* @__PURE__ */ jsxRuntime.jsx(icons_exports.Loader2, { className: "tw-size-[21px] tw-shrink-0 tw-animate-spin", "aria-hidden": "true" }) : /* @__PURE__ */ jsxRuntime.jsx(Microsoft, { className: "tw-size-[21px]" }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { children: children ?? LABELS[label] })
+    ]
+  }
+);
+var LABELS2 = {
   signin: "Sign in with Google",
   signup: "Sign up with Google",
   continue: "Continue with Google",
@@ -3263,7 +3356,7 @@ var GoogleButton = ({
           className: cn({
             "tw-sr-only": size === "icon"
           }),
-          children: children ?? LABELS[label]
+          children: children ?? LABELS2[label]
         }
       )
     ]
@@ -4480,6 +4573,11 @@ var variants4 = classVarianceAuthority.cva(
     "tw-group/popover-content",
     "tw-z-[1055]",
     "focus-visible:tw-outline-none",
+    // An open Radix Dialog locks `pointer-events: none` on <body>. Popover content
+    // is portalled to <body> as a sibling of the dialog, so it inherits the lock
+    // and clicks fall through — re-enable pointer events on the content itself
+    // (dismiss-on-outside-click still works, it listens on document).
+    "tw-pointer-events-auto",
     // sizing
     "tw-min-w-32",
     "tw-max-h-[var(--radix-popover-content-available-height)]",
@@ -9490,8 +9588,15 @@ var inputGroupVariants = classVarianceAuthority.cva(
           "tw-border-input",
           "tw-text-foreground",
           "has-[:is(input,textarea):disabled]:tw-opacity-50",
+          // readonly: keep the themed input surface/border. The base layer's fixed
+          // `neutral-150` (a light grey) is correct for the legacy light chrome but
+          // collides with argo's themed `foreground` text — light-on-light, invisible
+          // in dark mode. Re-pin to the same `muted`/`input` tokens the editable argo
+          // input uses (validated AA), so readonly stays legible in every scheme.
+          "has-[:is(input,textarea)[readonly]]:tw-bg-muted",
+          "has-[:is(input,textarea)[readonly]]:tw-border-input",
           // higher specificity than has-[:is(input,textarea):focus] — prevents focus border on readonly
-          "has-[:is(input,textarea)[readonly]:focus]:tw-border-neutral-150",
+          "has-[:is(input,textarea)[readonly]:focus]:tw-border-input",
           // aria-invalid on the control surfaces the error chrome without a `state` prop — the
           // accessible path (uses the themeable `destructive` status token).
           "has-[:is(input,textarea)[aria-invalid=true]]:tw-border-destructive",
@@ -12021,7 +12126,7 @@ var BadgeLabel = ({
 var badgeColors = {
   gray: "tw-bg-neutral-400 tw-text-white tw-decoration-neutral-400",
   "gray-darker": "tw-bg-neutral-500 tw-text-white tw-decoration-neutral-500",
-  "gray-inverse": "tw-bg-neutral-100 tw-text-neutral-500 tw-decoration-neutral-100 [[data-theme=dark]_&]:tw-bg-neutral-800 [[data-theme=dark]_&]:tw-text-neutral-300 [[data-theme=dark]_&]:tw-decoration-neutral-800",
+  "gray-inverse": "tw-bg-neutral-100 tw-text-neutral-500 tw-decoration-neutral-100 [[data-theme=dark]_&]:tw-bg-neutral-700 [[data-theme=dark]_&]:tw-text-neutral-300 [[data-theme=dark]_&]:tw-decoration-neutral-700",
   green: "tw-bg-green-500 tw-text-white tw-decoration-green-500",
   "green-darker": "tw-bg-green-600 tw-text-white tw-decoration-green-600",
   "green-inverse": "tw-bg-green-100 tw-text-green-900 tw-decoration-green-100 [[data-theme=dark]_&]:tw-bg-green-900 [[data-theme=dark]_&]:tw-text-green-200 [[data-theme=dark]_&]:tw-decoration-green-900",
@@ -24814,6 +24919,7 @@ exports.Link = Link;
 exports.Markdown = Markdown;
 exports.MarkedText = MarkedText;
 exports.MessageBubble = MessageBubble;
+exports.MicrosoftButton = MicrosoftButton;
 exports.Modal = Modal;
 exports.MultiActionButtonGroup = MultiActionButtonGroup;
 exports.MultiCombobox = MultiCombobox;