@replicated/portal-components 0.0.19 → 0.0.21

package/dist/team-selection.js

@@ -9,6 +9,9 @@ var jsxRuntime = require('react/jsx-runtime');
  * This file is generated by tsup. Do not edit manually.
  */
 
+
+// src/utils/constants.ts
+var DEFAULT_SECONDARY_COLOR = "#6366f1";
 var SearchIcon = () => /* @__PURE__ */ jsxRuntime.jsxs(
   "svg",
   {
@@ -104,7 +107,8 @@ var TeamSelection = ({
             type: "button",
             onClick: handleContinue,
             disabled: !selectedTeamId || isSubmitting,
-            className: "rounded-xl bg-indigo-600 px-12 py-3 text-base font-semibold text-white shadow-sm transition hover:bg-indigo-700 disabled:cursor-not-allowed disabled:opacity-50",
+            className: "rounded-xl px-12 py-3 text-base font-semibold text-white shadow-sm transition-opacity duration-200 hover:opacity-90 disabled:cursor-not-allowed disabled:opacity-50",
+            style: { backgroundColor: brandingColors?.primary || `var(--portal-branding-primary, ${DEFAULT_SECONDARY_COLOR})` },
             children: isSubmitting ? "Loading..." : "Continue"
           }
         ) })

package/dist/team-selection.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/team-selection.tsx"],"names":["jsxs","jsx","useState"],"mappings":"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","file":"team-selection.js","sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\n\nexport interface Team {\n  id: string;\n  name: string;\n}\n\nexport interface TeamSelectionProps {\n  teams: Team[];\n  defaultTeamId?: string;\n  onContinue: (teamId: string) => void | Promise<void>;\n  isSubmitting?: boolean;\n  logo?: React.ReactNode;\n  brandingColors?: {\n    primary?: string;\n    secondary?: string;\n  };\n}\n\nconst SearchIcon = () => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    className=\"h-5 w-5 text-gray-400\"\n  >\n    <circle cx=\"11\" cy=\"11\" r=\"8\" />\n    <path d=\"m21 21-4.35-4.35\" />\n  </svg>\n);\n\nconst UsersIcon = () => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    className=\"h-6 w-6 text-blue-600\"\n  >\n    <path d=\"M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2\" />\n    <circle cx=\"9\" cy=\"7\" r=\"4\" />\n    <path d=\"M22 21v-2a4 4 0 0 0-3-3.87\" />\n    <path d=\"M16 3.13a4 4 0 0 1 0 7.75\" />\n  </svg>\n);\n\nexport const TeamSelection = ({\n  teams,\n  defaultTeamId,\n  onContinue,\n  isSubmitting = false,\n  logo,\n  brandingColors\n}: TeamSelectionProps) => {\n  const [selectedTeamId, setSelectedTeamId] = useState<string>(\n    defaultTeamId || teams[0]?.id || \"\"\n  );\n  const [searchQuery, setSearchQuery] = useState(\"\");\n\n  const filteredTeams = teams.filter((team) =>\n    team.name.toLowerCase().includes(searchQuery.toLowerCase())\n  );\n\n  const handleContinue = async () => {\n    if (!selectedTeamId) return;\n    await onContinue(selectedTeamId);\n  };\n\n  return (\n    <div className=\"min-h-screen bg-gray-50\">\n      {/* Header */}\n      <header className=\"border-b border-gray-200 bg-white px-8 py-6\">\n        <div className=\"mx-auto flex max-w-7xl items-center\">\n          {logo || (\n            <div className=\"flex h-12 w-12 items-center justify-center rounded-2xl bg-gradient-to-br from-blue-500 to-violet-500 text-lg font-semibold text-white\">\n              EP\n            </div>\n          )}\n        </div>\n      </header>\n\n      {/* Main Content */}\n      <main className=\"mx-auto max-w-7xl px-8 py-16\">\n        <div className=\"mx-auto max-w-2xl\">\n          <div className=\"mb-12 text-center\">\n            <h1 className=\"text-4xl font-semibold text-gray-900\">Select Team</h1>\n            <p className=\"mt-2 text-base text-gray-600\">\n              Choose which team you'd like to access\n            </p>\n          </div>\n\n          <div className=\"space-y-6\">\n            {/* Search Input */}\n            {teams.length > 3 && (\n              <div className=\"relative\">\n                <div className=\"pointer-events-none absolute inset-y-0 left-0 flex items-center pl-4\">\n                  <SearchIcon />\n                </div>\n                <input\n                  type=\"text\"\n                  value={searchQuery}\n                  onChange={(e) => setSearchQuery(e.target.value)}\n                  placeholder=\"Search teams...\"\n                  className=\"portal-input w-full py-4 pl-12 pr-4 text-base\"\n                />\n              </div>\n            )}\n\n            {/* Team List */}\n            <div className=\"space-y-3\">\n              {filteredTeams.map((team) => (\n                <button\n                  key={team.id}\n                  type=\"button\"\n                  onClick={() => setSelectedTeamId(team.id)}\n                  className={`flex w-full items-center gap-4 rounded-xl border-2 p-6 text-left transition ${\n                    selectedTeamId === team.id\n                      ? \"border-blue-500 bg-blue-50\"\n                      : \"border-gray-200 bg-white hover:border-gray-300 hover:shadow-sm\"\n                  }`}\n                >\n                  <UsersIcon />\n                  <span className=\"text-lg font-medium text-gray-900\">{team.name}</span>\n                </button>\n              ))}\n            </div>\n\n            {/* Continue Button */}\n            <div className=\"flex justify-center pt-6\">\n              <button\n                type=\"button\"\n                onClick={handleContinue}\n                disabled={!selectedTeamId || isSubmitting}\n                className=\"rounded-xl bg-indigo-600 px-12 py-3 text-base font-semibold text-white shadow-sm transition hover:bg-indigo-700 disabled:cursor-not-allowed disabled:opacity-50\"\n              >\n                {isSubmitting ? \"Loading...\" : \"Continue\"}\n              </button>\n            </div>\n          </div>\n        </div>\n      </main>\n    </div>\n  );\n};\n\nTeamSelection.displayName = \"TeamSelection\";\n"]}
+{"version":3,"sources":["../src/utils/constants.ts","../src/components/team-selection.tsx"],"names":["jsxs","jsx","useState"],"mappings":"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","file":"team-selection.js","sourcesContent":["/**\n * Default globe favicon matching the CiGlobe icon (Circum Icons)\n * Used as fallback when custom branding doesn't provide a favicon\n */\nexport const DEFAULT_FAVICON = \"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='1.5'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cellipse cx='12' cy='12' rx='4' ry='10'/%3E%3Cpath d='M2 12h20'/%3E%3C/svg%3E\";\n\n/**\n * Default primary brand color\n */\nexport const DEFAULT_PRIMARY_COLOR = \"#4f46e5\";\n\n/**\n * Default secondary brand color\n */\nexport const DEFAULT_SECONDARY_COLOR = \"#6366f1\";\n\n/**\n * Check if the API origin is HTTP (used for repldev environments)\n * This determines cookie security settings for cross-origin iframes\n * @returns true if the API origin starts with http:// (not https://)\n */\nexport const isHttpApiOrigin = (): boolean => {\n  return process.env.REPLICATED_APP_ORIGIN?.startsWith('http://') || false;\n};\n","\"use client\";\n\nimport { useState } from \"react\";\nimport { DEFAULT_SECONDARY_COLOR } from \"../utils/constants\";\n\nexport interface Team {\n  id: string;\n  name: string;\n}\n\nexport interface TeamSelectionProps {\n  teams: Team[];\n  defaultTeamId?: string;\n  onContinue: (teamId: string) => void | Promise<void>;\n  isSubmitting?: boolean;\n  logo?: React.ReactNode;\n  brandingColors?: {\n    primary?: string;\n    secondary?: string;\n  };\n}\n\nconst SearchIcon = () => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    className=\"h-5 w-5 text-gray-400\"\n  >\n    <circle cx=\"11\" cy=\"11\" r=\"8\" />\n    <path d=\"m21 21-4.35-4.35\" />\n  </svg>\n);\n\nconst UsersIcon = () => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    className=\"h-6 w-6 text-blue-600\"\n  >\n    <path d=\"M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2\" />\n    <circle cx=\"9\" cy=\"7\" r=\"4\" />\n    <path d=\"M22 21v-2a4 4 0 0 0-3-3.87\" />\n    <path d=\"M16 3.13a4 4 0 0 1 0 7.75\" />\n  </svg>\n);\n\nexport const TeamSelection = ({\n  teams,\n  defaultTeamId,\n  onContinue,\n  isSubmitting = false,\n  logo,\n  brandingColors\n}: TeamSelectionProps) => {\n  const [selectedTeamId, setSelectedTeamId] = useState<string>(\n    defaultTeamId || teams[0]?.id || \"\"\n  );\n  const [searchQuery, setSearchQuery] = useState(\"\");\n\n  const filteredTeams = teams.filter((team) =>\n    team.name.toLowerCase().includes(searchQuery.toLowerCase())\n  );\n\n  const handleContinue = async () => {\n    if (!selectedTeamId) return;\n    await onContinue(selectedTeamId);\n  };\n\n  return (\n    <div className=\"min-h-screen bg-gray-50\">\n      {/* Header */}\n      <header className=\"border-b border-gray-200 bg-white px-8 py-6\">\n        <div className=\"mx-auto flex max-w-7xl items-center\">\n          {logo || (\n            <div className=\"flex h-12 w-12 items-center justify-center rounded-2xl bg-gradient-to-br from-blue-500 to-violet-500 text-lg font-semibold text-white\">\n              EP\n            </div>\n          )}\n        </div>\n      </header>\n\n      {/* Main Content */}\n      <main className=\"mx-auto max-w-7xl px-8 py-16\">\n        <div className=\"mx-auto max-w-2xl\">\n          <div className=\"mb-12 text-center\">\n            <h1 className=\"text-4xl font-semibold text-gray-900\">Select Team</h1>\n            <p className=\"mt-2 text-base text-gray-600\">\n              Choose which team you'd like to access\n            </p>\n          </div>\n\n          <div className=\"space-y-6\">\n            {/* Search Input */}\n            {teams.length > 3 && (\n              <div className=\"relative\">\n                <div className=\"pointer-events-none absolute inset-y-0 left-0 flex items-center pl-4\">\n                  <SearchIcon />\n                </div>\n                <input\n                  type=\"text\"\n                  value={searchQuery}\n                  onChange={(e) => setSearchQuery(e.target.value)}\n                  placeholder=\"Search teams...\"\n                  className=\"portal-input w-full py-4 pl-12 pr-4 text-base\"\n                />\n              </div>\n            )}\n\n            {/* Team List */}\n            <div className=\"space-y-3\">\n              {filteredTeams.map((team) => (\n                <button\n                  key={team.id}\n                  type=\"button\"\n                  onClick={() => setSelectedTeamId(team.id)}\n                  className={`flex w-full items-center gap-4 rounded-xl border-2 p-6 text-left transition ${\n                    selectedTeamId === team.id\n                      ? \"border-blue-500 bg-blue-50\"\n                      : \"border-gray-200 bg-white hover:border-gray-300 hover:shadow-sm\"\n                  }`}\n                >\n                  <UsersIcon />\n                  <span className=\"text-lg font-medium text-gray-900\">{team.name}</span>\n                </button>\n              ))}\n            </div>\n\n            {/* Continue Button */}\n            <div className=\"flex justify-center pt-6\">\n              <button\n                type=\"button\"\n                onClick={handleContinue}\n                disabled={!selectedTeamId || isSubmitting}\n                className=\"rounded-xl px-12 py-3 text-base font-semibold text-white shadow-sm transition-opacity duration-200 hover:opacity-90 disabled:cursor-not-allowed disabled:opacity-50\"\n                style={{ backgroundColor: brandingColors?.primary || `var(--portal-branding-primary, ${DEFAULT_SECONDARY_COLOR})` }}\n              >\n                {isSubmitting ? \"Loading...\" : \"Continue\"}\n              </button>\n            </div>\n          </div>\n        </div>\n      </main>\n    </div>\n  );\n};\n\nTeamSelection.displayName = \"TeamSelection\";\n"]}

package/dist/team-settings-card.js

@@ -12,6 +12,9 @@ var Link__default = /*#__PURE__*/_interopDefault(Link);
  * This file is generated by tsup. Do not edit manually.
  */
 
+
+// src/utils/constants.ts
+var DEFAULT_SECONDARY_COLOR = "#6366f1";
 var UsersIcon = (props) => /* @__PURE__ */ jsxRuntime.jsx(
   "svg",
   {
@@ -47,7 +50,7 @@ var headingClass = "text-lg font-semibold text-gray-900";
 var contentClass = "mt-4 flex-1 space-y-3";
 var itemClass = "flex items-center gap-3 text-sm text-gray-600";
 var iconClass = "h-5 w-5 text-gray-500";
-var footerClass = "mt-6 flex justify-end text-sm font-semibold text-primary hover:text-primary/80";
+var footerClass = "mt-6 flex justify-end text-sm font-semibold hover:opacity-80";
 var TeamSettingsCard = ({
   userCount = 0,
   serviceAccountCount = 0
@@ -71,7 +74,7 @@ var TeamSettingsCard = ({
       ] })
     ] })
   ] }),
-  /* @__PURE__ */ jsxRuntime.jsx("footer", { className: footerClass, children: /* @__PURE__ */ jsxRuntime.jsx(Link__default.default, { href: "/team-settings", children: "View team settings \u2192" }) })
+  /* @__PURE__ */ jsxRuntime.jsx("footer", { className: footerClass, children: /* @__PURE__ */ jsxRuntime.jsx(Link__default.default, { href: "/team-settings", style: { color: `var(--portal-branding-secondary, ${DEFAULT_SECONDARY_COLOR})` }, children: "View team settings \u2192" }) })
 ] });
 TeamSettingsCard.displayName = "TeamSettingsCard";
 

package/dist/team-settings-card.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/team-settings-card.tsx"],"names":["jsx","jsxs","Link"],"mappings":";;;;;;;;;;;;;;AAGA,IAAM,SAAA,GAAY,CAAC,KAAA,qBACjBA,cAAA;AAAA,EAAC,KAAA;AAAA,EAAA;AAAA,IACC,KAAA,EAAM,4BAAA;AAAA,IACN,OAAA,EAAQ,WAAA;AAAA,IACR,IAAA,EAAK,MAAA;AAAA,IACL,MAAA,EAAO,cAAA;AAAA,IACP,WAAA,EAAa,GAAA;AAAA,IACb,aAAA,EAAc,OAAA;AAAA,IACd,cAAA,EAAe,OAAA;AAAA,IACf,aAAA,EAAY,MAAA;AAAA,IACX,GAAG,KAAA;AAAA,IAEJ,QAAA,kBAAAA,cAAA,CAAC,MAAA,EAAA,EAAK,CAAA,EAAE,4WAAA,EAA6W;AAAA;AACvX,CAAA;AAGF,IAAM,OAAA,GAAU,CAAC,KAAA,qBACfA,cAAA;AAAA,EAAC,KAAA;AAAA,EAAA;AAAA,IACC,KAAA,EAAM,4BAAA;AAAA,IACN,OAAA,EAAQ,WAAA;AAAA,IACR,IAAA,EAAK,MAAA;AAAA,IACL,MAAA,EAAO,cAAA;AAAA,IACP,WAAA,EAAa,GAAA;AAAA,IACb,aAAA,EAAc,OAAA;AAAA,IACd,cAAA,EAAe,OAAA;AAAA,IACf,aAAA,EAAY,MAAA;AAAA,IACX,GAAG,KAAA;AAAA,IAEJ,QAAA,kBAAAA,cAAA,CAAC,MAAA,EAAA,EAAK,CAAA,EAAE,4MAAA,EAA6M;AAAA;AACvN,CAAA;AAGF,IAAM,aAAA,GACJ,8GAAA;AACF,IAAM,YAAA,GAAe,qCAAA;AACrB,IAAM,YAAA,GAAe,uBAAA;AACrB,IAAM,SAAA,GAAY,+CAAA;AAClB,IAAM,SAAA,GAAY,uBAAA;AAClB,IAAM,WAAA,GACJ,gFAAA;AASK,IAAM,mBAAmB,CAAC;AAAA,EAC/B,SAAA,GAAY,CAAA;AAAA,EACZ,mBAAA,GAAsB;AACxB,CAAA,qBACEC,eAAA,CAAC,SAAA,EAAA,EAAQ,SAAA,EAAW,aAAA,EAAe,mBAAgB,4BAAA,EACjD,QAAA,EAAA;AAAA,kBAAAD,cAAA,CAAC,QAAA,EAAA,EACC,yCAAC,IAAA,EAAA,EAAG,EAAA,EAAG,8BAA6B,SAAA,EAAW,YAAA,EAAc,2BAE7D,CAAA,EACF,CAAA;AAAA,kBACAC,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,YAAA,EACd,QAAA,EAAA;AAAA,oBAAAA,eAAA,CAAC,KAAA,EAAA,EAAI,WAAW,SAAA,EACd,QAAA,EAAA;AAAA,sBAAAD,cAAA,CAAC,SAAA,EAAA,EAAU,WAAW,SAAA,EAAW,CAAA;AAAA,sCAChC,MAAA,EAAA,EACE,QAAA,EAAA;AAAA,QAAA,SAAA;AAAA,QAAU,QAAA;AAAA,QAAO,SAAA,KAAc,IAAI,QAAA,GAAW;AAAA,OAAA,EACjD;AAAA,KAAA,EACF,CAAA;AAAA,oBACAC,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,SAAA,EACd,QAAA,EAAA;AAAA,sBAAAD,cAAA,CAAC,OAAA,EAAA,EAAQ,WAAW,SAAA,EAAW,CAAA;AAAA,sCAC9B,MAAA,EAAA,EACE,QAAA,EAAA;AAAA,QAAA,mBAAA;AAAA,QAAoB,WAAA;AAAA,QAAU,mBAAA,KAAwB,IAAI,SAAA,GAAY;AAAA,OAAA,EACzE;AAAA,KAAA,EACF;AAAA,GAAA,EACF,CAAA;AAAA,kBACAA,cAAA,CAAC,YAAO,SAAA,EAAW,WAAA,EACjB,yCAACE,qBAAA,EAAA,EAAK,IAAA,EAAK,gBAAA,EAAiB,QAAA,EAAA,2BAAA,EAAoB,CAAA,EAClD;AAAA,CAAA,EACF;AAGF,gBAAA,CAAiB,WAAA,GAAc,kBAAA","file":"team-settings-card.js","sourcesContent":["import type { SVGProps } from \"react\";\nimport Link from \"next/link\";\n\nconst UsersIcon = (props: SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth={1.5}\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    aria-hidden=\"true\"\n    {...props}\n  >\n    <path d=\"M15 19.128a9.38 9.38 0 002.625.372 9.337 9.337 0 004.121-.952 4.125 4.125 0 00-7.533-2.493M15 19.128v-.003c0-1.113-.285-2.16-.786-3.07M15 19.128v.106A12.318 12.318 0 018.624 21c-2.331 0-4.512-.645-6.374-1.766l-.001-.109a6.375 6.375 0 0111.964-3.07M12 6.375a3.375 3.375 0 11-6.75 0 3.375 3.375 0 016.75 0zm8.25 2.25a2.625 2.625 0 11-5.25 0 2.625 2.625 0 015.25 0z\" />\n  </svg>\n);\n\nconst KeyIcon = (props: SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth={1.5}\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    aria-hidden=\"true\"\n    {...props}\n  >\n    <path d=\"M15.75 5.25a3 3 0 013 3m3 0a6 6 0 01-7.029 5.912c-.563-.097-1.159.026-1.563.43L10.5 17.25H8.25v2.25H6v2.25H2.25v-2.818c0-.597.237-1.17.659-1.591l6.499-6.499c.404-.404.527-1 .43-1.563A6 6 0 1121.75 8.25z\" />\n  </svg>\n);\n\nconst baseCardClass =\n  \"flex h-full flex-col rounded-xl border border-gray-200 bg-white p-6 shadow-[0_16px_32px_rgba(15,23,42,0.05)]\";\nconst headingClass = \"text-lg font-semibold text-gray-900\";\nconst contentClass = \"mt-4 flex-1 space-y-3\";\nconst itemClass = \"flex items-center gap-3 text-sm text-gray-600\";\nconst iconClass = \"h-5 w-5 text-gray-500\";\nconst footerClass =\n  \"mt-6 flex justify-end text-sm font-semibold text-primary hover:text-primary/80\";\n\nexport interface TeamSettingsCardProps {\n  /** Number of team members */\n  userCount?: number;\n  /** Number of service accounts */\n  serviceAccountCount?: number;\n}\n\nexport const TeamSettingsCard = ({\n  userCount = 0,\n  serviceAccountCount = 0\n}: TeamSettingsCardProps) => (\n  <section className={baseCardClass} aria-labelledby=\"team-settings-card-heading\">\n    <header>\n      <h2 id=\"team-settings-card-heading\" className={headingClass}>\n        Team Settings\n      </h2>\n    </header>\n    <div className={contentClass}>\n      <div className={itemClass}>\n        <UsersIcon className={iconClass} />\n        <span>\n          {userCount} Team {userCount === 1 ? \"Member\" : \"Members\"}\n        </span>\n      </div>\n      <div className={itemClass}>\n        <KeyIcon className={iconClass} />\n        <span>\n          {serviceAccountCount} Service {serviceAccountCount === 1 ? \"Account\" : \"Accounts\"}\n        </span>\n      </div>\n    </div>\n    <footer className={footerClass}>\n      <Link href=\"/team-settings\">View team settings →</Link>\n    </footer>\n  </section>\n);\n\nTeamSettingsCard.displayName = \"TeamSettingsCard\";\n"]}
+{"version":3,"sources":["../src/utils/constants.ts","../src/components/team-settings-card.tsx"],"names":["jsx","jsxs","Link"],"mappings":"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","file":"team-settings-card.js","sourcesContent":["/**\n * Default globe favicon matching the CiGlobe icon (Circum Icons)\n * Used as fallback when custom branding doesn't provide a favicon\n */\nexport const DEFAULT_FAVICON = \"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='1.5'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cellipse cx='12' cy='12' rx='4' ry='10'/%3E%3Cpath d='M2 12h20'/%3E%3C/svg%3E\";\n\n/**\n * Default primary brand color\n */\nexport const DEFAULT_PRIMARY_COLOR = \"#4f46e5\";\n\n/**\n * Default secondary brand color\n */\nexport const DEFAULT_SECONDARY_COLOR = \"#6366f1\";\n\n/**\n * Check if the API origin is HTTP (used for repldev environments)\n * This determines cookie security settings for cross-origin iframes\n * @returns true if the API origin starts with http:// (not https://)\n */\nexport const isHttpApiOrigin = (): boolean => {\n  return process.env.REPLICATED_APP_ORIGIN?.startsWith('http://') || false;\n};\n","import type { SVGProps } from \"react\";\nimport Link from \"next/link\";\nimport { DEFAULT_SECONDARY_COLOR } from \"../utils/constants\";\n\nconst UsersIcon = (props: SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth={1.5}\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    aria-hidden=\"true\"\n    {...props}\n  >\n    <path d=\"M15 19.128a9.38 9.38 0 002.625.372 9.337 9.337 0 004.121-.952 4.125 4.125 0 00-7.533-2.493M15 19.128v-.003c0-1.113-.285-2.16-.786-3.07M15 19.128v.106A12.318 12.318 0 018.624 21c-2.331 0-4.512-.645-6.374-1.766l-.001-.109a6.375 6.375 0 0111.964-3.07M12 6.375a3.375 3.375 0 11-6.75 0 3.375 3.375 0 016.75 0zm8.25 2.25a2.625 2.625 0 11-5.25 0 2.625 2.625 0 015.25 0z\" />\n  </svg>\n);\n\nconst KeyIcon = (props: SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth={1.5}\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    aria-hidden=\"true\"\n    {...props}\n  >\n    <path d=\"M15.75 5.25a3 3 0 013 3m3 0a6 6 0 01-7.029 5.912c-.563-.097-1.159.026-1.563.43L10.5 17.25H8.25v2.25H6v2.25H2.25v-2.818c0-.597.237-1.17.659-1.591l6.499-6.499c.404-.404.527-1 .43-1.563A6 6 0 1121.75 8.25z\" />\n  </svg>\n);\n\nconst baseCardClass =\n  \"flex h-full flex-col rounded-xl border border-gray-200 bg-white p-6 shadow-[0_16px_32px_rgba(15,23,42,0.05)]\";\nconst headingClass = \"text-lg font-semibold text-gray-900\";\nconst contentClass = \"mt-4 flex-1 space-y-3\";\nconst itemClass = \"flex items-center gap-3 text-sm text-gray-600\";\nconst iconClass = \"h-5 w-5 text-gray-500\";\nconst footerClass =\n  \"mt-6 flex justify-end text-sm font-semibold hover:opacity-80\";\n\nexport interface TeamSettingsCardProps {\n  /** Number of team members */\n  userCount?: number;\n  /** Number of service accounts */\n  serviceAccountCount?: number;\n}\n\nexport const TeamSettingsCard = ({\n  userCount = 0,\n  serviceAccountCount = 0\n}: TeamSettingsCardProps) => (\n  <section className={baseCardClass} aria-labelledby=\"team-settings-card-heading\">\n    <header>\n      <h2 id=\"team-settings-card-heading\" className={headingClass}>\n        Team Settings\n      </h2>\n    </header>\n    <div className={contentClass}>\n      <div className={itemClass}>\n        <UsersIcon className={iconClass} />\n        <span>\n          {userCount} Team {userCount === 1 ? \"Member\" : \"Members\"}\n        </span>\n      </div>\n      <div className={itemClass}>\n        <KeyIcon className={iconClass} />\n        <span>\n          {serviceAccountCount} Service {serviceAccountCount === 1 ? \"Account\" : \"Accounts\"}\n        </span>\n      </div>\n    </div>\n    <footer className={footerClass}>\n      <Link href=\"/team-settings\" style={{ color: `var(--portal-branding-secondary, ${DEFAULT_SECONDARY_COLOR})` }}>View team settings →</Link>\n    </footer>\n  </section>\n);\n\nTeamSettingsCard.displayName = \"TeamSettingsCard\";\n"]}

package/dist/team-settings.js

@@ -10,6 +10,9 @@ var jsxRuntime = require('react/jsx-runtime');
  * This file is generated by tsup. Do not edit manually.
  */
 
+
+// src/utils/constants.ts
+var DEFAULT_SECONDARY_COLOR = "#6366f1";
 var mockUsers = [
   {
     email: "marc.e.campbell@gmail.com",
@@ -82,7 +85,8 @@ var TeamUsers = ({ users }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { classNam
       "button",
       {
         type: "button",
-        className: "rounded-lg bg-indigo-600 px-6 py-2.5 text-sm font-medium text-white transition hover:bg-indigo-700",
+        className: "rounded-lg px-6 py-2.5 text-sm font-medium text-white transition-opacity duration-200 hover:opacity-90",
+        style: { backgroundColor: `var(--portal-branding-primary, ${DEFAULT_SECONDARY_COLOR})` },
         children: "Invite user"
       }
     )
@@ -112,7 +116,8 @@ var TeamServiceAccounts = ({ serviceAccounts }) => /* @__PURE__ */ jsxRuntime.js
       "button",
       {
         type: "button",
-        className: "rounded-lg bg-indigo-600 px-6 py-2.5 text-sm font-medium text-white transition hover:bg-indigo-700",
+        className: "rounded-lg px-6 py-2.5 text-sm font-medium text-white transition-opacity duration-200 hover:opacity-90",
+        style: { backgroundColor: `var(--portal-branding-primary, ${DEFAULT_SECONDARY_COLOR})` },
         children: "Create service account"
       }
     )

package/dist/team-settings.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/team-settings.tsx"],"names":["useRouter","usePathname","useState","jsxs","jsx"],"mappings":"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","file":"team-settings.js","sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport { useRouter, usePathname } from \"next/navigation\";\n\ninterface TeamUser {\n  email: string;\n  isCurrentUser: boolean;\n  firstAccessed: string;\n  lastAccessed: string;\n  views: number;\n}\n\ninterface ServiceAccount {\n  name: string;\n  createdAt: string;\n  lastUsed: string | null;\n  status: \"active\" | \"revoked\";\n}\n\nexport interface TeamSettingsProps {\n  users?: TeamUser[];\n  serviceAccounts?: ServiceAccount[];\n}\n\nconst mockUsers: TeamUser[] = [\n  {\n    email: \"marc.e.campbell@gmail.com\",\n    isCurrentUser: true,\n    firstAccessed: \"Dec 2, 2025 8:44 PM\",\n    lastAccessed: \"Nov 17, 2025 10:23 PM\",\n    views: 1266\n  }\n];\n\nconst mockServiceAccounts: ServiceAccount[] = [\n  {\n    name: \"CI/CD Pipeline\",\n    createdAt: \"Nov 15, 2025 3:20 PM\",\n    lastUsed: \"Dec 2, 2025 5:30 AM\",\n    status: \"active\"\n  },\n  {\n    name: \"Monitoring Service\",\n    createdAt: \"Oct 10, 2025 9:15 AM\",\n    lastUsed: null,\n    status: \"revoked\"\n  }\n];\n\nexport const TeamSettings = ({ \n  users = mockUsers, \n  serviceAccounts = mockServiceAccounts \n}: TeamSettingsProps) => {\n  const router = useRouter();\n  const pathname = usePathname();\n  \n  // Determine active tab from URL\n  const isUsersTab = !pathname.includes(\"/service-accounts\");\n  const [activeTab, setActiveTab] = useState<\"users\" | \"service-accounts\">(\n    isUsersTab ? \"users\" : \"service-accounts\"\n  );\n\n  const handleTabChange = (tab: \"users\" | \"service-accounts\") => {\n    setActiveTab(tab);\n    const basePath = pathname.split(\"/team-settings\")[0];\n    const newPath = tab === \"users\" \n      ? `${basePath}/team-settings/users`\n      : `${basePath}/team-settings/service-accounts`;\n    router.push(newPath);\n  };\n\n  return (\n    <div className=\"space-y-8\">\n      <header>\n        <h1 className=\"text-4xl font-semibold text-gray-900\">Team Settings</h1>\n      </header>\n\n      {/* Tabs */}\n      <div className=\"border-b border-gray-200\">\n        <nav className=\"flex gap-8\">\n          <button\n            type=\"button\"\n            onClick={() => handleTabChange(\"users\")}\n            className={`pb-4 text-base font-medium transition ${\n              activeTab === \"users\"\n                ? \"border-b-2 border-gray-900 text-gray-900\"\n                : \"text-gray-500 hover:text-gray-700\"\n            }`}\n          >\n            Users\n          </button>\n          <button\n            type=\"button\"\n            onClick={() => handleTabChange(\"service-accounts\")}\n            className={`pb-4 text-base font-medium transition ${\n              activeTab === \"service-accounts\"\n                ? \"border-b-2 border-gray-900 text-gray-900\"\n                : \"text-gray-500 hover:text-gray-700\"\n            }`}\n          >\n            Service Accounts\n          </button>\n        </nav>\n      </div>\n\n      {/* Content */}\n      {activeTab === \"users\" ? (\n        <TeamUsers users={users} />\n      ) : (\n        <TeamServiceAccounts serviceAccounts={serviceAccounts} />\n      )}\n    </div>\n  );\n};\n\nTeamSettings.displayName = \"TeamSettings\";\n\nconst TeamUsers = ({ users }: { users: TeamUser[] }) => (\n  <div className=\"space-y-6\">\n    <div className=\"flex items-center justify-between\">\n      <p className=\"text-base text-gray-600\">\n        Manage users with access to your Enterprise Portal\n      </p>\n      <button\n        type=\"button\"\n        className=\"rounded-lg bg-indigo-600 px-6 py-2.5 text-sm font-medium text-white transition hover:bg-indigo-700\"\n      >\n        Invite user\n      </button>\n    </div>\n\n    <div className=\"overflow-hidden rounded-lg border border-gray-200 bg-white\">\n      <table className=\"w-full\">\n        <thead className=\"bg-gray-50\">\n          <tr>\n            <th className=\"px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500\">\n              Email\n            </th>\n            <th className=\"px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500\">\n              First Accessed\n            </th>\n            <th className=\"px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500\">\n              Last Accessed\n            </th>\n            <th className=\"px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500\">\n              Views\n            </th>\n          </tr>\n        </thead>\n        <tbody className=\"divide-y divide-gray-200\">\n          {users.map((user) => (\n            <tr key={user.email} className=\"hover:bg-gray-50\">\n              <td className=\"px-6 py-4 text-sm text-gray-900\">\n                {user.email}\n                {user.isCurrentUser && (\n                  <span className=\"ml-2 text-gray-500\">(You)</span>\n                )}\n              </td>\n              <td className=\"px-6 py-4 text-sm text-gray-600\">\n                {user.firstAccessed}\n              </td>\n              <td className=\"px-6 py-4 text-sm text-gray-600\">\n                {user.lastAccessed}\n              </td>\n              <td className=\"px-6 py-4 text-sm text-gray-600\">\n                {user.views}\n              </td>\n            </tr>\n          ))}\n        </tbody>\n      </table>\n    </div>\n  </div>\n);\n\nconst TeamServiceAccounts = ({ serviceAccounts }: { serviceAccounts: ServiceAccount[] }) => (\n  <div className=\"space-y-6\">\n    <div className=\"flex items-center justify-between\">\n      <p className=\"text-base text-gray-600\">\n        Manage service accounts for automated access to your Enterprise Portal\n      </p>\n      <button\n        type=\"button\"\n        className=\"rounded-lg bg-indigo-600 px-6 py-2.5 text-sm font-medium text-white transition hover:bg-indigo-700\"\n      >\n        Create service account\n      </button>\n    </div>\n\n    <div className=\"overflow-hidden rounded-lg border border-gray-200 bg-white\">\n      <table className=\"w-full\">\n        <thead className=\"bg-gray-50\">\n          <tr>\n            <th className=\"px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500\">\n              Name\n            </th>\n            <th className=\"px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500\">\n              Created\n            </th>\n            <th className=\"px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500\">\n              Last Used\n            </th>\n            <th className=\"px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500\">\n              Status\n            </th>\n          </tr>\n        </thead>\n        <tbody className=\"divide-y divide-gray-200\">\n          {serviceAccounts.map((account) => (\n            <tr key={account.name} className=\"hover:bg-gray-50\">\n              <td className=\"px-6 py-4 text-sm font-medium text-gray-900\">\n                {account.name}\n              </td>\n              <td className=\"px-6 py-4 text-sm text-gray-600\">\n                {account.createdAt}\n              </td>\n              <td className=\"px-6 py-4 text-sm text-gray-600\">\n                {account.lastUsed || \"Never\"}\n              </td>\n              <td className=\"px-6 py-4 text-sm\">\n                {account.status === \"active\" ? (\n                  <span className=\"inline-flex rounded-full bg-green-100 px-2 py-1 text-xs font-medium text-green-800\">\n                    Active\n                  </span>\n                ) : (\n                  <span className=\"inline-flex rounded-full bg-gray-100 px-2 py-1 text-xs font-medium text-gray-800\">\n                    Revoked\n                  </span>\n                )}\n              </td>\n            </tr>\n          ))}\n        </tbody>\n      </table>\n    </div>\n  </div>\n);\n"]}
+{"version":3,"sources":["../src/utils/constants.ts","../src/components/team-settings.tsx"],"names":["useRouter","usePathname","useState","jsxs","jsx"],"mappings":"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","file":"team-settings.js","sourcesContent":["/**\n * Default globe favicon matching the CiGlobe icon (Circum Icons)\n * Used as fallback when custom branding doesn't provide a favicon\n */\nexport const DEFAULT_FAVICON = \"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='1.5'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cellipse cx='12' cy='12' rx='4' ry='10'/%3E%3Cpath d='M2 12h20'/%3E%3C/svg%3E\";\n\n/**\n * Default primary brand color\n */\nexport const DEFAULT_PRIMARY_COLOR = \"#4f46e5\";\n\n/**\n * Default secondary brand color\n */\nexport const DEFAULT_SECONDARY_COLOR = \"#6366f1\";\n\n/**\n * Check if the API origin is HTTP (used for repldev environments)\n * This determines cookie security settings for cross-origin iframes\n * @returns true if the API origin starts with http:// (not https://)\n */\nexport const isHttpApiOrigin = (): boolean => {\n  return process.env.REPLICATED_APP_ORIGIN?.startsWith('http://') || false;\n};\n","\"use client\";\n\nimport { useState } from \"react\";\nimport { useRouter, usePathname } from \"next/navigation\";\nimport { DEFAULT_SECONDARY_COLOR } from \"../utils/constants\";\n\ninterface TeamUser {\n  email: string;\n  isCurrentUser: boolean;\n  firstAccessed: string;\n  lastAccessed: string;\n  views: number;\n}\n\ninterface ServiceAccount {\n  name: string;\n  createdAt: string;\n  lastUsed: string | null;\n  status: \"active\" | \"revoked\";\n}\n\nexport interface TeamSettingsProps {\n  users?: TeamUser[];\n  serviceAccounts?: ServiceAccount[];\n}\n\nconst mockUsers: TeamUser[] = [\n  {\n    email: \"marc.e.campbell@gmail.com\",\n    isCurrentUser: true,\n    firstAccessed: \"Dec 2, 2025 8:44 PM\",\n    lastAccessed: \"Nov 17, 2025 10:23 PM\",\n    views: 1266\n  }\n];\n\nconst mockServiceAccounts: ServiceAccount[] = [\n  {\n    name: \"CI/CD Pipeline\",\n    createdAt: \"Nov 15, 2025 3:20 PM\",\n    lastUsed: \"Dec 2, 2025 5:30 AM\",\n    status: \"active\"\n  },\n  {\n    name: \"Monitoring Service\",\n    createdAt: \"Oct 10, 2025 9:15 AM\",\n    lastUsed: null,\n    status: \"revoked\"\n  }\n];\n\nexport const TeamSettings = ({ \n  users = mockUsers, \n  serviceAccounts = mockServiceAccounts \n}: TeamSettingsProps) => {\n  const router = useRouter();\n  const pathname = usePathname();\n  \n  // Determine active tab from URL\n  const isUsersTab = !pathname.includes(\"/service-accounts\");\n  const [activeTab, setActiveTab] = useState<\"users\" | \"service-accounts\">(\n    isUsersTab ? \"users\" : \"service-accounts\"\n  );\n\n  const handleTabChange = (tab: \"users\" | \"service-accounts\") => {\n    setActiveTab(tab);\n    const basePath = pathname.split(\"/team-settings\")[0];\n    const newPath = tab === \"users\" \n      ? `${basePath}/team-settings/users`\n      : `${basePath}/team-settings/service-accounts`;\n    router.push(newPath);\n  };\n\n  return (\n    <div className=\"space-y-8\">\n      <header>\n        <h1 className=\"text-4xl font-semibold text-gray-900\">Team Settings</h1>\n      </header>\n\n      {/* Tabs */}\n      <div className=\"border-b border-gray-200\">\n        <nav className=\"flex gap-8\">\n          <button\n            type=\"button\"\n            onClick={() => handleTabChange(\"users\")}\n            className={`pb-4 text-base font-medium transition ${\n              activeTab === \"users\"\n                ? \"border-b-2 border-gray-900 text-gray-900\"\n                : \"text-gray-500 hover:text-gray-700\"\n            }`}\n          >\n            Users\n          </button>\n          <button\n            type=\"button\"\n            onClick={() => handleTabChange(\"service-accounts\")}\n            className={`pb-4 text-base font-medium transition ${\n              activeTab === \"service-accounts\"\n                ? \"border-b-2 border-gray-900 text-gray-900\"\n                : \"text-gray-500 hover:text-gray-700\"\n            }`}\n          >\n            Service Accounts\n          </button>\n        </nav>\n      </div>\n\n      {/* Content */}\n      {activeTab === \"users\" ? (\n        <TeamUsers users={users} />\n      ) : (\n        <TeamServiceAccounts serviceAccounts={serviceAccounts} />\n      )}\n    </div>\n  );\n};\n\nTeamSettings.displayName = \"TeamSettings\";\n\nconst TeamUsers = ({ users }: { users: TeamUser[] }) => (\n  <div className=\"space-y-6\">\n    <div className=\"flex items-center justify-between\">\n      <p className=\"text-base text-gray-600\">\n        Manage users with access to your Enterprise Portal\n      </p>\n      <button\n        type=\"button\"\n        className=\"rounded-lg px-6 py-2.5 text-sm font-medium text-white transition-opacity duration-200 hover:opacity-90\"\n        style={{ backgroundColor: `var(--portal-branding-primary, ${DEFAULT_SECONDARY_COLOR})` }}\n      >\n        Invite user\n      </button>\n    </div>\n\n    <div className=\"overflow-hidden rounded-lg border border-gray-200 bg-white\">\n      <table className=\"w-full\">\n        <thead className=\"bg-gray-50\">\n          <tr>\n            <th className=\"px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500\">\n              Email\n            </th>\n            <th className=\"px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500\">\n              First Accessed\n            </th>\n            <th className=\"px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500\">\n              Last Accessed\n            </th>\n            <th className=\"px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500\">\n              Views\n            </th>\n          </tr>\n        </thead>\n        <tbody className=\"divide-y divide-gray-200\">\n          {users.map((user) => (\n            <tr key={user.email} className=\"hover:bg-gray-50\">\n              <td className=\"px-6 py-4 text-sm text-gray-900\">\n                {user.email}\n                {user.isCurrentUser && (\n                  <span className=\"ml-2 text-gray-500\">(You)</span>\n                )}\n              </td>\n              <td className=\"px-6 py-4 text-sm text-gray-600\">\n                {user.firstAccessed}\n              </td>\n              <td className=\"px-6 py-4 text-sm text-gray-600\">\n                {user.lastAccessed}\n              </td>\n              <td className=\"px-6 py-4 text-sm text-gray-600\">\n                {user.views}\n              </td>\n            </tr>\n          ))}\n        </tbody>\n      </table>\n    </div>\n  </div>\n);\n\nconst TeamServiceAccounts = ({ serviceAccounts }: { serviceAccounts: ServiceAccount[] }) => (\n  <div className=\"space-y-6\">\n    <div className=\"flex items-center justify-between\">\n      <p className=\"text-base text-gray-600\">\n        Manage service accounts for automated access to your Enterprise Portal\n      </p>\n      <button\n        type=\"button\"\n        className=\"rounded-lg px-6 py-2.5 text-sm font-medium text-white transition-opacity duration-200 hover:opacity-90\"\n        style={{ backgroundColor: `var(--portal-branding-primary, ${DEFAULT_SECONDARY_COLOR})` }}\n      >\n        Create service account\n      </button>\n    </div>\n\n    <div className=\"overflow-hidden rounded-lg border border-gray-200 bg-white\">\n      <table className=\"w-full\">\n        <thead className=\"bg-gray-50\">\n          <tr>\n            <th className=\"px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500\">\n              Name\n            </th>\n            <th className=\"px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500\">\n              Created\n            </th>\n            <th className=\"px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500\">\n              Last Used\n            </th>\n            <th className=\"px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500\">\n              Status\n            </th>\n          </tr>\n        </thead>\n        <tbody className=\"divide-y divide-gray-200\">\n          {serviceAccounts.map((account) => (\n            <tr key={account.name} className=\"hover:bg-gray-50\">\n              <td className=\"px-6 py-4 text-sm font-medium text-gray-900\">\n                {account.name}\n              </td>\n              <td className=\"px-6 py-4 text-sm text-gray-600\">\n                {account.createdAt}\n              </td>\n              <td className=\"px-6 py-4 text-sm text-gray-600\">\n                {account.lastUsed || \"Never\"}\n              </td>\n              <td className=\"px-6 py-4 text-sm\">\n                {account.status === \"active\" ? (\n                  <span className=\"inline-flex rounded-full bg-green-100 px-2 py-1 text-xs font-medium text-green-800\">\n                    Active\n                  </span>\n                ) : (\n                  <span className=\"inline-flex rounded-full bg-gray-100 px-2 py-1 text-xs font-medium text-gray-800\">\n                    Revoked\n                  </span>\n                )}\n              </td>\n            </tr>\n          ))}\n        </tbody>\n      </table>\n    </div>\n  </div>\n);\n"]}

package/dist/{top-nav-IRIn66wS.d.ts → top-nav-BUQAGoG1.d.mts}

@@ -1,5 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ReactNode } from 'react';
+import { B as BackgroundType } from './branding-BsMSywts.mjs';
 
 interface Customer {
     id: string;
@@ -10,6 +11,16 @@ interface TopNavLink {
     href?: string;
     icon: ReactNode;
 }
+interface TopNavBranding {
+    logo?: string | null;
+    title?: string;
+    primaryColor?: string;
+    secondaryColor?: string;
+    background?: BackgroundType;
+    backgroundImage?: string;
+    backgroundGradientStart?: string;
+    backgroundGradientEnd?: string;
+}
 interface TopNavProps {
     links?: TopNavLink[];
     hiddenLabels?: string[];
@@ -23,11 +34,12 @@ interface TopNavProps {
     onChangeTeam?: (customerId: string) => Promise<void>;
     userMenuChildren?: ReactNode;
     logoutButton?: ReactNode;
+    branding?: TopNavBranding;
 }
 declare const defaultTopNavLinks: TopNavLink[];
 /**
  * TopNav renders the hero navigation bar shown on authenticated dashboards.
  */
-declare const TopNav: ({ links, hiddenLabels, additionalLinks, order, userMenuLabel, activeLabel, customerName, customers, currentCustomerId, onChangeTeam, userMenuChildren, logoutButton }: TopNavProps) => Promise<react_jsx_runtime.JSX.Element>;
+declare const TopNav: ({ links, hiddenLabels, additionalLinks, order, userMenuLabel, activeLabel, customerName, customers, currentCustomerId, onChangeTeam, userMenuChildren, logoutButton, branding: brandingProp }: TopNavProps) => Promise<react_jsx_runtime.JSX.Element>;
 
-export { type Customer as C, type TopNavLink as T, type TopNavProps as a, TopNav as b, defaultTopNavLinks as d };
+export { type Customer as C, type TopNavLink as T, type TopNavBranding as a, type TopNavProps as b, TopNav as c, defaultTopNavLinks as d };

package/dist/{top-nav-IRIn66wS.d.mts → top-nav-CEqw0KpO.d.ts}

@@ -1,5 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ReactNode } from 'react';
+import { B as BackgroundType } from './branding-BsMSywts.js';
 
 interface Customer {
     id: string;
@@ -10,6 +11,16 @@ interface TopNavLink {
     href?: string;
     icon: ReactNode;
 }
+interface TopNavBranding {
+    logo?: string | null;
+    title?: string;
+    primaryColor?: string;
+    secondaryColor?: string;
+    background?: BackgroundType;
+    backgroundImage?: string;
+    backgroundGradientStart?: string;
+    backgroundGradientEnd?: string;
+}
 interface TopNavProps {
     links?: TopNavLink[];
     hiddenLabels?: string[];
@@ -23,11 +34,12 @@ interface TopNavProps {
     onChangeTeam?: (customerId: string) => Promise<void>;
     userMenuChildren?: ReactNode;
     logoutButton?: ReactNode;
+    branding?: TopNavBranding;
 }
 declare const defaultTopNavLinks: TopNavLink[];
 /**
  * TopNav renders the hero navigation bar shown on authenticated dashboards.
  */
-declare const TopNav: ({ links, hiddenLabels, additionalLinks, order, userMenuLabel, activeLabel, customerName, customers, currentCustomerId, onChangeTeam, userMenuChildren, logoutButton }: TopNavProps) => Promise<react_jsx_runtime.JSX.Element>;
+declare const TopNav: ({ links, hiddenLabels, additionalLinks, order, userMenuLabel, activeLabel, customerName, customers, currentCustomerId, onChangeTeam, userMenuChildren, logoutButton, branding: brandingProp }: TopNavProps) => Promise<react_jsx_runtime.JSX.Element>;
 
-export { type Customer as C, type TopNavLink as T, type TopNavProps as a, TopNav as b, defaultTopNavLinks as d };
+export { type Customer as C, type TopNavLink as T, type TopNavBranding as a, type TopNavProps as b, TopNav as c, defaultTopNavLinks as d };

package/dist/top-nav-user-menu.js

@@ -9,6 +9,9 @@ var jsxRuntime = require('react/jsx-runtime');
  * This file is generated by tsup. Do not edit manually.
  */
 
+
+// src/utils/constants.ts
+var DEFAULT_SECONDARY_COLOR = "#6366f1";
 var TopNavChangeTeamButton = ({
   displayLabel,
   customers = [],
@@ -161,7 +164,8 @@ var TopNavChangeTeamButton = ({
               type: "button",
               onClick: handleChangeTeam,
               disabled: !selectedTeamId || isChanging || selectedTeamId === currentCustomerId,
-              className: "rounded-xl bg-indigo-600 px-6 py-3 text-base font-semibold text-white shadow-sm transition hover:bg-indigo-700 disabled:cursor-not-allowed disabled:opacity-50",
+              className: "rounded-xl px-6 py-3 text-base font-semibold text-white shadow-sm transition-opacity duration-200 hover:opacity-90 disabled:cursor-not-allowed disabled:opacity-50",
+              style: { backgroundColor: `var(--portal-branding-primary, ${DEFAULT_SECONDARY_COLOR})` },
               children: isChanging ? "Changing..." : "Change team"
             }
           )

package/dist/top-nav-user-menu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/top-nav-user-menu.tsx"],"names":["useState","jsxs","Fragment","jsx"],"mappings":"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","file":"top-nav-user-menu.js","sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\n\nexport interface Customer {\n  id: string;\n  name: string;\n}\n\nexport interface TopNavChangeTeamButtonProps {\n  displayLabel: string;\n  customers?: Customer[];\n  currentCustomerId?: string;\n  onChangeTeam?: (customerId: string) => Promise<void>;\n  appName?: string;\n  channelName?: string;\n}\n\nexport const TopNavChangeTeamButton = ({\n  displayLabel,\n  customers = [],\n  currentCustomerId,\n  onChangeTeam,\n  appName = \"Application\",\n  channelName = \"\"\n}: TopNavChangeTeamButtonProps) => {\n  const [showChangeTeamModal, setShowChangeTeamModal] = useState(false);\n  const [selectedTeamId, setSelectedTeamId] = useState(currentCustomerId || \"\");\n  const [searchQuery, setSearchQuery] = useState(\"\");\n  const [isChanging, setIsChanging] = useState(false);\n\n  const filteredCustomers = customers.filter((customer) =>\n    customer.name.toLowerCase().includes(searchQuery.toLowerCase())\n  );\n\n  const handleChangeTeam = async () => {\n    if (!selectedTeamId || !onChangeTeam) return;\n    \n    setIsChanging(true);\n    try {\n      await onChangeTeam(selectedTeamId);\n      setShowChangeTeamModal(false);\n      // Force a full page reload to ensure new JWT is used everywhere\n      window.location.href = \"/\";\n    } catch (error) {\n      console.error(\"[top-nav-user-menu] Failed to change team:\", error);\n      setIsChanging(false);\n    }\n  };\n\n  return (\n    <>\n      <button\n        type=\"button\"\n        onClick={() => setShowChangeTeamModal(true)}\n        className=\"block w-full px-4 py-2 text-left hover:bg-gray-100\"\n      >\n        Change team\n      </button>\n\n      {/* Change Team Modal */}\n      {showChangeTeamModal && (\n        <div className=\"fixed inset-0 z-50 flex items-center justify-center bg-black bg-opacity-50 p-4\">\n          <div className=\"w-full max-w-2xl rounded-3xl bg-white p-8 shadow-xl\">\n            <div className=\"mb-6 flex items-center justify-between\">\n              <h2 className=\"text-3xl font-semibold text-gray-900\">Change team</h2>\n              <button\n                type=\"button\"\n                onClick={() => setShowChangeTeamModal(false)}\n                className=\"text-gray-400 hover:text-gray-600\"\n              >\n                <svg\n                  xmlns=\"http://www.w3.org/2000/svg\"\n                  width=\"24\"\n                  height=\"24\"\n                  viewBox=\"0 0 24 24\"\n                  fill=\"none\"\n                  stroke=\"currentColor\"\n                  strokeWidth=\"2\"\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                >\n                  <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\"></line>\n                  <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\"></line>\n                </svg>\n              </button>\n            </div>\n\n            <div className=\"space-y-6\">\n              {customers.length > 3 && (\n                <div className=\"relative\">\n                  <div className=\"pointer-events-none absolute inset-y-0 left-0 flex items-center pl-4\">\n                    <svg\n                      xmlns=\"http://www.w3.org/2000/svg\"\n                      width=\"20\"\n                      height=\"20\"\n                      viewBox=\"0 0 24 24\"\n                      fill=\"none\"\n                      stroke=\"currentColor\"\n                      strokeWidth=\"2\"\n                      strokeLinecap=\"round\"\n                      strokeLinejoin=\"round\"\n                      className=\"text-gray-400\"\n                    >\n                      <circle cx=\"11\" cy=\"11\" r=\"8\"></circle>\n                      <path d=\"m21 21-4.35-4.35\"></path>\n                    </svg>\n                  </div>\n                  <input\n                    type=\"text\"\n                    value={searchQuery}\n                    onChange={(e) => setSearchQuery(e.target.value)}\n                    placeholder=\"Search teams...\"\n                    className=\"portal-input w-full py-4 pl-12 pr-4 text-base\"\n                  />\n                </div>\n              )}\n\n              <div>\n                <p className=\"mb-4 text-sm text-gray-600\">{channelName ? `${appName} ${channelName}` : appName}</p>\n                <div className=\"space-y-3\">\n                  {filteredCustomers.map((customer) => (\n                    <button\n                      key={customer.id}\n                      type=\"button\"\n                      onClick={() => setSelectedTeamId(customer.id)}\n                      className={`flex w-full items-center gap-4 rounded-xl border-2 p-6 text-left transition ${\n                        selectedTeamId === customer.id\n                          ? \"border-blue-500 bg-blue-50\"\n                          : \"border-gray-200 bg-white hover:border-gray-300 hover:shadow-sm\"\n                      }`}\n                    >\n                      <div className=\"flex h-12 w-12 items-center justify-center rounded-full bg-blue-100\">\n                        <svg\n                          xmlns=\"http://www.w3.org/2000/svg\"\n                          width=\"24\"\n                          height=\"24\"\n                          viewBox=\"0 0 24 24\"\n                          fill=\"none\"\n                          stroke=\"currentColor\"\n                          strokeWidth=\"2\"\n                          strokeLinecap=\"round\"\n                          strokeLinejoin=\"round\"\n                          className=\"text-blue-600\"\n                        >\n                          <path d=\"M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2\"></path>\n                          <circle cx=\"9\" cy=\"7\" r=\"4\"></circle>\n                          <path d=\"M22 21v-2a4 4 0 0 0-3-3.87\"></path>\n                          <path d=\"M16 3.13a4 4 0 0 1 0 7.75\"></path>\n                        </svg>\n                      </div>\n                      <span className=\"text-lg font-medium text-gray-900\">{customer.name}</span>\n                    </button>\n                  ))}\n                </div>\n              </div>\n\n              <div className=\"flex justify-end gap-3 pt-4\">\n                <button\n                  type=\"button\"\n                  onClick={() => setShowChangeTeamModal(false)}\n                  className=\"rounded-xl border border-gray-300 px-6 py-3 text-base font-semibold text-gray-700 transition hover:bg-gray-50\"\n                  disabled={isChanging}\n                >\n                  Cancel\n                </button>\n                <button\n                  type=\"button\"\n                  onClick={handleChangeTeam}\n                  disabled={!selectedTeamId || isChanging || selectedTeamId === currentCustomerId}\n                  className=\"rounded-xl bg-indigo-600 px-6 py-3 text-base font-semibold text-white shadow-sm transition hover:bg-indigo-700 disabled:cursor-not-allowed disabled:opacity-50\"\n                >\n                  {isChanging ? \"Changing...\" : \"Change team\"}\n                </button>\n              </div>\n            </div>\n          </div>\n        </div>\n      )}\n    </>\n  );\n};\n\nTopNavChangeTeamButton.displayName = \"TopNavChangeTeamButton\";\n"]}
+{"version":3,"sources":["../src/utils/constants.ts","../src/components/top-nav-user-menu.tsx"],"names":["useState","jsxs","Fragment","jsx"],"mappings":"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","file":"top-nav-user-menu.js","sourcesContent":["/**\n * Default globe favicon matching the CiGlobe icon (Circum Icons)\n * Used as fallback when custom branding doesn't provide a favicon\n */\nexport const DEFAULT_FAVICON = \"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='1.5'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cellipse cx='12' cy='12' rx='4' ry='10'/%3E%3Cpath d='M2 12h20'/%3E%3C/svg%3E\";\n\n/**\n * Default primary brand color\n */\nexport const DEFAULT_PRIMARY_COLOR = \"#4f46e5\";\n\n/**\n * Default secondary brand color\n */\nexport const DEFAULT_SECONDARY_COLOR = \"#6366f1\";\n\n/**\n * Check if the API origin is HTTP (used for repldev environments)\n * This determines cookie security settings for cross-origin iframes\n * @returns true if the API origin starts with http:// (not https://)\n */\nexport const isHttpApiOrigin = (): boolean => {\n  return process.env.REPLICATED_APP_ORIGIN?.startsWith('http://') || false;\n};\n","\"use client\";\n\nimport { useState } from \"react\";\nimport { DEFAULT_SECONDARY_COLOR } from \"../utils/constants\";\n\nexport interface Customer {\n  id: string;\n  name: string;\n}\n\nexport interface TopNavChangeTeamButtonProps {\n  displayLabel: string;\n  customers?: Customer[];\n  currentCustomerId?: string;\n  onChangeTeam?: (customerId: string) => Promise<void>;\n  appName?: string;\n  channelName?: string;\n}\n\nexport const TopNavChangeTeamButton = ({\n  displayLabel,\n  customers = [],\n  currentCustomerId,\n  onChangeTeam,\n  appName = \"Application\",\n  channelName = \"\"\n}: TopNavChangeTeamButtonProps) => {\n  const [showChangeTeamModal, setShowChangeTeamModal] = useState(false);\n  const [selectedTeamId, setSelectedTeamId] = useState(currentCustomerId || \"\");\n  const [searchQuery, setSearchQuery] = useState(\"\");\n  const [isChanging, setIsChanging] = useState(false);\n\n  const filteredCustomers = customers.filter((customer) =>\n    customer.name.toLowerCase().includes(searchQuery.toLowerCase())\n  );\n\n  const handleChangeTeam = async () => {\n    if (!selectedTeamId || !onChangeTeam) return;\n    \n    setIsChanging(true);\n    try {\n      await onChangeTeam(selectedTeamId);\n      setShowChangeTeamModal(false);\n      // Force a full page reload to ensure new JWT is used everywhere\n      window.location.href = \"/\";\n    } catch (error) {\n      console.error(\"[top-nav-user-menu] Failed to change team:\", error);\n      setIsChanging(false);\n    }\n  };\n\n  return (\n    <>\n      <button\n        type=\"button\"\n        onClick={() => setShowChangeTeamModal(true)}\n        className=\"block w-full px-4 py-2 text-left hover:bg-gray-100\"\n      >\n        Change team\n      </button>\n\n      {/* Change Team Modal */}\n      {showChangeTeamModal && (\n        <div className=\"fixed inset-0 z-50 flex items-center justify-center bg-black bg-opacity-50 p-4\">\n          <div className=\"w-full max-w-2xl rounded-3xl bg-white p-8 shadow-xl\">\n            <div className=\"mb-6 flex items-center justify-between\">\n              <h2 className=\"text-3xl font-semibold text-gray-900\">Change team</h2>\n              <button\n                type=\"button\"\n                onClick={() => setShowChangeTeamModal(false)}\n                className=\"text-gray-400 hover:text-gray-600\"\n              >\n                <svg\n                  xmlns=\"http://www.w3.org/2000/svg\"\n                  width=\"24\"\n                  height=\"24\"\n                  viewBox=\"0 0 24 24\"\n                  fill=\"none\"\n                  stroke=\"currentColor\"\n                  strokeWidth=\"2\"\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                >\n                  <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\"></line>\n                  <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\"></line>\n                </svg>\n              </button>\n            </div>\n\n            <div className=\"space-y-6\">\n              {customers.length > 3 && (\n                <div className=\"relative\">\n                  <div className=\"pointer-events-none absolute inset-y-0 left-0 flex items-center pl-4\">\n                    <svg\n                      xmlns=\"http://www.w3.org/2000/svg\"\n                      width=\"20\"\n                      height=\"20\"\n                      viewBox=\"0 0 24 24\"\n                      fill=\"none\"\n                      stroke=\"currentColor\"\n                      strokeWidth=\"2\"\n                      strokeLinecap=\"round\"\n                      strokeLinejoin=\"round\"\n                      className=\"text-gray-400\"\n                    >\n                      <circle cx=\"11\" cy=\"11\" r=\"8\"></circle>\n                      <path d=\"m21 21-4.35-4.35\"></path>\n                    </svg>\n                  </div>\n                  <input\n                    type=\"text\"\n                    value={searchQuery}\n                    onChange={(e) => setSearchQuery(e.target.value)}\n                    placeholder=\"Search teams...\"\n                    className=\"portal-input w-full py-4 pl-12 pr-4 text-base\"\n                  />\n                </div>\n              )}\n\n              <div>\n                <p className=\"mb-4 text-sm text-gray-600\">{channelName ? `${appName} ${channelName}` : appName}</p>\n                <div className=\"space-y-3\">\n                  {filteredCustomers.map((customer) => (\n                    <button\n                      key={customer.id}\n                      type=\"button\"\n                      onClick={() => setSelectedTeamId(customer.id)}\n                      className={`flex w-full items-center gap-4 rounded-xl border-2 p-6 text-left transition ${\n                        selectedTeamId === customer.id\n                          ? \"border-blue-500 bg-blue-50\"\n                          : \"border-gray-200 bg-white hover:border-gray-300 hover:shadow-sm\"\n                      }`}\n                    >\n                      <div className=\"flex h-12 w-12 items-center justify-center rounded-full bg-blue-100\">\n                        <svg\n                          xmlns=\"http://www.w3.org/2000/svg\"\n                          width=\"24\"\n                          height=\"24\"\n                          viewBox=\"0 0 24 24\"\n                          fill=\"none\"\n                          stroke=\"currentColor\"\n                          strokeWidth=\"2\"\n                          strokeLinecap=\"round\"\n                          strokeLinejoin=\"round\"\n                          className=\"text-blue-600\"\n                        >\n                          <path d=\"M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2\"></path>\n                          <circle cx=\"9\" cy=\"7\" r=\"4\"></circle>\n                          <path d=\"M22 21v-2a4 4 0 0 0-3-3.87\"></path>\n                          <path d=\"M16 3.13a4 4 0 0 1 0 7.75\"></path>\n                        </svg>\n                      </div>\n                      <span className=\"text-lg font-medium text-gray-900\">{customer.name}</span>\n                    </button>\n                  ))}\n                </div>\n              </div>\n\n              <div className=\"flex justify-end gap-3 pt-4\">\n                <button\n                  type=\"button\"\n                  onClick={() => setShowChangeTeamModal(false)}\n                  className=\"rounded-xl border border-gray-300 px-6 py-3 text-base font-semibold text-gray-700 transition hover:bg-gray-50\"\n                  disabled={isChanging}\n                >\n                  Cancel\n                </button>\n                <button\n                  type=\"button\"\n                  onClick={handleChangeTeam}\n                  disabled={!selectedTeamId || isChanging || selectedTeamId === currentCustomerId}\n                  className=\"rounded-xl px-6 py-3 text-base font-semibold text-white shadow-sm transition-opacity duration-200 hover:opacity-90 disabled:cursor-not-allowed disabled:opacity-50\"\n                  style={{ backgroundColor: `var(--portal-branding-primary, ${DEFAULT_SECONDARY_COLOR})` }}\n                >\n                  {isChanging ? \"Changing...\" : \"Change team\"}\n                </button>\n              </div>\n            </div>\n          </div>\n        </div>\n      )}\n    </>\n  );\n};\n\nTopNavChangeTeamButton.displayName = \"TopNavChangeTeamButton\";\n"]}

package/dist/top-nav.d.mts

@@ -1,3 +1,4 @@
-export { b as TopNav, T as TopNavLink, a as TopNavProps } from './top-nav-IRIn66wS.mjs';
+export { c as TopNav, a as TopNavBranding, T as TopNavLink, b as TopNavProps } from './top-nav-BUQAGoG1.mjs';
 import 'react/jsx-runtime';
 import 'react';
+import './branding-BsMSywts.mjs';

package/dist/top-nav.d.ts

@@ -1,3 +1,4 @@
-export { b as TopNav, T as TopNavLink, a as TopNavProps } from './top-nav-IRIn66wS.js';
+export { c as TopNav, a as TopNavBranding, T as TopNavLink, b as TopNavProps } from './top-nav-CEqw0KpO.js';
 import 'react/jsx-runtime';
 import 'react';
+import './branding-BsMSywts.js';