@francofantomius/material-components 0.1.0 → 1.0.1

package/dist/components/checkbox/checkbox.js

@@ -1,188 +1,4 @@
-import { css as h, html as p } from "lit";
-import { property as n, query as m, customElement as u } from "lit/decorators.js";
-import { M as c } from "../../chunks/form-associated-fKbeX_2P.js";
-import "../../internal/ripple/ripple.js";
-import "../../chunks/focus-ring-Dl-XoEKK.js";
-const b = h`
-  :host {
-    display: inline-flex;
-    align-items: center;
-    vertical-align: middle;
-    cursor: pointer;
-    outline: none;
-    -webkit-tap-highlight-color: transparent;
-    user-select: none;
-    gap: 8px;
-    font-family: var(--md-sys-typescale-font-family, inherit);
-    font-size: var(--md-sys-typescale-body-large-size, 16px);
-    color: var(--md-sys-color-on-surface, #1D1B20);
-  }
-
-  :host([disabled]) {
-    cursor: not-allowed;
-    color: rgba(29, 27, 32, 0.38);
-    pointer-events: none;
-  }
-
-  .container {
-    position: relative;
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    width: 40px;
-    height: 40px;
-    border-radius: 50%;
-  }
-
-  .box {
-    position: relative;
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    width: 18px;
-    height: 18px;
-    box-sizing: border-box;
-    border: 2px solid var(--md-sys-color-on-surface-variant, #49454F);
-    border-radius: var(--md-sys-shape-corner-extra-small, 2px);
-    background-color: transparent;
-    transition: background-color 150ms cubic-bezier(0.2, 0, 0, 1),
-                border-color 150ms cubic-bezier(0.2, 0, 0, 1);
-  }
-
-  :host([checked]) .box,
-  :host([indeterminate]) .box {
-    background-color: var(--md-sys-color-primary, #6750A4);
-    border-color: var(--md-sys-color-primary, #6750A4);
-  }
-
-  :host([error]) .box {
-    border-color: var(--md-sys-color-error, #B3261E);
-  }
-
-  :host([error][checked]) .box,
-  :host([error][indeterminate]) .box {
-    background-color: var(--md-sys-color-error, #B3261E);
-    border-color: var(--md-sys-color-error, #B3261E);
-  }
-
-  :host([disabled]) .box {
-    border-color: rgba(29, 27, 32, 0.38);
-  }
-
-  :host([disabled][checked]) .box,
-  :host([disabled][indeterminate]) .box {
-    background-color: rgba(29, 27, 32, 0.38);
-    border-color: transparent;
-  }
-
-  .mark {
-    position: absolute;
-    width: 14px;
-    height: 14px;
-    fill: none;
-    stroke: var(--md-sys-color-on-primary, #FFFFFF);
-    stroke-width: 2.5;
-    stroke-linecap: round;
-    stroke-linejoin: round;
-    opacity: 0;
-    transition: opacity 150ms ease;
-  }
-
-  :host([checked]) .mark.check {
-    opacity: 1;
-  }
-
-  :host([indeterminate]) .mark.dash {
-    opacity: 1;
-  }
-
-  input {
-    position: absolute;
-    opacity: 0;
-    width: 0;
-    height: 0;
-    pointer-events: none;
-  }
-`;
-var y = Object.defineProperty, k = Object.getOwnPropertyDescriptor, i = (e, o, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? k(o, a) : o, l = e.length - 1, d; l >= 0; l--)
-    (d = e[l]) && (r = (s ? d(o, a, r) : d(r)) || r);
-  return s && r && y(o, a, r), r;
-};
-let t = class extends c {
-  constructor() {
-    super(...arguments), this.checked = !1, this.indeterminate = !1, this.error = !1, this.value = "on", this.handleClick = (e) => {
-      this.disabled || (e.preventDefault(), this.toggle());
-    }, this.handleKeyDown = (e) => {
-      this.disabled || (e.key === " " || e.key === "Enter") && (e.preventDefault(), this.toggle());
-    };
-  }
-  connectedCallback() {
-    super.connectedCallback(), this.tabIndex = this.disabled ? -1 : 0, this.addEventListener("click", this.handleClick), this.addEventListener("keydown", this.handleKeyDown), this.updateFormValue();
-  }
-  disconnectedCallback() {
-    super.disconnectedCallback(), this.removeEventListener("click", this.handleClick), this.removeEventListener("keydown", this.handleKeyDown);
-  }
-  updated(e) {
-    super.updated(e), (e.has("checked") || e.has("indeterminate") || e.has("value")) && this.updateFormValue();
-  }
-  formResetCallback() {
-    this.checked = !1, this.indeterminate = !1, this.updateFormValue();
-  }
-  updateFormValue() {
-    this.setFormValue(this.checked ? this.value : null), this.required && !this.checked ? this.setValidity({ valueMissing: !0 }, "Please check this box if you want to proceed") : this.setValidity({});
-  }
-  toggle() {
-    this.indeterminate ? (this.indeterminate = !1, this.checked = !0) : this.checked = !this.checked, this.updateFormValue(), this.emitEvent("change", { checked: this.checked, indeterminate: this.indeterminate }), this.emitEvent("input", { checked: this.checked, indeterminate: this.indeterminate });
-  }
-  render() {
-    return p`
-      <div class="container">
-        <md-ripple ?disabled=${this.disabled} unbounded></md-ripple>
-        <md-focus-ring></md-focus-ring>
-        <div class="box">
-          <!-- Checkmark SVG -->
-          <svg class="mark check" viewBox="0 0 18 18">
-            <polyline points="3.5,9.5 7,13 14.5,5.5"></polyline>
-          </svg>
-          <!-- Indeterminate Dash SVG -->
-          <svg class="mark dash" viewBox="0 0 18 18">
-            <line x1="3.5" y1="9" x2="14.5" y2="9"></line>
-          </svg>
-        </div>
-        <input
-          type="checkbox"
-          .checked=${this.checked}
-          .indeterminate=${this.indeterminate}
-          ?disabled=${this.disabled}
-          tabindex="-1"
-          aria-hidden="true"
-        />
-      </div>
-      <slot></slot>
-    `;
-  }
-};
-t.styles = [c.styles, b];
-i([
-  n({ type: Boolean, reflect: !0 })
-], t.prototype, "checked", 2);
-i([
-  n({ type: Boolean, reflect: !0 })
-], t.prototype, "indeterminate", 2);
-i([
-  n({ type: Boolean, reflect: !0 })
-], t.prototype, "error", 2);
-i([
-  n({ type: String })
-], t.prototype, "value", 2);
-i([
-  m("input")
-], t.prototype, "inputElement", 2);
-t = i([
-  u("md-checkbox")
-], t);
+import { t as r } from "../../chunks/checkbox-BqlboAHd.js";
 export {
-  t as MdCheckbox
+  r as MdCheckbox
 };
-//# sourceMappingURL=checkbox.js.map

package/dist/components/chip/chip.js

@@ -1,174 +1,5 @@
-import { css as b, nothing as m, html as i } from "lit";
-import { property as o, customElement as v } from "lit/decorators.js";
-import { M as a } from "../../chunks/base-component-DQTjlEVL.js";
-import "../../internal/ripple/ripple.js";
-import "../../chunks/focus-ring-Dl-XoEKK.js";
-import "../icon/icon.js";
-const y = b`
-  :host {
-    display: inline-flex;
-    outline: none;
-    vertical-align: middle;
-    -webkit-tap-highlight-color: transparent;
-  }
-
-  :host([disabled]) {
-    pointer-events: none;
-    opacity: 0.38;
-  }
-
-  .chip {
-    position: relative;
-    display: inline-flex;
-    align-items: center;
-    box-sizing: border-box;
-    height: 32px;
-    padding: 0 12px;
-    border-radius: var(--md-sys-shape-corner-small, 8px);
-    border: 1px solid var(--md-sys-color-outline, #79747E);
-    background-color: transparent;
-    color: var(--md-sys-color-on-surface, #1D1B20);
-    font-family: var(--md-sys-typescale-font-family, inherit);
-    font-size: var(--md-sys-typescale-label-large-size, 14px);
-    font-weight: 500;
-    line-height: 20px;
-    letter-spacing: 0.1px;
-    cursor: pointer;
-    user-select: none;
-    outline: none;
-    gap: 8px;
-    transition: background-color 150ms cubic-bezier(0.2, 0, 0, 1),
-                border-color 150ms cubic-bezier(0.2, 0, 0, 1),
-                box-shadow 150ms cubic-bezier(0.2, 0, 0, 1);
-    overflow: hidden;
-  }
-
-  :host([selected]) .chip {
-    background-color: var(--md-sys-color-secondary-container, #E8DEF8);
-    color: var(--md-sys-color-on-secondary-container, #1D192B);
-    border-color: transparent;
-  }
-
-  :host([variant="elevated"]) .chip {
-    background-color: var(--md-sys-color-surface-container-low, #F7F2FA);
-    border: none;
-    box-shadow: var(--md-sys-elevation-level1, 0px 1px 3px 1px rgba(0,0,0,0.15));
-  }
-
-  .icon {
-    display: inline-flex;
-    align-items: center;
-    color: var(--md-sys-color-primary, #6750A4);
-  }
-
-  .remove-btn {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    width: 18px;
-    height: 18px;
-    padding: 0;
-    border: none;
-    border-radius: 50%;
-    background: transparent;
-    color: var(--md-sys-color-on-surface-variant, #49454F);
-    cursor: pointer;
-    margin-left: 2px;
-  }
-
-  .remove-btn:hover {
-    background-color: rgba(29, 27, 32, 0.12);
-  }
-`, u = b`
-  :host {
-    display: flex;
-    flex-wrap: wrap;
-    align-items: center;
-    gap: 8px;
-  }
-`;
-var f = Object.defineProperty, g = Object.getOwnPropertyDescriptor, t = (s, n, c, l) => {
-  for (var r = l > 1 ? void 0 : l ? g(n, c) : n, d = s.length - 1, p; d >= 0; d--)
-    (p = s[d]) && (r = (l ? p(n, c, r) : p(r)) || r);
-  return l && r && f(n, c, r), r;
-};
-let e = class extends a {
-  constructor() {
-    super(...arguments), this.variant = "assist", this.label = "", this.icon = "", this.selected = !1, this.removable = !1, this.disabled = !1, this.handleClick = (s) => {
-      this.disabled || this.variant === "filter" && (this.selected = !this.selected, this.emitEvent("change", { selected: this.selected }));
-    }, this.handleRemove = (s) => {
-      s.stopPropagation(), this.emitEvent("remove");
-    };
-  }
-  connectedCallback() {
-    super.connectedCallback(), this.addEventListener("click", this.handleClick);
-  }
-  disconnectedCallback() {
-    super.disconnectedCallback(), this.removeEventListener("click", this.handleClick);
-  }
-  render() {
-    return i`
-      <div class="chip" tabindex=${this.disabled ? "-1" : "0"}>
-        <md-ripple ?disabled=${this.disabled}></md-ripple>
-        <md-focus-ring></md-focus-ring>
-
-        <span class="icon">
-          ${this.variant === "filter" && this.selected ? i`<md-icon name="check" size="18"></md-icon>` : i`
-                <slot name="icon">
-                  ${this.icon ? i`<md-icon name=${this.icon} size="18"></md-icon>` : m}
-                </slot>
-              `}
-        </span>
-
-        <slot>${this.label}</slot>
-
-        ${this.removable || this.variant === "input" ? i`
-              <button
-                class="remove-btn"
-                aria-label="Remove"
-                @click=${this.handleRemove}
-                tabindex="-1"
-              >
-                <md-icon name="close" size="16"></md-icon>
-              </button>
-            ` : m}
-      </div>
-    `;
-  }
-};
-e.styles = [a.styles, y];
-t([
-  o({ type: String, reflect: !0 })
-], e.prototype, "variant", 2);
-t([
-  o({ type: String })
-], e.prototype, "label", 2);
-t([
-  o({ type: String })
-], e.prototype, "icon", 2);
-t([
-  o({ type: Boolean, reflect: !0 })
-], e.prototype, "selected", 2);
-t([
-  o({ type: Boolean, reflect: !0 })
-], e.prototype, "removable", 2);
-t([
-  o({ type: Boolean, reflect: !0 })
-], e.prototype, "disabled", 2);
-e = t([
-  v("md-chip")
-], e);
-let h = class extends a {
-  render() {
-    return i`<slot></slot>`;
-  }
-};
-h.styles = [a.styles, u];
-h = t([
-  v("md-chip-set")
-], h);
+import { n as t, t as i } from "../../chunks/chip-CI1ZINnr.js";
 export {
-  e as MdChip,
-  h as MdChipSet
+  i as MdChip,
+  t as MdChipSet
 };
-//# sourceMappingURL=chip.js.map

package/dist/components/code/code.css.d.ts

@@ -0,0 +1,2 @@
+export declare const codeStyles: import('lit').CSSResult;
+//# sourceMappingURL=code.css.d.ts.map

package/dist/components/code/code.css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"code.css.d.ts","sourceRoot":"","sources":["../../../src/components/code/code.css.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,UAAU,yBAyatB,CAAC"}

package/dist/components/code/code.d.ts

@@ -0,0 +1,106 @@
+import { PropertyValues } from 'lit';
+import { MdBaseElement } from '../../internal/base-component.js';
+import { LintDiagnostic } from './linter.js';
+export type { LintDiagnostic };
+export declare class MdCode extends MdBaseElement {
+    static styles: import('lit').CSSResultGroup[];
+    /**
+     * Raw source code string. If not provided, falls back to slot/textContent.
+     */
+    code: string;
+    /**
+     * Language identifier (e.g. 'javascript', 'typescript', 'html', 'css', 'json', 'python', 'bash', 'sql').
+     */
+    language: string;
+    /**
+     * Alias for language.
+     */
+    lang: string;
+    /**
+     * Optional filename or label to display in the header bar.
+     */
+    label: string;
+    /**
+     * Alias for label (filename).
+     */
+    filename: string;
+    /**
+     * When true, automatically lints the code for syntax issues and displays diagnostics.
+     */
+    lint: boolean;
+    /**
+     * Custom / external diagnostic issues to display.
+     */
+    diagnostics: LintDiagnostic[];
+    /**
+     * Whether to show the lint issues summary bar at the bottom.
+     */
+    showLintSummary: boolean;
+    /**
+     * Whether to render line numbers in a gutter.
+     */
+    lineNumbers: boolean;
+    /**
+     * Line numbers to highlight, e.g. "1, 3-5, 8".
+     */
+    highlightLines: string;
+    /**
+     * Whether the code is copyable via the copy button.
+     */
+    copyable: boolean;
+    /**
+     * When true, hides the copy button.
+     */
+    hideCopyButton: boolean;
+    /**
+     * When true, wraps long lines instead of scrolling horizontally.
+     */
+    wrapLines: boolean;
+    /**
+     * Maximum height for the code scroll container (e.g. "300px").
+     */
+    maxHeight: string;
+    private isCopied;
+    private isIssuesExpanded;
+    private internalCode;
+    private activeDiagnostics;
+    private copyTimeout;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    willUpdate(changedProperties: PropertyValues): void;
+    private extractCodeContent;
+    /**
+     * Strips common leading indentation from multi-line template strings.
+     */
+    private normalizeIndentation;
+    /**
+     * Performs linting and combines internal and external diagnostics.
+     */
+    runLint(): LintDiagnostic[];
+    /**
+     * Active effective language.
+     */
+    get effectiveLanguage(): string;
+    /**
+     * Effective filename / label.
+     */
+    get effectiveLabel(): string;
+    /**
+     * Copies the current unhighlighted code to clipboard.
+     */
+    copy(): Promise<boolean>;
+    private parseHighlightedLines;
+    private handleSlotChange;
+    private toggleIssuesList;
+    private scrollToLine;
+    render(): import('lit-html').TemplateResult<1>;
+}
+export declare class MdCodeBlock extends MdCode {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'md-code': MdCode;
+        'md-code-block': MdCodeBlock;
+    }
+}
+//# sourceMappingURL=code.d.ts.map

package/dist/components/code/code.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"code.d.ts","sourceRoot":"","sources":["../../../src/components/code/code.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,cAAc,EAAE,MAAM,KAAK,CAAC;AAGpD,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AAGjE,OAAO,EAAY,cAAc,EAAE,MAAM,aAAa,CAAC;AACvD,OAAO,iBAAiB,CAAC;AAEzB,YAAY,EAAE,cAAc,EAAE,CAAC;AAE/B,qBACa,MAAO,SAAQ,aAAa;IACvC,OAAgB,MAAM,iCAAsC;IAE5D;;OAEG;IAEH,IAAI,SAAM;IAEV;;OAEG;IAEH,QAAQ,SAAe;IAEvB;;OAEG;IAEM,IAAI,SAAM;IAEnB;;OAEG;IAEH,KAAK,SAAM;IAEX;;OAEG;IAEH,QAAQ,SAAM;IAEd;;OAEG;IAEH,IAAI,UAAS;IAEb;;OAEG;IAEH,WAAW,EAAE,cAAc,EAAE,CAAM;IAEnC;;OAEG;IASH,eAAe,UAAQ;IAEvB;;OAEG;IAEH,WAAW,UAAS;IAEpB;;OAEG;IAEH,cAAc,SAAM;IAEpB;;OAEG;IASH,QAAQ,UAAQ;IAEhB;;OAEG;IAEH,cAAc,UAAS;IAEvB;;OAEG;IAEH,SAAS,UAAS;IAElB;;OAEG;IAEH,SAAS,SAAM;IAGf,OAAO,CAAC,QAAQ,CAAS;IAGzB,OAAO,CAAC,gBAAgB,CAAS;IAGjC,OAAO,CAAC,YAAY,CAAM;IAG1B,OAAO,CAAC,iBAAiB,CAAwB;IAEjD,OAAO,CAAC,WAAW,CAA8C;IAExD,iBAAiB;IAKjB,oBAAoB;IAQpB,UAAU,CAAC,iBAAiB,EAAE,cAAc;IASrD,OAAO,CAAC,kBAAkB;IAO1B;;OAEG;IACH,OAAO,CAAC,oBAAoB;IAe5B;;OAEG;IACI,OAAO,IAAI,cAAc,EAAE;IAsBlC;;OAEG;IACH,IAAI,iBAAiB,IAAI,MAAM,CAE9B;IAED;;OAEG;IACH,IAAI,cAAc,IAAI,MAAM,CAE3B;IAED;;OAEG;IACU,IAAI,IAAI,OAAO,CAAC,OAAO,CAAC;IAiCrC,OAAO,CAAC,qBAAqB;IAsB7B,OAAO,CAAC,gBAAgB,CAKtB;IAEF,OAAO,CAAC,gBAAgB,CAEtB;IAEF,OAAO,CAAC,YAAY;IAOX,MAAM;CA8KhB;AAGD,qBACa,WAAY,SAAQ,MAAM;CAAG;AAE1C,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,SAAS,EAAE,MAAM,CAAC;QAClB,eAAe,EAAE,WAAW,CAAC;KAC9B;CACF"}

package/dist/components/code/code.js

@@ -0,0 +1,5 @@
+import { n as d, t as e } from "../../chunks/code-C5UFBkCh.js";
+export {
+  e as MdCode,
+  d as MdCodeBlock
+};

package/dist/components/code/highlighter.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Lightweight, robust syntax highlighter for common programming and markup languages.
+ */
+/**
+ * Main syntax highlight dispatcher.
+ */
+export declare function highlightCode(code: string, language: string): string;
+//# sourceMappingURL=highlighter.d.ts.map

package/dist/components/code/highlighter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"highlighter.d.ts","sourceRoot":"","sources":["../../../src/components/code/highlighter.ts"],"names":[],"mappings":"AAAA;;GAEG;AA+pBH;;GAEG;AACH,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,MAAM,CAoCpE"}

package/dist/components/code/linter.d.ts

@@ -0,0 +1,44 @@
+export interface LintDiagnostic {
+    line: number;
+    column?: number;
+    message: string;
+    severity?: 'error' | 'warning' | 'info';
+    rule?: string;
+}
+/**
+ * Lints JSON code and returns diagnostics for syntax errors, trailing commas, unquoted keys, etc.
+ */
+export declare function lintJson(code: string): LintDiagnostic[];
+/**
+ * Lints JavaScript and TypeScript code for common syntax issues.
+ */
+export declare function lintJavaScript(code: string): LintDiagnostic[];
+/**
+ * Lints HTML/XML code for unclosed or mismatched tags and attribute errors.
+ */
+export declare function lintHtml(code: string): LintDiagnostic[];
+/**
+ * Lints CSS code for unclosed braces, missing colons, and malformed declarations.
+ */
+export declare function lintCss(code: string): LintDiagnostic[];
+/**
+ * Lints Python code for indentation consistency, missing colons, and bracket balance.
+ */
+export declare function lintPython(code: string): LintDiagnostic[];
+/**
+ * Lints Bash/Shell code for unclosed quotes, missing control block terminators (fi, done, esac).
+ */
+export declare function lintBash(code: string): LintDiagnostic[];
+/**
+ * Lints YAML code for tab indentation and syntax anomalies.
+ */
+export declare function lintYaml(code: string): LintDiagnostic[];
+/**
+ * Lints Markdown code for broken links and unclosed code blocks.
+ */
+export declare function lintMarkdown(code: string): LintDiagnostic[];
+/**
+ * Master lint function for any supported language.
+ */
+export declare function lintCode(code: string, language: string): LintDiagnostic[];
+//# sourceMappingURL=linter.d.ts.map

package/dist/components/code/linter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"linter.d.ts","sourceRoot":"","sources":["../../../src/components/code/linter.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,GAAG,MAAM,CAAC;IACxC,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED;;GAEG;AACH,wBAAgB,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,cAAc,EAAE,CAsGvD;AAED;;GAEG;AACH,wBAAgB,cAAc,CAAC,IAAI,EAAE,MAAM,GAAG,cAAc,EAAE,CAgK7D;AAED;;GAEG;AACH,wBAAgB,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,cAAc,EAAE,CAyEvD;AAED;;GAEG;AACH,wBAAgB,OAAO,CAAC,IAAI,EAAE,MAAM,GAAG,cAAc,EAAE,CA4EtD;AAED;;GAEG;AACH,wBAAgB,UAAU,CAAC,IAAI,EAAE,MAAM,GAAG,cAAc,EAAE,CAqGzD;AAED;;GAEG;AACH,wBAAgB,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,cAAc,EAAE,CAqEvD;AAED;;GAEG;AACH,wBAAgB,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,cAAc,EAAE,CAiCvD;AAED;;GAEG;AACH,wBAAgB,YAAY,CAAC,IAAI,EAAE,MAAM,GAAG,cAAc,EAAE,CAgC3D;AAED;;GAEG;AACH,wBAAgB,QAAQ,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,cAAc,EAAE,CAwCzE"}