@bquery/bquery 1.0.0

package/LICENSE.md

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 @bQuery / Jonas Pfalzgraf
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,266 @@
+# bQuery.js
+
+[![Repo](https://img.shields.io/badge/github-bquery%2Fbquery-24292f?logo=github)](https://github.com/bquery/bquery)
+[![Stars](https://img.shields.io/github/stars/bquery/bquery?style=flat&logo=github)](https://github.com/bquery/bquery/stargazers)
+[![Issues](https://img.shields.io/github/issues/bquery/bquery?style=flat&logo=github)](https://github.com/bquery/bquery/issues)
+[![License](https://img.shields.io/github/license/bquery/bquery?style=flat)](https://github.com/bquery/bquery/blob/main/LICENSE.md)
+[![npm](https://img.shields.io/npm/v/bquery)](https://www.npmjs.com/package/bquery)
+[![Bundle Size](https://img.shields.io/bundlephobia/minzip/bquery)](https://bundlephobia.com/package/bquery)
+[![unpkg](https://img.shields.io/badge/unpkg-browse-blue?logo=unpkg)](https://unpkg.com/bquery/)
+
+**The jQuery for the modern Web Platform.**
+
+bQuery.js is a slim, TypeScript-first library that combines jQuery's direct DOM workflow with modern features like reactivity, Web Components, and motion utilities — without a mandatory build step.
+
+## Highlights
+
+- **Zero‑build capable**: runs directly in the browser; build tools are optional.
+- **Security‑focused**: DOM writes are sanitized by default; Trusted Types supported.
+- **Modular**: the core stays small; extra modules are opt‑in.
+- **TypeScript‑first**: clear types and strong IDE support.
+- **Tree-shakeable**: import only what you need.
+
+## Installation
+
+### Via npm/bun/pnpm
+
+```bash
+# npm
+npm install bquery
+
+# bun
+bun add bquery
+
+# pnpm
+pnpm add bquery
+```
+
+### Via CDN (Zero-build)
+
+#### ES Modules (recommended)
+
+```html
+<script type="module">
+  import { $, signal } from 'https://unpkg.com/bquery@1/dist/full.es.mjs';
+
+  const count = signal(0);
+  $('#counter').text(`Count: ${count.value}`);
+</script>
+```
+
+#### UMD (global variable)
+
+```html
+<script src="https://unpkg.com/bquery@1/dist/full.umd.js"></script>
+<script>
+  const { $, signal } = bQuery;
+  const count = signal(0);
+</script>
+```
+
+#### IIFE (self-executing)
+
+```html
+<script src="https://unpkg.com/bquery@1/dist/full.iife.js"></script>
+<script>
+  const { $, $$ } = bQuery;
+  $$('.items').addClass('loaded');
+</script>
+```
+
+### Import Strategies
+
+```ts
+// Full bundle (all modules)
+import { $, signal, component } from 'bquery';
+
+// Core only
+import { $, $$ } from 'bquery/core';
+
+// À la carte (individual modules)
+import { signal, computed, effect } from 'bquery/reactive';
+import { component, html } from 'bquery/component';
+import { transition, spring } from 'bquery/motion';
+import { sanitize } from 'bquery/security';
+import { storage, cache } from 'bquery/platform';
+```
+
+## Modules at a glance
+
+| Module        | Description                                    | Size (gzip) |
+| ------------- | ---------------------------------------------- | ----------- |
+| **Core**      | Selectors, DOM manipulation, events, utilities | ~6 KB       |
+| **Reactive**  | `signal`, `computed`, `effect`, `batch`        | ~1 KB       |
+| **Component** | Lightweight Web Components with props          | ~1.3 KB     |
+| **Motion**    | View transitions, FLIP animations, springs     | ~1.2 KB     |
+| **Security**  | HTML sanitizing, Trusted Types, CSP            | ~1.6 KB     |
+| **Platform**  | Storage, cache, notifications, buckets         | ~1.7 KB     |
+
+## Quick examples
+
+### Core – DOM & events
+
+```ts
+import { $, $$ } from 'bquery/core';
+
+// jQuery-style selectors
+$('#save').on('click', (event) => {
+  console.log('Saved', event.type);
+});
+
+// Method chaining
+$('#box').addClass('active').css({ opacity: '0.8' }).attr('data-state', 'ready');
+
+// Collections
+$$('.items').addClass('highlight');
+```
+
+### Reactive – signals
+
+```ts
+import { signal, computed, effect, batch } from 'bquery/reactive';
+
+const count = signal(0);
+const doubled = computed(() => count.value * 2);
+
+effect(() => {
+  console.log('Count changed', count.value);
+});
+
+// Batch updates for performance
+batch(() => {
+  count.value++;
+  count.value++;
+});
+```
+
+### Components – Web Components
+
+```ts
+import { component, html } from 'bquery/component';
+
+component('user-card', {
+  props: {
+    username: { type: String, required: true },
+  },
+  render({ props }) {
+    return html`<div>Hello ${props.username}</div>`;
+  },
+});
+```
+
+### Motion – animations
+
+```ts
+import { transition, spring } from 'bquery/motion';
+
+// View transitions (with fallback)
+await transition(() => {
+  $('#content').text('Updated');
+});
+
+// Spring physics
+const x = spring(0, { stiffness: 120, damping: 14 });
+x.onChange((value) => {
+  element.style.transform = `translateX(${value}px)`;
+});
+await x.to(100);
+```
+
+### Security – sanitizing
+
+```ts
+import { sanitize, escapeHtml } from 'bquery/security';
+
+// Sanitize HTML (removes dangerous elements)
+const safeHtml = sanitize(userInput);
+
+// Escape for text display
+const escaped = escapeHtml('<script>alert(1)</script>');
+```
+
+### Platform – storage & APIs
+
+```ts
+import { storage, notifications } from 'bquery/platform';
+
+// Unified storage API
+const local = storage.local();
+await local.set('theme', 'dark');
+const theme = await local.get<string>('theme');
+
+// Notifications
+const permission = await notifications.requestPermission();
+if (permission === 'granted') {
+  notifications.send('Build complete', {
+    body: 'Your docs are ready.',
+  });
+}
+```
+
+## Browser Support
+
+| Browser | Version | Support |
+| ------- | ------- | ------- |
+| Chrome  | 90+     | ✅ Full |
+| Firefox | 90+     | ✅ Full |
+| Safari  | 15+     | ✅ Full |
+| Edge    | 90+     | ✅ Full |
+
+> **No IE support** by design.
+
+## Documentation
+
+- **Getting Started**: [docs/guide/getting-started.md](docs/guide/getting-started.md)
+- **Core API**: [docs/guide/api-core.md](docs/guide/api-core.md)
+- **Components**: [docs/guide/components.md](docs/guide/components.md)
+- **Reactivity**: [docs/guide/reactive.md](docs/guide/reactive.md)
+- **Motion**: [docs/guide/motion.md](docs/guide/motion.md)
+- **Security**: [docs/guide/security.md](docs/guide/security.md)
+
+## Local Development
+
+```bash
+# Install dependencies
+bun install
+
+# Start VitePress docs
+bun run dev
+
+# Run Vite playground
+bun run playground
+
+# Run tests
+bun test
+
+# Build library
+bun run build
+
+# Generate API documentation
+bun run docs:api
+```
+
+## Project Structure
+
+```text
+bQuery.js
+├── src/
+│   ├── core/       # Selectors, DOM ops, events, utils
+│   ├── reactive/   # Signals, computed, effects
+│   ├── component/  # Web Components helper
+│   ├── motion/     # View transitions, FLIP, springs
+│   ├── security/   # Sanitizer, CSP, Trusted Types
+│   └── platform/   # Storage, cache, notifications
+├── docs/           # VitePress documentation
+├── playground/     # Vite demo app
+├── tests/          # bun:test suites
+└── dist/           # Built files (ESM, UMD, IIFE)
+```
+
+## Contributing
+
+See [CONTRIBUTING.md](CONTRIBUTING.md) for guidelines.
+
+## License
+
+MIT – See [LICENSE.md](LICENSE.md) for details.

package/dist/component/index.d.ts

@@ -0,0 +1,155 @@
+/**
+ * Minimal Web Component helper for building custom elements.
+ *
+ * This module provides a declarative API for defining Web Components
+ * without complex build steps. Features include:
+ * - Type-safe props with automatic attribute coercion
+ * - Reactive state management
+ * - Shadow DOM encapsulation with scoped styles
+ * - Lifecycle hooks (connected, disconnected)
+ * - Event emission helpers
+ *
+ * @module bquery/component
+ *
+ * @example
+ * ```ts
+ * import { component, html } from 'bquery/component';
+ *
+ * component('user-card', {
+ *   props: {
+ *     username: { type: String, required: true },
+ *     avatar: { type: String, default: '/default-avatar.png' },
+ *   },
+ *   styles: `
+ *     .card { padding: 1rem; border: 1px solid #ccc; }
+ *   `,
+ *   render({ props }) {
+ *     return html`
+ *       <div class="card">
+ *         <img src="${props.avatar}" alt="${props.username}" />
+ *         <h3>${props.username}</h3>
+ *       </div>
+ *     `;
+ *   },
+ * });
+ * ```
+ */
+/**
+ * Defines a single prop's type and configuration.
+ *
+ * @template T - The TypeScript type of the prop value
+ *
+ * @example
+ * ```ts
+ * const myProp: PropDefinition<number> = {
+ *   type: Number,
+ *   required: false,
+ *   default: 0,
+ * };
+ * ```
+ */
+export type PropDefinition<T = unknown> = {
+    /** Constructor or converter function for the prop type */
+    type: StringConstructor | NumberConstructor | BooleanConstructor | ObjectConstructor | ArrayConstructor | {
+        new (value: unknown): T;
+    } | ((value: unknown) => T);
+    /** Whether the prop must be provided */
+    required?: boolean;
+    /** Default value when prop is not provided */
+    default?: T;
+};
+/**
+ * Complete component definition including props, state, styles, and lifecycle.
+ *
+ * @template TProps - Type of the component's props
+ */
+export type ComponentDefinition<TProps extends Record<string, unknown> = Record<string, unknown>> = {
+    /** Prop definitions with types and defaults */
+    props?: Record<keyof TProps, PropDefinition>;
+    /** Initial internal state */
+    state?: Record<string, unknown>;
+    /** CSS styles scoped to the component's shadow DOM */
+    styles?: string;
+    /** Lifecycle hook called when component is added to DOM */
+    connected?: () => void;
+    /** Lifecycle hook called when component is removed from DOM */
+    disconnected?: () => void;
+    /** Lifecycle hook called after reactive updates trigger a render */
+    updated?: () => void;
+    /** Render function returning HTML string */
+    render: (context: {
+        props: TProps;
+        state: Record<string, unknown>;
+        emit: (event: string, detail?: unknown) => void;
+    }) => string;
+};
+/**
+ * Tagged template literal for creating HTML strings.
+ *
+ * This function handles interpolation of values into HTML templates,
+ * converting null/undefined to empty strings.
+ *
+ * @param strings - Template literal string parts
+ * @param values - Interpolated values
+ * @returns Combined HTML string
+ *
+ * @example
+ * ```ts
+ * const name = 'World';
+ * const greeting = html`<h1>Hello, ${name}!</h1>`;
+ * // Result: '<h1>Hello, World!</h1>'
+ * ```
+ */
+export declare const html: (strings: TemplateStringsArray, ...values: unknown[]) => string;
+/**
+ * Escapes HTML entities in interpolated values for XSS prevention.
+ * Use this when you need to safely embed user content in templates.
+ *
+ * @param strings - Template literal string parts
+ * @param values - Interpolated values to escape
+ * @returns Combined HTML string with escaped values
+ *
+ * @example
+ * ```ts
+ * const userInput = '<script>alert("xss")</script>';
+ * const safe = safeHtml`<div>${userInput}</div>`;
+ * // Result: '<div>&lt;script&gt;alert("xss")&lt;/script&gt;</div>'
+ * ```
+ */
+export declare const safeHtml: (strings: TemplateStringsArray, ...values: unknown[]) => string;
+/**
+ * Defines and registers a custom Web Component.
+ *
+ * This function creates a new custom element with the given tag name
+ * and configuration. The component uses Shadow DOM for encapsulation
+ * and automatically re-renders when observed attributes change.
+ *
+ * @template TProps - Type of the component's props
+ * @param tagName - The custom element tag name (must contain a hyphen)
+ * @param definition - The component configuration
+ *
+ * @example
+ * ```ts
+ * component('counter-button', {
+ *   props: {
+ *     start: { type: Number, default: 0 },
+ *   },
+ *   state: { count: 0 },
+ *   styles: `
+ *     button { padding: 0.5rem 1rem; }
+ *   `,
+ *   connected() {
+ *     console.log('Counter mounted');
+ *   },
+ *   render({ props, state, emit }) {
+ *     return html`
+ *       <button onclick="this.getRootNode().host.increment()">
+ *         Count: ${state.count}
+ *       </button>
+ *     `;
+ *   },
+ * });
+ * ```
+ */
+export declare const component: <TProps extends Record<string, unknown>>(tagName: string, definition: ComponentDefinition<TProps>) => void;
+//# sourceMappingURL=index.d.ts.map

package/dist/component/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/component/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AAEH;;;;;;;;;;;;;GAaG;AACH,MAAM,MAAM,cAAc,CAAC,CAAC,GAAG,OAAO,IAAI;IACxC,0DAA0D;IAC1D,IAAI,EACA,iBAAiB,GACjB,iBAAiB,GACjB,kBAAkB,GAClB,iBAAiB,GACjB,gBAAgB,GAChB;QAAE,KAAK,KAAK,EAAE,OAAO,GAAG,CAAC,CAAA;KAAE,GAC3B,CAAC,CAAC,KAAK,EAAE,OAAO,KAAK,CAAC,CAAC,CAAC;IAC5B,wCAAwC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,8CAA8C;IAC9C,OAAO,CAAC,EAAE,CAAC,CAAC;CACb,CAAC;AAEF;;;;GAIG;AACH,MAAM,MAAM,mBAAmB,CAAC,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,IAC9F;IACE,+CAA+C;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,MAAM,EAAE,cAAc,CAAC,CAAC;IAC7C,6BAA6B;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAChC,sDAAsD;IACtD,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,2DAA2D;IAC3D,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,+DAA+D;IAC/D,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,oEAAoE;IACpE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,4CAA4C;IAC5C,MAAM,EAAE,CAAC,OAAO,EAAE;QAChB,KAAK,EAAE,MAAM,CAAC;QACd,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;QAC/B,IAAI,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;KACjD,KAAK,MAAM,CAAC;CACd,CAAC;AAsDJ;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,IAAI,GAAI,SAAS,oBAAoB,EAAE,GAAG,QAAQ,OAAO,EAAE,KAAG,MAE1E,CAAC;AAEF;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,QAAQ,GAAI,SAAS,oBAAoB,EAAE,GAAG,QAAQ,OAAO,EAAE,KAAG,MAgB9E,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,eAAO,MAAM,SAAS,GAAI,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAC9D,SAAS,MAAM,EACf,YAAY,mBAAmB,CAAC,MAAM,CAAC,KACtC,IA0HF,CAAC"}

package/dist/component.es.mjs

@@ -0,0 +1,128 @@
+const i = (t, e) => {
+  const { type: o } = e;
+  if (o === String) return t;
+  if (o === Number) {
+    const s = Number(t);
+    return Number.isNaN(s) ? t : s;
+  }
+  if (o === Boolean) {
+    const s = t.trim().toLowerCase();
+    return s === "" || s === "true" || s === "1" ? !0 : s === "false" || s === "0" ? !1 : !!t;
+  }
+  if (o === Object || o === Array)
+    try {
+      return JSON.parse(t);
+    } catch {
+      return t;
+    }
+  if (typeof o == "function") {
+    const s = o, r = o;
+    try {
+      return s(t);
+    } catch {
+      return new r(t);
+    }
+  }
+  return t;
+}, l = (t, ...e) => t.reduce((o, s, r) => `${o}${s}${e[r] ?? ""}`, ""), h = (t, ...e) => {
+  const o = {
+    "&": "&",
+    "<": "&lt;",
+    ">": "&gt;",
+    '"': "&quot;",
+    "'": "&#x27;",
+    "`": "&#x60;"
+  }, s = (r) => String(r ?? "").replace(/[&<>"'`]/g, (c) => o[c]);
+  return t.reduce((r, n, c) => `${r}${n}${s(e[c])}`, "");
+}, d = (t, e) => {
+  class o extends HTMLElement {
+    constructor() {
+      super(), this.state = { ...e.state ?? {} }, this.props = {}, this.attachShadow({ mode: "open" }), this.syncProps();
+    }
+    /**
+     * Returns the list of attributes to observe for changes.
+     */
+    static get observedAttributes() {
+      return Object.keys(e.props ?? {});
+    }
+    /**
+     * Called when the element is added to the DOM.
+     */
+    connectedCallback() {
+      e.connected?.call(this), this.render();
+    }
+    /**
+     * Called when the element is removed from the DOM.
+     */
+    disconnectedCallback() {
+      e.disconnected?.call(this);
+    }
+    /**
+     * Called when an observed attribute changes.
+     */
+    attributeChangedCallback() {
+      this.syncProps(), this.render(!0);
+    }
+    /**
+     * Updates a state property and triggers a re-render.
+     *
+     * @param key - The state property key
+     * @param value - The new value
+     */
+    setState(r, n) {
+      this.state[r] = n, this.render(!0);
+    }
+    /**
+     * Gets a state property value.
+     *
+     * @param key - The state property key
+     * @returns The current value
+     */
+    getState(r) {
+      return this.state[r];
+    }
+    /**
+     * Synchronizes props from attributes.
+     * @internal
+     */
+    syncProps() {
+      const r = e.props ?? {};
+      for (const [n, c] of Object.entries(r)) {
+        const u = this.getAttribute(n);
+        if (u == null) {
+          if (c.required && c.default === void 0)
+            throw new Error(`bQuery component: missing required prop "${n}"`);
+          this.props[n] = c.default ?? void 0;
+          continue;
+        }
+        this.props[n] = i(
+          u,
+          c
+        );
+      }
+    }
+    /**
+     * Renders the component to its shadow root.
+     * @internal
+     */
+    render(r = !1) {
+      const n = (p, a) => {
+        this.dispatchEvent(new CustomEvent(p, { detail: a, bubbles: !0, composed: !0 }));
+      };
+      if (!this.shadowRoot) return;
+      const c = e.render({
+        props: this.props,
+        state: this.state,
+        emit: n
+      }), u = e.styles ? `<style>${e.styles}</style>` : "";
+      this.shadowRoot.innerHTML = `${u}${c}`, r && e.updated?.call(this);
+    }
+  }
+  customElements.get(t) || customElements.define(t, o);
+};
+export {
+  d as component,
+  l as html,
+  h as safeHtml
+};
+//# sourceMappingURL=component.es.mjs.map

package/dist/component.es.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"component.es.mjs","sources":["../src/component/index.ts"],"sourcesContent":["/**\n * Minimal Web Component helper for building custom elements.\n *\n * This module provides a declarative API for defining Web Components\n * without complex build steps. Features include:\n * - Type-safe props with automatic attribute coercion\n * - Reactive state management\n * - Shadow DOM encapsulation with scoped styles\n * - Lifecycle hooks (connected, disconnected)\n * - Event emission helpers\n *\n * @module bquery/component\n *\n * @example\n * ```ts\n * import { component, html } from 'bquery/component';\n *\n * component('user-card', {\n *   props: {\n *     username: { type: String, required: true },\n *     avatar: { type: String, default: '/default-avatar.png' },\n *   },\n *   styles: `\n *     .card { padding: 1rem; border: 1px solid #ccc; }\n *   `,\n *   render({ props }) {\n *     return html`\n *       <div class=\"card\">\n *         <img src=\"${props.avatar}\" alt=\"${props.username}\" />\n *         <h3>${props.username}</h3>\n *       </div>\n *     `;\n *   },\n * });\n * ```\n */\n\n/**\n * Defines a single prop's type and configuration.\n *\n * @template T - The TypeScript type of the prop value\n *\n * @example\n * ```ts\n * const myProp: PropDefinition<number> = {\n *   type: Number,\n *   required: false,\n *   default: 0,\n * };\n * ```\n */\nexport type PropDefinition<T = unknown> = {\n  /** Constructor or converter function for the prop type */\n  type:\n    | StringConstructor\n    | NumberConstructor\n    | BooleanConstructor\n    | ObjectConstructor\n    | ArrayConstructor\n    | { new (value: unknown): T }\n    | ((value: unknown) => T);\n  /** Whether the prop must be provided */\n  required?: boolean;\n  /** Default value when prop is not provided */\n  default?: T;\n};\n\n/**\n * Complete component definition including props, state, styles, and lifecycle.\n *\n * @template TProps - Type of the component's props\n */\nexport type ComponentDefinition<TProps extends Record<string, unknown> = Record<string, unknown>> =\n  {\n    /** Prop definitions with types and defaults */\n    props?: Record<keyof TProps, PropDefinition>;\n    /** Initial internal state */\n    state?: Record<string, unknown>;\n    /** CSS styles scoped to the component's shadow DOM */\n    styles?: string;\n    /** Lifecycle hook called when component is added to DOM */\n    connected?: () => void;\n    /** Lifecycle hook called when component is removed from DOM */\n    disconnected?: () => void;\n    /** Lifecycle hook called after reactive updates trigger a render */\n    updated?: () => void;\n    /** Render function returning HTML string */\n    render: (context: {\n      props: TProps;\n      state: Record<string, unknown>;\n      emit: (event: string, detail?: unknown) => void;\n    }) => string;\n  };\n\n/**\n * Coerces a string attribute value into a typed prop value.\n * Supports String, Number, Boolean, Object, Array, and custom converters.\n *\n * @internal\n * @template T - The target type\n * @param rawValue - The raw string value from the attribute\n * @param config - The prop definition with type information\n * @returns The coerced value of type T\n */\nconst coercePropValue = <T>(rawValue: string, config: PropDefinition<T>): T => {\n  const { type } = config;\n\n  if (type === String) return rawValue as T;\n\n  if (type === Number) {\n    const parsed = Number(rawValue);\n    return (Number.isNaN(parsed) ? rawValue : parsed) as T;\n  }\n\n  if (type === Boolean) {\n    const normalized = rawValue.trim().toLowerCase();\n    if (normalized === '' || normalized === 'true' || normalized === '1') {\n      return true as T;\n    }\n    if (normalized === 'false' || normalized === '0') {\n      return false as T;\n    }\n    return Boolean(rawValue) as T;\n  }\n\n  if (type === Object || type === Array) {\n    try {\n      return JSON.parse(rawValue) as T;\n    } catch {\n      return rawValue as T;\n    }\n  }\n\n  if (typeof type === 'function') {\n    const callable = type as (value: unknown) => T;\n    const constructable = type as new (value: unknown) => T;\n    try {\n      return callable(rawValue);\n    } catch {\n      return new constructable(rawValue);\n    }\n  }\n\n  return rawValue as T;\n};\n\n/**\n * Tagged template literal for creating HTML strings.\n *\n * This function handles interpolation of values into HTML templates,\n * converting null/undefined to empty strings.\n *\n * @param strings - Template literal string parts\n * @param values - Interpolated values\n * @returns Combined HTML string\n *\n * @example\n * ```ts\n * const name = 'World';\n * const greeting = html`<h1>Hello, ${name}!</h1>`;\n * // Result: '<h1>Hello, World!</h1>'\n * ```\n */\nexport const html = (strings: TemplateStringsArray, ...values: unknown[]): string => {\n  return strings.reduce((acc, part, index) => `${acc}${part}${values[index] ?? ''}`, '');\n};\n\n/**\n * Escapes HTML entities in interpolated values for XSS prevention.\n * Use this when you need to safely embed user content in templates.\n *\n * @param strings - Template literal string parts\n * @param values - Interpolated values to escape\n * @returns Combined HTML string with escaped values\n *\n * @example\n * ```ts\n * const userInput = '<script>alert(\"xss\")</script>';\n * const safe = safeHtml`<div>${userInput}</div>`;\n * // Result: '<div>&lt;script&gt;alert(\"xss\")&lt;/script&gt;</div>'\n * ```\n */\nexport const safeHtml = (strings: TemplateStringsArray, ...values: unknown[]): string => {\n  const escapeMap: Record<string, string> = {\n    '&': '&amp;',\n    '<': '&lt;',\n    '>': '&gt;',\n    '\"': '&quot;',\n    \"'\": '&#x27;',\n    '`': '&#x60;',\n  };\n\n  const escape = (value: unknown): string => {\n    const str = String(value ?? '');\n    return str.replace(/[&<>\"'`]/g, (char) => escapeMap[char]);\n  };\n\n  return strings.reduce((acc, part, index) => `${acc}${part}${escape(values[index])}`, '');\n};\n\n/**\n * Defines and registers a custom Web Component.\n *\n * This function creates a new custom element with the given tag name\n * and configuration. The component uses Shadow DOM for encapsulation\n * and automatically re-renders when observed attributes change.\n *\n * @template TProps - Type of the component's props\n * @param tagName - The custom element tag name (must contain a hyphen)\n * @param definition - The component configuration\n *\n * @example\n * ```ts\n * component('counter-button', {\n *   props: {\n *     start: { type: Number, default: 0 },\n *   },\n *   state: { count: 0 },\n *   styles: `\n *     button { padding: 0.5rem 1rem; }\n *   `,\n *   connected() {\n *     console.log('Counter mounted');\n *   },\n *   render({ props, state, emit }) {\n *     return html`\n *       <button onclick=\"this.getRootNode().host.increment()\">\n *         Count: ${state.count}\n *       </button>\n *     `;\n *   },\n * });\n * ```\n */\nexport const component = <TProps extends Record<string, unknown>>(\n  tagName: string,\n  definition: ComponentDefinition<TProps>\n): void => {\n  /**\n   * Internal Web Component class created for each component definition.\n   * @internal\n   */\n  class BQueryComponent extends HTMLElement {\n    /** Internal state object for the component */\n    private readonly state = { ...(definition.state ?? {}) };\n    /** Typed props object populated from attributes */\n    private props = {} as TProps;\n\n    constructor() {\n      super();\n      this.attachShadow({ mode: 'open' });\n      this.syncProps();\n    }\n\n    /**\n     * Returns the list of attributes to observe for changes.\n     */\n    static get observedAttributes(): string[] {\n      return Object.keys(definition.props ?? {});\n    }\n\n    /**\n     * Called when the element is added to the DOM.\n     */\n    connectedCallback(): void {\n      definition.connected?.call(this);\n      this.render();\n    }\n\n    /**\n     * Called when the element is removed from the DOM.\n     */\n    disconnectedCallback(): void {\n      definition.disconnected?.call(this);\n    }\n\n    /**\n     * Called when an observed attribute changes.\n     */\n    attributeChangedCallback(): void {\n      this.syncProps();\n      this.render(true);\n    }\n\n    /**\n     * Updates a state property and triggers a re-render.\n     *\n     * @param key - The state property key\n     * @param value - The new value\n     */\n    setState(key: string, value: unknown): void {\n      this.state[key] = value;\n      this.render(true);\n    }\n\n    /**\n     * Gets a state property value.\n     *\n     * @param key - The state property key\n     * @returns The current value\n     */\n    getState<T = unknown>(key: string): T {\n      return this.state[key] as T;\n    }\n\n    /**\n     * Synchronizes props from attributes.\n     * @internal\n     */\n    private syncProps(): void {\n      const props = definition.props ?? {};\n      for (const [key, config] of Object.entries(props) as [string, PropDefinition][]) {\n        const attrValue = this.getAttribute(key);\n        if (attrValue == null) {\n          if (config.required && config.default === undefined) {\n            throw new Error(`bQuery component: missing required prop \"${key}\"`);\n          }\n          (this.props as Record<string, unknown>)[key] = config.default ?? undefined;\n          continue;\n        }\n        (this.props as Record<string, unknown>)[key] = coercePropValue(\n          attrValue,\n          config\n        ) as TProps[keyof TProps];\n      }\n    }\n\n    /**\n     * Renders the component to its shadow root.\n     * @internal\n     */\n    private render(triggerUpdated = false): void {\n      /**\n       * Emits a custom event from the component.\n       */\n      const emit = (event: string, detail?: unknown): void => {\n        this.dispatchEvent(new CustomEvent(event, { detail, bubbles: true, composed: true }));\n      };\n\n      if (!this.shadowRoot) return;\n\n      const markup = definition.render({\n        props: this.props,\n        state: this.state,\n        emit,\n      });\n\n      const styles = definition.styles ? `<style>${definition.styles}</style>` : '';\n      this.shadowRoot.innerHTML = `${styles}${markup}`;\n\n      if (triggerUpdated) {\n        definition.updated?.call(this);\n      }\n    }\n  }\n\n  if (!customElements.get(tagName)) {\n    customElements.define(tagName, BQueryComponent);\n  }\n};\n"],"names":["coercePropValue","rawValue","config","type","parsed","normalized","callable","constructable","html","strings","values","acc","part","index","safeHtml","escapeMap","escape","value","char","component","tagName","definition","BQueryComponent","key","props","attrValue","triggerUpdated","emit","event","detail","markup","styles"],"mappings":"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"}