@appbuildersph/badge 0.1.0

package/README.md

@@ -0,0 +1,3 @@
+# @appbuildersph/badge
+
+Reserved for a future phase — not yet implemented. See the root README's "Next phases" list.

package/dist/appbuilders-badge.global.js

@@ -0,0 +1,46 @@
+var AppBuildersBadge=(function(exports){'use strict';var g={"bottom-right":"bottom:16px;right:16px;","bottom-left":"bottom:16px;left:16px;","top-right":"top:16px;right:16px;","top-left":"top:16px;left:16px;"};function m(e){return e!=="system"?e:typeof window<"u"&&window.matchMedia?window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light":"dark"}function p(e,t){let n=m(e.theme),d=[t.appName,t.organization,t.environment].filter(Boolean).join(" \xB7 ");return `
+    <style>
+      :host { all: initial; }
+      .ab-badge {
+        position: fixed;
+        ${g[e.position]}
+        z-index: 2147483647;
+        display: flex;
+        align-items: center;
+        gap: 6px;
+        padding: 6px 10px;
+        border-radius: 999px;
+        font-family: system-ui, -apple-system, sans-serif;
+        font-size: 12px;
+        line-height: 1.4;
+        background: ${n==="dark"?"#111":"#fff"};
+        color: ${n==="dark"?"#fff":"#111"};
+        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
+        cursor: ${e.expandable?"pointer":"default"};
+        transition: ${e.animation?"all 0.2s ease":"none"};
+        user-select: none;
+      }
+      .ab-badge__dot {
+        width: 6px;
+        height: 6px;
+        border-radius: 50%;
+        background: ${t.verified?"#22c55e":"#94a3b8"};
+        flex-shrink: 0;
+      }
+      .ab-badge__details {
+        display: none;
+        margin-left: 4px;
+        opacity: 0.75;
+        white-space: nowrap;
+      }
+      .ab-badge--expanded .ab-badge__details {
+        display: inline;
+      }
+    </style>
+    <div class="ab-badge" part="badge">
+      <span class="ab-badge__dot"></span>
+      <span>Verified by App Builders PH</span>
+      <span class="ab-badge__details">${d}</span>
+    </div>
+  `}var i="appbuilders-badge",r=false;function s(){if(r||typeof window>"u"||typeof HTMLElement>"u")return;if(customElements.get(i)){r=true;return}class e extends HTMLElement{shadow;constructor(){super(),this.shadow=this.attachShadow({mode:"open"});}setConfig(n,d){this.shadow.innerHTML=p(n,d),n.expandable&&this.shadow.querySelector(".ab-badge")?.addEventListener("click",f=>{f.currentTarget.classList.toggle("ab-badge--expanded");});}}customElements.define(i,e),r=true;}var o={theme:"system",position:"bottom-right",animation:true,expandable:true};function a(e){return e===false?null:e===void 0||e===true?{...o}:e.enabled===false?null:{theme:e.theme??o.theme,position:e.position??o.position,animation:e.animation??o.animation,expandable:e.expandable??o.expandable}}var l=class{identity;config;el=null;constructor(t,n){this.identity=t,this.config=a(n);}isMounted(){return this.el!==null}mount(t){if(typeof document>"u"||this.config===null||this.el)return;s();let n=document.createElement(i);n.setConfig(this.config,this.identity),(t??document.body).appendChild(n),this.el=n;}unmount(){this.el&&(this.el.remove(),this.el=null);}update(t){if(this.config=a(t),!!this.el){if(this.config===null){this.unmount();return}this.el.setConfig(this.config,this.identity);}}};exports.BADGE_TAG=i;exports.Badge=l;exports.DEFAULT_BADGE_CONFIG=o;exports.defineBadgeElement=s;exports.resolveBadgeConfig=a;return exports;})({});//# sourceMappingURL=appbuilders-badge.global.js.map
+//# sourceMappingURL=appbuilders-badge.global.js.map

package/dist/appbuilders-badge.global.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/template.ts","../src/element.ts","../src/types.ts","../src/badge.ts"],"names":["POSITION_STYLES","resolveTheme","theme","template","config","identity","details","BADGE_TAG","registered","defineBadgeElement","AppBuildersBadgeElement","event","DEFAULT_BADGE_CONFIG","resolveBadgeConfig","input","Badge","target","el"],"mappings":"qDAEA,IAAMA,CAAAA,CAAmE,CACvE,cAAA,CAAgB,yBAAA,CAChB,aAAA,CAAe,wBAAA,CACf,WAAA,CAAa,sBAAA,CACb,UAAA,CAAY,qBACd,CAAA,CAEA,SAASC,CAAAA,CAAaC,CAAAA,CAAuD,CAC3E,OAAIA,CAAAA,GAAU,QAAA,CAAiBA,CAAAA,CAC3B,OAAO,MAAA,CAAW,GAAA,EAAe,MAAA,CAAO,UAAA,CACnC,MAAA,CAAO,UAAA,CAAW,8BAA8B,CAAA,CAAE,OAAA,CAAU,MAAA,CAAS,OAAA,CAEvE,MACT,CAEO,SAASC,CAAAA,CAASC,CAAAA,CAA6BC,CAAAA,CAAqC,CACzF,IAAMH,CAAAA,CAAQD,CAAAA,CAAaG,CAAAA,CAAO,KAAK,CAAA,CACjCE,CAAAA,CAAU,CAACD,CAAAA,CAAS,OAAA,CAASA,CAAAA,CAAS,YAAA,CAAcA,CAAAA,CAAS,WAAW,CAAA,CAC3E,MAAA,CAAO,OAAO,CAAA,CACd,IAAA,CAAK,QAAK,CAAA,CAEb,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,QAAA,EAKCL,CAAAA,CAAgBI,CAAAA,CAAO,QAAQ,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAAA,EAUpBF,CAAAA,GAAU,MAAA,CAAS,MAAA,CAAS,MAAM,CAAA;AAAA,eAAA,EACvCA,CAAAA,GAAU,MAAA,CAAS,MAAA,CAAS,MAAM,CAAA;AAAA;AAAA,gBAAA,EAEjCE,CAAAA,CAAO,UAAA,CAAa,SAAA,CAAY,SAAS,CAAA;AAAA,oBAAA,EACrCA,CAAAA,CAAO,SAAA,CAAY,eAAA,CAAkB,MAAM,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAAA,EAO3CC,CAAAA,CAAS,QAAA,CAAW,SAAA,CAAY,SAAS,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sCAAA,EAgBvBC,CAAO,CAAA;AAAA;AAAA,EAAA,CAG/C,CCjEO,IAAMC,CAAAA,CAAY,mBAAA,CAErBC,CAAAA,CAAa,MAEV,SAASC,CAAAA,EAA2B,CAEzC,GADID,CAAAA,EACA,OAAO,MAAA,CAAW,GAAA,EAAe,OAAO,WAAA,CAAgB,GAAA,CAAa,OACzE,GAAI,cAAA,CAAe,GAAA,CAAID,CAAS,CAAA,CAAG,CACjCC,CAAAA,CAAa,IAAA,CACb,MACF,CAEA,MAAME,CAAAA,SAAgC,WAAY,CAC/B,MAAA,CAEjB,WAAA,EAAc,CACZ,KAAA,EAAM,CACN,IAAA,CAAK,MAAA,CAAS,IAAA,CAAK,YAAA,CAAa,CAAE,IAAA,CAAM,MAAO,CAAC,EAClD,CAEA,SAAA,CAAUN,CAAAA,CAA6BC,CAAAA,CAAmC,CACxE,IAAA,CAAK,MAAA,CAAO,SAAA,CAAYF,CAAAA,CAASC,CAAAA,CAAQC,CAAQ,CAAA,CAE7CD,CAAAA,CAAO,UAAA,EACT,IAAA,CAAK,MAAA,CAAO,aAAA,CAAc,WAAW,CAAA,EAAG,gBAAA,CAAiB,OAAA,CAAUO,CAAAA,EAAU,CAC1EA,CAAAA,CAAM,aAAA,CAA8B,SAAA,CAAU,MAAA,CAAO,oBAAoB,EAC5E,CAAC,EAEL,CACF,CAEA,cAAA,CAAe,MAAA,CAAOJ,CAAAA,CAAWG,CAAuB,CAAA,CACxDF,CAAAA,CAAa,KACf,CCnBO,IAAMI,CAAAA,CAA4C,CACvD,KAAA,CAAO,QAAA,CACP,QAAA,CAAU,cAAA,CACV,SAAA,CAAW,IAAA,CACX,UAAA,CAAY,IACd,EAEO,SAASC,CAAAA,CAAmBC,CAAAA,CAA2D,CAC5F,OAAIA,CAAAA,GAAU,KAAA,CAAc,IAAA,CACxBA,CAAAA,GAAU,MAAA,EAAaA,CAAAA,GAAU,IAAA,CAAa,CAAE,GAAGF,CAAqB,CAAA,CACxEE,CAAAA,CAAM,OAAA,GAAY,KAAA,CAAc,IAAA,CAE7B,CACL,KAAA,CAAOA,CAAAA,CAAM,KAAA,EAASF,CAAAA,CAAqB,KAAA,CAC3C,SAAUE,CAAAA,CAAM,QAAA,EAAYF,CAAAA,CAAqB,QAAA,CACjD,SAAA,CAAWE,CAAAA,CAAM,SAAA,EAAaF,CAAAA,CAAqB,SAAA,CACnD,UAAA,CAAYE,CAAAA,CAAM,UAAA,EAAcF,CAAAA,CAAqB,UACvD,CACF,CC/BO,IAAMG,CAAAA,CAAN,KAAY,CACA,QAAA,CACT,MAAA,CACA,EAAA,CAA0B,IAAA,CAElC,WAAA,CAAYV,CAAAA,CAA6BD,CAAAA,CAAgC,CACvE,IAAA,CAAK,QAAA,CAAWC,CAAAA,CAChB,IAAA,CAAK,MAAA,CAASQ,CAAAA,CAAmBT,CAAM,EACzC,CAEA,SAAA,EAAqB,CACnB,OAAO,IAAA,CAAK,EAAA,GAAO,IACrB,CAEA,KAAA,CAAMY,CAAAA,CAAwB,CAG5B,GAFI,OAAO,QAAA,CAAa,GAAA,EACpB,IAAA,CAAK,MAAA,GAAW,IAAA,EAChB,IAAA,CAAK,EAAA,CAAI,OAEbP,CAAAA,EAAmB,CACnB,IAAMQ,CAAAA,CAAK,QAAA,CAAS,aAAA,CAAcV,CAAS,CAAA,CAC3CU,CAAAA,CAAG,SAAA,CAAU,IAAA,CAAK,MAAA,CAAQ,IAAA,CAAK,QAAQ,CAAA,CAAA,CACtCD,CAAAA,EAAU,QAAA,CAAS,IAAA,EAAM,WAAA,CAAYC,CAAE,CAAA,CACxC,IAAA,CAAK,EAAA,CAAKA,EACZ,CAEA,OAAA,EAAgB,CACT,IAAA,CAAK,EAAA,GACV,IAAA,CAAK,EAAA,CAAG,MAAA,EAAO,CACf,IAAA,CAAK,EAAA,CAAK,IAAA,EACZ,CAEA,MAAA,CAAOb,CAAAA,CAAsC,CAG3C,GAFA,IAAA,CAAK,MAAA,CAASS,CAAAA,CAAmBT,CAAM,CAAA,CAEnC,CAAA,CAAC,IAAA,CAAK,EAAA,CACV,CAAA,GAAI,IAAA,CAAK,MAAA,GAAW,IAAA,CAAM,CACxB,IAAA,CAAK,OAAA,EAAQ,CACb,MACF,CACA,IAAA,CAAK,EAAA,CAAG,SAAA,CAAU,IAAA,CAAK,MAAA,CAAQ,IAAA,CAAK,QAAQ,EAAA,CAC9C,CACF","file":"appbuilders-badge.global.js","sourcesContent":["import type { BadgeIdentityInfo, ResolvedBadgeConfig } from \"./types.js\";\n\nconst POSITION_STYLES: Record<ResolvedBadgeConfig[\"position\"], string> = {\n  \"bottom-right\": \"bottom:16px;right:16px;\",\n  \"bottom-left\": \"bottom:16px;left:16px;\",\n  \"top-right\": \"top:16px;right:16px;\",\n  \"top-left\": \"top:16px;left:16px;\",\n};\n\nfunction resolveTheme(theme: ResolvedBadgeConfig[\"theme\"]): \"dark\" | \"light\" {\n  if (theme !== \"system\") return theme;\n  if (typeof window !== \"undefined\" && window.matchMedia) {\n    return window.matchMedia(\"(prefers-color-scheme: dark)\").matches ? \"dark\" : \"light\";\n  }\n  return \"dark\";\n}\n\nexport function template(config: ResolvedBadgeConfig, identity: BadgeIdentityInfo): string {\n  const theme = resolveTheme(config.theme);\n  const details = [identity.appName, identity.organization, identity.environment]\n    .filter(Boolean)\n    .join(\" · \");\n\n  return `\n    <style>\n      :host { all: initial; }\n      .ab-badge {\n        position: fixed;\n        ${POSITION_STYLES[config.position]}\n        z-index: 2147483647;\n        display: flex;\n        align-items: center;\n        gap: 6px;\n        padding: 6px 10px;\n        border-radius: 999px;\n        font-family: system-ui, -apple-system, sans-serif;\n        font-size: 12px;\n        line-height: 1.4;\n        background: ${theme === \"dark\" ? \"#111\" : \"#fff\"};\n        color: ${theme === \"dark\" ? \"#fff\" : \"#111\"};\n        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);\n        cursor: ${config.expandable ? \"pointer\" : \"default\"};\n        transition: ${config.animation ? \"all 0.2s ease\" : \"none\"};\n        user-select: none;\n      }\n      .ab-badge__dot {\n        width: 6px;\n        height: 6px;\n        border-radius: 50%;\n        background: ${identity.verified ? \"#22c55e\" : \"#94a3b8\"};\n        flex-shrink: 0;\n      }\n      .ab-badge__details {\n        display: none;\n        margin-left: 4px;\n        opacity: 0.75;\n        white-space: nowrap;\n      }\n      .ab-badge--expanded .ab-badge__details {\n        display: inline;\n      }\n    </style>\n    <div class=\"ab-badge\" part=\"badge\">\n      <span class=\"ab-badge__dot\"></span>\n      <span>Verified by App Builders PH</span>\n      <span class=\"ab-badge__details\">${details}</span>\n    </div>\n  `;\n}\n","import { template } from \"./template.js\";\nimport type { BadgeIdentityInfo, ResolvedBadgeConfig } from \"./types.js\";\n\nexport const BADGE_TAG = \"appbuilders-badge\";\n\nlet registered = false;\n\nexport function defineBadgeElement(): void {\n  if (registered) return;\n  if (typeof window === \"undefined\" || typeof HTMLElement === \"undefined\") return;\n  if (customElements.get(BADGE_TAG)) {\n    registered = true;\n    return;\n  }\n\n  class AppBuildersBadgeElement extends HTMLElement {\n    private readonly shadow: ShadowRoot;\n\n    constructor() {\n      super();\n      this.shadow = this.attachShadow({ mode: \"open\" });\n    }\n\n    setConfig(config: ResolvedBadgeConfig, identity: BadgeIdentityInfo): void {\n      this.shadow.innerHTML = template(config, identity);\n\n      if (config.expandable) {\n        this.shadow.querySelector(\".ab-badge\")?.addEventListener(\"click\", (event) => {\n          (event.currentTarget as HTMLElement).classList.toggle(\"ab-badge--expanded\");\n        });\n      }\n    }\n  }\n\n  customElements.define(BADGE_TAG, AppBuildersBadgeElement);\n  registered = true;\n}\n\nexport interface BadgeElement extends HTMLElement {\n  setConfig(config: ResolvedBadgeConfig, identity: BadgeIdentityInfo): void;\n}\n","import type { BadgeConfig, BadgePosition, Environment, Theme } from \"@appbuildersph/shared\";\n\nexport interface BadgeIdentityInfo {\n  appName: string;\n  organization?: string;\n  developer?: string;\n  environment?: Environment;\n  verified?: boolean;\n}\n\nexport interface ResolvedBadgeConfig {\n  theme: Theme;\n  position: BadgePosition;\n  animation: boolean;\n  expandable: boolean;\n}\n\nexport const DEFAULT_BADGE_CONFIG: ResolvedBadgeConfig = {\n  theme: \"system\",\n  position: \"bottom-right\",\n  animation: true,\n  expandable: true,\n};\n\nexport function resolveBadgeConfig(input?: boolean | BadgeConfig): ResolvedBadgeConfig | null {\n  if (input === false) return null;\n  if (input === undefined || input === true) return { ...DEFAULT_BADGE_CONFIG };\n  if (input.enabled === false) return null;\n\n  return {\n    theme: input.theme ?? DEFAULT_BADGE_CONFIG.theme,\n    position: input.position ?? DEFAULT_BADGE_CONFIG.position,\n    animation: input.animation ?? DEFAULT_BADGE_CONFIG.animation,\n    expandable: input.expandable ?? DEFAULT_BADGE_CONFIG.expandable,\n  };\n}\n","import type { BadgeConfig } from \"@appbuildersph/shared\";\nimport { BADGE_TAG, defineBadgeElement, type BadgeElement } from \"./element.js\";\nimport { resolveBadgeConfig, type BadgeIdentityInfo, type ResolvedBadgeConfig } from \"./types.js\";\n\nexport class Badge {\n  private readonly identity: BadgeIdentityInfo;\n  private config: ResolvedBadgeConfig | null;\n  private el: BadgeElement | null = null;\n\n  constructor(identity: BadgeIdentityInfo, config?: boolean | BadgeConfig) {\n    this.identity = identity;\n    this.config = resolveBadgeConfig(config);\n  }\n\n  isMounted(): boolean {\n    return this.el !== null;\n  }\n\n  mount(target?: Element): void {\n    if (typeof document === \"undefined\") return;\n    if (this.config === null) return;\n    if (this.el) return;\n\n    defineBadgeElement();\n    const el = document.createElement(BADGE_TAG) as BadgeElement;\n    el.setConfig(this.config, this.identity);\n    (target ?? document.body).appendChild(el);\n    this.el = el;\n  }\n\n  unmount(): void {\n    if (!this.el) return;\n    this.el.remove();\n    this.el = null;\n  }\n\n  update(config?: boolean | BadgeConfig): void {\n    this.config = resolveBadgeConfig(config);\n\n    if (!this.el) return;\n    if (this.config === null) {\n      this.unmount();\n      return;\n    }\n    this.el.setConfig(this.config, this.identity);\n  }\n}\n"]}

package/dist/index.cjs

@@ -0,0 +1,159 @@
+'use strict';
+
+// src/template.ts
+var POSITION_STYLES = {
+  "bottom-right": "bottom:16px;right:16px;",
+  "bottom-left": "bottom:16px;left:16px;",
+  "top-right": "top:16px;right:16px;",
+  "top-left": "top:16px;left:16px;"
+};
+function resolveTheme(theme) {
+  if (theme !== "system") return theme;
+  if (typeof window !== "undefined" && window.matchMedia) {
+    return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+  }
+  return "dark";
+}
+function template(config, identity) {
+  const theme = resolveTheme(config.theme);
+  const details = [identity.appName, identity.organization, identity.environment].filter(Boolean).join(" \xB7 ");
+  return `
+    <style>
+      :host { all: initial; }
+      .ab-badge {
+        position: fixed;
+        ${POSITION_STYLES[config.position]}
+        z-index: 2147483647;
+        display: flex;
+        align-items: center;
+        gap: 6px;
+        padding: 6px 10px;
+        border-radius: 999px;
+        font-family: system-ui, -apple-system, sans-serif;
+        font-size: 12px;
+        line-height: 1.4;
+        background: ${theme === "dark" ? "#111" : "#fff"};
+        color: ${theme === "dark" ? "#fff" : "#111"};
+        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
+        cursor: ${config.expandable ? "pointer" : "default"};
+        transition: ${config.animation ? "all 0.2s ease" : "none"};
+        user-select: none;
+      }
+      .ab-badge__dot {
+        width: 6px;
+        height: 6px;
+        border-radius: 50%;
+        background: ${identity.verified ? "#22c55e" : "#94a3b8"};
+        flex-shrink: 0;
+      }
+      .ab-badge__details {
+        display: none;
+        margin-left: 4px;
+        opacity: 0.75;
+        white-space: nowrap;
+      }
+      .ab-badge--expanded .ab-badge__details {
+        display: inline;
+      }
+    </style>
+    <div class="ab-badge" part="badge">
+      <span class="ab-badge__dot"></span>
+      <span>Verified by App Builders PH</span>
+      <span class="ab-badge__details">${details}</span>
+    </div>
+  `;
+}
+
+// src/element.ts
+var BADGE_TAG = "appbuilders-badge";
+var registered = false;
+function defineBadgeElement() {
+  if (registered) return;
+  if (typeof window === "undefined" || typeof HTMLElement === "undefined") return;
+  if (customElements.get(BADGE_TAG)) {
+    registered = true;
+    return;
+  }
+  class AppBuildersBadgeElement extends HTMLElement {
+    shadow;
+    constructor() {
+      super();
+      this.shadow = this.attachShadow({ mode: "open" });
+    }
+    setConfig(config, identity) {
+      this.shadow.innerHTML = template(config, identity);
+      if (config.expandable) {
+        this.shadow.querySelector(".ab-badge")?.addEventListener("click", (event) => {
+          event.currentTarget.classList.toggle("ab-badge--expanded");
+        });
+      }
+    }
+  }
+  customElements.define(BADGE_TAG, AppBuildersBadgeElement);
+  registered = true;
+}
+
+// src/types.ts
+var DEFAULT_BADGE_CONFIG = {
+  theme: "system",
+  position: "bottom-right",
+  animation: true,
+  expandable: true
+};
+function resolveBadgeConfig(input) {
+  if (input === false) return null;
+  if (input === void 0 || input === true) return { ...DEFAULT_BADGE_CONFIG };
+  if (input.enabled === false) return null;
+  return {
+    theme: input.theme ?? DEFAULT_BADGE_CONFIG.theme,
+    position: input.position ?? DEFAULT_BADGE_CONFIG.position,
+    animation: input.animation ?? DEFAULT_BADGE_CONFIG.animation,
+    expandable: input.expandable ?? DEFAULT_BADGE_CONFIG.expandable
+  };
+}
+
+// src/badge.ts
+var Badge = class {
+  identity;
+  config;
+  el = null;
+  constructor(identity, config) {
+    this.identity = identity;
+    this.config = resolveBadgeConfig(config);
+  }
+  isMounted() {
+    return this.el !== null;
+  }
+  mount(target) {
+    if (typeof document === "undefined") return;
+    if (this.config === null) return;
+    if (this.el) return;
+    defineBadgeElement();
+    const el = document.createElement(BADGE_TAG);
+    el.setConfig(this.config, this.identity);
+    (target ?? document.body).appendChild(el);
+    this.el = el;
+  }
+  unmount() {
+    if (!this.el) return;
+    this.el.remove();
+    this.el = null;
+  }
+  update(config) {
+    this.config = resolveBadgeConfig(config);
+    if (!this.el) return;
+    if (this.config === null) {
+      this.unmount();
+      return;
+    }
+    this.el.setConfig(this.config, this.identity);
+  }
+};
+
+exports.BADGE_TAG = BADGE_TAG;
+exports.Badge = Badge;
+exports.DEFAULT_BADGE_CONFIG = DEFAULT_BADGE_CONFIG;
+exports.defineBadgeElement = defineBadgeElement;
+exports.resolveBadgeConfig = resolveBadgeConfig;
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/template.ts","../src/element.ts","../src/types.ts","../src/badge.ts"],"names":[],"mappings":"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","file":"index.cjs","sourcesContent":["import type { BadgeIdentityInfo, ResolvedBadgeConfig } from \"./types.js\";\n\nconst POSITION_STYLES: Record<ResolvedBadgeConfig[\"position\"], string> = {\n  \"bottom-right\": \"bottom:16px;right:16px;\",\n  \"bottom-left\": \"bottom:16px;left:16px;\",\n  \"top-right\": \"top:16px;right:16px;\",\n  \"top-left\": \"top:16px;left:16px;\",\n};\n\nfunction resolveTheme(theme: ResolvedBadgeConfig[\"theme\"]): \"dark\" | \"light\" {\n  if (theme !== \"system\") return theme;\n  if (typeof window !== \"undefined\" && window.matchMedia) {\n    return window.matchMedia(\"(prefers-color-scheme: dark)\").matches ? \"dark\" : \"light\";\n  }\n  return \"dark\";\n}\n\nexport function template(config: ResolvedBadgeConfig, identity: BadgeIdentityInfo): string {\n  const theme = resolveTheme(config.theme);\n  const details = [identity.appName, identity.organization, identity.environment]\n    .filter(Boolean)\n    .join(\" · \");\n\n  return `\n    <style>\n      :host { all: initial; }\n      .ab-badge {\n        position: fixed;\n        ${POSITION_STYLES[config.position]}\n        z-index: 2147483647;\n        display: flex;\n        align-items: center;\n        gap: 6px;\n        padding: 6px 10px;\n        border-radius: 999px;\n        font-family: system-ui, -apple-system, sans-serif;\n        font-size: 12px;\n        line-height: 1.4;\n        background: ${theme === \"dark\" ? \"#111\" : \"#fff\"};\n        color: ${theme === \"dark\" ? \"#fff\" : \"#111\"};\n        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);\n        cursor: ${config.expandable ? \"pointer\" : \"default\"};\n        transition: ${config.animation ? \"all 0.2s ease\" : \"none\"};\n        user-select: none;\n      }\n      .ab-badge__dot {\n        width: 6px;\n        height: 6px;\n        border-radius: 50%;\n        background: ${identity.verified ? \"#22c55e\" : \"#94a3b8\"};\n        flex-shrink: 0;\n      }\n      .ab-badge__details {\n        display: none;\n        margin-left: 4px;\n        opacity: 0.75;\n        white-space: nowrap;\n      }\n      .ab-badge--expanded .ab-badge__details {\n        display: inline;\n      }\n    </style>\n    <div class=\"ab-badge\" part=\"badge\">\n      <span class=\"ab-badge__dot\"></span>\n      <span>Verified by App Builders PH</span>\n      <span class=\"ab-badge__details\">${details}</span>\n    </div>\n  `;\n}\n","import { template } from \"./template.js\";\nimport type { BadgeIdentityInfo, ResolvedBadgeConfig } from \"./types.js\";\n\nexport const BADGE_TAG = \"appbuilders-badge\";\n\nlet registered = false;\n\nexport function defineBadgeElement(): void {\n  if (registered) return;\n  if (typeof window === \"undefined\" || typeof HTMLElement === \"undefined\") return;\n  if (customElements.get(BADGE_TAG)) {\n    registered = true;\n    return;\n  }\n\n  class AppBuildersBadgeElement extends HTMLElement {\n    private readonly shadow: ShadowRoot;\n\n    constructor() {\n      super();\n      this.shadow = this.attachShadow({ mode: \"open\" });\n    }\n\n    setConfig(config: ResolvedBadgeConfig, identity: BadgeIdentityInfo): void {\n      this.shadow.innerHTML = template(config, identity);\n\n      if (config.expandable) {\n        this.shadow.querySelector(\".ab-badge\")?.addEventListener(\"click\", (event) => {\n          (event.currentTarget as HTMLElement).classList.toggle(\"ab-badge--expanded\");\n        });\n      }\n    }\n  }\n\n  customElements.define(BADGE_TAG, AppBuildersBadgeElement);\n  registered = true;\n}\n\nexport interface BadgeElement extends HTMLElement {\n  setConfig(config: ResolvedBadgeConfig, identity: BadgeIdentityInfo): void;\n}\n","import type { BadgeConfig, BadgePosition, Environment, Theme } from \"@appbuildersph/shared\";\n\nexport interface BadgeIdentityInfo {\n  appName: string;\n  organization?: string;\n  developer?: string;\n  environment?: Environment;\n  verified?: boolean;\n}\n\nexport interface ResolvedBadgeConfig {\n  theme: Theme;\n  position: BadgePosition;\n  animation: boolean;\n  expandable: boolean;\n}\n\nexport const DEFAULT_BADGE_CONFIG: ResolvedBadgeConfig = {\n  theme: \"system\",\n  position: \"bottom-right\",\n  animation: true,\n  expandable: true,\n};\n\nexport function resolveBadgeConfig(input?: boolean | BadgeConfig): ResolvedBadgeConfig | null {\n  if (input === false) return null;\n  if (input === undefined || input === true) return { ...DEFAULT_BADGE_CONFIG };\n  if (input.enabled === false) return null;\n\n  return {\n    theme: input.theme ?? DEFAULT_BADGE_CONFIG.theme,\n    position: input.position ?? DEFAULT_BADGE_CONFIG.position,\n    animation: input.animation ?? DEFAULT_BADGE_CONFIG.animation,\n    expandable: input.expandable ?? DEFAULT_BADGE_CONFIG.expandable,\n  };\n}\n","import type { BadgeConfig } from \"@appbuildersph/shared\";\nimport { BADGE_TAG, defineBadgeElement, type BadgeElement } from \"./element.js\";\nimport { resolveBadgeConfig, type BadgeIdentityInfo, type ResolvedBadgeConfig } from \"./types.js\";\n\nexport class Badge {\n  private readonly identity: BadgeIdentityInfo;\n  private config: ResolvedBadgeConfig | null;\n  private el: BadgeElement | null = null;\n\n  constructor(identity: BadgeIdentityInfo, config?: boolean | BadgeConfig) {\n    this.identity = identity;\n    this.config = resolveBadgeConfig(config);\n  }\n\n  isMounted(): boolean {\n    return this.el !== null;\n  }\n\n  mount(target?: Element): void {\n    if (typeof document === \"undefined\") return;\n    if (this.config === null) return;\n    if (this.el) return;\n\n    defineBadgeElement();\n    const el = document.createElement(BADGE_TAG) as BadgeElement;\n    el.setConfig(this.config, this.identity);\n    (target ?? document.body).appendChild(el);\n    this.el = el;\n  }\n\n  unmount(): void {\n    if (!this.el) return;\n    this.el.remove();\n    this.el = null;\n  }\n\n  update(config?: boolean | BadgeConfig): void {\n    this.config = resolveBadgeConfig(config);\n\n    if (!this.el) return;\n    if (this.config === null) {\n      this.unmount();\n      return;\n    }\n    this.el.setConfig(this.config, this.identity);\n  }\n}\n"]}

package/dist/index.d.cts

@@ -0,0 +1,36 @@
+import { Environment, Theme, BadgePosition, BadgeConfig } from '@appbuildersph/shared';
+
+interface BadgeIdentityInfo {
+    appName: string;
+    organization?: string;
+    developer?: string;
+    environment?: Environment;
+    verified?: boolean;
+}
+interface ResolvedBadgeConfig {
+    theme: Theme;
+    position: BadgePosition;
+    animation: boolean;
+    expandable: boolean;
+}
+declare const DEFAULT_BADGE_CONFIG: ResolvedBadgeConfig;
+declare function resolveBadgeConfig(input?: boolean | BadgeConfig): ResolvedBadgeConfig | null;
+
+declare class Badge {
+    private readonly identity;
+    private config;
+    private el;
+    constructor(identity: BadgeIdentityInfo, config?: boolean | BadgeConfig);
+    isMounted(): boolean;
+    mount(target?: Element): void;
+    unmount(): void;
+    update(config?: boolean | BadgeConfig): void;
+}
+
+declare const BADGE_TAG = "appbuilders-badge";
+declare function defineBadgeElement(): void;
+interface BadgeElement extends HTMLElement {
+    setConfig(config: ResolvedBadgeConfig, identity: BadgeIdentityInfo): void;
+}
+
+export { BADGE_TAG, Badge, type BadgeElement, type BadgeIdentityInfo, DEFAULT_BADGE_CONFIG, type ResolvedBadgeConfig, defineBadgeElement, resolveBadgeConfig };

package/dist/index.d.ts

@@ -0,0 +1,36 @@
+import { Environment, Theme, BadgePosition, BadgeConfig } from '@appbuildersph/shared';
+
+interface BadgeIdentityInfo {
+    appName: string;
+    organization?: string;
+    developer?: string;
+    environment?: Environment;
+    verified?: boolean;
+}
+interface ResolvedBadgeConfig {
+    theme: Theme;
+    position: BadgePosition;
+    animation: boolean;
+    expandable: boolean;
+}
+declare const DEFAULT_BADGE_CONFIG: ResolvedBadgeConfig;
+declare function resolveBadgeConfig(input?: boolean | BadgeConfig): ResolvedBadgeConfig | null;
+
+declare class Badge {
+    private readonly identity;
+    private config;
+    private el;
+    constructor(identity: BadgeIdentityInfo, config?: boolean | BadgeConfig);
+    isMounted(): boolean;
+    mount(target?: Element): void;
+    unmount(): void;
+    update(config?: boolean | BadgeConfig): void;
+}
+
+declare const BADGE_TAG = "appbuilders-badge";
+declare function defineBadgeElement(): void;
+interface BadgeElement extends HTMLElement {
+    setConfig(config: ResolvedBadgeConfig, identity: BadgeIdentityInfo): void;
+}
+
+export { BADGE_TAG, Badge, type BadgeElement, type BadgeIdentityInfo, DEFAULT_BADGE_CONFIG, type ResolvedBadgeConfig, defineBadgeElement, resolveBadgeConfig };

package/dist/index.js

@@ -0,0 +1,153 @@
+// src/template.ts
+var POSITION_STYLES = {
+  "bottom-right": "bottom:16px;right:16px;",
+  "bottom-left": "bottom:16px;left:16px;",
+  "top-right": "top:16px;right:16px;",
+  "top-left": "top:16px;left:16px;"
+};
+function resolveTheme(theme) {
+  if (theme !== "system") return theme;
+  if (typeof window !== "undefined" && window.matchMedia) {
+    return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+  }
+  return "dark";
+}
+function template(config, identity) {
+  const theme = resolveTheme(config.theme);
+  const details = [identity.appName, identity.organization, identity.environment].filter(Boolean).join(" \xB7 ");
+  return `
+    <style>
+      :host { all: initial; }
+      .ab-badge {
+        position: fixed;
+        ${POSITION_STYLES[config.position]}
+        z-index: 2147483647;
+        display: flex;
+        align-items: center;
+        gap: 6px;
+        padding: 6px 10px;
+        border-radius: 999px;
+        font-family: system-ui, -apple-system, sans-serif;
+        font-size: 12px;
+        line-height: 1.4;
+        background: ${theme === "dark" ? "#111" : "#fff"};
+        color: ${theme === "dark" ? "#fff" : "#111"};
+        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
+        cursor: ${config.expandable ? "pointer" : "default"};
+        transition: ${config.animation ? "all 0.2s ease" : "none"};
+        user-select: none;
+      }
+      .ab-badge__dot {
+        width: 6px;
+        height: 6px;
+        border-radius: 50%;
+        background: ${identity.verified ? "#22c55e" : "#94a3b8"};
+        flex-shrink: 0;
+      }
+      .ab-badge__details {
+        display: none;
+        margin-left: 4px;
+        opacity: 0.75;
+        white-space: nowrap;
+      }
+      .ab-badge--expanded .ab-badge__details {
+        display: inline;
+      }
+    </style>
+    <div class="ab-badge" part="badge">
+      <span class="ab-badge__dot"></span>
+      <span>Verified by App Builders PH</span>
+      <span class="ab-badge__details">${details}</span>
+    </div>
+  `;
+}
+
+// src/element.ts
+var BADGE_TAG = "appbuilders-badge";
+var registered = false;
+function defineBadgeElement() {
+  if (registered) return;
+  if (typeof window === "undefined" || typeof HTMLElement === "undefined") return;
+  if (customElements.get(BADGE_TAG)) {
+    registered = true;
+    return;
+  }
+  class AppBuildersBadgeElement extends HTMLElement {
+    shadow;
+    constructor() {
+      super();
+      this.shadow = this.attachShadow({ mode: "open" });
+    }
+    setConfig(config, identity) {
+      this.shadow.innerHTML = template(config, identity);
+      if (config.expandable) {
+        this.shadow.querySelector(".ab-badge")?.addEventListener("click", (event) => {
+          event.currentTarget.classList.toggle("ab-badge--expanded");
+        });
+      }
+    }
+  }
+  customElements.define(BADGE_TAG, AppBuildersBadgeElement);
+  registered = true;
+}
+
+// src/types.ts
+var DEFAULT_BADGE_CONFIG = {
+  theme: "system",
+  position: "bottom-right",
+  animation: true,
+  expandable: true
+};
+function resolveBadgeConfig(input) {
+  if (input === false) return null;
+  if (input === void 0 || input === true) return { ...DEFAULT_BADGE_CONFIG };
+  if (input.enabled === false) return null;
+  return {
+    theme: input.theme ?? DEFAULT_BADGE_CONFIG.theme,
+    position: input.position ?? DEFAULT_BADGE_CONFIG.position,
+    animation: input.animation ?? DEFAULT_BADGE_CONFIG.animation,
+    expandable: input.expandable ?? DEFAULT_BADGE_CONFIG.expandable
+  };
+}
+
+// src/badge.ts
+var Badge = class {
+  identity;
+  config;
+  el = null;
+  constructor(identity, config) {
+    this.identity = identity;
+    this.config = resolveBadgeConfig(config);
+  }
+  isMounted() {
+    return this.el !== null;
+  }
+  mount(target) {
+    if (typeof document === "undefined") return;
+    if (this.config === null) return;
+    if (this.el) return;
+    defineBadgeElement();
+    const el = document.createElement(BADGE_TAG);
+    el.setConfig(this.config, this.identity);
+    (target ?? document.body).appendChild(el);
+    this.el = el;
+  }
+  unmount() {
+    if (!this.el) return;
+    this.el.remove();
+    this.el = null;
+  }
+  update(config) {
+    this.config = resolveBadgeConfig(config);
+    if (!this.el) return;
+    if (this.config === null) {
+      this.unmount();
+      return;
+    }
+    this.el.setConfig(this.config, this.identity);
+  }
+};
+
+export { BADGE_TAG, Badge, DEFAULT_BADGE_CONFIG, defineBadgeElement, resolveBadgeConfig };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/template.ts","../src/element.ts","../src/types.ts","../src/badge.ts"],"names":[],"mappings":"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","file":"index.js","sourcesContent":["import type { BadgeIdentityInfo, ResolvedBadgeConfig } from \"./types.js\";\n\nconst POSITION_STYLES: Record<ResolvedBadgeConfig[\"position\"], string> = {\n  \"bottom-right\": \"bottom:16px;right:16px;\",\n  \"bottom-left\": \"bottom:16px;left:16px;\",\n  \"top-right\": \"top:16px;right:16px;\",\n  \"top-left\": \"top:16px;left:16px;\",\n};\n\nfunction resolveTheme(theme: ResolvedBadgeConfig[\"theme\"]): \"dark\" | \"light\" {\n  if (theme !== \"system\") return theme;\n  if (typeof window !== \"undefined\" && window.matchMedia) {\n    return window.matchMedia(\"(prefers-color-scheme: dark)\").matches ? \"dark\" : \"light\";\n  }\n  return \"dark\";\n}\n\nexport function template(config: ResolvedBadgeConfig, identity: BadgeIdentityInfo): string {\n  const theme = resolveTheme(config.theme);\n  const details = [identity.appName, identity.organization, identity.environment]\n    .filter(Boolean)\n    .join(\" · \");\n\n  return `\n    <style>\n      :host { all: initial; }\n      .ab-badge {\n        position: fixed;\n        ${POSITION_STYLES[config.position]}\n        z-index: 2147483647;\n        display: flex;\n        align-items: center;\n        gap: 6px;\n        padding: 6px 10px;\n        border-radius: 999px;\n        font-family: system-ui, -apple-system, sans-serif;\n        font-size: 12px;\n        line-height: 1.4;\n        background: ${theme === \"dark\" ? \"#111\" : \"#fff\"};\n        color: ${theme === \"dark\" ? \"#fff\" : \"#111\"};\n        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);\n        cursor: ${config.expandable ? \"pointer\" : \"default\"};\n        transition: ${config.animation ? \"all 0.2s ease\" : \"none\"};\n        user-select: none;\n      }\n      .ab-badge__dot {\n        width: 6px;\n        height: 6px;\n        border-radius: 50%;\n        background: ${identity.verified ? \"#22c55e\" : \"#94a3b8\"};\n        flex-shrink: 0;\n      }\n      .ab-badge__details {\n        display: none;\n        margin-left: 4px;\n        opacity: 0.75;\n        white-space: nowrap;\n      }\n      .ab-badge--expanded .ab-badge__details {\n        display: inline;\n      }\n    </style>\n    <div class=\"ab-badge\" part=\"badge\">\n      <span class=\"ab-badge__dot\"></span>\n      <span>Verified by App Builders PH</span>\n      <span class=\"ab-badge__details\">${details}</span>\n    </div>\n  `;\n}\n","import { template } from \"./template.js\";\nimport type { BadgeIdentityInfo, ResolvedBadgeConfig } from \"./types.js\";\n\nexport const BADGE_TAG = \"appbuilders-badge\";\n\nlet registered = false;\n\nexport function defineBadgeElement(): void {\n  if (registered) return;\n  if (typeof window === \"undefined\" || typeof HTMLElement === \"undefined\") return;\n  if (customElements.get(BADGE_TAG)) {\n    registered = true;\n    return;\n  }\n\n  class AppBuildersBadgeElement extends HTMLElement {\n    private readonly shadow: ShadowRoot;\n\n    constructor() {\n      super();\n      this.shadow = this.attachShadow({ mode: \"open\" });\n    }\n\n    setConfig(config: ResolvedBadgeConfig, identity: BadgeIdentityInfo): void {\n      this.shadow.innerHTML = template(config, identity);\n\n      if (config.expandable) {\n        this.shadow.querySelector(\".ab-badge\")?.addEventListener(\"click\", (event) => {\n          (event.currentTarget as HTMLElement).classList.toggle(\"ab-badge--expanded\");\n        });\n      }\n    }\n  }\n\n  customElements.define(BADGE_TAG, AppBuildersBadgeElement);\n  registered = true;\n}\n\nexport interface BadgeElement extends HTMLElement {\n  setConfig(config: ResolvedBadgeConfig, identity: BadgeIdentityInfo): void;\n}\n","import type { BadgeConfig, BadgePosition, Environment, Theme } from \"@appbuildersph/shared\";\n\nexport interface BadgeIdentityInfo {\n  appName: string;\n  organization?: string;\n  developer?: string;\n  environment?: Environment;\n  verified?: boolean;\n}\n\nexport interface ResolvedBadgeConfig {\n  theme: Theme;\n  position: BadgePosition;\n  animation: boolean;\n  expandable: boolean;\n}\n\nexport const DEFAULT_BADGE_CONFIG: ResolvedBadgeConfig = {\n  theme: \"system\",\n  position: \"bottom-right\",\n  animation: true,\n  expandable: true,\n};\n\nexport function resolveBadgeConfig(input?: boolean | BadgeConfig): ResolvedBadgeConfig | null {\n  if (input === false) return null;\n  if (input === undefined || input === true) return { ...DEFAULT_BADGE_CONFIG };\n  if (input.enabled === false) return null;\n\n  return {\n    theme: input.theme ?? DEFAULT_BADGE_CONFIG.theme,\n    position: input.position ?? DEFAULT_BADGE_CONFIG.position,\n    animation: input.animation ?? DEFAULT_BADGE_CONFIG.animation,\n    expandable: input.expandable ?? DEFAULT_BADGE_CONFIG.expandable,\n  };\n}\n","import type { BadgeConfig } from \"@appbuildersph/shared\";\nimport { BADGE_TAG, defineBadgeElement, type BadgeElement } from \"./element.js\";\nimport { resolveBadgeConfig, type BadgeIdentityInfo, type ResolvedBadgeConfig } from \"./types.js\";\n\nexport class Badge {\n  private readonly identity: BadgeIdentityInfo;\n  private config: ResolvedBadgeConfig | null;\n  private el: BadgeElement | null = null;\n\n  constructor(identity: BadgeIdentityInfo, config?: boolean | BadgeConfig) {\n    this.identity = identity;\n    this.config = resolveBadgeConfig(config);\n  }\n\n  isMounted(): boolean {\n    return this.el !== null;\n  }\n\n  mount(target?: Element): void {\n    if (typeof document === \"undefined\") return;\n    if (this.config === null) return;\n    if (this.el) return;\n\n    defineBadgeElement();\n    const el = document.createElement(BADGE_TAG) as BadgeElement;\n    el.setConfig(this.config, this.identity);\n    (target ?? document.body).appendChild(el);\n    this.el = el;\n  }\n\n  unmount(): void {\n    if (!this.el) return;\n    this.el.remove();\n    this.el = null;\n  }\n\n  update(config?: boolean | BadgeConfig): void {\n    this.config = resolveBadgeConfig(config);\n\n    if (!this.el) return;\n    if (this.config === null) {\n      this.unmount();\n      return;\n    }\n    this.el.setConfig(this.config, this.identity);\n  }\n}\n"]}

package/package.json

@@ -0,0 +1,33 @@
+{
+  "name": "@appbuildersph/badge",
+  "version": "0.1.0",
+  "description": "Floating Verified Badge UI web component for the App Builders PH SDK.",
+  "type": "module",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "dependencies": {
+    "@appbuildersph/shared": "0.0.2"
+  },
+  "devDependencies": {
+    "tsup": "^8.3.5",
+    "typescript": "^5.6.3",
+    "vitest": "^2.1.4"
+  },
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsup --watch",
+    "typecheck": "tsc --noEmit",
+    "test": "vitest run"
+  }
+}