@roxyapi/ui 0.9.0 → 0.11.0

package/dist/components/crystal-card.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/crystal-card.ts", "../../src/utils/base-element.ts", "../../src/utils/base-styles.ts", "../../src/utils/fetch-controller.ts", "../../src/utils/markup-data.ts"],
+  "sourcesContent": ["import { css, html, nothing } from 'lit';\nimport { customElement } from 'lit/decorators.js';\nimport type { GetCrystalResponse } from '../types/index.js';\nimport { RoxyDataElement } from '../utils/base-element.js';\nimport { baseStyles } from '../utils/base-styles.js';\n\nconst MONTHS = [\n\t'January',\n\t'February',\n\t'March',\n\t'April',\n\t'May',\n\t'June',\n\t'July',\n\t'August',\n\t'September',\n\t'October',\n\t'November',\n\t'December',\n];\n\n/**\n * Single-crystal detail card. Renders /crystals/{id}: the stone's photo, description, and full metaphysical profile (spiritual / emotional / physical meaning, governing chakras, zodiac signs, planet, elements, colours, Mohs hardness, numerical vibration, birthstone month), plus its affirmation and the crystals it pairs with. This is the detail view; roxy-crystal-grid is the gallery.\n */\n@customElement('roxy-crystal-card')\nexport class RoxyCrystalCard extends RoxyDataElement<GetCrystalResponse> {\n\tstatic styles = [\n\t\tbaseStyles,\n\t\tcss`.wrap{background:var(--roxy-surface,#fff);color:var(--roxy-fg,#0a0a0a);border:1px solid var(--roxy-border,#e4e4e7);border-radius:var(--roxy-radius-md,8px);padding:var(--roxy-space-lg,1.5rem);box-shadow:var(--roxy-shadow-sm);gap:var(--roxy-space-md,1rem);display:grid}.hero{gap:var(--roxy-space-md,1rem);align-items:flex-start;display:flex}.photo{border-radius:var(--roxy-radius-md,8px);object-fit:cover;background:color-mix(in srgb, var(--roxy-border,#e4e4e7) 35%, transparent);flex:none;width:96px;height:96px}.title{margin:0 0 var(--roxy-space-xs,.25rem) 0;font-size:var(--roxy-text-lg,1.125rem);font-weight:var(--roxy-weight-bold,600)}.desc{line-height:1.55;font-size:var(--roxy-text-sm,.875rem);color:var(--roxy-fg,#0a0a0a);margin:0}.attrs{gap:var(--roxy-space-sm,.5rem);grid-template-columns:repeat(auto-fit,minmax(7rem,1fr));display:grid}.attr{gap:2px;display:grid}.attr dt{font-size:var(--roxy-text-xs,.75rem);color:var(--roxy-muted,#71717a);text-transform:uppercase;letter-spacing:.05em}.attr dd{font-size:var(--roxy-text-sm,.875rem);margin:0;font-weight:500}.colors{flex-wrap:wrap;gap:.4rem;display:flex}.color{font-size:var(--roxy-text-xs,.75rem);text-transform:capitalize;align-items:center;gap:.3rem;display:inline-flex}.dot{border-radius:var(--roxy-radius-full,9999px);border:1px solid color-mix(in srgb, var(--roxy-fg,#0a0a0a) 18%, transparent);width:.7rem;height:.7rem}.meaning h3{margin:0 0 var(--roxy-space-xs,.25rem) 0;font-size:var(--roxy-text-xs,.75rem);color:var(--roxy-muted,#71717a);text-transform:uppercase;letter-spacing:.05em}.meaning p{margin:0 0 var(--roxy-space-sm,.5rem) 0;font-size:var(--roxy-text-sm,.875rem);line-height:1.55}.chips{flex-wrap:wrap;gap:.3rem;display:flex}.chip{border-radius:var(--roxy-radius-full,9999px);background:color-mix(in srgb, var(--roxy-accent,#f59e0b) 14%, transparent);color:var(--roxy-fg,#0a0a0a);font-size:var(--roxy-text-xs,.75rem);text-transform:capitalize;padding:1px 8px}.section-label{font-size:var(--roxy-text-xs,.75rem);color:var(--roxy-muted,#71717a);text-transform:uppercase;letter-spacing:.06em;font-weight:var(--roxy-weight-bold,600);margin:0 0 var(--roxy-space-xs,.25rem) 0}.affirmation{padding:var(--roxy-space-sm,.5rem) var(--roxy-space-md,1rem);border-left:3px solid var(--roxy-accent,#f59e0b);background:color-mix(in srgb, var(--roxy-accent,#f59e0b) 8%, transparent);font-style:italic;font-size:var(--roxy-text-sm,.875rem);border-radius:0 var(--roxy-radius-sm,4px) var(--roxy-radius-sm,4px) 0;margin:0}`,\n\t];\n\n\tprotected renderEmpty() {\n\t\treturn html`<div class=\"roxy-empty\" role=\"status\">No crystal data</div>`;\n\t}\n\n\tprotected renderData(d: GetCrystalResponse) {\n\t\tconst colors = d.colors ?? [];\n\t\tconst keywords = d.keywords ?? [];\n\t\tconst pairs = d.pairsWith ?? [];\n\t\tconst month =\n\t\t\ttypeof d.birthMonth === 'number' ? MONTHS[d.birthMonth - 1] : undefined;\n\n\t\treturn html`<article class=\"wrap\" aria-label=\"${d.name ?? 'Crystal'}\"><div class=\"hero\">${d.imageUrl ? html`<img class=\"photo\" src=\"${d.imageUrl}\" alt=\"${d.name ?? 'Crystal'}\" loading=\"lazy\">` : nothing}<div><h2 class=\"title\">${d.name}</h2>${d.description ? html`<p class=\"desc\">${d.description}</p>` : nothing}</div></div><dl class=\"attrs\">${this.attr('Planet', d.planet)} ${this.attr('Hardness', typeof d.hardness === 'number' ? `${d.hardness} Mohs` : undefined)} ${this.attr('Vibration', d.numericalVibration)} ${this.attr('Birthstone', month)} ${this.list('Chakras', d.chakras)} ${this.list('Zodiac', d.zodiacSigns)} ${this.list('Elements', d.elements)} ${\n\t\t\t\t\tcolors.length\n\t\t\t\t\t\t? html`<div class=\"attr\"><dt>Colors</dt><dd><div class=\"colors\">${colors.map((c) => html`<span class=\"color\"><span class=\"dot\" style=\"background:${c}\"></span>${c}</span>`)}</div></dd></div>`\n\t\t\t\t\t\t: nothing\n\t\t\t\t}</dl>${this.renderMeaning(d.meaning)} ${\n\t\t\t\tkeywords.length\n\t\t\t\t\t? html`<div><p class=\"section-label\">Keywords</p><div class=\"chips\">${keywords.map((k) => html`<span class=\"chip\">${k}</span>`)}</div></div>`\n\t\t\t\t\t: nothing\n\t\t\t} ${d.affirmation ? html`<p class=\"affirmation\">${d.affirmation}</p>` : nothing} ${\n\t\t\t\tpairs.length\n\t\t\t\t\t? html`<div><p class=\"section-label\">Pairs with</p><div class=\"chips\">${pairs.map((p) => html`<span class=\"chip\">${String(p).replace(/-/g, ' ')}</span>`)}</div></div>`\n\t\t\t\t\t: nothing\n\t\t\t}</article>`;\n\t}\n\n\tprivate attr(label: string, value: string | number | undefined) {\n\t\tif (value === undefined || value === null || value === '') return nothing;\n\t\treturn html`<div class=\"attr\"><dt>${label}</dt><dd>${value}</dd></div>`;\n\t}\n\n\tprivate list(label: string, values: readonly string[] | undefined) {\n\t\tif (!values?.length) return nothing;\n\t\treturn html`<div class=\"attr\"><dt>${label}</dt><dd>${values.join(', ')}</dd></div>`;\n\t}\n\n\tprivate renderMeaning(m: GetCrystalResponse['meaning'] | undefined) {\n\t\tif (!m) return nothing;\n\t\tconst rows: Array<[string, string | undefined]> = [\n\t\t\t['Spiritual', m.spiritual],\n\t\t\t['Emotional', m.emotional],\n\t\t\t['Physical', m.physical],\n\t\t];\n\t\tconst present = rows.filter(([, v]) => Boolean(v));\n\t\tif (present.length === 0) return nothing;\n\t\treturn html`<div class=\"meaning\">${present.map(([label, text]) => html`<h3>${label}</h3><p>${text}</p>`)}</div>`;\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'roxy-crystal-card': RoxyCrystalCard;\n\t}\n}\n", "import {\n\ttype CSSResultGroup,\n\thtml,\n\tLitElement,\n\ttype PropertyValues,\n} from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { baseStyles } from './base-styles.js';\nimport { buildRequest, FetchController } from './fetch-controller.js';\nimport { MarkupDataController } from './markup-data.js';\n\n/**\n * Shared base for every data-driven Roxy component. Consolidates the things every component used to repeat by hand and adds the self-contained, drop-in behavior: controlled-mode hydration, an opt-in self-fetch (form, request, loading, error, empty), the typed `data` slot, and the render switch. A subclass implements one method, {@link RoxyDataElement.renderData}.\n *\n * @remarks\n * Two render modes, one component, which is the whole drop-in contract:\n *\n * - Controlled: a server (WordPress, JSX SSR, static HTML) fetches the response and injects it as a direct-child `<script type=\"application/json\" class=\"roxy-data\">`. {@link MarkupDataController} hydrates `data` from it on connect. No key reaches the browser. This is the path the WordPress plugin drives, and it is unchanged by the base class.\n * - Uncontrolled: no data is injected, but a `data-endpoint` and a `pk_` `publishable-key` are set. The component renders its own `<roxy-endpoint-form>` (an internal detail, never placed by the consumer), and on submit fetches through {@link FetchController}, which refuses any non-publishable key. The result populates `data` and the component renders it.\n *\n * The JavaScript `data` property always wins over markup, so a host that assigns `el.data = \u2026` after upgrade is authoritative.\n *\n * Self-fetch needs `<roxy-endpoint-form>` (and `<roxy-location-search>`) registered. The CDN bundle and the full `@roxyapi/ui` entry register everything; per-component ESM consumers that want self-fetch import the form component too.\n *\n * @example\n * ```ts\n * @customElement('roxy-dream-card')\n * export class RoxyDreamCard extends RoxyDataElement<GetDreamSymbolResponse> {\n *   static styles = [baseStyles, css`.card { \u2026 }`];\n *   protected renderData(d: GetDreamSymbolResponse) {\n *     return html`<article class=\"card\">\u2026</article>`;\n *   }\n *   protected renderEmpty() {\n *     return html`<div class=\"roxy-empty\" role=\"status\">No dream symbol</div>`;\n *   }\n * }\n * ```\n */\nexport abstract class RoxyDataElement<T = unknown> extends LitElement {\n\tstatic styles: CSSResultGroup = [baseStyles];\n\n\t/** Typed RoxyAPI response. Assigned in JavaScript, hydrated from the roxy-data island, or set by a self-fetch. */\n\t@property({ attribute: false })\n\tdata: T | null = null;\n\n\t/** Endpoint path for self-fetch, e.g. \"astrology/natal-chart\" or \"dreams/symbols/{id}\". Empty disables self-fetch (controlled mode only). */\n\t@property({ type: String, attribute: 'data-endpoint' })\n\tendpoint = '';\n\n\t/** HTTP method for self-fetch. */\n\t@property({ type: String })\n\tmethod: 'GET' | 'POST' = 'POST';\n\n\t/** Browser-safe publishable key (pk_) for self-fetch. A secret key is refused client-side. */\n\t@property({ type: String, attribute: 'publishable-key' })\n\tpublishableKey?: string;\n\n\t/** Override the API origin for self-hosted or proxied deployments. */\n\t@property({ type: String, attribute: 'base-url' })\n\tbaseUrl?: string;\n\n\t/** Override the OpenAPI spec URL the self-fetch form introspects. */\n\t@property({ type: String, attribute: 'spec-url' })\n\tspecUrl?: string;\n\n\t/** Consumer backend route that proxies the request (holds the secret key). When set, self-fetch POSTs the request here instead of calling RoxyAPI directly, so no key reaches the browser. The server-rendered (WordPress) path. */\n\t@property({ type: String, attribute: 'submit-url' })\n\tsubmitUrl?: string;\n\n\t/** Persist the last self-fetch form values in sessionStorage (keyed by endpoint) and prefill the form on reload. */\n\t@property({ type: Boolean })\n\tremember = false;\n\n\t/** True while an uncontrolled self-fetch is in flight. Public so {@link FetchController} can drive it. */\n\t@state()\n\tloading = false;\n\n\t/** Message from a failed self-fetch, or null. Public so {@link FetchController} can drive it. */\n\t@state()\n\terror: string | null = null;\n\n\tprivate fetcher: FetchController<T>;\n\n\tconstructor() {\n\t\tsuper();\n\t\t// Controlled mode: hydrate `data` from a direct-child roxy-data island when\n\t\t// no JS property was assigned. Keyless; the server already fetched.\n\t\tnew MarkupDataController<T>(this);\n\t\tthis.fetcher = new FetchController<T>(this);\n\t}\n\n\tprotected willUpdate(changed: PropertyValues): void {\n\t\tif (changed.has('publishableKey')) {\n\t\t\tthis.fetcher.publishableKey = this.publishableKey;\n\t\t}\n\t\tif (changed.has('baseUrl') && this.baseUrl) {\n\t\t\tthis.fetcher.baseUrl = this.baseUrl;\n\t\t}\n\t\tif (changed.has('submitUrl')) {\n\t\t\tthis.fetcher.submitUrl = this.submitUrl;\n\t\t}\n\t}\n\n\trender(): unknown {\n\t\tif (this.loading) return this.renderLoading();\n\t\tif (this.error != null) return this.renderError(this.error);\n\t\tif (this.data != null) return this.renderData(this.data);\n\t\treturn this.renderNoData();\n\t}\n\n\t/** Render the populated response. The single method every component implements. */\n\tprotected abstract renderData(data: T): unknown;\n\n\t/** The data-absent branch: the self-fetch form when an endpoint is set, otherwise the empty state. */\n\tprotected renderNoData(): unknown {\n\t\treturn this.endpoint ? this.renderForm() : this.renderEmpty();\n\t}\n\n\t/** Internal self-fetch form. Reuses the introspecting `<roxy-endpoint-form>`; the consumer never places it. */\n\tprotected renderForm(): unknown {\n\t\treturn html`<roxy-endpoint-form data-endpoint=\"${this.endpoint}\" method=\"${this.method}\" spec-url=\"${ifDefined(this.specUrl)}\" .initialValues=\"${this.remember ? this.readRemembered() : undefined}\" @roxy-submit=\"${this.onFormSubmit}\"></roxy-endpoint-form>`;\n\t}\n\n\tprivate onFormSubmit = (e: Event) => {\n\t\tconst detail = (e as CustomEvent).detail as {\n\t\t\tvalues: Record<string, unknown>;\n\t\t};\n\t\tif (this.remember) this.writeRemembered(detail.values);\n\t\tvoid this.fetcher.run(\n\t\t\tbuildRequest(this.endpoint, this.method, detail.values),\n\t\t);\n\t};\n\n\t/** sessionStorage key for this component's remembered form values, scoped by endpoint. */\n\tprivate rememberKey(): string {\n\t\treturn `roxy-ui:form:${this.endpoint}`;\n\t}\n\n\tprivate readRemembered(): Record<string, unknown> | undefined {\n\t\ttry {\n\t\t\tconst raw = sessionStorage.getItem(this.rememberKey());\n\t\t\treturn raw ? (JSON.parse(raw) as Record<string, unknown>) : undefined;\n\t\t} catch {\n\t\t\treturn undefined;\n\t\t}\n\t}\n\n\tprivate writeRemembered(values: Record<string, unknown>): void {\n\t\ttry {\n\t\t\tsessionStorage.setItem(this.rememberKey(), JSON.stringify(values));\n\t\t} catch {\n\t\t\t// Private mode / disabled storage: remembering is best-effort, never fatal.\n\t\t}\n\t}\n\n\t/** Terminal empty state. Subclasses override for a domain-specific message. */\n\tprotected renderEmpty(): unknown {\n\t\treturn html`<div class=\"roxy-empty\" role=\"status\">No data</div>`;\n\t}\n\n\t/** Loading placeholder shown during a self-fetch. */\n\tprotected renderLoading(): unknown {\n\t\treturn html`<div class=\"roxy-skeleton\" style=\"height:8rem\" role=\"status\" aria-label=\"Loading\"></div>`;\n\t}\n\n\t/** Error state shown when a self-fetch fails. Keeps the form in view so the request can be retried. */\n\tprotected renderError(message: string): unknown {\n\t\tconst banner = html`<div class=\"roxy-error\" role=\"alert\">${message}</div>`;\n\t\treturn this.endpoint ? html`${banner}${this.renderForm()}` : banner;\n\t}\n}\n", "import { css } from 'lit';\n\n/**\n * Shared host styles every component pulls in. Sets default font, color,\n * container query support, and the entry fade-in.\n */\nexport const baseStyles = css`:host{font-family:var(--roxy-font-sans,system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif);color:var(--roxy-fg,#0a0a0a);font-size:var(--roxy-text-base,1rem);line-height:var(--roxy-leading-normal,1.5);animation:roxy-fade-in var(--roxy-motion-duration,.2s) var(--roxy-motion-easing,cubic-bezier(.4, 0, .2, 1)) both;background:0 0;display:block;container-type:inline-size}:host([bare]){--roxy-surface:transparent;--roxy-shadow-sm:none;--roxy-shadow-md:none}*,:before,:after{box-sizing:border-box}@keyframes roxy-fade-in{0%{opacity:0;transform:translateY(2px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){:host{animation:none}}.roxy-skeleton{background:linear-gradient(90deg, var(--roxy-border,#e4e4e7) 0%, color-mix(in srgb, var(--roxy-border,#e4e4e7) 60%, transparent) 50%, var(--roxy-border,#e4e4e7) 100%);border-radius:var(--roxy-radius-md,8px);background-size:200% 100%;animation:1.4s ease-in-out infinite roxy-shimmer}@keyframes roxy-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@media (prefers-reduced-motion:reduce){.roxy-skeleton{animation:none}}.roxy-empty{padding:var(--roxy-space-lg,1.5rem);color:var(--roxy-muted,#71717a);text-align:center;font-size:var(--roxy-text-sm,.875rem)}.roxy-error{gap:var(--roxy-space-sm,.5rem);padding:var(--roxy-space-lg,1.5rem);background:var(--roxy-surface,#fff);border:1px solid var(--roxy-danger,#dc2626);border-radius:var(--roxy-radius-md,8px);color:var(--roxy-danger-fg,#991b1b);font-size:var(--roxy-text-sm,.875rem);justify-items:start;display:grid}.roxy-surface{background:var(--roxy-surface,#fff);color:var(--roxy-fg,#0a0a0a)}:host(:focus-within) .roxy-card{outline:2px solid var(--roxy-ring,#f59e0b66);outline-offset:2px}:host{font-variant-emoji:text}`;\n", "import type { ReactiveController, ReactiveControllerHost } from 'lit';\n\n/**\n * Host slots the controller drives. {@link RoxyDataElement} satisfies this, so\n * the form mixin can attach a controller without the component wiring state by hand.\n */\ninterface FetchHost<T> extends ReactiveControllerHost {\n\tdata: T | null;\n\tloading: boolean;\n\terror: string | null;\n}\n\n/** Default RoxyAPI v2 origin. A component overrides it per instance via its `base-url` attribute. */\nconst DEFAULT_BASE_URL = 'https://roxyapi.com/api/v2';\n\n/** A single request the controller issues on the component's behalf. */\nexport interface RoxyRequest {\n\t/** Path under the API base, e.g. \"/dreams/symbols/water\" or \"/astrology/natal-chart\". */\n\tpath: string;\n\tmethod?: 'GET' | 'POST';\n\t/** JSON body for POST endpoints. */\n\tbody?: unknown;\n\t/** Query string parameters; nullish values are dropped. */\n\tquery?: Record<string, string | number | undefined>;\n}\n\n/**\n * Client-side fetch for uncontrolled (self-fetching) components: drives `host.data` / `host.loading` / `host.error` and cancels a stale request when a newer one starts or the host disconnects.\n *\n * @remarks\n * Security boundary. The only credential this ever sends is a `pk_` publishable key, which carries a server-side origin allowlist. A secret (`sk_`) or legacy unprefixed key is refused before any network call and surfaced as an error, so a server secret cannot leak into a browser request. This centralizes the guard that originated in `<roxy-location-search>` so every self-fetching component enforces it identically.\n *\n * Controlled-mode components never construct this. When a server injects the response as a `<script class=\"roxy-data\">` island, there is no key and no fetch, which is the path server-rendered consumers (WordPress, JSX SSR, static HTML) rely on.\n */\nexport class FetchController<T = unknown> implements ReactiveController {\n\tprivate readonly host: FetchHost<T>;\n\tprivate abort?: AbortController;\n\n\t/** Browser-safe publishable key. Set by the host from its `publishable-key` attribute. */\n\tpublishableKey?: string;\n\t/** API origin, overridable for self-hosted or proxied deployments. */\n\tbaseUrl = DEFAULT_BASE_URL;\n\t/**\n\t * Consumer backend route that holds the secret key. When set, the request is POSTed here as `{ path, method, body, query }` instead of called against RoxyAPI directly, so no key (publishable or secret) is sent from the browser. This is the canonical path for server-rendered hosts (WordPress); the backend proxies the request with its own `sk_` key and returns the JSON response.\n\t */\n\tsubmitUrl?: string;\n\n\tconstructor(host: FetchHost<T>) {\n\t\tthis.host = host;\n\t\thost.addController(this);\n\t}\n\n\thostDisconnected() {\n\t\tthis.abort?.abort();\n\t\tthis.abort = undefined;\n\t}\n\n\t/**\n\t * Issue the request and resolve once `host.data` (success) or `host.error`\n\t * (failure) is set. A no-op return when a non-publishable key is present:\n\t * the error is already surfaced and nothing is sent.\n\t */\n\tasync run(req: RoxyRequest): Promise<void> {\n\t\t// submit-url proxy: no key leaves the browser; the consumer's backend holds it.\n\t\tif (!this.submitUrl && this.secretKeyRefused()) return;\n\t\tthis.abort?.abort();\n\t\tconst controller = new AbortController();\n\t\tthis.abort = controller;\n\t\tthis.host.loading = true;\n\t\tthis.host.error = null;\n\t\ttry {\n\t\t\tconst res = this.submitUrl\n\t\t\t\t? await fetch(this.submitUrl, {\n\t\t\t\t\t\tmethod: 'POST',\n\t\t\t\t\t\theaders: {\n\t\t\t\t\t\t\tAccept: 'application/json',\n\t\t\t\t\t\t\t'Content-Type': 'application/json',\n\t\t\t\t\t\t},\n\t\t\t\t\t\tbody: JSON.stringify(req),\n\t\t\t\t\t\tsignal: controller.signal,\n\t\t\t\t\t})\n\t\t\t\t: await this.callApi(req, controller.signal);\n\t\t\tif (!res.ok) throw new Error(await this.readError(res));\n\t\t\tconst json = (await res.json()) as T;\n\t\t\tif (controller.signal.aborted) return;\n\t\t\tthis.host.data = json;\n\t\t} catch (err) {\n\t\t\tif ((err as { name?: string })?.name === 'AbortError') return;\n\t\t\tthis.host.error = err instanceof Error ? err.message : String(err);\n\t\t} finally {\n\t\t\tif (this.abort === controller) this.abort = undefined;\n\t\t\tif (!controller.signal.aborted) this.host.loading = false;\n\t\t}\n\t}\n\n\t/** Direct call against RoxyAPI with the publishable key (the no-backend path). */\n\tprivate callApi(req: RoxyRequest, signal: AbortSignal): Promise<Response> {\n\t\tconst url = new URL(`${this.baseUrl}${req.path}`);\n\t\tfor (const [k, v] of Object.entries(req.query ?? {})) {\n\t\t\tif (v != null) url.searchParams.set(k, String(v));\n\t\t}\n\t\tconst headers: Record<string, string> = { Accept: 'application/json' };\n\t\tif (this.publishableKey) headers['X-API-Key'] = this.publishableKey;\n\t\tif (req.body != null) headers['Content-Type'] = 'application/json';\n\t\treturn fetch(url, {\n\t\t\tmethod: req.method ?? 'GET',\n\t\t\theaders,\n\t\t\tbody: req.body != null ? JSON.stringify(req.body) : undefined,\n\t\t\tsignal,\n\t\t});\n\t}\n\n\t/** True when a key is set and it is not a browser-safe `pk_` publishable key. Surfaces the error and refuses to send. */\n\tprivate secretKeyRefused(): boolean {\n\t\tconst key = this.publishableKey;\n\t\tif (!key || key.startsWith('pk_')) return false;\n\t\tthis.host.error =\n\t\t\t'Client-side components accept a pk_ publishable key only. Use a publishable key with an origin allowlist, or render server-side.';\n\t\t(this.host as unknown as EventTarget).dispatchEvent(\n\t\t\tnew CustomEvent('roxy-validation-error', {\n\t\t\t\tdetail: { reason: 'possible-secret-key' },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}),\n\t\t);\n\t\treturn true;\n\t}\n\n\t/** Surface the `{ error, code }` message the API returns on failure, falling back to the status code. */\n\tprivate async readError(res: Response): Promise<string> {\n\t\ttry {\n\t\t\tconst body = (await res.json()) as { error?: string };\n\t\t\tif (body?.error) return body.error;\n\t\t} catch {\n\t\t\t// Non-JSON error body: fall through to the status line.\n\t\t}\n\t\treturn `Request failed (${res.status})`;\n\t}\n}\n\n/**\n * Translate flat form values into a {@link RoxyRequest} for an endpoint. The `{name}` segments in the endpoint template are substituted from the values and removed; the rest become the JSON body for POST or query parameters for GET. This is the spec-light request builder the base element uses to turn a `<roxy-endpoint-form>` submission into a self-fetch, so a component needs no per-endpoint glue.\n */\nexport function buildRequest(\n\tendpoint: string,\n\tmethod: 'GET' | 'POST',\n\tvalues: Record<string, unknown>,\n): RoxyRequest {\n\tconst rest: Record<string, unknown> = { ...values };\n\tconst path = `/${endpoint.replace(/^\\//, '')}`.replace(\n\t\t/\\{([^}]+)\\}/g,\n\t\t(_match, name: string) => {\n\t\t\tconst v = rest[name];\n\t\t\tdelete rest[name];\n\t\t\treturn encodeURIComponent(String(v ?? ''));\n\t\t},\n\t);\n\tconst query: Record<string, string | number | undefined> = {};\n\tconst body: Record<string, unknown> = {};\n\tfor (const [k, v] of Object.entries(rest)) {\n\t\tif (v === undefined || v === '') continue;\n\t\tif (method === 'GET') query[k] = v as string | number;\n\t\telse body[k] = v;\n\t}\n\treturn { path, method, query, body: method === 'POST' ? body : undefined };\n}\n", "import type { ReactiveController, ReactiveControllerHost } from 'lit';\n\n/**\n * Marker class on the inline JSON script a server emits inside a component.\n *\n * @example\n * ```html\n * <roxy-natal-chart>\n *   <script type=\"application/json\" class=\"roxy-data\">{ ...response... }</script>\n * </roxy-natal-chart>\n * ```\n */\nconst ROXY_DATA_CLASS = 'roxy-data';\n\n/**\n * Serialize a RoxyAPI response for embedding inside an inline `<script type=\"application/json\" class=\"roxy-data\">`. This is the safe writer counterpart to {@link MarkupDataController}, the reader: server-rendered and cached consumers (WordPress, JSX SSR, static HTML) emit the script with this, and the component hydrates `data` from it on connect.\n *\n * @remarks\n * Use this instead of a bare `JSON.stringify`. A raw stringify of a response that contains the literal text `</script>` (common in long interpretation prose) closes the script element early, corrupting the page and creating an HTML-injection vector. This escapes the script-unsafe characters to their `\\uXXXX` JSON escapes, which `JSON.parse` restores to the original characters, so the value the component receives is identical to the response you passed.\n *\n * `<` is the load-bearing escape (it defeats `</script>` and `<!--`). `>` and `&` are escaped for defence in depth, and U+2028 / U+2029 because they are valid in JSON yet are line terminators in a `<script>` context and break some parsers. The escapes introduce only `\\uXXXX` sequences, so the replacements never feed each other and order is irrelevant.\n *\n * Pass the unwrapped RoxyAPI response, the same shape you would assign to `element.data`. Do not pass the SDK envelope (`{ data, error, request, response }`).\n *\n * @example\n * ```ts\n * import { serializeRoxyData } from '@roxyapi/ui';\n *\n * const { data } = await roxy.dreams.getDreamSymbol({ path: { id: 'water' } });\n * const html = `<roxy-dream-card><script type=\"application/json\" class=\"roxy-data\">${serializeRoxyData(data)}</script></roxy-dream-card>`;\n * ```\n */\nexport function serializeRoxyData(data: unknown): string {\n\treturn JSON.stringify(data)\n\t\t.replace(/</g, '\\\\u003c')\n\t\t.replace(/>/g, '\\\\u003e')\n\t\t.replace(/&/g, '\\\\u0026')\n\t\t.replace(/\\u2028/g, '\\\\u2028')\n\t\t.replace(/\\u2029/g, '\\\\u2029');\n}\n\n/**\n * Build the complete `<script type=\"application/json\" class=\"roxy-data\">\u2026</script>` element a server nests inside a `roxy-*` component for the no-JavaScript hydration path. The payload is escaped via {@link serializeRoxyData}, so it is safe to drop straight into HTML output.\n *\n * @remarks\n * The element carries both `type=\"application/json\"` and `class=\"roxy-data\"` because {@link MarkupDataController} reads only a direct-child script that has both. Emit one of these inside the target component; the JavaScript `data` property still wins if it is later assigned.\n *\n * @example\n * ```ts\n * import { roxyDataScript } from '@roxyapi/ui';\n *\n * const { data } = await roxy.crystals.getCrystal({ path: { id: 'amethyst' } });\n * const html = `<roxy-crystal-grid>${roxyDataScript(data)}</roxy-crystal-grid>`;\n * ```\n */\nexport function roxyDataScript(data: unknown): string {\n\treturn `<script type=\"application/json\" class=\"${ROXY_DATA_CLASS}\">${serializeRoxyData(data)}</script>`;\n}\n\n/**\n * True when the element is a `<script type=\"application/json\">`. Uses tag name and attribute rather than `instanceof HTMLScriptElement` so the check holds in every DOM implementation, including server-rendered and hydration runtimes where the constructor global may be absent.\n */\nfunction isJsonScript(el: Element): boolean {\n\treturn (\n\t\tel.nodeName === 'SCRIPT' && el.getAttribute('type') === 'application/json'\n\t);\n}\n\n/**\n * Host shape the controller drives: any reactive element that exposes a public `data` slot. The controller only writes `data` when the host left it unset, so the JavaScript property path always wins.\n */\ninterface DataHost extends ReactiveControllerHost, HTMLElement {\n\tdata?: unknown;\n}\n\n/**\n * Reactive controller that lets a component hydrate its `data` from embedded markup when no `data` property was assigned in JavaScript.\n *\n * @remarks\n * The server-side and cached-render model: a backend renders the RoxyAPI response into a direct-child `<script type=\"application/json\" class=\"roxy-data\">` element, ships static HTML, and never runs per-element JavaScript to assign a property. On connect this controller reads that script, parses it, and feeds the result to the host. The JavaScript property path is untouched and authoritative: if `host.data` already holds a value when the host connects, the controller does nothing and the markup is ignored.\n *\n * Source resolution order on connect, first hit wins:\n *\n * 1. `host.data` already set in JavaScript -> leave it, read nothing.\n * 2. A direct-child `<script type=\"application/json\" class=\"roxy-data\">` -> parse and use. Direct-child only, so a nested component's own script is never read by an ancestor.\n *\n * Fetching from a URL is intentionally unsupported: that would require a browser-visible key and breaks the server-rendered, cached model these consumers rely on.\n *\n * Timing: {@link hostConnected} runs inside the host `connectedCallback`. For an element parsed from server HTML, its direct children are present by the time the custom element upgrades and connects, so the script is readable here. For an element created with `document.createElement` and connected before any child is appended, there is nothing to read and the property path is the only source, which is exactly the existing behavior.\n *\n * Failure is safe: malformed JSON or a missing script leaves `host.data` untouched, so the host renders its normal empty state.\n *\n * Reading the script never mutates it, and only the marked script is touched, so any sibling fallback markup a server nested inside the element (for no-JavaScript, AMP, or crawler rendering) is left in place.\n *\n * @example\n * ```ts\n * import { MarkupDataController } from '../utils/markup-data.js';\n *\n * export class RoxyExample extends LitElement {\n *   constructor() {\n *     super();\n *     new MarkupDataController(this);\n *   }\n *\n *   @property({ attribute: false })\n *   data: ExampleResponse | null = null;\n * }\n * ```\n */\nexport class MarkupDataController<T = unknown> implements ReactiveController {\n\tprivate readonly host: DataHost;\n\n\tconstructor(host: DataHost) {\n\t\tthis.host = host;\n\t\thost.addController(this);\n\t}\n\n\thostConnected() {\n\t\t// Property path wins. If the consumer (React, vanilla `.data =`, the\n\t\t// widgets script, an MCP agent) already set data, never look at markup.\n\t\tif (this.host.data != null) return;\n\n\t\tconst parsed = this.read();\n\t\tif (parsed === undefined) return;\n\n\t\tthis.host.data = parsed as T;\n\t\tthis.host.requestUpdate();\n\t}\n\n\t/**\n\t * Resolve the embedded payload. Returns `undefined` when there is nothing valid to read so the caller can leave `host.data` untouched.\n\t */\n\tprivate read(): T | undefined {\n\t\tconst inline = this.findInlineScript();\n\t\treturn inline ? this.parse(inline.textContent) : undefined;\n\t}\n\n\t/**\n\t * Direct-child `<script type=\"application/json\" class=\"roxy-data\">`. Scoped to immediate children so a nested data-driven component never has its script read by an ancestor, and so sibling fallback markup is ignored.\n\t */\n\tprivate findInlineScript(): Element | null {\n\t\tfor (const child of Array.from(this.host.children)) {\n\t\t\tif (isJsonScript(child) && child.classList.contains(ROXY_DATA_CLASS)) {\n\t\t\t\treturn child;\n\t\t\t}\n\t\t}\n\t\treturn null;\n\t}\n\n\tprivate parse(text: string | null): T | undefined {\n\t\tif (!text?.trim()) return undefined;\n\t\ttry {\n\t\t\treturn JSON.parse(text) as T;\n\t\t} catch {\n\t\t\t// Malformed embedded JSON: fail safe, leave the host empty state in\n\t\t\t// place rather than throwing during connect.\n\t\t\treturn undefined;\n\t\t}\n\t}\n}\n"],
+  "mappings": "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",
+  "names": ["css", "html", "nothing", "customElement", "html", "LitElement", "property", "state", "ifDefined", "css", "baseStyles", "DEFAULT_BASE_URL", "FetchController", "host", "req", "controller", "res", "json", "err", "signal", "url", "k", "v", "headers", "key", "body", "buildRequest", "endpoint", "method", "values", "rest", "path", "_match", "name", "query", "ROXY_DATA_CLASS", "isJsonScript", "el", "MarkupDataController", "host", "parsed", "inline", "child", "ROXY_DATA_CLASS", "text", "RoxyDataElement", "LitElement", "detail", "buildRequest", "MarkupDataController", "FetchController", "baseStyles", "changed", "html", "ifDefined", "raw", "values", "message", "banner", "__decorateClass", "property", "state", "MONTHS", "RoxyCrystalCard", "RoxyDataElement", "html", "d", "colors", "keywords", "pairs", "month", "nothing", "c", "k", "p", "label", "value", "values", "m", "present", "v", "text", "baseStyles", "css", "__decorateClass", "customElement"]
+}

package/dist/components/crystal-grid.d.ts

@@ -0,0 +1,26 @@
+import type { GetBirthstonesResponse, GetCrystalsByChakraResponse, GetCrystalsByElementResponse, GetCrystalsByZodiacResponse, ListCrystalsResponse, SearchCrystalsResponse } from '../types/index.js';
+import { RoxyDataElement } from '../utils/base-element.js';
+/**
+ * Any crystal list response that carries a `crystals` summary array. Every crystals endpoint that returns more than one stone shares the `{ name, id, imageUrl, colors }` item shape, so one grid renders them all.
+ */
+type CrystalGridData = ListCrystalsResponse | GetCrystalsByChakraResponse | GetCrystalsByElementResponse | GetCrystalsByZodiacResponse | GetBirthstonesResponse | SearchCrystalsResponse;
+/**
+ * Crystal grid. Renders any crystals list response (/crystals, /crystals/chakra/{chakra}, /crystals/element/{element}, /crystals/zodiac/{sign}, /crystals/birthstone/{month}, /crystals/search) as a responsive gallery of crystal tiles with photo, name, and colour swatches. The heading is derived from the response filter (chakra, element, zodiac sign, or birth month) or set explicitly via the `heading` attribute.
+ */
+export declare class RoxyCrystalGrid extends RoxyDataElement<CrystalGridData> {
+    static styles: import("lit").CSSResult[];
+    /**
+     * Override the auto-derived grid heading. Empty by default, in which case the heading comes from the response filter (chakra, element, zodiac, or birth month) or falls back to "Crystals".
+     */
+    heading: string;
+    protected renderEmpty(): import("lit").TemplateResult<1>;
+    protected renderData(d: CrystalGridData): import("lit").TemplateResult<1>;
+    private deriveHeading;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'roxy-crystal-grid': RoxyCrystalGrid;
+    }
+}
+export {};
+//# sourceMappingURL=crystal-grid.d.ts.map

package/dist/components/crystal-grid.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"crystal-grid.d.ts","sourceRoot":"","sources":["../../src/components/crystal-grid.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EACX,sBAAsB,EACtB,2BAA2B,EAC3B,4BAA4B,EAC5B,2BAA2B,EAC3B,oBAAoB,EACpB,sBAAsB,EACtB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAG3D;;GAEG;AACH,KAAK,eAAe,GACjB,oBAAoB,GACpB,2BAA2B,GAC3B,4BAA4B,GAC5B,2BAA2B,GAC3B,sBAAsB,GACtB,sBAAsB,CAAC;AAoB1B;;GAEG;AACH,qBACa,eAAgB,SAAQ,eAAe,CAAC,eAAe,CAAC;IACpE,MAAM,CAAC,MAAM,4BAkEX;IAEF;;OAEG;IAEH,OAAO,SAAM;IAEb,SAAS,CAAC,WAAW;IAIrB,SAAS,CAAC,UAAU,CAAC,CAAC,EAAE,eAAe;IAmCvC,OAAO,CAAC,aAAa;CAQrB;AASD,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,mBAAmB,EAAE,eAAe,CAAC;KACrC;CACD"}

package/dist/components/crystal-grid.js

@@ -0,0 +1,2 @@
+var w=Object.defineProperty;var k=Object.getOwnPropertyDescriptor;var n=(a,r,e,t)=>{for(var s=t>1?void 0:t?k(r,e):r,l=a.length-1,o;l>=0;l--)(o=a[l])&&(s=(t?o(r,e,s):o(s))||s);return t&&s&&w(r,e,s),s};import{css as E,html as p,nothing as A}from"lit";import{customElement as j,property as O}from"lit/decorators.js";import{html as y,LitElement as $}from"lit";import{property as d,state as x}from"lit/decorators.js";import{ifDefined as U}from"lit/directives/if-defined.js";import{css as S}from"lit";var h=S`:host{font-family:var(--roxy-font-sans,system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);color:var(--roxy-fg,#0a0a0a);font-size:var(--roxy-text-base,1rem);line-height:var(--roxy-leading-normal,1.5);animation:roxy-fade-in var(--roxy-motion-duration,.2s) var(--roxy-motion-easing,cubic-bezier(.4, 0, .2, 1)) both;background:0 0;display:block;container-type:inline-size}:host([bare]){--roxy-surface:transparent;--roxy-shadow-sm:none;--roxy-shadow-md:none}*,:before,:after{box-sizing:border-box}@keyframes roxy-fade-in{0%{opacity:0;transform:translateY(2px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){:host{animation:none}}.roxy-skeleton{background:linear-gradient(90deg, var(--roxy-border,#e4e4e7) 0%, color-mix(in srgb, var(--roxy-border,#e4e4e7) 60%, transparent) 50%, var(--roxy-border,#e4e4e7) 100%);border-radius:var(--roxy-radius-md,8px);background-size:200% 100%;animation:1.4s ease-in-out infinite roxy-shimmer}@keyframes roxy-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@media (prefers-reduced-motion:reduce){.roxy-skeleton{animation:none}}.roxy-empty{padding:var(--roxy-space-lg,1.5rem);color:var(--roxy-muted,#71717a);text-align:center;font-size:var(--roxy-text-sm,.875rem)}.roxy-error{gap:var(--roxy-space-sm,.5rem);padding:var(--roxy-space-lg,1.5rem);background:var(--roxy-surface,#fff);border:1px solid var(--roxy-danger,#dc2626);border-radius:var(--roxy-radius-md,8px);color:var(--roxy-danger-fg,#991b1b);font-size:var(--roxy-text-sm,.875rem);justify-items:start;display:grid}.roxy-surface{background:var(--roxy-surface,#fff);color:var(--roxy-fg,#0a0a0a)}:host(:focus-within) .roxy-card{outline:2px solid var(--roxy-ring,#f59e0b66);outline-offset:2px}:host{font-variant-emoji:text}`;var R="https://roxyapi.com/api/v2",f=class{constructor(r){this.baseUrl=R;this.host=r,r.addController(this)}hostDisconnected(){this.abort?.abort(),this.abort=void 0}async run(r){if(!this.submitUrl&&this.secretKeyRefused())return;this.abort?.abort();let e=new AbortController;this.abort=e,this.host.loading=!0,this.host.error=null;try{let t=this.submitUrl?await fetch(this.submitUrl,{method:"POST",headers:{Accept:"application/json","Content-Type":"application/json"},body:JSON.stringify(r),signal:e.signal}):await this.callApi(r,e.signal);if(!t.ok)throw new Error(await this.readError(t));let s=await t.json();if(e.signal.aborted)return;this.host.data=s}catch(t){if(t?.name==="AbortError")return;this.host.error=t instanceof Error?t.message:String(t)}finally{this.abort===e&&(this.abort=void 0),e.signal.aborted||(this.host.loading=!1)}}callApi(r,e){let t=new URL(`${this.baseUrl}${r.path}`);for(let[l,o]of Object.entries(r.query??{}))o!=null&&t.searchParams.set(l,String(o));let s={Accept:"application/json"};return this.publishableKey&&(s["X-API-Key"]=this.publishableKey),r.body!=null&&(s["Content-Type"]="application/json"),fetch(t,{method:r.method??"GET",headers:s,body:r.body!=null?JSON.stringify(r.body):void 0,signal:e})}secretKeyRefused(){let r=this.publishableKey;return!r||r.startsWith("pk_")?!1:(this.host.error="Client-side components accept a pk_ publishable key only. Use a publishable key with an origin allowlist, or render server-side.",this.host.dispatchEvent(new CustomEvent("roxy-validation-error",{detail:{reason:"possible-secret-key"},bubbles:!0,composed:!0})),!0)}async readError(r){try{let e=await r.json();if(e?.error)return e.error}catch{}return`Request failed (${r.status})`}};function g(a,r,e){let t={...e},s=`/${a.replace(/^\//,"")}`.replace(/\{([^}]+)\}/g,(u,c)=>{let v=t[c];return delete t[c],encodeURIComponent(String(v??""))}),l={},o={};for(let[u,c]of Object.entries(t))c===void 0||c===""||(r==="GET"?l[u]=c:o[u]=c);return{path:s,method:r,query:l,body:r==="POST"?o:void 0}}var C="roxy-data";function T(a){return a.nodeName==="SCRIPT"&&a.getAttribute("type")==="application/json"}var b=class{constructor(r){this.host=r,r.addController(this)}hostConnected(){if(this.host.data!=null)return;let r=this.read();r!==void 0&&(this.host.data=r,this.host.requestUpdate())}read(){let r=this.findInlineScript();return r?this.parse(r.textContent):void 0}findInlineScript(){for(let r of Array.from(this.host.children))if(T(r)&&r.classList.contains(C))return r;return null}parse(r){if(r?.trim())try{return JSON.parse(r)}catch{return}}};var i=class extends ${constructor(){super();this.data=null;this.endpoint="";this.method="POST";this.remember=!1;this.loading=!1;this.error=null;this.onFormSubmit=e=>{let t=e.detail;this.remember&&this.writeRemembered(t.values),this.fetcher.run(g(this.endpoint,this.method,t.values))};new b(this),this.fetcher=new f(this)}static{this.styles=[h]}willUpdate(e){e.has("publishableKey")&&(this.fetcher.publishableKey=this.publishableKey),e.has("baseUrl")&&this.baseUrl&&(this.fetcher.baseUrl=this.baseUrl),e.has("submitUrl")&&(this.fetcher.submitUrl=this.submitUrl)}render(){return this.loading?this.renderLoading():this.error!=null?this.renderError(this.error):this.data!=null?this.renderData(this.data):this.renderNoData()}renderNoData(){return this.endpoint?this.renderForm():this.renderEmpty()}renderForm(){return y`<roxy-endpoint-form data-endpoint="${this.endpoint}" method="${this.method}" spec-url="${U(this.specUrl)}" .initialValues="${this.remember?this.readRemembered():void 0}" @roxy-submit="${this.onFormSubmit}"></roxy-endpoint-form>`}rememberKey(){return`roxy-ui:form:${this.endpoint}`}readRemembered(){try{let e=sessionStorage.getItem(this.rememberKey());return e?JSON.parse(e):void 0}catch{return}}writeRemembered(e){try{sessionStorage.setItem(this.rememberKey(),JSON.stringify(e))}catch{}}renderEmpty(){return y`<div class="roxy-empty" role="status">No data</div>`}renderLoading(){return y`<div class="roxy-skeleton" style="height:8rem" role="status" aria-label="Loading"></div>`}renderError(e){let t=y`<div class="roxy-error" role="alert">${e}</div>`;return this.endpoint?y`${t}${this.renderForm()}`:t}};n([d({attribute:!1})],i.prototype,"data",2),n([d({type:String,attribute:"data-endpoint"})],i.prototype,"endpoint",2),n([d({type:String})],i.prototype,"method",2),n([d({type:String,attribute:"publishable-key"})],i.prototype,"publishableKey",2),n([d({type:String,attribute:"base-url"})],i.prototype,"baseUrl",2),n([d({type:String,attribute:"spec-url"})],i.prototype,"specUrl",2),n([d({type:String,attribute:"submit-url"})],i.prototype,"submitUrl",2),n([d({type:Boolean})],i.prototype,"remember",2),n([x()],i.prototype,"loading",2),n([x()],i.prototype,"error",2);var G=["January","February","March","April","May","June","July","August","September","October","November","December"],m=class extends i{constructor(){super(...arguments);this.heading=""}renderEmpty(){return p`<div class="roxy-empty" role="status">No crystals</div>`}renderData(e){let t=e.crystals??[];if(t.length===0)return this.renderEmpty();let s=this.heading||this.deriveHeading(e),l="total"in e&&typeof e.total=="number"?e.total:t.length;return p`<section class="wrap" aria-label="${s}"><header class="head"><h2 class="title">${s}</h2><span class="count">${l} ${l===1?"crystal":"crystals"}</span></header><ul class="grid">${t.map(o=>p`<li class="tile">${o.imageUrl?p`<img class="photo" src="${o.imageUrl}" alt="${o.name??"Crystal"}" loading="lazy">`:p`<div class="photo" aria-hidden="true"></div>`}<p class="name">${o.name}</p>${o.colors&&o.colors.length>0?p`<div class="colors" aria-label="${`Colours: ${o.colors.join(", ")}`}">${o.colors.map(u=>p`<span class="swatch" style="${`background:${H(u)}`}" title="${u}"></span>`)}</div>`:A}</li>`)}</ul></section>`}deriveHeading(e){return"chakra"in e&&e.chakra?`${e.chakra} chakra crystals`:"element"in e&&e.element?`${e.element} element crystals`:"sign"in e&&e.sign?`Crystals for ${e.sign}`:"month"in e&&typeof e.month=="number"?`${G[e.month-1]??""} birthstones`.trim():"Crystals"}};m.styles=[h,E`.wrap{gap:var(--roxy-space-md,1rem);display:grid}.head{justify-content:space-between;align-items:baseline;gap:var(--roxy-space-sm,.5rem);flex-wrap:wrap;display:flex}.title{font-size:var(--roxy-text-lg,1.125rem);font-weight:var(--roxy-weight-bold,600);color:var(--roxy-fg,#0a0a0a);margin:0}.count{color:var(--roxy-muted,#71717a);font-size:var(--roxy-text-sm,.875rem)}.grid{gap:var(--roxy-space-md,1rem);grid-template-columns:repeat(auto-fill,minmax(8rem,1fr));margin:0;padding:0;list-style:none;display:grid}.tile{gap:var(--roxy-space-xs,.25rem);background:var(--roxy-surface,#fff);border:1px solid var(--roxy-border,#e4e4e7);border-radius:var(--roxy-radius-md,8px);padding:var(--roxy-space-sm,.5rem);box-shadow:var(--roxy-shadow-sm);display:grid}.photo{aspect-ratio:1;border-radius:var(--roxy-radius-sm,4px);object-fit:cover;background:color-mix(in srgb, var(--roxy-border,#e4e4e7) 35%, transparent);width:100%}.name{font-size:var(--roxy-text-sm,.875rem);font-weight:var(--roxy-weight-bold,600);color:var(--roxy-fg,#0a0a0a);margin:0}.colors{flex-wrap:wrap;gap:4px;display:flex}.swatch{border-radius:var(--roxy-radius-full,9999px);border:1px solid color-mix(in srgb, var(--roxy-fg,#0a0a0a) 18%, transparent);width:10px;height:10px}`],n([O({type:String,reflect:!0})],m.prototype,"heading",2),m=n([j("roxy-crystal-grid")],m);function H(a){return a.trim().toLowerCase().replace(/\s+/g,"")}export{m as RoxyCrystalGrid};
+//# sourceMappingURL=crystal-grid.js.map

package/dist/components/crystal-grid.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/crystal-grid.ts", "../../src/utils/base-element.ts", "../../src/utils/base-styles.ts", "../../src/utils/fetch-controller.ts", "../../src/utils/markup-data.ts"],
+  "sourcesContent": ["import { css, html, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport type {\n\tGetBirthstonesResponse,\n\tGetCrystalsByChakraResponse,\n\tGetCrystalsByElementResponse,\n\tGetCrystalsByZodiacResponse,\n\tListCrystalsResponse,\n\tSearchCrystalsResponse,\n} from '../types/index.js';\nimport { RoxyDataElement } from '../utils/base-element.js';\nimport { baseStyles } from '../utils/base-styles.js';\n\n/**\n * Any crystal list response that carries a `crystals` summary array. Every crystals endpoint that returns more than one stone shares the `{ name, id, imageUrl, colors }` item shape, so one grid renders them all.\n */\ntype CrystalGridData =\n\t| ListCrystalsResponse\n\t| GetCrystalsByChakraResponse\n\t| GetCrystalsByElementResponse\n\t| GetCrystalsByZodiacResponse\n\t| GetBirthstonesResponse\n\t| SearchCrystalsResponse;\n\n/**\n * Month number to birthstone month name for the derived heading.\n */\nconst MONTHS = [\n\t'January',\n\t'February',\n\t'March',\n\t'April',\n\t'May',\n\t'June',\n\t'July',\n\t'August',\n\t'September',\n\t'October',\n\t'November',\n\t'December',\n];\n\n/**\n * Crystal grid. Renders any crystals list response (/crystals, /crystals/chakra/{chakra}, /crystals/element/{element}, /crystals/zodiac/{sign}, /crystals/birthstone/{month}, /crystals/search) as a responsive gallery of crystal tiles with photo, name, and colour swatches. The heading is derived from the response filter (chakra, element, zodiac sign, or birth month) or set explicitly via the `heading` attribute.\n */\n@customElement('roxy-crystal-grid')\nexport class RoxyCrystalGrid extends RoxyDataElement<CrystalGridData> {\n\tstatic styles = [\n\t\tbaseStyles,\n\t\tcss`.wrap{gap:var(--roxy-space-md,1rem);display:grid}.head{justify-content:space-between;align-items:baseline;gap:var(--roxy-space-sm,.5rem);flex-wrap:wrap;display:flex}.title{font-size:var(--roxy-text-lg,1.125rem);font-weight:var(--roxy-weight-bold,600);color:var(--roxy-fg,#0a0a0a);margin:0}.count{color:var(--roxy-muted,#71717a);font-size:var(--roxy-text-sm,.875rem)}.grid{gap:var(--roxy-space-md,1rem);grid-template-columns:repeat(auto-fill,minmax(8rem,1fr));margin:0;padding:0;list-style:none;display:grid}.tile{gap:var(--roxy-space-xs,.25rem);background:var(--roxy-surface,#fff);border:1px solid var(--roxy-border,#e4e4e7);border-radius:var(--roxy-radius-md,8px);padding:var(--roxy-space-sm,.5rem);box-shadow:var(--roxy-shadow-sm);display:grid}.photo{aspect-ratio:1;border-radius:var(--roxy-radius-sm,4px);object-fit:cover;background:color-mix(in srgb, var(--roxy-border,#e4e4e7) 35%, transparent);width:100%}.name{font-size:var(--roxy-text-sm,.875rem);font-weight:var(--roxy-weight-bold,600);color:var(--roxy-fg,#0a0a0a);margin:0}.colors{flex-wrap:wrap;gap:4px;display:flex}.swatch{border-radius:var(--roxy-radius-full,9999px);border:1px solid color-mix(in srgb, var(--roxy-fg,#0a0a0a) 18%, transparent);width:10px;height:10px}`,\n\t];\n\n\t/**\n\t * Override the auto-derived grid heading. Empty by default, in which case the heading comes from the response filter (chakra, element, zodiac, or birth month) or falls back to \"Crystals\".\n\t */\n\t@property({ type: String, reflect: true })\n\theading = '';\n\n\tprotected renderEmpty() {\n\t\treturn html`<div class=\"roxy-empty\" role=\"status\">No crystals</div>`;\n\t}\n\n\tprotected renderData(d: CrystalGridData) {\n\t\tconst crystals = d.crystals ?? [];\n\t\tif (crystals.length === 0) return this.renderEmpty();\n\n\t\tconst title = this.heading || this.deriveHeading(d);\n\t\tconst total =\n\t\t\t'total' in d && typeof d.total === 'number' ? d.total : crystals.length;\n\n\t\treturn html`<section class=\"wrap\" aria-label=\"${title}\"><header class=\"head\"><h2 class=\"title\">${title}</h2><span class=\"count\">${total} ${total === 1 ? 'crystal' : 'crystals'}</span></header><ul class=\"grid\">${crystals.map(\n\t\t\t\t\t(c) => html`<li class=\"tile\">${\n\t\t\t\t\t\t\tc.imageUrl\n\t\t\t\t\t\t\t\t? html`<img class=\"photo\" src=\"${c.imageUrl}\" alt=\"${c.name ?? 'Crystal'}\" loading=\"lazy\">`\n\t\t\t\t\t\t\t\t: html`<div class=\"photo\" aria-hidden=\"true\"></div>`\n\t\t\t\t\t\t}<p class=\"name\">${c.name}</p>${\n\t\t\t\t\t\t\tc.colors && c.colors.length > 0\n\t\t\t\t\t\t\t\t? html`<div class=\"colors\" aria-label=\"${`Colours: ${c.colors.join(', ')}`}\">${c.colors.map((col) => html`<span class=\"swatch\" style=\"${`background:${cssColor(col)}`}\" title=\"${col}\"></span>`)}</div>`\n\t\t\t\t\t\t\t\t: nothing\n\t\t\t\t\t\t}</li>`,\n\t\t\t\t)}</ul></section>`;\n\t}\n\n\tprivate deriveHeading(d: CrystalGridData): string {\n\t\tif ('chakra' in d && d.chakra) return `${d.chakra} chakra crystals`;\n\t\tif ('element' in d && d.element) return `${d.element} element crystals`;\n\t\tif ('sign' in d && d.sign) return `Crystals for ${d.sign}`;\n\t\tif ('month' in d && typeof d.month === 'number')\n\t\t\treturn `${MONTHS[d.month - 1] ?? ''} birthstones`.trim();\n\t\treturn 'Crystals';\n\t}\n}\n\n/**\n * Map an API colour keyword to a CSS colour. Most crystal colours (violet, purple, green, blue) are valid CSS named colours; multi-word or non-standard values (blue-green, lavender) fall back to the keyword and, if the browser cannot resolve it, the swatch border still renders. Lower-cased and space-stripped so \"Blue Green\" resolves to the CSS hyphen form where it exists.\n */\nfunction cssColor(name: string): string {\n\treturn name.trim().toLowerCase().replace(/\\s+/g, '');\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'roxy-crystal-grid': RoxyCrystalGrid;\n\t}\n}\n", "import {\n\ttype CSSResultGroup,\n\thtml,\n\tLitElement,\n\ttype PropertyValues,\n} from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { baseStyles } from './base-styles.js';\nimport { buildRequest, FetchController } from './fetch-controller.js';\nimport { MarkupDataController } from './markup-data.js';\n\n/**\n * Shared base for every data-driven Roxy component. Consolidates the things every component used to repeat by hand and adds the self-contained, drop-in behavior: controlled-mode hydration, an opt-in self-fetch (form, request, loading, error, empty), the typed `data` slot, and the render switch. A subclass implements one method, {@link RoxyDataElement.renderData}.\n *\n * @remarks\n * Two render modes, one component, which is the whole drop-in contract:\n *\n * - Controlled: a server (WordPress, JSX SSR, static HTML) fetches the response and injects it as a direct-child `<script type=\"application/json\" class=\"roxy-data\">`. {@link MarkupDataController} hydrates `data` from it on connect. No key reaches the browser. This is the path the WordPress plugin drives, and it is unchanged by the base class.\n * - Uncontrolled: no data is injected, but a `data-endpoint` and a `pk_` `publishable-key` are set. The component renders its own `<roxy-endpoint-form>` (an internal detail, never placed by the consumer), and on submit fetches through {@link FetchController}, which refuses any non-publishable key. The result populates `data` and the component renders it.\n *\n * The JavaScript `data` property always wins over markup, so a host that assigns `el.data = \u2026` after upgrade is authoritative.\n *\n * Self-fetch needs `<roxy-endpoint-form>` (and `<roxy-location-search>`) registered. The CDN bundle and the full `@roxyapi/ui` entry register everything; per-component ESM consumers that want self-fetch import the form component too.\n *\n * @example\n * ```ts\n * @customElement('roxy-dream-card')\n * export class RoxyDreamCard extends RoxyDataElement<GetDreamSymbolResponse> {\n *   static styles = [baseStyles, css`.card { \u2026 }`];\n *   protected renderData(d: GetDreamSymbolResponse) {\n *     return html`<article class=\"card\">\u2026</article>`;\n *   }\n *   protected renderEmpty() {\n *     return html`<div class=\"roxy-empty\" role=\"status\">No dream symbol</div>`;\n *   }\n * }\n * ```\n */\nexport abstract class RoxyDataElement<T = unknown> extends LitElement {\n\tstatic styles: CSSResultGroup = [baseStyles];\n\n\t/** Typed RoxyAPI response. Assigned in JavaScript, hydrated from the roxy-data island, or set by a self-fetch. */\n\t@property({ attribute: false })\n\tdata: T | null = null;\n\n\t/** Endpoint path for self-fetch, e.g. \"astrology/natal-chart\" or \"dreams/symbols/{id}\". Empty disables self-fetch (controlled mode only). */\n\t@property({ type: String, attribute: 'data-endpoint' })\n\tendpoint = '';\n\n\t/** HTTP method for self-fetch. */\n\t@property({ type: String })\n\tmethod: 'GET' | 'POST' = 'POST';\n\n\t/** Browser-safe publishable key (pk_) for self-fetch. A secret key is refused client-side. */\n\t@property({ type: String, attribute: 'publishable-key' })\n\tpublishableKey?: string;\n\n\t/** Override the API origin for self-hosted or proxied deployments. */\n\t@property({ type: String, attribute: 'base-url' })\n\tbaseUrl?: string;\n\n\t/** Override the OpenAPI spec URL the self-fetch form introspects. */\n\t@property({ type: String, attribute: 'spec-url' })\n\tspecUrl?: string;\n\n\t/** Consumer backend route that proxies the request (holds the secret key). When set, self-fetch POSTs the request here instead of calling RoxyAPI directly, so no key reaches the browser. The server-rendered (WordPress) path. */\n\t@property({ type: String, attribute: 'submit-url' })\n\tsubmitUrl?: string;\n\n\t/** Persist the last self-fetch form values in sessionStorage (keyed by endpoint) and prefill the form on reload. */\n\t@property({ type: Boolean })\n\tremember = false;\n\n\t/** True while an uncontrolled self-fetch is in flight. Public so {@link FetchController} can drive it. */\n\t@state()\n\tloading = false;\n\n\t/** Message from a failed self-fetch, or null. Public so {@link FetchController} can drive it. */\n\t@state()\n\terror: string | null = null;\n\n\tprivate fetcher: FetchController<T>;\n\n\tconstructor() {\n\t\tsuper();\n\t\t// Controlled mode: hydrate `data` from a direct-child roxy-data island when\n\t\t// no JS property was assigned. Keyless; the server already fetched.\n\t\tnew MarkupDataController<T>(this);\n\t\tthis.fetcher = new FetchController<T>(this);\n\t}\n\n\tprotected willUpdate(changed: PropertyValues): void {\n\t\tif (changed.has('publishableKey')) {\n\t\t\tthis.fetcher.publishableKey = this.publishableKey;\n\t\t}\n\t\tif (changed.has('baseUrl') && this.baseUrl) {\n\t\t\tthis.fetcher.baseUrl = this.baseUrl;\n\t\t}\n\t\tif (changed.has('submitUrl')) {\n\t\t\tthis.fetcher.submitUrl = this.submitUrl;\n\t\t}\n\t}\n\n\trender(): unknown {\n\t\tif (this.loading) return this.renderLoading();\n\t\tif (this.error != null) return this.renderError(this.error);\n\t\tif (this.data != null) return this.renderData(this.data);\n\t\treturn this.renderNoData();\n\t}\n\n\t/** Render the populated response. The single method every component implements. */\n\tprotected abstract renderData(data: T): unknown;\n\n\t/** The data-absent branch: the self-fetch form when an endpoint is set, otherwise the empty state. */\n\tprotected renderNoData(): unknown {\n\t\treturn this.endpoint ? this.renderForm() : this.renderEmpty();\n\t}\n\n\t/** Internal self-fetch form. Reuses the introspecting `<roxy-endpoint-form>`; the consumer never places it. */\n\tprotected renderForm(): unknown {\n\t\treturn html`<roxy-endpoint-form data-endpoint=\"${this.endpoint}\" method=\"${this.method}\" spec-url=\"${ifDefined(this.specUrl)}\" .initialValues=\"${this.remember ? this.readRemembered() : undefined}\" @roxy-submit=\"${this.onFormSubmit}\"></roxy-endpoint-form>`;\n\t}\n\n\tprivate onFormSubmit = (e: Event) => {\n\t\tconst detail = (e as CustomEvent).detail as {\n\t\t\tvalues: Record<string, unknown>;\n\t\t};\n\t\tif (this.remember) this.writeRemembered(detail.values);\n\t\tvoid this.fetcher.run(\n\t\t\tbuildRequest(this.endpoint, this.method, detail.values),\n\t\t);\n\t};\n\n\t/** sessionStorage key for this component's remembered form values, scoped by endpoint. */\n\tprivate rememberKey(): string {\n\t\treturn `roxy-ui:form:${this.endpoint}`;\n\t}\n\n\tprivate readRemembered(): Record<string, unknown> | undefined {\n\t\ttry {\n\t\t\tconst raw = sessionStorage.getItem(this.rememberKey());\n\t\t\treturn raw ? (JSON.parse(raw) as Record<string, unknown>) : undefined;\n\t\t} catch {\n\t\t\treturn undefined;\n\t\t}\n\t}\n\n\tprivate writeRemembered(values: Record<string, unknown>): void {\n\t\ttry {\n\t\t\tsessionStorage.setItem(this.rememberKey(), JSON.stringify(values));\n\t\t} catch {\n\t\t\t// Private mode / disabled storage: remembering is best-effort, never fatal.\n\t\t}\n\t}\n\n\t/** Terminal empty state. Subclasses override for a domain-specific message. */\n\tprotected renderEmpty(): unknown {\n\t\treturn html`<div class=\"roxy-empty\" role=\"status\">No data</div>`;\n\t}\n\n\t/** Loading placeholder shown during a self-fetch. */\n\tprotected renderLoading(): unknown {\n\t\treturn html`<div class=\"roxy-skeleton\" style=\"height:8rem\" role=\"status\" aria-label=\"Loading\"></div>`;\n\t}\n\n\t/** Error state shown when a self-fetch fails. Keeps the form in view so the request can be retried. */\n\tprotected renderError(message: string): unknown {\n\t\tconst banner = html`<div class=\"roxy-error\" role=\"alert\">${message}</div>`;\n\t\treturn this.endpoint ? html`${banner}${this.renderForm()}` : banner;\n\t}\n}\n", "import { css } from 'lit';\n\n/**\n * Shared host styles every component pulls in. Sets default font, color,\n * container query support, and the entry fade-in.\n */\nexport const baseStyles = css`:host{font-family:var(--roxy-font-sans,system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif);color:var(--roxy-fg,#0a0a0a);font-size:var(--roxy-text-base,1rem);line-height:var(--roxy-leading-normal,1.5);animation:roxy-fade-in var(--roxy-motion-duration,.2s) var(--roxy-motion-easing,cubic-bezier(.4, 0, .2, 1)) both;background:0 0;display:block;container-type:inline-size}:host([bare]){--roxy-surface:transparent;--roxy-shadow-sm:none;--roxy-shadow-md:none}*,:before,:after{box-sizing:border-box}@keyframes roxy-fade-in{0%{opacity:0;transform:translateY(2px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){:host{animation:none}}.roxy-skeleton{background:linear-gradient(90deg, var(--roxy-border,#e4e4e7) 0%, color-mix(in srgb, var(--roxy-border,#e4e4e7) 60%, transparent) 50%, var(--roxy-border,#e4e4e7) 100%);border-radius:var(--roxy-radius-md,8px);background-size:200% 100%;animation:1.4s ease-in-out infinite roxy-shimmer}@keyframes roxy-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@media (prefers-reduced-motion:reduce){.roxy-skeleton{animation:none}}.roxy-empty{padding:var(--roxy-space-lg,1.5rem);color:var(--roxy-muted,#71717a);text-align:center;font-size:var(--roxy-text-sm,.875rem)}.roxy-error{gap:var(--roxy-space-sm,.5rem);padding:var(--roxy-space-lg,1.5rem);background:var(--roxy-surface,#fff);border:1px solid var(--roxy-danger,#dc2626);border-radius:var(--roxy-radius-md,8px);color:var(--roxy-danger-fg,#991b1b);font-size:var(--roxy-text-sm,.875rem);justify-items:start;display:grid}.roxy-surface{background:var(--roxy-surface,#fff);color:var(--roxy-fg,#0a0a0a)}:host(:focus-within) .roxy-card{outline:2px solid var(--roxy-ring,#f59e0b66);outline-offset:2px}:host{font-variant-emoji:text}`;\n", "import type { ReactiveController, ReactiveControllerHost } from 'lit';\n\n/**\n * Host slots the controller drives. {@link RoxyDataElement} satisfies this, so\n * the form mixin can attach a controller without the component wiring state by hand.\n */\ninterface FetchHost<T> extends ReactiveControllerHost {\n\tdata: T | null;\n\tloading: boolean;\n\terror: string | null;\n}\n\n/** Default RoxyAPI v2 origin. A component overrides it per instance via its `base-url` attribute. */\nconst DEFAULT_BASE_URL = 'https://roxyapi.com/api/v2';\n\n/** A single request the controller issues on the component's behalf. */\nexport interface RoxyRequest {\n\t/** Path under the API base, e.g. \"/dreams/symbols/water\" or \"/astrology/natal-chart\". */\n\tpath: string;\n\tmethod?: 'GET' | 'POST';\n\t/** JSON body for POST endpoints. */\n\tbody?: unknown;\n\t/** Query string parameters; nullish values are dropped. */\n\tquery?: Record<string, string | number | undefined>;\n}\n\n/**\n * Client-side fetch for uncontrolled (self-fetching) components: drives `host.data` / `host.loading` / `host.error` and cancels a stale request when a newer one starts or the host disconnects.\n *\n * @remarks\n * Security boundary. The only credential this ever sends is a `pk_` publishable key, which carries a server-side origin allowlist. A secret (`sk_`) or legacy unprefixed key is refused before any network call and surfaced as an error, so a server secret cannot leak into a browser request. This centralizes the guard that originated in `<roxy-location-search>` so every self-fetching component enforces it identically.\n *\n * Controlled-mode components never construct this. When a server injects the response as a `<script class=\"roxy-data\">` island, there is no key and no fetch, which is the path server-rendered consumers (WordPress, JSX SSR, static HTML) rely on.\n */\nexport class FetchController<T = unknown> implements ReactiveController {\n\tprivate readonly host: FetchHost<T>;\n\tprivate abort?: AbortController;\n\n\t/** Browser-safe publishable key. Set by the host from its `publishable-key` attribute. */\n\tpublishableKey?: string;\n\t/** API origin, overridable for self-hosted or proxied deployments. */\n\tbaseUrl = DEFAULT_BASE_URL;\n\t/**\n\t * Consumer backend route that holds the secret key. When set, the request is POSTed here as `{ path, method, body, query }` instead of called against RoxyAPI directly, so no key (publishable or secret) is sent from the browser. This is the canonical path for server-rendered hosts (WordPress); the backend proxies the request with its own `sk_` key and returns the JSON response.\n\t */\n\tsubmitUrl?: string;\n\n\tconstructor(host: FetchHost<T>) {\n\t\tthis.host = host;\n\t\thost.addController(this);\n\t}\n\n\thostDisconnected() {\n\t\tthis.abort?.abort();\n\t\tthis.abort = undefined;\n\t}\n\n\t/**\n\t * Issue the request and resolve once `host.data` (success) or `host.error`\n\t * (failure) is set. A no-op return when a non-publishable key is present:\n\t * the error is already surfaced and nothing is sent.\n\t */\n\tasync run(req: RoxyRequest): Promise<void> {\n\t\t// submit-url proxy: no key leaves the browser; the consumer's backend holds it.\n\t\tif (!this.submitUrl && this.secretKeyRefused()) return;\n\t\tthis.abort?.abort();\n\t\tconst controller = new AbortController();\n\t\tthis.abort = controller;\n\t\tthis.host.loading = true;\n\t\tthis.host.error = null;\n\t\ttry {\n\t\t\tconst res = this.submitUrl\n\t\t\t\t? await fetch(this.submitUrl, {\n\t\t\t\t\t\tmethod: 'POST',\n\t\t\t\t\t\theaders: {\n\t\t\t\t\t\t\tAccept: 'application/json',\n\t\t\t\t\t\t\t'Content-Type': 'application/json',\n\t\t\t\t\t\t},\n\t\t\t\t\t\tbody: JSON.stringify(req),\n\t\t\t\t\t\tsignal: controller.signal,\n\t\t\t\t\t})\n\t\t\t\t: await this.callApi(req, controller.signal);\n\t\t\tif (!res.ok) throw new Error(await this.readError(res));\n\t\t\tconst json = (await res.json()) as T;\n\t\t\tif (controller.signal.aborted) return;\n\t\t\tthis.host.data = json;\n\t\t} catch (err) {\n\t\t\tif ((err as { name?: string })?.name === 'AbortError') return;\n\t\t\tthis.host.error = err instanceof Error ? err.message : String(err);\n\t\t} finally {\n\t\t\tif (this.abort === controller) this.abort = undefined;\n\t\t\tif (!controller.signal.aborted) this.host.loading = false;\n\t\t}\n\t}\n\n\t/** Direct call against RoxyAPI with the publishable key (the no-backend path). */\n\tprivate callApi(req: RoxyRequest, signal: AbortSignal): Promise<Response> {\n\t\tconst url = new URL(`${this.baseUrl}${req.path}`);\n\t\tfor (const [k, v] of Object.entries(req.query ?? {})) {\n\t\t\tif (v != null) url.searchParams.set(k, String(v));\n\t\t}\n\t\tconst headers: Record<string, string> = { Accept: 'application/json' };\n\t\tif (this.publishableKey) headers['X-API-Key'] = this.publishableKey;\n\t\tif (req.body != null) headers['Content-Type'] = 'application/json';\n\t\treturn fetch(url, {\n\t\t\tmethod: req.method ?? 'GET',\n\t\t\theaders,\n\t\t\tbody: req.body != null ? JSON.stringify(req.body) : undefined,\n\t\t\tsignal,\n\t\t});\n\t}\n\n\t/** True when a key is set and it is not a browser-safe `pk_` publishable key. Surfaces the error and refuses to send. */\n\tprivate secretKeyRefused(): boolean {\n\t\tconst key = this.publishableKey;\n\t\tif (!key || key.startsWith('pk_')) return false;\n\t\tthis.host.error =\n\t\t\t'Client-side components accept a pk_ publishable key only. Use a publishable key with an origin allowlist, or render server-side.';\n\t\t(this.host as unknown as EventTarget).dispatchEvent(\n\t\t\tnew CustomEvent('roxy-validation-error', {\n\t\t\t\tdetail: { reason: 'possible-secret-key' },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}),\n\t\t);\n\t\treturn true;\n\t}\n\n\t/** Surface the `{ error, code }` message the API returns on failure, falling back to the status code. */\n\tprivate async readError(res: Response): Promise<string> {\n\t\ttry {\n\t\t\tconst body = (await res.json()) as { error?: string };\n\t\t\tif (body?.error) return body.error;\n\t\t} catch {\n\t\t\t// Non-JSON error body: fall through to the status line.\n\t\t}\n\t\treturn `Request failed (${res.status})`;\n\t}\n}\n\n/**\n * Translate flat form values into a {@link RoxyRequest} for an endpoint. The `{name}` segments in the endpoint template are substituted from the values and removed; the rest become the JSON body for POST or query parameters for GET. This is the spec-light request builder the base element uses to turn a `<roxy-endpoint-form>` submission into a self-fetch, so a component needs no per-endpoint glue.\n */\nexport function buildRequest(\n\tendpoint: string,\n\tmethod: 'GET' | 'POST',\n\tvalues: Record<string, unknown>,\n): RoxyRequest {\n\tconst rest: Record<string, unknown> = { ...values };\n\tconst path = `/${endpoint.replace(/^\\//, '')}`.replace(\n\t\t/\\{([^}]+)\\}/g,\n\t\t(_match, name: string) => {\n\t\t\tconst v = rest[name];\n\t\t\tdelete rest[name];\n\t\t\treturn encodeURIComponent(String(v ?? ''));\n\t\t},\n\t);\n\tconst query: Record<string, string | number | undefined> = {};\n\tconst body: Record<string, unknown> = {};\n\tfor (const [k, v] of Object.entries(rest)) {\n\t\tif (v === undefined || v === '') continue;\n\t\tif (method === 'GET') query[k] = v as string | number;\n\t\telse body[k] = v;\n\t}\n\treturn { path, method, query, body: method === 'POST' ? body : undefined };\n}\n", "import type { ReactiveController, ReactiveControllerHost } from 'lit';\n\n/**\n * Marker class on the inline JSON script a server emits inside a component.\n *\n * @example\n * ```html\n * <roxy-natal-chart>\n *   <script type=\"application/json\" class=\"roxy-data\">{ ...response... }</script>\n * </roxy-natal-chart>\n * ```\n */\nconst ROXY_DATA_CLASS = 'roxy-data';\n\n/**\n * Serialize a RoxyAPI response for embedding inside an inline `<script type=\"application/json\" class=\"roxy-data\">`. This is the safe writer counterpart to {@link MarkupDataController}, the reader: server-rendered and cached consumers (WordPress, JSX SSR, static HTML) emit the script with this, and the component hydrates `data` from it on connect.\n *\n * @remarks\n * Use this instead of a bare `JSON.stringify`. A raw stringify of a response that contains the literal text `</script>` (common in long interpretation prose) closes the script element early, corrupting the page and creating an HTML-injection vector. This escapes the script-unsafe characters to their `\\uXXXX` JSON escapes, which `JSON.parse` restores to the original characters, so the value the component receives is identical to the response you passed.\n *\n * `<` is the load-bearing escape (it defeats `</script>` and `<!--`). `>` and `&` are escaped for defence in depth, and U+2028 / U+2029 because they are valid in JSON yet are line terminators in a `<script>` context and break some parsers. The escapes introduce only `\\uXXXX` sequences, so the replacements never feed each other and order is irrelevant.\n *\n * Pass the unwrapped RoxyAPI response, the same shape you would assign to `element.data`. Do not pass the SDK envelope (`{ data, error, request, response }`).\n *\n * @example\n * ```ts\n * import { serializeRoxyData } from '@roxyapi/ui';\n *\n * const { data } = await roxy.dreams.getDreamSymbol({ path: { id: 'water' } });\n * const html = `<roxy-dream-card><script type=\"application/json\" class=\"roxy-data\">${serializeRoxyData(data)}</script></roxy-dream-card>`;\n * ```\n */\nexport function serializeRoxyData(data: unknown): string {\n\treturn JSON.stringify(data)\n\t\t.replace(/</g, '\\\\u003c')\n\t\t.replace(/>/g, '\\\\u003e')\n\t\t.replace(/&/g, '\\\\u0026')\n\t\t.replace(/\\u2028/g, '\\\\u2028')\n\t\t.replace(/\\u2029/g, '\\\\u2029');\n}\n\n/**\n * Build the complete `<script type=\"application/json\" class=\"roxy-data\">\u2026</script>` element a server nests inside a `roxy-*` component for the no-JavaScript hydration path. The payload is escaped via {@link serializeRoxyData}, so it is safe to drop straight into HTML output.\n *\n * @remarks\n * The element carries both `type=\"application/json\"` and `class=\"roxy-data\"` because {@link MarkupDataController} reads only a direct-child script that has both. Emit one of these inside the target component; the JavaScript `data` property still wins if it is later assigned.\n *\n * @example\n * ```ts\n * import { roxyDataScript } from '@roxyapi/ui';\n *\n * const { data } = await roxy.crystals.getCrystal({ path: { id: 'amethyst' } });\n * const html = `<roxy-crystal-grid>${roxyDataScript(data)}</roxy-crystal-grid>`;\n * ```\n */\nexport function roxyDataScript(data: unknown): string {\n\treturn `<script type=\"application/json\" class=\"${ROXY_DATA_CLASS}\">${serializeRoxyData(data)}</script>`;\n}\n\n/**\n * True when the element is a `<script type=\"application/json\">`. Uses tag name and attribute rather than `instanceof HTMLScriptElement` so the check holds in every DOM implementation, including server-rendered and hydration runtimes where the constructor global may be absent.\n */\nfunction isJsonScript(el: Element): boolean {\n\treturn (\n\t\tel.nodeName === 'SCRIPT' && el.getAttribute('type') === 'application/json'\n\t);\n}\n\n/**\n * Host shape the controller drives: any reactive element that exposes a public `data` slot. The controller only writes `data` when the host left it unset, so the JavaScript property path always wins.\n */\ninterface DataHost extends ReactiveControllerHost, HTMLElement {\n\tdata?: unknown;\n}\n\n/**\n * Reactive controller that lets a component hydrate its `data` from embedded markup when no `data` property was assigned in JavaScript.\n *\n * @remarks\n * The server-side and cached-render model: a backend renders the RoxyAPI response into a direct-child `<script type=\"application/json\" class=\"roxy-data\">` element, ships static HTML, and never runs per-element JavaScript to assign a property. On connect this controller reads that script, parses it, and feeds the result to the host. The JavaScript property path is untouched and authoritative: if `host.data` already holds a value when the host connects, the controller does nothing and the markup is ignored.\n *\n * Source resolution order on connect, first hit wins:\n *\n * 1. `host.data` already set in JavaScript -> leave it, read nothing.\n * 2. A direct-child `<script type=\"application/json\" class=\"roxy-data\">` -> parse and use. Direct-child only, so a nested component's own script is never read by an ancestor.\n *\n * Fetching from a URL is intentionally unsupported: that would require a browser-visible key and breaks the server-rendered, cached model these consumers rely on.\n *\n * Timing: {@link hostConnected} runs inside the host `connectedCallback`. For an element parsed from server HTML, its direct children are present by the time the custom element upgrades and connects, so the script is readable here. For an element created with `document.createElement` and connected before any child is appended, there is nothing to read and the property path is the only source, which is exactly the existing behavior.\n *\n * Failure is safe: malformed JSON or a missing script leaves `host.data` untouched, so the host renders its normal empty state.\n *\n * Reading the script never mutates it, and only the marked script is touched, so any sibling fallback markup a server nested inside the element (for no-JavaScript, AMP, or crawler rendering) is left in place.\n *\n * @example\n * ```ts\n * import { MarkupDataController } from '../utils/markup-data.js';\n *\n * export class RoxyExample extends LitElement {\n *   constructor() {\n *     super();\n *     new MarkupDataController(this);\n *   }\n *\n *   @property({ attribute: false })\n *   data: ExampleResponse | null = null;\n * }\n * ```\n */\nexport class MarkupDataController<T = unknown> implements ReactiveController {\n\tprivate readonly host: DataHost;\n\n\tconstructor(host: DataHost) {\n\t\tthis.host = host;\n\t\thost.addController(this);\n\t}\n\n\thostConnected() {\n\t\t// Property path wins. If the consumer (React, vanilla `.data =`, the\n\t\t// widgets script, an MCP agent) already set data, never look at markup.\n\t\tif (this.host.data != null) return;\n\n\t\tconst parsed = this.read();\n\t\tif (parsed === undefined) return;\n\n\t\tthis.host.data = parsed as T;\n\t\tthis.host.requestUpdate();\n\t}\n\n\t/**\n\t * Resolve the embedded payload. Returns `undefined` when there is nothing valid to read so the caller can leave `host.data` untouched.\n\t */\n\tprivate read(): T | undefined {\n\t\tconst inline = this.findInlineScript();\n\t\treturn inline ? this.parse(inline.textContent) : undefined;\n\t}\n\n\t/**\n\t * Direct-child `<script type=\"application/json\" class=\"roxy-data\">`. Scoped to immediate children so a nested data-driven component never has its script read by an ancestor, and so sibling fallback markup is ignored.\n\t */\n\tprivate findInlineScript(): Element | null {\n\t\tfor (const child of Array.from(this.host.children)) {\n\t\t\tif (isJsonScript(child) && child.classList.contains(ROXY_DATA_CLASS)) {\n\t\t\t\treturn child;\n\t\t\t}\n\t\t}\n\t\treturn null;\n\t}\n\n\tprivate parse(text: string | null): T | undefined {\n\t\tif (!text?.trim()) return undefined;\n\t\ttry {\n\t\t\treturn JSON.parse(text) as T;\n\t\t} catch {\n\t\t\t// Malformed embedded JSON: fail safe, leave the host empty state in\n\t\t\t// place rather than throwing during connect.\n\t\t\treturn undefined;\n\t\t}\n\t}\n}\n"],
+  "mappings": "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",
+  "names": ["css", "html", "nothing", "customElement", "property", "html", "LitElement", "property", "state", "ifDefined", "css", "baseStyles", "DEFAULT_BASE_URL", "FetchController", "host", "req", "controller", "res", "json", "err", "signal", "url", "k", "v", "headers", "key", "body", "buildRequest", "endpoint", "method", "values", "rest", "path", "_match", "name", "query", "ROXY_DATA_CLASS", "isJsonScript", "el", "MarkupDataController", "host", "parsed", "inline", "child", "ROXY_DATA_CLASS", "text", "RoxyDataElement", "LitElement", "detail", "buildRequest", "MarkupDataController", "FetchController", "baseStyles", "changed", "html", "ifDefined", "raw", "values", "message", "banner", "__decorateClass", "property", "state", "MONTHS", "RoxyCrystalGrid", "RoxyDataElement", "html", "d", "crystals", "title", "total", "c", "col", "cssColor", "nothing", "baseStyles", "css", "__decorateClass", "property", "customElement", "name"]
+}

package/dist/components/dasha-timeline.d.ts

@@ -1,17 +1,16 @@
-import { LitElement } from 'lit';
 import type { GetCurrentDashaResponse, GetMajorDashasResponse, GetSubDashasResponse } from '../types/index.js';
+import { RoxyDataElement } from '../utils/base-element.js';
 type DashaData = GetCurrentDashaResponse | GetMajorDashasResponse | GetSubDashasResponse;
 /**
  * Dasha timeline. Renders /vedic-astrology/dasha/{current,major,sub/{...}}.
  * Default mode shows the active mahadasha + antardasha + pratyantardasha.
  * Switch to period="major" for the full 120-year Vimshottari timeline.
  */
-export declare class RoxyDashaTimeline extends LitElement {
+export declare class RoxyDashaTimeline extends RoxyDataElement<DashaData> {
     static styles: import("lit").CSSResult[];
-    constructor();
-    data: DashaData | null;
     period: 'current' | 'major' | 'sub';
-    render(): import("lit").TemplateResult<1>;
+    protected renderEmpty(): import("lit").TemplateResult<1>;
+    protected renderData(d: DashaData): import("lit").TemplateResult<1>;
     private renderBirthBalance;
     private renderActiveInterpretation;
     private renderCurrent;

package/dist/components/dasha-timeline.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dasha-timeline.d.ts","sourceRoot":"","sources":["../../src/components/dasha-timeline.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,UAAU,EAAW,MAAM,KAAK,CAAC;AAErD,OAAO,KAAK,EACX,uBAAuB,EACvB,sBAAsB,EACtB,oBAAoB,EACpB,MAAM,mBAAmB,CAAC;AAK3B,KAAK,SAAS,GACX,uBAAuB,GACvB,sBAAsB,GACtB,oBAAoB,CAAC;AAIxB;;;;GAIG;AACH,qBACa,iBAAkB,SAAQ,UAAU;IAChD,MAAM,CAAC,MAAM,4BAgIX;;IAWF,IAAI,EAAE,SAAS,GAAG,IAAI,CAAQ;IAG9B,MAAM,EAAE,SAAS,GAAG,OAAO,GAAG,KAAK,CAAa;IAEhD,MAAM;IA4CN,OAAO,CAAC,kBAAkB;IAkB1B,OAAO,CAAC,0BAA0B;IASlC,OAAO,CAAC,aAAa;IA6CrB,OAAO,CAAC,cAAc;IAMtB,sFAAsF;IACtF,OAAO,CAAC,SAAS;IASjB;;;;OAIG;IACH,OAAO,CAAC,UAAU;IAiBlB,OAAO,CAAC,SAAS;CAgCjB;AAOD,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,qBAAqB,EAAE,iBAAiB,CAAC;KACzC;CACD"}
+{"version":3,"file":"dasha-timeline.d.ts","sourceRoot":"","sources":["../../src/components/dasha-timeline.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EACX,uBAAuB,EACvB,sBAAsB,EACtB,oBAAoB,EACpB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAI3D,KAAK,SAAS,GACX,uBAAuB,GACvB,sBAAsB,GACtB,oBAAoB,CAAC;AAIxB;;;;GAIG;AACH,qBACa,iBAAkB,SAAQ,eAAe,CAAC,SAAS,CAAC;IAChE,MAAM,CAAC,MAAM,4BAgIX;IAGF,MAAM,EAAE,SAAS,GAAG,OAAO,GAAG,KAAK,CAAa;IAEhD,SAAS,CAAC,WAAW;IAIrB,SAAS,CAAC,UAAU,CAAC,CAAC,EAAE,SAAS;IAwCjC,OAAO,CAAC,kBAAkB;IAkB1B,OAAO,CAAC,0BAA0B;IASlC,OAAO,CAAC,aAAa;IA6CrB,OAAO,CAAC,cAAc;IAMtB,sFAAsF;IACtF,OAAO,CAAC,SAAS;IASjB;;;;OAIG;IACH,OAAO,CAAC,UAAU;IAiBlB,OAAO,CAAC,SAAS;CAgCjB;AAOD,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,qBAAqB,EAAE,iBAAiB,CAAC;KACzC;CACD"}

package/dist/components/dasha-timeline.js

@@ -1,2 +1,2 @@
-var b=Object.defineProperty;var v=Object.getOwnPropertyDescriptor;var p=(i,e,r,a)=>{for(var t=a>1?void 0:a?v(e,r):e,n=i.length-1,d;n>=0;n--)(d=i[n])&&(t=(a?d(e,r,t):d(t))||t);return a&&t&&b(e,r,t),t};import{css as w,html as s,LitElement as N,nothing as o}from"lit";import{customElement as C,property as y}from"lit/decorators.js";import{css as $}from"lit";var f=$`:host{font-family:var(--roxy-font-sans,system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);color:var(--roxy-fg,#0a0a0a);font-size:var(--roxy-text-base,1rem);line-height:var(--roxy-leading-normal,1.5);animation:roxy-fade-in var(--roxy-motion-duration,.2s) var(--roxy-motion-easing,cubic-bezier(.4, 0, .2, 1)) both;background:0 0;display:block;container-type:inline-size}*,:before,:after{box-sizing:border-box}@keyframes roxy-fade-in{0%{opacity:0;transform:translateY(2px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){:host{animation:none}}.roxy-skeleton{background:linear-gradient(90deg, var(--roxy-border,#e4e4e7) 0%, color-mix(in srgb, var(--roxy-border,#e4e4e7) 60%, transparent) 50%, var(--roxy-border,#e4e4e7) 100%);border-radius:var(--roxy-radius-md,8px);background-size:200% 100%;animation:1.4s ease-in-out infinite roxy-shimmer}@keyframes roxy-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@media (prefers-reduced-motion:reduce){.roxy-skeleton{animation:none}}.roxy-empty{padding:var(--roxy-space-lg,1.5rem);color:var(--roxy-muted,#71717a);text-align:center;font-size:var(--roxy-text-sm,.875rem)}:host(:focus-within) .roxy-card{outline:2px solid var(--roxy-ring,#f59e0b66);outline-offset:2px}:host{font-variant-emoji:text}`;function h(i,e=1){return typeof i!="number"||!Number.isFinite(i)?"":i.toFixed(e).replace(/\.?0+$/,"")}var D="roxy-data";function k(i){return i.nodeName==="SCRIPT"&&i.getAttribute("type")==="application/json"}var u=class{constructor(e){this.host=e,e.addController(this)}hostConnected(){if(this.host.data!=null)return;let e=this.read();e!==void 0&&(this.host.data=e,this.host.requestUpdate())}read(){let e=this.findInlineScript();return e?this.parse(e.textContent):void 0}findInlineScript(){for(let e of Array.from(this.host.children))if(k(e)&&e.classList.contains(D))return e;return null}parse(e){if(e?.trim())try{return JSON.parse(e)}catch{return}}};var c=class extends N{constructor(){super();this.data=null;this.period="current";new u(this)}render(){let r=this.data;if(!r)return s`<div class="roxy-empty" role="status">No dasha data</div>`;let a=this.collectPeriods(r),t=a.length?Math.max(...a.map(n=>n.durationYears)):0;return s`<div class="wrap" aria-label="Dasha timeline"><header class="head"><h2 class="title">${this.period==="major"?"Vimshottari Mahadasha":this.period==="sub"?"Antardasha":"Active dashas"}</h2>${"nakshatraName"in r&&r.nakshatraName?s`<div class="nakshatra">Moon nakshatra: ${r.nakshatraName} ${"nakshatraLord"in r&&r.nakshatraLord?s`(lord ${r.nakshatraLord})`:o}</div>`:o}</header>${this.renderBirthBalance(r)} ${this.period==="current"?this.renderCurrent(r):o} ${a.length>0?s`<div class="timeline" role="list">${a.map(n=>this.renderBar(n,t))}</div>`:o} ${this.renderActiveInterpretation(a)}</div>`}renderBirthBalance(r){if(!("birthDashaBalance"in r)||!r.birthDashaBalance)return o;let a=r.birthDashaBalance,t="nakshatraLord"in r&&r.nakshatraLord?r.nakshatraLord:"",n=a.years??0,d=a.months??0,l=a.days??0,m=[];n&&m.push(`${n}y`),d&&m.push(`${d}m`),l&&m.push(`${l}d`);let x=m.length?m.join(" "):"0d";return s`<p class="balance">Birth dasha balance: ${x} of ${t?s`<strong>${t}</strong>`:"the opening mahadasha"} remained at birth.</p>`}renderActiveInterpretation(r){let a=r.find(t=>this.isCurrent(t));return a?.interpretation?s`<div class="interp"><h3>${a.planet} mahadasha</h3><p>${a.interpretation}</p></div>`:o}renderCurrent(r){return"mahadasha"in r?s`<div class="current">${"mahadasha"in r&&r.mahadasha?s`<div><span>Mahadasha</span> <strong>${r.mahadasha.planet}</strong> ${"remainingInMahadasha"in r&&r.remainingInMahadasha?s`<small>${h(r.remainingInMahadasha.years+r.remainingInMahadasha.months/12,1)} years left</small>`:o}</div>`:o} ${"antardasha"in r&&r.antardasha?s`<div><span>Antardasha</span> <strong>${r.antardasha.planet}</strong> ${"remainingInAntardasha"in r&&r.remainingInAntardasha?s`<small>${h(r.remainingInAntardasha.years+r.remainingInAntardasha.months/12,1)} years left</small>`:o}</div>`:o} ${"pratyantardasha"in r&&r.pratyantardasha?s`<div><span>Pratyantardasha</span> <strong>${r.pratyantardasha.planet}</strong> ${"remainingInPratyantardasha"in r&&r.remainingInPratyantardasha?s`<small>${h(r.remainingInPratyantardasha.years+r.remainingInPratyantardasha.months/12,1)} years left</small>`:o}</div>`:o}</div>`:o}collectPeriods(r){return"mahadashas"in r&&r.mahadashas?.length?r.mahadashas:"antardashas"in r&&r.antardashas?.length?r.antardashas:[]}isCurrent(r){if(!r.startDate||!r.endDate)return!1;let a=Date.now(),t=Date.parse(r.startDate),n=Date.parse(r.endDate);return Number.isNaN(t)||Number.isNaN(n)?!1:a>=t&&a<n}progressIn(r){if(!r.startDate||!r.endDate)return-1;let a=Date.parse(r.startDate),t=Date.parse(r.endDate),n=Date.now();return Number.isNaN(a)||Number.isNaN(t)||n<a||n>=t||t<=a?-1:(n-a)/(t-a)}renderBar(r,a){let t=r.durationYears,n=a>0?t/a*100:0,d=this.isCurrent(r),l=d?this.progressIn(r):-1,m=d?"bar-track bar-now":"bar-track";return s`<div class="${d?"bar now":"bar"}" role="listitem" aria-current="${d?"time":"false"}"><span><strong>${r.planet}</strong>${d?s`<span class="now-badge">Now</span>`:o} </span><span class="${m}"><span class="bar-fill" style="width:${n}%"></span> ${l>=0?s`<span class="bar-progress" style="left:${l*n}%" aria-hidden="true"></span>`:o} </span><span class="dates">${r.startDate?g(r.startDate):""} ${r.endDate?s`- ${g(r.endDate)}`:""}</span></div>`}};c.styles=[f,w`.wrap{gap:var(--roxy-space-md,1rem);display:grid}.head{justify-content:space-between;align-items:center;gap:var(--roxy-space-sm,.5rem);flex-wrap:wrap;display:flex}.title{font-size:var(--roxy-text-lg,1.125rem);font-weight:var(--roxy-weight-bold,600);margin:0}.nakshatra{color:var(--roxy-muted,#71717a);font-size:var(--roxy-text-sm,.875rem)}.current{gap:var(--roxy-space-md,1rem);background:var(--roxy-bg,#fff);border:1px solid var(--roxy-border,#e4e4e7);border-radius:var(--roxy-radius-md,8px);padding:var(--roxy-space-md,1rem);box-shadow:var(--roxy-shadow-sm);grid-template-columns:repeat(auto-fit,minmax(10rem,1fr));display:grid}.current div span:first-child{color:var(--roxy-muted,#71717a);font-size:var(--roxy-text-xs,.75rem);text-transform:uppercase;letter-spacing:.06em;display:block}.current div strong{font-size:var(--roxy-text-base,1rem);color:var(--roxy-fg,#0a0a0a)}.balance{font-size:var(--roxy-text-sm,.875rem);color:var(--roxy-muted,#71717a);border-left:2px solid var(--roxy-border,#e4e4e7);padding-left:var(--roxy-space-sm,.5rem);margin:0}.timeline{gap:var(--roxy-space-xs,.25rem);display:grid}.bar{gap:var(--roxy-space-sm,.5rem);font-size:var(--roxy-text-sm,.875rem);grid-template-columns:5rem 1fr 8rem;align-items:center;display:grid}.bar.now strong{color:var(--roxy-accent-ink,#b45309)}.now-badge{font-size:var(--roxy-text-xs,.75rem);font-weight:var(--roxy-weight-bold,600);color:var(--roxy-accent-ink,#b45309);text-transform:uppercase;letter-spacing:.06em;margin-left:.4em;display:inline-block}.bar-track{background:var(--roxy-border,#e4e4e7);border-radius:var(--roxy-radius-full,9999px);height:14px;position:relative;overflow:hidden}.bar-fill{background:var(--roxy-accent,#f59e0b);opacity:.45;height:100%;transition:width var(--roxy-motion-duration,.2s) var(--roxy-motion-easing,cubic-bezier(.4, 0, .2, 1));display:block}.bar-now .bar-fill{opacity:1}.bar-progress{background:var(--roxy-accent-ink,#b45309);width:2px;box-shadow:0 0 0 2px color-mix(in srgb, var(--roxy-accent,#f59e0b) 35%, transparent);border-radius:2px;position:absolute;top:-2px;bottom:-2px}.dates{color:var(--roxy-muted,#71717a);font-size:var(--roxy-text-xs,.75rem);font-variant-numeric:tabular-nums;text-align:right}.interp{border:1px solid var(--roxy-border,#e4e4e7);border-radius:var(--roxy-radius-md,8px);padding:var(--roxy-space-sm,.5rem) var(--roxy-space-md,1rem);background:var(--roxy-bg,#fff)}.interp h3{font-size:var(--roxy-text-sm,.875rem);font-weight:var(--roxy-weight-bold,600);margin:0}.interp p{margin:var(--roxy-space-sm,.5rem) 0 0;font-size:var(--roxy-text-sm,.875rem);color:var(--roxy-muted,#71717a)}`],p([y({attribute:!1})],c.prototype,"data",2),p([y({type:String,reflect:!0})],c.prototype,"period",2),c=p([C("roxy-dasha-timeline")],c);function g(i){let e=i.match(/^(\d{4})/);return e?e[1]:i}export{c as RoxyDashaTimeline};
+var D=Object.defineProperty;var S=Object.getOwnPropertyDescriptor;var c=(o,t,r,e)=>{for(var a=e>1?void 0:e?S(t,r):t,n=o.length-1,i;n>=0;n--)(i=o[n])&&(a=(e?i(t,r,a):i(a))||a);return e&&a&&D(t,r,a),a};import{css as U,html as s,nothing as l}from"lit";import{customElement as I,property as j}from"lit/decorators.js";import{html as f,LitElement as P}from"lit";import{property as h,state as k}from"lit/decorators.js";import{ifDefined as A}from"lit/directives/if-defined.js";import{css as T}from"lit";var y=T`:host{font-family:var(--roxy-font-sans,system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);color:var(--roxy-fg,#0a0a0a);font-size:var(--roxy-text-base,1rem);line-height:var(--roxy-leading-normal,1.5);animation:roxy-fade-in var(--roxy-motion-duration,.2s) var(--roxy-motion-easing,cubic-bezier(.4, 0, .2, 1)) both;background:0 0;display:block;container-type:inline-size}:host([bare]){--roxy-surface:transparent;--roxy-shadow-sm:none;--roxy-shadow-md:none}*,:before,:after{box-sizing:border-box}@keyframes roxy-fade-in{0%{opacity:0;transform:translateY(2px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){:host{animation:none}}.roxy-skeleton{background:linear-gradient(90deg, var(--roxy-border,#e4e4e7) 0%, color-mix(in srgb, var(--roxy-border,#e4e4e7) 60%, transparent) 50%, var(--roxy-border,#e4e4e7) 100%);border-radius:var(--roxy-radius-md,8px);background-size:200% 100%;animation:1.4s ease-in-out infinite roxy-shimmer}@keyframes roxy-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@media (prefers-reduced-motion:reduce){.roxy-skeleton{animation:none}}.roxy-empty{padding:var(--roxy-space-lg,1.5rem);color:var(--roxy-muted,#71717a);text-align:center;font-size:var(--roxy-text-sm,.875rem)}.roxy-error{gap:var(--roxy-space-sm,.5rem);padding:var(--roxy-space-lg,1.5rem);background:var(--roxy-surface,#fff);border:1px solid var(--roxy-danger,#dc2626);border-radius:var(--roxy-radius-md,8px);color:var(--roxy-danger-fg,#991b1b);font-size:var(--roxy-text-sm,.875rem);justify-items:start;display:grid}.roxy-surface{background:var(--roxy-surface,#fff);color:var(--roxy-fg,#0a0a0a)}:host(:focus-within) .roxy-card{outline:2px solid var(--roxy-ring,#f59e0b66);outline-offset:2px}:host{font-variant-emoji:text}`;var R="https://roxyapi.com/api/v2",b=class{constructor(t){this.baseUrl=R;this.host=t,t.addController(this)}hostDisconnected(){this.abort?.abort(),this.abort=void 0}async run(t){if(!this.submitUrl&&this.secretKeyRefused())return;this.abort?.abort();let r=new AbortController;this.abort=r,this.host.loading=!0,this.host.error=null;try{let e=this.submitUrl?await fetch(this.submitUrl,{method:"POST",headers:{Accept:"application/json","Content-Type":"application/json"},body:JSON.stringify(t),signal:r.signal}):await this.callApi(t,r.signal);if(!e.ok)throw new Error(await this.readError(e));let a=await e.json();if(r.signal.aborted)return;this.host.data=a}catch(e){if(e?.name==="AbortError")return;this.host.error=e instanceof Error?e.message:String(e)}finally{this.abort===r&&(this.abort=void 0),r.signal.aborted||(this.host.loading=!1)}}callApi(t,r){let e=new URL(`${this.baseUrl}${t.path}`);for(let[n,i]of Object.entries(t.query??{}))i!=null&&e.searchParams.set(n,String(i));let a={Accept:"application/json"};return this.publishableKey&&(a["X-API-Key"]=this.publishableKey),t.body!=null&&(a["Content-Type"]="application/json"),fetch(e,{method:t.method??"GET",headers:a,body:t.body!=null?JSON.stringify(t.body):void 0,signal:r})}secretKeyRefused(){let t=this.publishableKey;return!t||t.startsWith("pk_")?!1:(this.host.error="Client-side components accept a pk_ publishable key only. Use a publishable key with an origin allowlist, or render server-side.",this.host.dispatchEvent(new CustomEvent("roxy-validation-error",{detail:{reason:"possible-secret-key"},bubbles:!0,composed:!0})),!0)}async readError(t){try{let r=await t.json();if(r?.error)return r.error}catch{}return`Request failed (${t.status})`}};function w(o,t,r){let e={...r},a=`/${o.replace(/^\//,"")}`.replace(/\{([^}]+)\}/g,(p,d)=>{let v=e[d];return delete e[d],encodeURIComponent(String(v??""))}),n={},i={};for(let[p,d]of Object.entries(e))d===void 0||d===""||(t==="GET"?n[p]=d:i[p]=d);return{path:a,method:t,query:n,body:t==="POST"?i:void 0}}var N="roxy-data";function C(o){return o.nodeName==="SCRIPT"&&o.getAttribute("type")==="application/json"}var g=class{constructor(t){this.host=t,t.addController(this)}hostConnected(){if(this.host.data!=null)return;let t=this.read();t!==void 0&&(this.host.data=t,this.host.requestUpdate())}read(){let t=this.findInlineScript();return t?this.parse(t.textContent):void 0}findInlineScript(){for(let t of Array.from(this.host.children))if(C(t)&&t.classList.contains(N))return t;return null}parse(t){if(t?.trim())try{return JSON.parse(t)}catch{return}}};var u=class extends P{constructor(){super();this.data=null;this.endpoint="";this.method="POST";this.remember=!1;this.loading=!1;this.error=null;this.onFormSubmit=r=>{let e=r.detail;this.remember&&this.writeRemembered(e.values),this.fetcher.run(w(this.endpoint,this.method,e.values))};new g(this),this.fetcher=new b(this)}static{this.styles=[y]}willUpdate(r){r.has("publishableKey")&&(this.fetcher.publishableKey=this.publishableKey),r.has("baseUrl")&&this.baseUrl&&(this.fetcher.baseUrl=this.baseUrl),r.has("submitUrl")&&(this.fetcher.submitUrl=this.submitUrl)}render(){return this.loading?this.renderLoading():this.error!=null?this.renderError(this.error):this.data!=null?this.renderData(this.data):this.renderNoData()}renderNoData(){return this.endpoint?this.renderForm():this.renderEmpty()}renderForm(){return f`<roxy-endpoint-form data-endpoint="${this.endpoint}" method="${this.method}" spec-url="${A(this.specUrl)}" .initialValues="${this.remember?this.readRemembered():void 0}" @roxy-submit="${this.onFormSubmit}"></roxy-endpoint-form>`}rememberKey(){return`roxy-ui:form:${this.endpoint}`}readRemembered(){try{let r=sessionStorage.getItem(this.rememberKey());return r?JSON.parse(r):void 0}catch{return}}writeRemembered(r){try{sessionStorage.setItem(this.rememberKey(),JSON.stringify(r))}catch{}}renderEmpty(){return f`<div class="roxy-empty" role="status">No data</div>`}renderLoading(){return f`<div class="roxy-skeleton" style="height:8rem" role="status" aria-label="Loading"></div>`}renderError(r){let e=f`<div class="roxy-error" role="alert">${r}</div>`;return this.endpoint?f`${e}${this.renderForm()}`:e}};c([h({attribute:!1})],u.prototype,"data",2),c([h({type:String,attribute:"data-endpoint"})],u.prototype,"endpoint",2),c([h({type:String})],u.prototype,"method",2),c([h({type:String,attribute:"publishable-key"})],u.prototype,"publishableKey",2),c([h({type:String,attribute:"base-url"})],u.prototype,"baseUrl",2),c([h({type:String,attribute:"spec-url"})],u.prototype,"specUrl",2),c([h({type:String,attribute:"submit-url"})],u.prototype,"submitUrl",2),c([h({type:Boolean})],u.prototype,"remember",2),c([k()],u.prototype,"loading",2),c([k()],u.prototype,"error",2);function x(o,t=1){return typeof o!="number"||!Number.isFinite(o)?"":o.toFixed(t).replace(/\.?0+$/,"")}var m=class extends u{constructor(){super(...arguments);this.period="current"}renderEmpty(){return s`<div class="roxy-empty" role="status">No dasha data</div>`}renderData(r){let e=this.collectPeriods(r),a=e.length?Math.max(...e.map(n=>n.durationYears)):0;return s`<div class="wrap" aria-label="Dasha timeline"><header class="head"><h2 class="title">${this.period==="major"?"Vimshottari Mahadasha":this.period==="sub"?"Antardasha":"Active dashas"}</h2>${"nakshatraName"in r&&r.nakshatraName?s`<div class="nakshatra">Moon nakshatra: ${r.nakshatraName} ${"nakshatraLord"in r&&r.nakshatraLord?s`(lord ${r.nakshatraLord})`:l}</div>`:l}</header>${this.renderBirthBalance(r)} ${this.period==="current"?this.renderCurrent(r):l} ${e.length>0?s`<div class="timeline" role="list">${e.map(n=>this.renderBar(n,a))}</div>`:l} ${this.renderActiveInterpretation(e)}</div>`}renderBirthBalance(r){if(!("birthDashaBalance"in r)||!r.birthDashaBalance)return l;let e=r.birthDashaBalance,a="nakshatraLord"in r&&r.nakshatraLord?r.nakshatraLord:"",n=e.years??0,i=e.months??0,p=e.days??0,d=[];n&&d.push(`${n}y`),i&&d.push(`${i}m`),p&&d.push(`${p}d`);let v=d.length?d.join(" "):"0d";return s`<p class="balance">Birth dasha balance: ${v} of ${a?s`<strong>${a}</strong>`:"the opening mahadasha"} remained at birth.</p>`}renderActiveInterpretation(r){let e=r.find(a=>this.isCurrent(a));return e?.interpretation?s`<div class="interp"><h3>${e.planet} mahadasha</h3><p>${e.interpretation}</p></div>`:l}renderCurrent(r){return"mahadasha"in r?s`<div class="current">${"mahadasha"in r&&r.mahadasha?s`<div><span>Mahadasha</span> <strong>${r.mahadasha.planet}</strong> ${"remainingInMahadasha"in r&&r.remainingInMahadasha?s`<small>${x(r.remainingInMahadasha.years+r.remainingInMahadasha.months/12,1)} years left</small>`:l}</div>`:l} ${"antardasha"in r&&r.antardasha?s`<div><span>Antardasha</span> <strong>${r.antardasha.planet}</strong> ${"remainingInAntardasha"in r&&r.remainingInAntardasha?s`<small>${x(r.remainingInAntardasha.years+r.remainingInAntardasha.months/12,1)} years left</small>`:l}</div>`:l} ${"pratyantardasha"in r&&r.pratyantardasha?s`<div><span>Pratyantardasha</span> <strong>${r.pratyantardasha.planet}</strong> ${"remainingInPratyantardasha"in r&&r.remainingInPratyantardasha?s`<small>${x(r.remainingInPratyantardasha.years+r.remainingInPratyantardasha.months/12,1)} years left</small>`:l}</div>`:l}</div>`:l}collectPeriods(r){return"mahadashas"in r&&r.mahadashas?.length?r.mahadashas:"antardashas"in r&&r.antardashas?.length?r.antardashas:[]}isCurrent(r){if(!r.startDate||!r.endDate)return!1;let e=Date.now(),a=Date.parse(r.startDate),n=Date.parse(r.endDate);return Number.isNaN(a)||Number.isNaN(n)?!1:e>=a&&e<n}progressIn(r){if(!r.startDate||!r.endDate)return-1;let e=Date.parse(r.startDate),a=Date.parse(r.endDate),n=Date.now();return Number.isNaN(e)||Number.isNaN(a)||n<e||n>=a||a<=e?-1:(n-e)/(a-e)}renderBar(r,e){let a=r.durationYears,n=e>0?a/e*100:0,i=this.isCurrent(r),p=i?this.progressIn(r):-1,d=i?"bar-track bar-now":"bar-track";return s`<div class="${i?"bar now":"bar"}" role="listitem" aria-current="${i?"time":"false"}"><span><strong>${r.planet}</strong>${i?s`<span class="now-badge">Now</span>`:l} </span><span class="${d}"><span class="bar-fill" style="width:${n}%"></span> ${p>=0?s`<span class="bar-progress" style="left:${p*n}%" aria-hidden="true"></span>`:l} </span><span class="dates">${r.startDate?$(r.startDate):""} ${r.endDate?s`- ${$(r.endDate)}`:""}</span></div>`}};m.styles=[y,U`.wrap{gap:var(--roxy-space-md,1rem);display:grid}.head{justify-content:space-between;align-items:center;gap:var(--roxy-space-sm,.5rem);flex-wrap:wrap;display:flex}.title{font-size:var(--roxy-text-lg,1.125rem);font-weight:var(--roxy-weight-bold,600);margin:0}.nakshatra{color:var(--roxy-muted,#71717a);font-size:var(--roxy-text-sm,.875rem)}.current{gap:var(--roxy-space-md,1rem);background:var(--roxy-surface,#fff);border:1px solid var(--roxy-border,#e4e4e7);border-radius:var(--roxy-radius-md,8px);padding:var(--roxy-space-md,1rem);box-shadow:var(--roxy-shadow-sm);grid-template-columns:repeat(auto-fit,minmax(10rem,1fr));display:grid}.current div span:first-child{color:var(--roxy-muted,#71717a);font-size:var(--roxy-text-xs,.75rem);text-transform:uppercase;letter-spacing:.06em;display:block}.current div strong{font-size:var(--roxy-text-base,1rem);color:var(--roxy-fg,#0a0a0a)}.balance{font-size:var(--roxy-text-sm,.875rem);color:var(--roxy-muted,#71717a);border-left:2px solid var(--roxy-border,#e4e4e7);padding-left:var(--roxy-space-sm,.5rem);margin:0}.timeline{gap:var(--roxy-space-xs,.25rem);display:grid}.bar{gap:var(--roxy-space-sm,.5rem);font-size:var(--roxy-text-sm,.875rem);grid-template-columns:5rem 1fr 8rem;align-items:center;display:grid}.bar.now strong{color:var(--roxy-accent-ink,#b45309)}.now-badge{font-size:var(--roxy-text-xs,.75rem);font-weight:var(--roxy-weight-bold,600);color:var(--roxy-accent-ink,#b45309);text-transform:uppercase;letter-spacing:.06em;margin-left:.4em;display:inline-block}.bar-track{background:var(--roxy-border,#e4e4e7);border-radius:var(--roxy-radius-full,9999px);height:14px;position:relative;overflow:hidden}.bar-fill{background:var(--roxy-accent,#f59e0b);opacity:.45;height:100%;transition:width var(--roxy-motion-duration,.2s) var(--roxy-motion-easing,cubic-bezier(.4, 0, .2, 1));display:block}.bar-now .bar-fill{opacity:1}.bar-progress{background:var(--roxy-accent-ink,#b45309);width:2px;box-shadow:0 0 0 2px color-mix(in srgb, var(--roxy-accent,#f59e0b) 35%, transparent);border-radius:2px;position:absolute;top:-2px;bottom:-2px}.dates{color:var(--roxy-muted,#71717a);font-size:var(--roxy-text-xs,.75rem);font-variant-numeric:tabular-nums;text-align:right}.interp{border:1px solid var(--roxy-border,#e4e4e7);border-radius:var(--roxy-radius-md,8px);padding:var(--roxy-space-sm,.5rem) var(--roxy-space-md,1rem);background:var(--roxy-surface,#fff)}.interp h3{font-size:var(--roxy-text-sm,.875rem);font-weight:var(--roxy-weight-bold,600);margin:0}.interp p{margin:var(--roxy-space-sm,.5rem) 0 0;font-size:var(--roxy-text-sm,.875rem);color:var(--roxy-muted,#71717a)}`],c([j({type:String,reflect:!0})],m.prototype,"period",2),m=c([I("roxy-dasha-timeline")],m);function $(o){let t=o.match(/^(\d{4})/);return t?t[1]:o}export{m as RoxyDashaTimeline};
 //# sourceMappingURL=dasha-timeline.js.map

package/dist/components/dasha-timeline.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../../src/components/dasha-timeline.ts", "../../src/utils/base-styles.ts", "../../src/utils/format.ts", "../../src/utils/markup-data.ts"],
-  "sourcesContent": ["import { css, html, LitElement, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport type {\n\tGetCurrentDashaResponse,\n\tGetMajorDashasResponse,\n\tGetSubDashasResponse,\n} from '../types/index.js';\nimport { baseStyles } from '../utils/base-styles.js';\nimport { formatNumber } from '../utils/format.js';\nimport { MarkupDataController } from '../utils/markup-data.js';\n\ntype DashaData =\n\t| GetCurrentDashaResponse\n\t| GetMajorDashasResponse\n\t| GetSubDashasResponse;\n\ntype DashaPeriod = GetMajorDashasResponse['mahadashas'][number];\n\n/**\n * Dasha timeline. Renders /vedic-astrology/dasha/{current,major,sub/{...}}.\n * Default mode shows the active mahadasha + antardasha + pratyantardasha.\n * Switch to period=\"major\" for the full 120-year Vimshottari timeline.\n */\n@customElement('roxy-dasha-timeline')\nexport class RoxyDashaTimeline extends LitElement {\n\tstatic styles = [\n\t\tbaseStyles,\n\t\tcss`.wrap{gap:var(--roxy-space-md,1rem);display:grid}.head{justify-content:space-between;align-items:center;gap:var(--roxy-space-sm,.5rem);flex-wrap:wrap;display:flex}.title{font-size:var(--roxy-text-lg,1.125rem);font-weight:var(--roxy-weight-bold,600);margin:0}.nakshatra{color:var(--roxy-muted,#71717a);font-size:var(--roxy-text-sm,.875rem)}.current{gap:var(--roxy-space-md,1rem);background:var(--roxy-bg,#fff);border:1px solid var(--roxy-border,#e4e4e7);border-radius:var(--roxy-radius-md,8px);padding:var(--roxy-space-md,1rem);box-shadow:var(--roxy-shadow-sm);grid-template-columns:repeat(auto-fit,minmax(10rem,1fr));display:grid}.current div span:first-child{color:var(--roxy-muted,#71717a);font-size:var(--roxy-text-xs,.75rem);text-transform:uppercase;letter-spacing:.06em;display:block}.current div strong{font-size:var(--roxy-text-base,1rem);color:var(--roxy-fg,#0a0a0a)}.balance{font-size:var(--roxy-text-sm,.875rem);color:var(--roxy-muted,#71717a);border-left:2px solid var(--roxy-border,#e4e4e7);padding-left:var(--roxy-space-sm,.5rem);margin:0}.timeline{gap:var(--roxy-space-xs,.25rem);display:grid}.bar{gap:var(--roxy-space-sm,.5rem);font-size:var(--roxy-text-sm,.875rem);grid-template-columns:5rem 1fr 8rem;align-items:center;display:grid}.bar.now strong{color:var(--roxy-accent-ink,#b45309)}.now-badge{font-size:var(--roxy-text-xs,.75rem);font-weight:var(--roxy-weight-bold,600);color:var(--roxy-accent-ink,#b45309);text-transform:uppercase;letter-spacing:.06em;margin-left:.4em;display:inline-block}.bar-track{background:var(--roxy-border,#e4e4e7);border-radius:var(--roxy-radius-full,9999px);height:14px;position:relative;overflow:hidden}.bar-fill{background:var(--roxy-accent,#f59e0b);opacity:.45;height:100%;transition:width var(--roxy-motion-duration,.2s) var(--roxy-motion-easing,cubic-bezier(.4, 0, .2, 1));display:block}.bar-now .bar-fill{opacity:1}.bar-progress{background:var(--roxy-accent-ink,#b45309);width:2px;box-shadow:0 0 0 2px color-mix(in srgb, var(--roxy-accent,#f59e0b) 35%, transparent);border-radius:2px;position:absolute;top:-2px;bottom:-2px}.dates{color:var(--roxy-muted,#71717a);font-size:var(--roxy-text-xs,.75rem);font-variant-numeric:tabular-nums;text-align:right}.interp{border:1px solid var(--roxy-border,#e4e4e7);border-radius:var(--roxy-radius-md,8px);padding:var(--roxy-space-sm,.5rem) var(--roxy-space-md,1rem);background:var(--roxy-bg,#fff)}.interp h3{font-size:var(--roxy-text-sm,.875rem);font-weight:var(--roxy-weight-bold,600);margin:0}.interp p{margin:var(--roxy-space-sm,.5rem) 0 0;font-size:var(--roxy-text-sm,.875rem);color:var(--roxy-muted,#71717a)}`,\n\t];\n\n\tconstructor() {\n\t\tsuper();\n\t\t// Enables hydrating `data` from a direct-child\n\t\t// <script type=\"application/json\" class=\"roxy-data\"> for server-rendered\n\t\t// and cached consumers. The JavaScript `data` property still wins.\n\t\tnew MarkupDataController(this);\n\t}\n\n\t@property({ attribute: false })\n\tdata: DashaData | null = null;\n\n\t@property({ type: String, reflect: true })\n\tperiod: 'current' | 'major' | 'sub' = 'current';\n\n\trender() {\n\t\tconst d = this.data;\n\t\tif (!d)\n\t\t\treturn html`<div class=\"roxy-empty\" role=\"status\">No dasha data</div>`;\n\n\t\tconst periods = this.collectPeriods(d);\n\t\tconst maxYears = periods.length\n\t\t\t? Math.max(...periods.map((p) => p.durationYears))\n\t\t\t: 0;\n\n\t\treturn html`<div class=\"wrap\" aria-label=\"Dasha timeline\"><header class=\"head\"><h2 class=\"title\">${\n\t\t\t\t\t\tthis.period === 'major'\n\t\t\t\t\t\t\t? 'Vimshottari Mahadasha'\n\t\t\t\t\t\t\t: this.period === 'sub'\n\t\t\t\t\t\t\t\t? 'Antardasha'\n\t\t\t\t\t\t\t\t: 'Active dashas'\n\t\t\t\t\t}</h2>${\n\t\t\t\t\t'nakshatraName' in d && d.nakshatraName\n\t\t\t\t\t\t? html`<div class=\"nakshatra\">Moon nakshatra: ${d.nakshatraName} ${'nakshatraLord' in d && d.nakshatraLord ? html`(lord ${d.nakshatraLord})` : nothing}</div>`\n\t\t\t\t\t\t: nothing\n\t\t\t\t}</header>${this.renderBirthBalance(d)} ${this.period === 'current' ? this.renderCurrent(d) : nothing} ${\n\t\t\t\tperiods.length > 0\n\t\t\t\t\t? html`<div class=\"timeline\" role=\"list\">${periods.map((p) => this.renderBar(p, maxYears))}</div>`\n\t\t\t\t\t: nothing\n\t\t\t} ${this.renderActiveInterpretation(periods)}</div>`;\n\t}\n\n\tprivate renderBirthBalance(d: DashaData) {\n\t\tif (!('birthDashaBalance' in d) || !d.birthDashaBalance) return nothing;\n\t\tconst b = d.birthDashaBalance;\n\t\tconst lord = 'nakshatraLord' in d && d.nakshatraLord ? d.nakshatraLord : '';\n\t\tconst yrs = b.years ?? 0;\n\t\tconst mo = b.months ?? 0;\n\t\tconst da = b.days ?? 0;\n\t\tconst parts: string[] = [];\n\t\tif (yrs) parts.push(`${yrs}y`);\n\t\tif (mo) parts.push(`${mo}m`);\n\t\tif (da) parts.push(`${da}d`);\n\t\tconst remaining = parts.length ? parts.join(' ') : '0d';\n\t\treturn html`<p class=\"balance\">Birth dasha balance: ${remaining} of ${lord ? html`<strong>${lord}</strong>` : 'the opening mahadasha'} remained at birth.</p>`;\n\t}\n\n\tprivate renderActiveInterpretation(periods: DashaPeriod[]) {\n\t\tconst active = periods.find((p) => this.isCurrent(p));\n\t\tif (!active?.interpretation) return nothing;\n\t\treturn html`<div class=\"interp\"><h3>${active.planet} mahadasha</h3><p>${active.interpretation}</p></div>`;\n\t}\n\n\tprivate renderCurrent(d: DashaData) {\n\t\tif (!('mahadasha' in d)) return nothing;\n\t\treturn html`<div class=\"current\">${\n\t\t\t\t'mahadasha' in d && d.mahadasha\n\t\t\t\t\t? html`<div><span>Mahadasha</span> <strong>${d.mahadasha.planet}</strong> ${\n\t\t\t\t\t\t'remainingInMahadasha' in d && d.remainingInMahadasha\n\t\t\t\t\t\t\t? html`<small>${formatNumber(d.remainingInMahadasha.years + d.remainingInMahadasha.months / 12, 1)} years left</small>`\n\t\t\t\t\t\t\t: nothing\n\t\t\t\t\t}</div>`\n\t\t\t\t\t: nothing\n\t\t\t} ${\n\t\t\t\t'antardasha' in d && d.antardasha\n\t\t\t\t\t? html`<div><span>Antardasha</span> <strong>${d.antardasha.planet}</strong> ${\n\t\t\t\t\t\t'remainingInAntardasha' in d && d.remainingInAntardasha\n\t\t\t\t\t\t\t? html`<small>${formatNumber(d.remainingInAntardasha.years + d.remainingInAntardasha.months / 12, 1)} years left</small>`\n\t\t\t\t\t\t\t: nothing\n\t\t\t\t\t}</div>`\n\t\t\t\t\t: nothing\n\t\t\t} ${\n\t\t\t\t'pratyantardasha' in d && d.pratyantardasha\n\t\t\t\t\t? html`<div><span>Pratyantardasha</span> <strong>${d.pratyantardasha.planet}</strong> ${\n\t\t\t\t\t\t'remainingInPratyantardasha' in d && d.remainingInPratyantardasha\n\t\t\t\t\t\t\t? html`<small>${formatNumber(d.remainingInPratyantardasha.years + d.remainingInPratyantardasha.months / 12, 1)} years left</small>`\n\t\t\t\t\t\t\t: nothing\n\t\t\t\t\t}</div>`\n\t\t\t\t\t: nothing\n\t\t\t}</div>`;\n\t}\n\n\tprivate collectPeriods(d: DashaData): DashaPeriod[] {\n\t\tif ('mahadashas' in d && d.mahadashas?.length) return d.mahadashas;\n\t\tif ('antardashas' in d && d.antardashas?.length) return d.antardashas;\n\t\treturn [];\n\t}\n\n\t/** True when the current wall-clock time falls between the period's start and end. */\n\tprivate isCurrent(p: DashaPeriod): boolean {\n\t\tif (!p.startDate || !p.endDate) return false;\n\t\tconst now = Date.now();\n\t\tconst start = Date.parse(p.startDate);\n\t\tconst end = Date.parse(p.endDate);\n\t\tif (Number.isNaN(start) || Number.isNaN(end)) return false;\n\t\treturn now >= start && now < end;\n\t}\n\n\t/**\n\t * Fractional progress (0..1) through a period at the current time. Used to\n\t * draw a vertical \"now\" marker inside the active bar. Returns -1 outside the\n\t * period so the caller can skip the marker.\n\t */\n\tprivate progressIn(p: DashaPeriod): number {\n\t\tif (!p.startDate || !p.endDate) return -1;\n\t\tconst start = Date.parse(p.startDate);\n\t\tconst end = Date.parse(p.endDate);\n\t\tconst now = Date.now();\n\t\tif (\n\t\t\tNumber.isNaN(start) ||\n\t\t\tNumber.isNaN(end) ||\n\t\t\tnow < start ||\n\t\t\tnow >= end ||\n\t\t\tend <= start\n\t\t) {\n\t\t\treturn -1;\n\t\t}\n\t\treturn (now - start) / (end - start);\n\t}\n\n\tprivate renderBar(p: DashaPeriod, max: number) {\n\t\tconst years = p.durationYears;\n\t\tconst width = max > 0 ? (years / max) * 100 : 0;\n\t\tconst current = this.isCurrent(p);\n\t\tconst progress = current ? this.progressIn(p) : -1;\n\t\tconst trackClass = current ? 'bar-track bar-now' : 'bar-track';\n\t\treturn html`<div class=\"${current ? 'bar now' : 'bar'}\" role=\"listitem\" aria-current=\"${current ? 'time' : 'false'}\"><span><strong>${p.planet}</strong>${current ? html`<span class=\"now-badge\">Now</span>` : nothing} </span><span class=\"${trackClass}\"><span class=\"bar-fill\" style=\"width:${width}%\"></span> ${\n\t\t\t\t\tprogress >= 0\n\t\t\t\t\t\t? html`<span class=\"bar-progress\" style=\"left:${progress * width}%\" aria-hidden=\"true\"></span>`\n\t\t\t\t\t\t: nothing\n\t\t\t\t} </span><span class=\"dates\">${p.startDate ? formatYear(p.startDate) : ''} ${p.endDate ? html`- ${formatYear(p.endDate)}` : ''}</span></div>`;\n\t}\n}\n\nfunction formatYear(s: string): string {\n\tconst m = s.match(/^(\\d{4})/);\n\treturn m ? m[1] : s;\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'roxy-dasha-timeline': RoxyDashaTimeline;\n\t}\n}\n", "import { css } from 'lit';\n\n/**\n * Shared host styles every component pulls in. Sets default font, color,\n * container query support, and the entry fade-in.\n */\nexport const baseStyles = css`:host{font-family:var(--roxy-font-sans,system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif);color:var(--roxy-fg,#0a0a0a);font-size:var(--roxy-text-base,1rem);line-height:var(--roxy-leading-normal,1.5);animation:roxy-fade-in var(--roxy-motion-duration,.2s) var(--roxy-motion-easing,cubic-bezier(.4, 0, .2, 1)) both;background:0 0;display:block;container-type:inline-size}*,:before,:after{box-sizing:border-box}@keyframes roxy-fade-in{0%{opacity:0;transform:translateY(2px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){:host{animation:none}}.roxy-skeleton{background:linear-gradient(90deg, var(--roxy-border,#e4e4e7) 0%, color-mix(in srgb, var(--roxy-border,#e4e4e7) 60%, transparent) 50%, var(--roxy-border,#e4e4e7) 100%);border-radius:var(--roxy-radius-md,8px);background-size:200% 100%;animation:1.4s ease-in-out infinite roxy-shimmer}@keyframes roxy-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@media (prefers-reduced-motion:reduce){.roxy-skeleton{animation:none}}.roxy-empty{padding:var(--roxy-space-lg,1.5rem);color:var(--roxy-muted,#71717a);text-align:center;font-size:var(--roxy-text-sm,.875rem)}:host(:focus-within) .roxy-card{outline:2px solid var(--roxy-ring,#f59e0b66);outline-offset:2px}:host{font-variant-emoji:text}`;\n", "/**\n * Display formatters for ISO timestamps and floats coming back from the API.\n * Every helper returns \"\" for nullish or unparseable input so it falls out of\n * template literals cleanly.\n */\n\nexport function formatTime(input: unknown): string {\n\tif (typeof input !== 'string' || input.length === 0) return '';\n\tif (/^\\d{4}-\\d{2}-\\d{2}$/.test(input)) return '';\n\tconst bareTime = /^\\d{2}:\\d{2}(:\\d{2})?$/.test(input);\n\tconst iso = bareTime ? `1970-01-01T${input}` : input;\n\tconst d = new Date(iso);\n\tif (Number.isNaN(d.getTime())) return input;\n\treturn d.toLocaleTimeString(undefined, {\n\t\thour: 'numeric',\n\t\tminute: '2-digit',\n\t\thour12: true,\n\t});\n}\n\nexport function formatDate(input: unknown): string {\n\tif (typeof input !== 'string' || input.length === 0) return '';\n\tconst d = new Date(\n\t\t/^\\d{4}-\\d{2}-\\d{2}$/.test(input) ? `${input}T00:00:00` : input,\n\t);\n\tif (Number.isNaN(d.getTime())) return input;\n\treturn d.toLocaleDateString(undefined, {\n\t\tmonth: 'short',\n\t\tday: 'numeric',\n\t\tyear: 'numeric',\n\t});\n}\n\nexport function formatTimeRange(\n\tt: { start?: string; end?: string } | undefined,\n): string {\n\tif (!t) return '';\n\tconst start = formatTime(t.start);\n\tconst end = formatTime(t.end);\n\tif (start && end) return `${start} - ${end}`;\n\treturn start || end || '';\n}\n\nexport function formatNumber(value: unknown, dp = 1): string {\n\tif (typeof value !== 'number' || !Number.isFinite(value)) return '';\n\treturn value.toFixed(dp).replace(/\\.?0+$/, '');\n}\n\nexport function formatPercent(value: unknown, dp = 1): string {\n\tconst n = formatNumber(value, dp);\n\treturn n ? `${n}%` : '';\n}\n\n/**\n * CSS class name per aspect type. Used by natal and synastry chart aspect\n * lines so the same color encoding (harmonious vs challenging) applies in\n * both wheels. Keys are lowercase canonical names, values are CSS class\n * suffixes the chart components define in their `:host` styles.\n */\nexport const ASPECT_CLASS: Record<string, string> = {\n\tconjunction: 'aspect-conjunction',\n\tsextile: 'aspect-sextile',\n\tsquare: 'aspect-square',\n\ttrine: 'aspect-trine',\n\topposition: 'aspect-opposition',\n};\n\n/**\n * Normalize the `type` field on an aspect entry to a lowercase, hyphen-separated\n * canonical name (`SEMI_SEXTILE` \u2192 `semi-sextile`). Accepts any aspect-shaped\n * object so both natal and synastry inter-aspect entries can share this.\n */\nexport function normalizeAspect(a: { type?: string }): string {\n\treturn (a.type ?? '').toLowerCase().replace(/_/g, '-');\n}\n", "import type { ReactiveController, ReactiveControllerHost } from 'lit';\n\n/**\n * Marker class on the inline JSON script a server emits inside a component.\n *\n * @example\n * ```html\n * <roxy-natal-chart>\n *   <script type=\"application/json\" class=\"roxy-data\">{ ...response... }</script>\n * </roxy-natal-chart>\n * ```\n */\nconst ROXY_DATA_CLASS = 'roxy-data';\n\n/**\n * True when the element is a `<script type=\"application/json\">`. Uses tag name and attribute rather than `instanceof HTMLScriptElement` so the check holds in every DOM implementation, including server-rendered and hydration runtimes where the constructor global may be absent.\n */\nfunction isJsonScript(el: Element): boolean {\n\treturn (\n\t\tel.nodeName === 'SCRIPT' && el.getAttribute('type') === 'application/json'\n\t);\n}\n\n/**\n * Host shape the controller drives: any reactive element that exposes a public `data` slot. The controller only writes `data` when the host left it unset, so the JavaScript property path always wins.\n */\ninterface DataHost extends ReactiveControllerHost, HTMLElement {\n\tdata?: unknown;\n}\n\n/**\n * Reactive controller that lets a component hydrate its `data` from embedded markup when no `data` property was assigned in JavaScript.\n *\n * @remarks\n * The server-side and cached-render model: a backend renders the RoxyAPI response into a direct-child `<script type=\"application/json\" class=\"roxy-data\">` element, ships static HTML, and never runs per-element JavaScript to assign a property. On connect this controller reads that script, parses it, and feeds the result to the host. The JavaScript property path is untouched and authoritative: if `host.data` already holds a value when the host connects, the controller does nothing and the markup is ignored.\n *\n * Source resolution order on connect, first hit wins:\n *\n * 1. `host.data` already set in JavaScript -> leave it, read nothing.\n * 2. A direct-child `<script type=\"application/json\" class=\"roxy-data\">` -> parse and use. Direct-child only, so a nested component's own script is never read by an ancestor.\n *\n * Fetching from a URL is intentionally unsupported: that would require a browser-visible key and breaks the server-rendered, cached model these consumers rely on.\n *\n * Timing: {@link hostConnected} runs inside the host `connectedCallback`. For an element parsed from server HTML, its direct children are present by the time the custom element upgrades and connects, so the script is readable here. For an element created with `document.createElement` and connected before any child is appended, there is nothing to read and the property path is the only source, which is exactly the existing behavior.\n *\n * Failure is safe: malformed JSON or a missing script leaves `host.data` untouched, so the host renders its normal empty state.\n *\n * Reading the script never mutates it, and only the marked script is touched, so any sibling fallback markup a server nested inside the element (for no-JavaScript, AMP, or crawler rendering) is left in place.\n *\n * @example\n * ```ts\n * import { MarkupDataController } from '../utils/markup-data.js';\n *\n * export class RoxyExample extends LitElement {\n *   constructor() {\n *     super();\n *     new MarkupDataController(this);\n *   }\n *\n *   @property({ attribute: false })\n *   data: ExampleResponse | null = null;\n * }\n * ```\n */\nexport class MarkupDataController<T = unknown> implements ReactiveController {\n\tprivate readonly host: DataHost;\n\n\tconstructor(host: DataHost) {\n\t\tthis.host = host;\n\t\thost.addController(this);\n\t}\n\n\thostConnected() {\n\t\t// Property path wins. If the consumer (React, vanilla `.data =`, the\n\t\t// widgets script, an MCP agent) already set data, never look at markup.\n\t\tif (this.host.data != null) return;\n\n\t\tconst parsed = this.read();\n\t\tif (parsed === undefined) return;\n\n\t\tthis.host.data = parsed as T;\n\t\tthis.host.requestUpdate();\n\t}\n\n\t/**\n\t * Resolve the embedded payload. Returns `undefined` when there is nothing valid to read so the caller can leave `host.data` untouched.\n\t */\n\tprivate read(): T | undefined {\n\t\tconst inline = this.findInlineScript();\n\t\treturn inline ? this.parse(inline.textContent) : undefined;\n\t}\n\n\t/**\n\t * Direct-child `<script type=\"application/json\" class=\"roxy-data\">`. Scoped to immediate children so a nested data-driven component never has its script read by an ancestor, and so sibling fallback markup is ignored.\n\t */\n\tprivate findInlineScript(): Element | null {\n\t\tfor (const child of Array.from(this.host.children)) {\n\t\t\tif (isJsonScript(child) && child.classList.contains(ROXY_DATA_CLASS)) {\n\t\t\t\treturn child;\n\t\t\t}\n\t\t}\n\t\treturn null;\n\t}\n\n\tprivate parse(text: string | null): T | undefined {\n\t\tif (!text?.trim()) return undefined;\n\t\ttry {\n\t\t\treturn JSON.parse(text) as T;\n\t\t} catch {\n\t\t\t// Malformed embedded JSON: fail safe, leave the host empty state in\n\t\t\t// place rather than throwing during connect.\n\t\t\treturn undefined;\n\t\t}\n\t}\n}\n"],
-  "mappings": "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",
-  "names": ["css", "html", "LitElement", "nothing", "customElement", "property", "css", "baseStyles", "formatNumber", "value", "dp", "ROXY_DATA_CLASS", "isJsonScript", "el", "MarkupDataController", "host", "parsed", "inline", "child", "text", "RoxyDashaTimeline", "LitElement", "MarkupDataController", "d", "html", "periods", "maxYears", "p", "nothing", "b", "lord", "yrs", "mo", "da", "parts", "remaining", "active", "formatNumber", "now", "start", "end", "max", "years", "width", "current", "progress", "trackClass", "formatYear", "baseStyles", "css", "__decorateClass", "property", "customElement", "s", "m"]
+  "sources": ["../../src/components/dasha-timeline.ts", "../../src/utils/base-element.ts", "../../src/utils/base-styles.ts", "../../src/utils/fetch-controller.ts", "../../src/utils/markup-data.ts", "../../src/utils/format.ts"],
+  "sourcesContent": ["import { css, html, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport type {\n\tGetCurrentDashaResponse,\n\tGetMajorDashasResponse,\n\tGetSubDashasResponse,\n} from '../types/index.js';\nimport { RoxyDataElement } from '../utils/base-element.js';\nimport { baseStyles } from '../utils/base-styles.js';\nimport { formatNumber } from '../utils/format.js';\n\ntype DashaData =\n\t| GetCurrentDashaResponse\n\t| GetMajorDashasResponse\n\t| GetSubDashasResponse;\n\ntype DashaPeriod = GetMajorDashasResponse['mahadashas'][number];\n\n/**\n * Dasha timeline. Renders /vedic-astrology/dasha/{current,major,sub/{...}}.\n * Default mode shows the active mahadasha + antardasha + pratyantardasha.\n * Switch to period=\"major\" for the full 120-year Vimshottari timeline.\n */\n@customElement('roxy-dasha-timeline')\nexport class RoxyDashaTimeline extends RoxyDataElement<DashaData> {\n\tstatic styles = [\n\t\tbaseStyles,\n\t\tcss`.wrap{gap:var(--roxy-space-md,1rem);display:grid}.head{justify-content:space-between;align-items:center;gap:var(--roxy-space-sm,.5rem);flex-wrap:wrap;display:flex}.title{font-size:var(--roxy-text-lg,1.125rem);font-weight:var(--roxy-weight-bold,600);margin:0}.nakshatra{color:var(--roxy-muted,#71717a);font-size:var(--roxy-text-sm,.875rem)}.current{gap:var(--roxy-space-md,1rem);background:var(--roxy-surface,#fff);border:1px solid var(--roxy-border,#e4e4e7);border-radius:var(--roxy-radius-md,8px);padding:var(--roxy-space-md,1rem);box-shadow:var(--roxy-shadow-sm);grid-template-columns:repeat(auto-fit,minmax(10rem,1fr));display:grid}.current div span:first-child{color:var(--roxy-muted,#71717a);font-size:var(--roxy-text-xs,.75rem);text-transform:uppercase;letter-spacing:.06em;display:block}.current div strong{font-size:var(--roxy-text-base,1rem);color:var(--roxy-fg,#0a0a0a)}.balance{font-size:var(--roxy-text-sm,.875rem);color:var(--roxy-muted,#71717a);border-left:2px solid var(--roxy-border,#e4e4e7);padding-left:var(--roxy-space-sm,.5rem);margin:0}.timeline{gap:var(--roxy-space-xs,.25rem);display:grid}.bar{gap:var(--roxy-space-sm,.5rem);font-size:var(--roxy-text-sm,.875rem);grid-template-columns:5rem 1fr 8rem;align-items:center;display:grid}.bar.now strong{color:var(--roxy-accent-ink,#b45309)}.now-badge{font-size:var(--roxy-text-xs,.75rem);font-weight:var(--roxy-weight-bold,600);color:var(--roxy-accent-ink,#b45309);text-transform:uppercase;letter-spacing:.06em;margin-left:.4em;display:inline-block}.bar-track{background:var(--roxy-border,#e4e4e7);border-radius:var(--roxy-radius-full,9999px);height:14px;position:relative;overflow:hidden}.bar-fill{background:var(--roxy-accent,#f59e0b);opacity:.45;height:100%;transition:width var(--roxy-motion-duration,.2s) var(--roxy-motion-easing,cubic-bezier(.4, 0, .2, 1));display:block}.bar-now .bar-fill{opacity:1}.bar-progress{background:var(--roxy-accent-ink,#b45309);width:2px;box-shadow:0 0 0 2px color-mix(in srgb, var(--roxy-accent,#f59e0b) 35%, transparent);border-radius:2px;position:absolute;top:-2px;bottom:-2px}.dates{color:var(--roxy-muted,#71717a);font-size:var(--roxy-text-xs,.75rem);font-variant-numeric:tabular-nums;text-align:right}.interp{border:1px solid var(--roxy-border,#e4e4e7);border-radius:var(--roxy-radius-md,8px);padding:var(--roxy-space-sm,.5rem) var(--roxy-space-md,1rem);background:var(--roxy-surface,#fff)}.interp h3{font-size:var(--roxy-text-sm,.875rem);font-weight:var(--roxy-weight-bold,600);margin:0}.interp p{margin:var(--roxy-space-sm,.5rem) 0 0;font-size:var(--roxy-text-sm,.875rem);color:var(--roxy-muted,#71717a)}`,\n\t];\n\n\t@property({ type: String, reflect: true })\n\tperiod: 'current' | 'major' | 'sub' = 'current';\n\n\tprotected renderEmpty() {\n\t\treturn html`<div class=\"roxy-empty\" role=\"status\">No dasha data</div>`;\n\t}\n\n\tprotected renderData(d: DashaData) {\n\t\tconst periods = this.collectPeriods(d);\n\t\tconst maxYears = periods.length\n\t\t\t? Math.max(...periods.map((p) => p.durationYears))\n\t\t\t: 0;\n\n\t\treturn html`<div class=\"wrap\" aria-label=\"Dasha timeline\"><header class=\"head\"><h2 class=\"title\">${\n\t\t\t\t\t\tthis.period === 'major'\n\t\t\t\t\t\t\t? 'Vimshottari Mahadasha'\n\t\t\t\t\t\t\t: this.period === 'sub'\n\t\t\t\t\t\t\t\t? 'Antardasha'\n\t\t\t\t\t\t\t\t: 'Active dashas'\n\t\t\t\t\t}</h2>${\n\t\t\t\t\t'nakshatraName' in d && d.nakshatraName\n\t\t\t\t\t\t? html`<div class=\"nakshatra\">Moon nakshatra: ${d.nakshatraName} ${'nakshatraLord' in d && d.nakshatraLord ? html`(lord ${d.nakshatraLord})` : nothing}</div>`\n\t\t\t\t\t\t: nothing\n\t\t\t\t}</header>${this.renderBirthBalance(d)} ${this.period === 'current' ? this.renderCurrent(d) : nothing} ${\n\t\t\t\tperiods.length > 0\n\t\t\t\t\t? html`<div class=\"timeline\" role=\"list\">${periods.map((p) => this.renderBar(p, maxYears))}</div>`\n\t\t\t\t\t: nothing\n\t\t\t} ${this.renderActiveInterpretation(periods)}</div>`;\n\t}\n\n\tprivate renderBirthBalance(d: DashaData) {\n\t\tif (!('birthDashaBalance' in d) || !d.birthDashaBalance) return nothing;\n\t\tconst b = d.birthDashaBalance;\n\t\tconst lord = 'nakshatraLord' in d && d.nakshatraLord ? d.nakshatraLord : '';\n\t\tconst yrs = b.years ?? 0;\n\t\tconst mo = b.months ?? 0;\n\t\tconst da = b.days ?? 0;\n\t\tconst parts: string[] = [];\n\t\tif (yrs) parts.push(`${yrs}y`);\n\t\tif (mo) parts.push(`${mo}m`);\n\t\tif (da) parts.push(`${da}d`);\n\t\tconst remaining = parts.length ? parts.join(' ') : '0d';\n\t\treturn html`<p class=\"balance\">Birth dasha balance: ${remaining} of ${lord ? html`<strong>${lord}</strong>` : 'the opening mahadasha'} remained at birth.</p>`;\n\t}\n\n\tprivate renderActiveInterpretation(periods: DashaPeriod[]) {\n\t\tconst active = periods.find((p) => this.isCurrent(p));\n\t\tif (!active?.interpretation) return nothing;\n\t\treturn html`<div class=\"interp\"><h3>${active.planet} mahadasha</h3><p>${active.interpretation}</p></div>`;\n\t}\n\n\tprivate renderCurrent(d: DashaData) {\n\t\tif (!('mahadasha' in d)) return nothing;\n\t\treturn html`<div class=\"current\">${\n\t\t\t\t'mahadasha' in d && d.mahadasha\n\t\t\t\t\t? html`<div><span>Mahadasha</span> <strong>${d.mahadasha.planet}</strong> ${\n\t\t\t\t\t\t'remainingInMahadasha' in d && d.remainingInMahadasha\n\t\t\t\t\t\t\t? html`<small>${formatNumber(d.remainingInMahadasha.years + d.remainingInMahadasha.months / 12, 1)} years left</small>`\n\t\t\t\t\t\t\t: nothing\n\t\t\t\t\t}</div>`\n\t\t\t\t\t: nothing\n\t\t\t} ${\n\t\t\t\t'antardasha' in d && d.antardasha\n\t\t\t\t\t? html`<div><span>Antardasha</span> <strong>${d.antardasha.planet}</strong> ${\n\t\t\t\t\t\t'remainingInAntardasha' in d && d.remainingInAntardasha\n\t\t\t\t\t\t\t? html`<small>${formatNumber(d.remainingInAntardasha.years + d.remainingInAntardasha.months / 12, 1)} years left</small>`\n\t\t\t\t\t\t\t: nothing\n\t\t\t\t\t}</div>`\n\t\t\t\t\t: nothing\n\t\t\t} ${\n\t\t\t\t'pratyantardasha' in d && d.pratyantardasha\n\t\t\t\t\t? html`<div><span>Pratyantardasha</span> <strong>${d.pratyantardasha.planet}</strong> ${\n\t\t\t\t\t\t'remainingInPratyantardasha' in d && d.remainingInPratyantardasha\n\t\t\t\t\t\t\t? html`<small>${formatNumber(d.remainingInPratyantardasha.years + d.remainingInPratyantardasha.months / 12, 1)} years left</small>`\n\t\t\t\t\t\t\t: nothing\n\t\t\t\t\t}</div>`\n\t\t\t\t\t: nothing\n\t\t\t}</div>`;\n\t}\n\n\tprivate collectPeriods(d: DashaData): DashaPeriod[] {\n\t\tif ('mahadashas' in d && d.mahadashas?.length) return d.mahadashas;\n\t\tif ('antardashas' in d && d.antardashas?.length) return d.antardashas;\n\t\treturn [];\n\t}\n\n\t/** True when the current wall-clock time falls between the period's start and end. */\n\tprivate isCurrent(p: DashaPeriod): boolean {\n\t\tif (!p.startDate || !p.endDate) return false;\n\t\tconst now = Date.now();\n\t\tconst start = Date.parse(p.startDate);\n\t\tconst end = Date.parse(p.endDate);\n\t\tif (Number.isNaN(start) || Number.isNaN(end)) return false;\n\t\treturn now >= start && now < end;\n\t}\n\n\t/**\n\t * Fractional progress (0..1) through a period at the current time. Used to\n\t * draw a vertical \"now\" marker inside the active bar. Returns -1 outside the\n\t * period so the caller can skip the marker.\n\t */\n\tprivate progressIn(p: DashaPeriod): number {\n\t\tif (!p.startDate || !p.endDate) return -1;\n\t\tconst start = Date.parse(p.startDate);\n\t\tconst end = Date.parse(p.endDate);\n\t\tconst now = Date.now();\n\t\tif (\n\t\t\tNumber.isNaN(start) ||\n\t\t\tNumber.isNaN(end) ||\n\t\t\tnow < start ||\n\t\t\tnow >= end ||\n\t\t\tend <= start\n\t\t) {\n\t\t\treturn -1;\n\t\t}\n\t\treturn (now - start) / (end - start);\n\t}\n\n\tprivate renderBar(p: DashaPeriod, max: number) {\n\t\tconst years = p.durationYears;\n\t\tconst width = max > 0 ? (years / max) * 100 : 0;\n\t\tconst current = this.isCurrent(p);\n\t\tconst progress = current ? this.progressIn(p) : -1;\n\t\tconst trackClass = current ? 'bar-track bar-now' : 'bar-track';\n\t\treturn html`<div class=\"${current ? 'bar now' : 'bar'}\" role=\"listitem\" aria-current=\"${current ? 'time' : 'false'}\"><span><strong>${p.planet}</strong>${current ? html`<span class=\"now-badge\">Now</span>` : nothing} </span><span class=\"${trackClass}\"><span class=\"bar-fill\" style=\"width:${width}%\"></span> ${\n\t\t\t\t\tprogress >= 0\n\t\t\t\t\t\t? html`<span class=\"bar-progress\" style=\"left:${progress * width}%\" aria-hidden=\"true\"></span>`\n\t\t\t\t\t\t: nothing\n\t\t\t\t} </span><span class=\"dates\">${p.startDate ? formatYear(p.startDate) : ''} ${p.endDate ? html`- ${formatYear(p.endDate)}` : ''}</span></div>`;\n\t}\n}\n\nfunction formatYear(s: string): string {\n\tconst m = s.match(/^(\\d{4})/);\n\treturn m ? m[1] : s;\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'roxy-dasha-timeline': RoxyDashaTimeline;\n\t}\n}\n", "import {\n\ttype CSSResultGroup,\n\thtml,\n\tLitElement,\n\ttype PropertyValues,\n} from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { baseStyles } from './base-styles.js';\nimport { buildRequest, FetchController } from './fetch-controller.js';\nimport { MarkupDataController } from './markup-data.js';\n\n/**\n * Shared base for every data-driven Roxy component. Consolidates the things every component used to repeat by hand and adds the self-contained, drop-in behavior: controlled-mode hydration, an opt-in self-fetch (form, request, loading, error, empty), the typed `data` slot, and the render switch. A subclass implements one method, {@link RoxyDataElement.renderData}.\n *\n * @remarks\n * Two render modes, one component, which is the whole drop-in contract:\n *\n * - Controlled: a server (WordPress, JSX SSR, static HTML) fetches the response and injects it as a direct-child `<script type=\"application/json\" class=\"roxy-data\">`. {@link MarkupDataController} hydrates `data` from it on connect. No key reaches the browser. This is the path the WordPress plugin drives, and it is unchanged by the base class.\n * - Uncontrolled: no data is injected, but a `data-endpoint` and a `pk_` `publishable-key` are set. The component renders its own `<roxy-endpoint-form>` (an internal detail, never placed by the consumer), and on submit fetches through {@link FetchController}, which refuses any non-publishable key. The result populates `data` and the component renders it.\n *\n * The JavaScript `data` property always wins over markup, so a host that assigns `el.data = \u2026` after upgrade is authoritative.\n *\n * Self-fetch needs `<roxy-endpoint-form>` (and `<roxy-location-search>`) registered. The CDN bundle and the full `@roxyapi/ui` entry register everything; per-component ESM consumers that want self-fetch import the form component too.\n *\n * @example\n * ```ts\n * @customElement('roxy-dream-card')\n * export class RoxyDreamCard extends RoxyDataElement<GetDreamSymbolResponse> {\n *   static styles = [baseStyles, css`.card { \u2026 }`];\n *   protected renderData(d: GetDreamSymbolResponse) {\n *     return html`<article class=\"card\">\u2026</article>`;\n *   }\n *   protected renderEmpty() {\n *     return html`<div class=\"roxy-empty\" role=\"status\">No dream symbol</div>`;\n *   }\n * }\n * ```\n */\nexport abstract class RoxyDataElement<T = unknown> extends LitElement {\n\tstatic styles: CSSResultGroup = [baseStyles];\n\n\t/** Typed RoxyAPI response. Assigned in JavaScript, hydrated from the roxy-data island, or set by a self-fetch. */\n\t@property({ attribute: false })\n\tdata: T | null = null;\n\n\t/** Endpoint path for self-fetch, e.g. \"astrology/natal-chart\" or \"dreams/symbols/{id}\". Empty disables self-fetch (controlled mode only). */\n\t@property({ type: String, attribute: 'data-endpoint' })\n\tendpoint = '';\n\n\t/** HTTP method for self-fetch. */\n\t@property({ type: String })\n\tmethod: 'GET' | 'POST' = 'POST';\n\n\t/** Browser-safe publishable key (pk_) for self-fetch. A secret key is refused client-side. */\n\t@property({ type: String, attribute: 'publishable-key' })\n\tpublishableKey?: string;\n\n\t/** Override the API origin for self-hosted or proxied deployments. */\n\t@property({ type: String, attribute: 'base-url' })\n\tbaseUrl?: string;\n\n\t/** Override the OpenAPI spec URL the self-fetch form introspects. */\n\t@property({ type: String, attribute: 'spec-url' })\n\tspecUrl?: string;\n\n\t/** Consumer backend route that proxies the request (holds the secret key). When set, self-fetch POSTs the request here instead of calling RoxyAPI directly, so no key reaches the browser. The server-rendered (WordPress) path. */\n\t@property({ type: String, attribute: 'submit-url' })\n\tsubmitUrl?: string;\n\n\t/** Persist the last self-fetch form values in sessionStorage (keyed by endpoint) and prefill the form on reload. */\n\t@property({ type: Boolean })\n\tremember = false;\n\n\t/** True while an uncontrolled self-fetch is in flight. Public so {@link FetchController} can drive it. */\n\t@state()\n\tloading = false;\n\n\t/** Message from a failed self-fetch, or null. Public so {@link FetchController} can drive it. */\n\t@state()\n\terror: string | null = null;\n\n\tprivate fetcher: FetchController<T>;\n\n\tconstructor() {\n\t\tsuper();\n\t\t// Controlled mode: hydrate `data` from a direct-child roxy-data island when\n\t\t// no JS property was assigned. Keyless; the server already fetched.\n\t\tnew MarkupDataController<T>(this);\n\t\tthis.fetcher = new FetchController<T>(this);\n\t}\n\n\tprotected willUpdate(changed: PropertyValues): void {\n\t\tif (changed.has('publishableKey')) {\n\t\t\tthis.fetcher.publishableKey = this.publishableKey;\n\t\t}\n\t\tif (changed.has('baseUrl') && this.baseUrl) {\n\t\t\tthis.fetcher.baseUrl = this.baseUrl;\n\t\t}\n\t\tif (changed.has('submitUrl')) {\n\t\t\tthis.fetcher.submitUrl = this.submitUrl;\n\t\t}\n\t}\n\n\trender(): unknown {\n\t\tif (this.loading) return this.renderLoading();\n\t\tif (this.error != null) return this.renderError(this.error);\n\t\tif (this.data != null) return this.renderData(this.data);\n\t\treturn this.renderNoData();\n\t}\n\n\t/** Render the populated response. The single method every component implements. */\n\tprotected abstract renderData(data: T): unknown;\n\n\t/** The data-absent branch: the self-fetch form when an endpoint is set, otherwise the empty state. */\n\tprotected renderNoData(): unknown {\n\t\treturn this.endpoint ? this.renderForm() : this.renderEmpty();\n\t}\n\n\t/** Internal self-fetch form. Reuses the introspecting `<roxy-endpoint-form>`; the consumer never places it. */\n\tprotected renderForm(): unknown {\n\t\treturn html`<roxy-endpoint-form data-endpoint=\"${this.endpoint}\" method=\"${this.method}\" spec-url=\"${ifDefined(this.specUrl)}\" .initialValues=\"${this.remember ? this.readRemembered() : undefined}\" @roxy-submit=\"${this.onFormSubmit}\"></roxy-endpoint-form>`;\n\t}\n\n\tprivate onFormSubmit = (e: Event) => {\n\t\tconst detail = (e as CustomEvent).detail as {\n\t\t\tvalues: Record<string, unknown>;\n\t\t};\n\t\tif (this.remember) this.writeRemembered(detail.values);\n\t\tvoid this.fetcher.run(\n\t\t\tbuildRequest(this.endpoint, this.method, detail.values),\n\t\t);\n\t};\n\n\t/** sessionStorage key for this component's remembered form values, scoped by endpoint. */\n\tprivate rememberKey(): string {\n\t\treturn `roxy-ui:form:${this.endpoint}`;\n\t}\n\n\tprivate readRemembered(): Record<string, unknown> | undefined {\n\t\ttry {\n\t\t\tconst raw = sessionStorage.getItem(this.rememberKey());\n\t\t\treturn raw ? (JSON.parse(raw) as Record<string, unknown>) : undefined;\n\t\t} catch {\n\t\t\treturn undefined;\n\t\t}\n\t}\n\n\tprivate writeRemembered(values: Record<string, unknown>): void {\n\t\ttry {\n\t\t\tsessionStorage.setItem(this.rememberKey(), JSON.stringify(values));\n\t\t} catch {\n\t\t\t// Private mode / disabled storage: remembering is best-effort, never fatal.\n\t\t}\n\t}\n\n\t/** Terminal empty state. Subclasses override for a domain-specific message. */\n\tprotected renderEmpty(): unknown {\n\t\treturn html`<div class=\"roxy-empty\" role=\"status\">No data</div>`;\n\t}\n\n\t/** Loading placeholder shown during a self-fetch. */\n\tprotected renderLoading(): unknown {\n\t\treturn html`<div class=\"roxy-skeleton\" style=\"height:8rem\" role=\"status\" aria-label=\"Loading\"></div>`;\n\t}\n\n\t/** Error state shown when a self-fetch fails. Keeps the form in view so the request can be retried. */\n\tprotected renderError(message: string): unknown {\n\t\tconst banner = html`<div class=\"roxy-error\" role=\"alert\">${message}</div>`;\n\t\treturn this.endpoint ? html`${banner}${this.renderForm()}` : banner;\n\t}\n}\n", "import { css } from 'lit';\n\n/**\n * Shared host styles every component pulls in. Sets default font, color,\n * container query support, and the entry fade-in.\n */\nexport const baseStyles = css`:host{font-family:var(--roxy-font-sans,system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif);color:var(--roxy-fg,#0a0a0a);font-size:var(--roxy-text-base,1rem);line-height:var(--roxy-leading-normal,1.5);animation:roxy-fade-in var(--roxy-motion-duration,.2s) var(--roxy-motion-easing,cubic-bezier(.4, 0, .2, 1)) both;background:0 0;display:block;container-type:inline-size}:host([bare]){--roxy-surface:transparent;--roxy-shadow-sm:none;--roxy-shadow-md:none}*,:before,:after{box-sizing:border-box}@keyframes roxy-fade-in{0%{opacity:0;transform:translateY(2px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){:host{animation:none}}.roxy-skeleton{background:linear-gradient(90deg, var(--roxy-border,#e4e4e7) 0%, color-mix(in srgb, var(--roxy-border,#e4e4e7) 60%, transparent) 50%, var(--roxy-border,#e4e4e7) 100%);border-radius:var(--roxy-radius-md,8px);background-size:200% 100%;animation:1.4s ease-in-out infinite roxy-shimmer}@keyframes roxy-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@media (prefers-reduced-motion:reduce){.roxy-skeleton{animation:none}}.roxy-empty{padding:var(--roxy-space-lg,1.5rem);color:var(--roxy-muted,#71717a);text-align:center;font-size:var(--roxy-text-sm,.875rem)}.roxy-error{gap:var(--roxy-space-sm,.5rem);padding:var(--roxy-space-lg,1.5rem);background:var(--roxy-surface,#fff);border:1px solid var(--roxy-danger,#dc2626);border-radius:var(--roxy-radius-md,8px);color:var(--roxy-danger-fg,#991b1b);font-size:var(--roxy-text-sm,.875rem);justify-items:start;display:grid}.roxy-surface{background:var(--roxy-surface,#fff);color:var(--roxy-fg,#0a0a0a)}:host(:focus-within) .roxy-card{outline:2px solid var(--roxy-ring,#f59e0b66);outline-offset:2px}:host{font-variant-emoji:text}`;\n", "import type { ReactiveController, ReactiveControllerHost } from 'lit';\n\n/**\n * Host slots the controller drives. {@link RoxyDataElement} satisfies this, so\n * the form mixin can attach a controller without the component wiring state by hand.\n */\ninterface FetchHost<T> extends ReactiveControllerHost {\n\tdata: T | null;\n\tloading: boolean;\n\terror: string | null;\n}\n\n/** Default RoxyAPI v2 origin. A component overrides it per instance via its `base-url` attribute. */\nconst DEFAULT_BASE_URL = 'https://roxyapi.com/api/v2';\n\n/** A single request the controller issues on the component's behalf. */\nexport interface RoxyRequest {\n\t/** Path under the API base, e.g. \"/dreams/symbols/water\" or \"/astrology/natal-chart\". */\n\tpath: string;\n\tmethod?: 'GET' | 'POST';\n\t/** JSON body for POST endpoints. */\n\tbody?: unknown;\n\t/** Query string parameters; nullish values are dropped. */\n\tquery?: Record<string, string | number | undefined>;\n}\n\n/**\n * Client-side fetch for uncontrolled (self-fetching) components: drives `host.data` / `host.loading` / `host.error` and cancels a stale request when a newer one starts or the host disconnects.\n *\n * @remarks\n * Security boundary. The only credential this ever sends is a `pk_` publishable key, which carries a server-side origin allowlist. A secret (`sk_`) or legacy unprefixed key is refused before any network call and surfaced as an error, so a server secret cannot leak into a browser request. This centralizes the guard that originated in `<roxy-location-search>` so every self-fetching component enforces it identically.\n *\n * Controlled-mode components never construct this. When a server injects the response as a `<script class=\"roxy-data\">` island, there is no key and no fetch, which is the path server-rendered consumers (WordPress, JSX SSR, static HTML) rely on.\n */\nexport class FetchController<T = unknown> implements ReactiveController {\n\tprivate readonly host: FetchHost<T>;\n\tprivate abort?: AbortController;\n\n\t/** Browser-safe publishable key. Set by the host from its `publishable-key` attribute. */\n\tpublishableKey?: string;\n\t/** API origin, overridable for self-hosted or proxied deployments. */\n\tbaseUrl = DEFAULT_BASE_URL;\n\t/**\n\t * Consumer backend route that holds the secret key. When set, the request is POSTed here as `{ path, method, body, query }` instead of called against RoxyAPI directly, so no key (publishable or secret) is sent from the browser. This is the canonical path for server-rendered hosts (WordPress); the backend proxies the request with its own `sk_` key and returns the JSON response.\n\t */\n\tsubmitUrl?: string;\n\n\tconstructor(host: FetchHost<T>) {\n\t\tthis.host = host;\n\t\thost.addController(this);\n\t}\n\n\thostDisconnected() {\n\t\tthis.abort?.abort();\n\t\tthis.abort = undefined;\n\t}\n\n\t/**\n\t * Issue the request and resolve once `host.data` (success) or `host.error`\n\t * (failure) is set. A no-op return when a non-publishable key is present:\n\t * the error is already surfaced and nothing is sent.\n\t */\n\tasync run(req: RoxyRequest): Promise<void> {\n\t\t// submit-url proxy: no key leaves the browser; the consumer's backend holds it.\n\t\tif (!this.submitUrl && this.secretKeyRefused()) return;\n\t\tthis.abort?.abort();\n\t\tconst controller = new AbortController();\n\t\tthis.abort = controller;\n\t\tthis.host.loading = true;\n\t\tthis.host.error = null;\n\t\ttry {\n\t\t\tconst res = this.submitUrl\n\t\t\t\t? await fetch(this.submitUrl, {\n\t\t\t\t\t\tmethod: 'POST',\n\t\t\t\t\t\theaders: {\n\t\t\t\t\t\t\tAccept: 'application/json',\n\t\t\t\t\t\t\t'Content-Type': 'application/json',\n\t\t\t\t\t\t},\n\t\t\t\t\t\tbody: JSON.stringify(req),\n\t\t\t\t\t\tsignal: controller.signal,\n\t\t\t\t\t})\n\t\t\t\t: await this.callApi(req, controller.signal);\n\t\t\tif (!res.ok) throw new Error(await this.readError(res));\n\t\t\tconst json = (await res.json()) as T;\n\t\t\tif (controller.signal.aborted) return;\n\t\t\tthis.host.data = json;\n\t\t} catch (err) {\n\t\t\tif ((err as { name?: string })?.name === 'AbortError') return;\n\t\t\tthis.host.error = err instanceof Error ? err.message : String(err);\n\t\t} finally {\n\t\t\tif (this.abort === controller) this.abort = undefined;\n\t\t\tif (!controller.signal.aborted) this.host.loading = false;\n\t\t}\n\t}\n\n\t/** Direct call against RoxyAPI with the publishable key (the no-backend path). */\n\tprivate callApi(req: RoxyRequest, signal: AbortSignal): Promise<Response> {\n\t\tconst url = new URL(`${this.baseUrl}${req.path}`);\n\t\tfor (const [k, v] of Object.entries(req.query ?? {})) {\n\t\t\tif (v != null) url.searchParams.set(k, String(v));\n\t\t}\n\t\tconst headers: Record<string, string> = { Accept: 'application/json' };\n\t\tif (this.publishableKey) headers['X-API-Key'] = this.publishableKey;\n\t\tif (req.body != null) headers['Content-Type'] = 'application/json';\n\t\treturn fetch(url, {\n\t\t\tmethod: req.method ?? 'GET',\n\t\t\theaders,\n\t\t\tbody: req.body != null ? JSON.stringify(req.body) : undefined,\n\t\t\tsignal,\n\t\t});\n\t}\n\n\t/** True when a key is set and it is not a browser-safe `pk_` publishable key. Surfaces the error and refuses to send. */\n\tprivate secretKeyRefused(): boolean {\n\t\tconst key = this.publishableKey;\n\t\tif (!key || key.startsWith('pk_')) return false;\n\t\tthis.host.error =\n\t\t\t'Client-side components accept a pk_ publishable key only. Use a publishable key with an origin allowlist, or render server-side.';\n\t\t(this.host as unknown as EventTarget).dispatchEvent(\n\t\t\tnew CustomEvent('roxy-validation-error', {\n\t\t\t\tdetail: { reason: 'possible-secret-key' },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}),\n\t\t);\n\t\treturn true;\n\t}\n\n\t/** Surface the `{ error, code }` message the API returns on failure, falling back to the status code. */\n\tprivate async readError(res: Response): Promise<string> {\n\t\ttry {\n\t\t\tconst body = (await res.json()) as { error?: string };\n\t\t\tif (body?.error) return body.error;\n\t\t} catch {\n\t\t\t// Non-JSON error body: fall through to the status line.\n\t\t}\n\t\treturn `Request failed (${res.status})`;\n\t}\n}\n\n/**\n * Translate flat form values into a {@link RoxyRequest} for an endpoint. The `{name}` segments in the endpoint template are substituted from the values and removed; the rest become the JSON body for POST or query parameters for GET. This is the spec-light request builder the base element uses to turn a `<roxy-endpoint-form>` submission into a self-fetch, so a component needs no per-endpoint glue.\n */\nexport function buildRequest(\n\tendpoint: string,\n\tmethod: 'GET' | 'POST',\n\tvalues: Record<string, unknown>,\n): RoxyRequest {\n\tconst rest: Record<string, unknown> = { ...values };\n\tconst path = `/${endpoint.replace(/^\\//, '')}`.replace(\n\t\t/\\{([^}]+)\\}/g,\n\t\t(_match, name: string) => {\n\t\t\tconst v = rest[name];\n\t\t\tdelete rest[name];\n\t\t\treturn encodeURIComponent(String(v ?? ''));\n\t\t},\n\t);\n\tconst query: Record<string, string | number | undefined> = {};\n\tconst body: Record<string, unknown> = {};\n\tfor (const [k, v] of Object.entries(rest)) {\n\t\tif (v === undefined || v === '') continue;\n\t\tif (method === 'GET') query[k] = v as string | number;\n\t\telse body[k] = v;\n\t}\n\treturn { path, method, query, body: method === 'POST' ? body : undefined };\n}\n", "import type { ReactiveController, ReactiveControllerHost } from 'lit';\n\n/**\n * Marker class on the inline JSON script a server emits inside a component.\n *\n * @example\n * ```html\n * <roxy-natal-chart>\n *   <script type=\"application/json\" class=\"roxy-data\">{ ...response... }</script>\n * </roxy-natal-chart>\n * ```\n */\nconst ROXY_DATA_CLASS = 'roxy-data';\n\n/**\n * Serialize a RoxyAPI response for embedding inside an inline `<script type=\"application/json\" class=\"roxy-data\">`. This is the safe writer counterpart to {@link MarkupDataController}, the reader: server-rendered and cached consumers (WordPress, JSX SSR, static HTML) emit the script with this, and the component hydrates `data` from it on connect.\n *\n * @remarks\n * Use this instead of a bare `JSON.stringify`. A raw stringify of a response that contains the literal text `</script>` (common in long interpretation prose) closes the script element early, corrupting the page and creating an HTML-injection vector. This escapes the script-unsafe characters to their `\\uXXXX` JSON escapes, which `JSON.parse` restores to the original characters, so the value the component receives is identical to the response you passed.\n *\n * `<` is the load-bearing escape (it defeats `</script>` and `<!--`). `>` and `&` are escaped for defence in depth, and U+2028 / U+2029 because they are valid in JSON yet are line terminators in a `<script>` context and break some parsers. The escapes introduce only `\\uXXXX` sequences, so the replacements never feed each other and order is irrelevant.\n *\n * Pass the unwrapped RoxyAPI response, the same shape you would assign to `element.data`. Do not pass the SDK envelope (`{ data, error, request, response }`).\n *\n * @example\n * ```ts\n * import { serializeRoxyData } from '@roxyapi/ui';\n *\n * const { data } = await roxy.dreams.getDreamSymbol({ path: { id: 'water' } });\n * const html = `<roxy-dream-card><script type=\"application/json\" class=\"roxy-data\">${serializeRoxyData(data)}</script></roxy-dream-card>`;\n * ```\n */\nexport function serializeRoxyData(data: unknown): string {\n\treturn JSON.stringify(data)\n\t\t.replace(/</g, '\\\\u003c')\n\t\t.replace(/>/g, '\\\\u003e')\n\t\t.replace(/&/g, '\\\\u0026')\n\t\t.replace(/\\u2028/g, '\\\\u2028')\n\t\t.replace(/\\u2029/g, '\\\\u2029');\n}\n\n/**\n * Build the complete `<script type=\"application/json\" class=\"roxy-data\">\u2026</script>` element a server nests inside a `roxy-*` component for the no-JavaScript hydration path. The payload is escaped via {@link serializeRoxyData}, so it is safe to drop straight into HTML output.\n *\n * @remarks\n * The element carries both `type=\"application/json\"` and `class=\"roxy-data\"` because {@link MarkupDataController} reads only a direct-child script that has both. Emit one of these inside the target component; the JavaScript `data` property still wins if it is later assigned.\n *\n * @example\n * ```ts\n * import { roxyDataScript } from '@roxyapi/ui';\n *\n * const { data } = await roxy.crystals.getCrystal({ path: { id: 'amethyst' } });\n * const html = `<roxy-crystal-grid>${roxyDataScript(data)}</roxy-crystal-grid>`;\n * ```\n */\nexport function roxyDataScript(data: unknown): string {\n\treturn `<script type=\"application/json\" class=\"${ROXY_DATA_CLASS}\">${serializeRoxyData(data)}</script>`;\n}\n\n/**\n * True when the element is a `<script type=\"application/json\">`. Uses tag name and attribute rather than `instanceof HTMLScriptElement` so the check holds in every DOM implementation, including server-rendered and hydration runtimes where the constructor global may be absent.\n */\nfunction isJsonScript(el: Element): boolean {\n\treturn (\n\t\tel.nodeName === 'SCRIPT' && el.getAttribute('type') === 'application/json'\n\t);\n}\n\n/**\n * Host shape the controller drives: any reactive element that exposes a public `data` slot. The controller only writes `data` when the host left it unset, so the JavaScript property path always wins.\n */\ninterface DataHost extends ReactiveControllerHost, HTMLElement {\n\tdata?: unknown;\n}\n\n/**\n * Reactive controller that lets a component hydrate its `data` from embedded markup when no `data` property was assigned in JavaScript.\n *\n * @remarks\n * The server-side and cached-render model: a backend renders the RoxyAPI response into a direct-child `<script type=\"application/json\" class=\"roxy-data\">` element, ships static HTML, and never runs per-element JavaScript to assign a property. On connect this controller reads that script, parses it, and feeds the result to the host. The JavaScript property path is untouched and authoritative: if `host.data` already holds a value when the host connects, the controller does nothing and the markup is ignored.\n *\n * Source resolution order on connect, first hit wins:\n *\n * 1. `host.data` already set in JavaScript -> leave it, read nothing.\n * 2. A direct-child `<script type=\"application/json\" class=\"roxy-data\">` -> parse and use. Direct-child only, so a nested component's own script is never read by an ancestor.\n *\n * Fetching from a URL is intentionally unsupported: that would require a browser-visible key and breaks the server-rendered, cached model these consumers rely on.\n *\n * Timing: {@link hostConnected} runs inside the host `connectedCallback`. For an element parsed from server HTML, its direct children are present by the time the custom element upgrades and connects, so the script is readable here. For an element created with `document.createElement` and connected before any child is appended, there is nothing to read and the property path is the only source, which is exactly the existing behavior.\n *\n * Failure is safe: malformed JSON or a missing script leaves `host.data` untouched, so the host renders its normal empty state.\n *\n * Reading the script never mutates it, and only the marked script is touched, so any sibling fallback markup a server nested inside the element (for no-JavaScript, AMP, or crawler rendering) is left in place.\n *\n * @example\n * ```ts\n * import { MarkupDataController } from '../utils/markup-data.js';\n *\n * export class RoxyExample extends LitElement {\n *   constructor() {\n *     super();\n *     new MarkupDataController(this);\n *   }\n *\n *   @property({ attribute: false })\n *   data: ExampleResponse | null = null;\n * }\n * ```\n */\nexport class MarkupDataController<T = unknown> implements ReactiveController {\n\tprivate readonly host: DataHost;\n\n\tconstructor(host: DataHost) {\n\t\tthis.host = host;\n\t\thost.addController(this);\n\t}\n\n\thostConnected() {\n\t\t// Property path wins. If the consumer (React, vanilla `.data =`, the\n\t\t// widgets script, an MCP agent) already set data, never look at markup.\n\t\tif (this.host.data != null) return;\n\n\t\tconst parsed = this.read();\n\t\tif (parsed === undefined) return;\n\n\t\tthis.host.data = parsed as T;\n\t\tthis.host.requestUpdate();\n\t}\n\n\t/**\n\t * Resolve the embedded payload. Returns `undefined` when there is nothing valid to read so the caller can leave `host.data` untouched.\n\t */\n\tprivate read(): T | undefined {\n\t\tconst inline = this.findInlineScript();\n\t\treturn inline ? this.parse(inline.textContent) : undefined;\n\t}\n\n\t/**\n\t * Direct-child `<script type=\"application/json\" class=\"roxy-data\">`. Scoped to immediate children so a nested data-driven component never has its script read by an ancestor, and so sibling fallback markup is ignored.\n\t */\n\tprivate findInlineScript(): Element | null {\n\t\tfor (const child of Array.from(this.host.children)) {\n\t\t\tif (isJsonScript(child) && child.classList.contains(ROXY_DATA_CLASS)) {\n\t\t\t\treturn child;\n\t\t\t}\n\t\t}\n\t\treturn null;\n\t}\n\n\tprivate parse(text: string | null): T | undefined {\n\t\tif (!text?.trim()) return undefined;\n\t\ttry {\n\t\t\treturn JSON.parse(text) as T;\n\t\t} catch {\n\t\t\t// Malformed embedded JSON: fail safe, leave the host empty state in\n\t\t\t// place rather than throwing during connect.\n\t\t\treturn undefined;\n\t\t}\n\t}\n}\n", "/**\n * Display formatters for ISO timestamps and floats coming back from the API.\n * Every helper returns \"\" for nullish or unparseable input so it falls out of\n * template literals cleanly.\n */\n\nexport function formatTime(input: unknown): string {\n\tif (typeof input !== 'string' || input.length === 0) return '';\n\tif (/^\\d{4}-\\d{2}-\\d{2}$/.test(input)) return '';\n\tconst bareTime = /^\\d{2}:\\d{2}(:\\d{2})?$/.test(input);\n\tconst iso = bareTime ? `1970-01-01T${input}` : input;\n\tconst d = new Date(iso);\n\tif (Number.isNaN(d.getTime())) return input;\n\treturn d.toLocaleTimeString(undefined, {\n\t\thour: 'numeric',\n\t\tminute: '2-digit',\n\t\thour12: true,\n\t});\n}\n\nexport function formatDate(input: unknown): string {\n\tif (typeof input !== 'string' || input.length === 0) return '';\n\tconst d = new Date(\n\t\t/^\\d{4}-\\d{2}-\\d{2}$/.test(input) ? `${input}T00:00:00` : input,\n\t);\n\tif (Number.isNaN(d.getTime())) return input;\n\treturn d.toLocaleDateString(undefined, {\n\t\tmonth: 'short',\n\t\tday: 'numeric',\n\t\tyear: 'numeric',\n\t});\n}\n\nexport function formatTimeRange(\n\tt: { start?: string; end?: string } | undefined,\n): string {\n\tif (!t) return '';\n\tconst start = formatTime(t.start);\n\tconst end = formatTime(t.end);\n\tif (start && end) return `${start} - ${end}`;\n\treturn start || end || '';\n}\n\nexport function formatNumber(value: unknown, dp = 1): string {\n\tif (typeof value !== 'number' || !Number.isFinite(value)) return '';\n\treturn value.toFixed(dp).replace(/\\.?0+$/, '');\n}\n\nexport function formatPercent(value: unknown, dp = 1): string {\n\tconst n = formatNumber(value, dp);\n\treturn n ? `${n}%` : '';\n}\n\n/**\n * CSS class name per aspect type. Used by natal and synastry chart aspect\n * lines so the same color encoding (harmonious vs challenging) applies in\n * both wheels. Keys are lowercase canonical names, values are CSS class\n * suffixes the chart components define in their `:host` styles.\n */\nexport const ASPECT_CLASS: Record<string, string> = {\n\tconjunction: 'aspect-conjunction',\n\tsextile: 'aspect-sextile',\n\tsquare: 'aspect-square',\n\ttrine: 'aspect-trine',\n\topposition: 'aspect-opposition',\n};\n\n/**\n * Normalize the `type` field on an aspect entry to a lowercase, hyphen-separated\n * canonical name (`SEMI_SEXTILE` \u2192 `semi-sextile`). Accepts any aspect-shaped\n * object so both natal and synastry inter-aspect entries can share this.\n */\nexport function normalizeAspect(a: { type?: string }): string {\n\treturn (a.type ?? '').toLowerCase().replace(/_/g, '-');\n}\n"],
+  "mappings": "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",
+  "names": ["css", "html", "nothing", "customElement", "property", "html", "LitElement", "property", "state", "ifDefined", "css", "baseStyles", "DEFAULT_BASE_URL", "FetchController", "host", "req", "controller", "res", "json", "err", "signal", "url", "k", "v", "headers", "key", "body", "buildRequest", "endpoint", "method", "values", "rest", "path", "_match", "name", "query", "ROXY_DATA_CLASS", "isJsonScript", "el", "MarkupDataController", "host", "parsed", "inline", "child", "ROXY_DATA_CLASS", "text", "RoxyDataElement", "LitElement", "e", "detail", "buildRequest", "MarkupDataController", "FetchController", "baseStyles", "changed", "html", "ifDefined", "raw", "values", "message", "banner", "__decorateClass", "property", "state", "formatNumber", "value", "dp", "RoxyDashaTimeline", "RoxyDataElement", "html", "d", "periods", "maxYears", "p", "nothing", "b", "lord", "yrs", "mo", "da", "parts", "remaining", "active", "formatNumber", "now", "start", "end", "max", "years", "width", "current", "progress", "trackClass", "formatYear", "baseStyles", "css", "__decorateClass", "property", "customElement", "s", "m"]
 }