@redvars/peacock 3.8.3 → 3.8.4

package/dist/button-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"button-group.js","sources":["../../src/button/button-group/button-group.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './button-group.scss';\nimport { Button, ButtonColor } from '../button/button.js';\nimport { IconButton } from '../icon-button/icon-button.js';\n\n/**\n * @label Button Group\n * @tag wc-button-group\n * @rawTag button-group\n *\n * @summary Group a series of buttons together on a single line with the button group, and super-power.\n\n * @example\n * ```html\n * <wc-button-group connected>\n *  <wc-icon-button toggle=\"true\" shape=\"wide\" selected>\n *    <wc-icon name=\"format_bold\"></wc-icon>\n *  </wc-icon-button>\n *  <wc-icon-button toggle=\"true\" shape=\"wide\">\n *    <wc-icon name=\"format_italic\"></wc-icon>\n *  </wc-icon-button>\n *  <wc-icon-button toggle=\"true\" shape=\"wide\">\n *    <wc-icon name=\"format_underlined\"></wc-icon>\n *  </wc-icon-button>\n * </wc-button-group>\n * ```\n *\n * @tags controls\n */\n@IndividualComponent\nclass ButtonGroup extends LitElement {\n  // Lit prefers CSS-in-JS for better performance and scoping.\n  // If you prefer keeping the SCSS file, you'll need a build tool (like Vite or Webpack)\n  // that can import .scss files as lit-css.\n  static styles = [styles];\n\n  static Button = Button;\n\n  static IconButton = IconButton;\n\n  /**\n   * Button size.\n   * Possible values are `\"sm\"`, `\"md\"`, `\"lg\"`. Defaults to `\"md\"`.\n   */\n  @property({ reflect: true }) size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' = 'sm';\n\n  /**\n   * Layout variant of the button group.\n   * `\"standard\"` shows buttons with a small gap between them.\n   * `\"connected\"` places buttons with a 2px gap;\n   * rounded outer corners and middle buttons keep standard rounded corners.\n   * Defaults to `\"standard\"`.\n   */\n  @property({ type: Boolean, reflect: true }) connected = false;\n\n  /**\n   * Color applied to all buttons in the group.\n   * Possible values are `\"primary\"`, `\"success\"`, `\"danger\"`, `\"warning\"`, `\"surface\"`, `\"on-surface\"`.\n   */\n  @property({ reflect: true }) color?: ButtonColor;\n\n  /**\n   * Visual style applied to all buttons in the group.\n   * Possible values are `\"filled\"`, `\"tonal\"`, `\"outlined\"`.\n   */\n  @property({ attribute: 'variant', reflect: true }) variant?:\n    | 'filled'\n    | 'tonal'\n    | 'outlined';\n\n  override updated() {\n    this._syncButtonProperties();\n  }\n\n  private _getSlottedElements(): HTMLElement[] {\n    const slot = this.shadowRoot?.querySelector('slot');\n    return (slot?.assignedElements({ flatten: true }) ?? []) as HTMLElement[];\n  }\n\n  private _syncButtonProperties() {\n    const children = this._getSlottedElements();\n    children.forEach((child, index) => {\n      ['color', 'variant', 'toggle', 'size'].forEach(prop => {\n        // @ts-ignore\n        if (this[prop] && prop in child) {\n          // @ts-ignore\n          (child as any)[prop] = this[prop];\n        }\n      });\n    });\n  }\n\n  render() {\n    return html`\n      <slot @slotchange=${() => this._syncButtonProperties()}></slot>\n    `;\n  }\n}\n\nexport default ButtonGroup;\n"],"names":["LitElement","html","styles","property"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA;;;;;;;;;;;;;;;;;;;;;;;AAuBG;AAEH,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQA,GAAU,CAAA;AAApC,IAAA,WAAA,GAAA;;AAUE;;;AAGG;QAC0B,IAAA,CAAA,IAAI,GAAqC,IAAI;AAE1E;;;;;;AAMG;QACyC,IAAA,CAAA,SAAS,GAAG,KAAK;IA4C/D;IA3BW,OAAO,GAAA;QACd,IAAI,CAAC,qBAAqB,EAAE;IAC9B;IAEQ,mBAAmB,GAAA;QACzB,MAAM,IAAI,GAAG,IAAI,CAAC,UAAU,EAAE,aAAa,CAAC,MAAM,CAAC;AACnD,QAAA,QAAQ,IAAI,EAAE,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,IAAI,EAAE;IACzD;IAEQ,qBAAqB,GAAA;AAC3B,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,mBAAmB,EAAE;QAC3C,QAAQ,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,KAAK,KAAI;AAChC,YAAA,CAAC,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAC,OAAO,CAAC,IAAI,IAAG;;gBAEpD,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,KAAK,EAAE;;oBAE9B,KAAa,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC;gBACnC;AACF,YAAA,CAAC,CAAC;AACJ,QAAA,CAAC,CAAC;IACJ;IAEA,MAAM,GAAA;AACJ,QAAA,OAAOC,CAAI,CAAA;AACW,wBAAA,EAAA,MAAM,IAAI,CAAC,qBAAqB,EAAE,CAAA;KACvD;IACH;;AAjEA;AACA;AACA;AACO,WAAA,CAAA,MAAM,GAAG,CAACC,QAAM,CAAC;AAEjB,WAAA,CAAA,MAAM,GAAG,MAAH;AAEN,WAAA,CAAA,UAAU,GAAG,UAAH;AAMY,UAAA,CAAA;AAA5B,IAAAC,CAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE;AAAgD,CAAA,EAAA,WAAA,CAAA,SAAA,EAAA,MAAA,EAAA,MAAA,CAAA;AAS/B,UAAA,CAAA;IAA3CA,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAAoB,CAAA,EAAA,WAAA,CAAA,SAAA,EAAA,WAAA,EAAA,MAAA,CAAA;AAMjC,UAAA,CAAA;AAA5B,IAAAA,CAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE;AAAsB,CAAA,EAAA,WAAA,CAAA,SAAA,EAAA,OAAA,EAAA,MAAA,CAAA;AAME,UAAA,CAAA;IAAlDA,CAAQ,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE;AAGlC,CAAA,EAAA,WAAA,CAAA,SAAA,EAAA,SAAA,EAAA,MAAA,CAAA;AAtCX,WAAW,GAAA,UAAA,CAAA;IADhB;AACK,CAAA,EAAA,WAAW,CAmEhB;AAED,oBAAe,WAAW;;;;"}
+{"version":3,"file":"button-group.js","sources":["../../src/button/button-group/button-group.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './button-group.scss';\nimport { Button, ButtonColor } from '../button/button.js';\nimport { IconButton } from '../icon-button/icon-button.js';\n\n/**\n * @label Button Group\n * @tag wc-button-group\n * @rawTag button-group\n *\n * @summary Group a series of buttons together on a single line with the button group, and super-power.\n\n * @example\n * ```html\n * <wc-button-group connected>\n *  <wc-icon-button toggle=\"true\" shape=\"wide\" selected>\n *    <wc-icon name=\"format_bold\"></wc-icon>\n *  </wc-icon-button>\n *  <wc-icon-button toggle=\"true\" shape=\"wide\">\n *    <wc-icon name=\"format_italic\"></wc-icon>\n *  </wc-icon-button>\n *  <wc-icon-button toggle=\"true\" shape=\"wide\">\n *    <wc-icon name=\"format_underlined\"></wc-icon>\n *  </wc-icon-button>\n * </wc-button-group>\n * ```\n *\n * @tags controls\n */\n@IndividualComponent\nclass ButtonGroup extends LitElement {\n  // Lit prefers CSS-in-JS for better performance and scoping.\n  // If you prefer keeping the SCSS file, you'll need a build tool (like Vite or Webpack)\n  // that can import .scss files as lit-css.\n  static styles = [styles];\n\n  static Button = Button;\n\n  static IconButton = IconButton;\n\n  /**\n   * Button size.\n   * Possible values are `\"sm\"`, `\"md\"`, `\"lg\"`. Defaults to `\"md\"`.\n   */\n  @property({ reflect: true }) size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' = 'sm';\n\n  /**\n   * Layout variant of the button group.\n   * `\"standard\"` shows buttons with a small gap between them.\n   * `\"connected\"` places buttons with a 2px gap;\n   * rounded outer corners and middle buttons keep standard rounded corners.\n   * Defaults to `\"standard\"`.\n   */\n  @property({ type: Boolean, reflect: true }) connected = false;\n\n  /**\n   * Color applied to all buttons in the group.\n   * Possible values are `\"primary\"`, `\"success\"`, `\"danger\"`, `\"warning\"`, `\"surface\"`, `\"on-surface\"`.\n   */\n  @property({ reflect: true }) color?: ButtonColor;\n\n  /**\n   * Visual style applied to all buttons in the group.\n   * Possible values are `\"filled\"`, `\"tonal\"`, `\"outlined\"`.\n   */\n  @property({ attribute: 'variant', reflect: true }) variant?:\n    | 'filled'\n    | 'tonal'\n    | 'outlined';\n\n  override updated() {\n    this._syncButtonProperties();\n  }\n\n  private _getSlottedElements(): HTMLElement[] {\n    const slot = this.shadowRoot?.querySelector('slot');\n    return (slot?.assignedElements({ flatten: true }) ?? []) as HTMLElement[];\n  }\n\n  private _syncButtonProperties() {\n    const children = this._getSlottedElements();\n    children.forEach((child, index) => {\n      ['color', 'variant', 'toggle', 'size'].forEach(prop => {\n        // @ts-ignore\n        if (this[prop] && prop in child) {\n          // @ts-ignore\n          (child as any)[prop] = this[prop];\n        }\n      });\n    });\n  }\n\n  render() {\n    return html`\n      <slot @slotchange=${() => this._syncButtonProperties()}></slot>\n    `;\n  }\n}\n\nexport default ButtonGroup;\n"],"names":["LitElement","html","styles","property"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA;;;;;;;;;;;;;;;;;;;;;;;AAuBG;AAEH,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQA,GAAU,CAAA;AAApC,IAAA,WAAA,GAAA;;AAUE;;;AAGG;QAC0B,IAAA,CAAA,IAAI,GAAqC,IAAI;AAE1E;;;;;;AAMG;QACyC,IAAA,CAAA,SAAS,GAAG,KAAK;IA4C/D;IA3BW,OAAO,GAAA;QACd,IAAI,CAAC,qBAAqB,EAAE;IAC9B;IAEQ,mBAAmB,GAAA;QACzB,MAAM,IAAI,GAAG,IAAI,CAAC,UAAU,EAAE,aAAa,CAAC,MAAM,CAAC;AACnD,QAAA,QAAQ,IAAI,EAAE,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,IAAI,EAAE;IACzD;IAEQ,qBAAqB,GAAA;AAC3B,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,mBAAmB,EAAE;QAC3C,QAAQ,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,KAAK,KAAI;AAChC,YAAA,CAAC,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAC,OAAO,CAAC,IAAI,IAAG;;gBAEpD,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,KAAK,EAAE;;oBAE9B,KAAa,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC;gBACnC;AACF,YAAA,CAAC,CAAC;AACJ,QAAA,CAAC,CAAC;IACJ;IAEA,MAAM,GAAA;AACJ,QAAA,OAAOC,CAAI,CAAA;AACW,wBAAA,EAAA,MAAM,IAAI,CAAC,qBAAqB,EAAE,CAAA;KACvD;IACH;;AAjEA;AACA;AACA;AACO,WAAA,CAAA,MAAM,GAAG,CAACC,QAAM,CAAC;AAEjB,WAAA,CAAA,MAAM,GAAG,MAAH;AAEN,WAAA,CAAA,UAAU,GAAG,UAAH;AAMY,UAAA,CAAA;AAA5B,IAAAC,CAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE;AAAgD,CAAA,EAAA,WAAA,CAAA,SAAA,EAAA,MAAA,EAAA,MAAA,CAAA;AAS/B,UAAA,CAAA;IAA3CA,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAAoB,CAAA,EAAA,WAAA,CAAA,SAAA,EAAA,WAAA,EAAA,MAAA,CAAA;AAMjC,UAAA,CAAA;AAA5B,IAAAA,CAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE;AAAsB,CAAA,EAAA,WAAA,CAAA,SAAA,EAAA,OAAA,EAAA,MAAA,CAAA;AAME,UAAA,CAAA;IAAlDA,CAAQ,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE;AAGlC,CAAA,EAAA,WAAA,CAAA,SAAA,EAAA,SAAA,EAAA,MAAA,CAAA;AAtCX,WAAW,GAAA,UAAA,CAAA;IADhB;AACK,CAAA,EAAA,WAAW,CAmEhB;AAED,oBAAe,WAAW;;;;"}

package/dist/button.js

@@ -168,6 +168,7 @@ var css_248z = i`.button {
 
 * {
   box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
 }
 
 .screen-reader-only {
@@ -882,10 +883,10 @@ let Button = class Button extends mixinBaseButton(mixinHyperlink(mixinDelegatesA
         super();
         // ── Properties ───────────────────────────────────────────────────────────
         /**
-         * Icon alignment.
-         * Possible values are `"start"`, `"end"`. Defaults to `"end"`.
+         * When `true` (default), the icon is placed after the label (trailing).
+         * When `false`, the icon is placed before the label (leading).
          */
-        this.trailingIcon = false;
+        this.trailingIcon = true;
         /**
          * Button size.
          * Possible values are `"xs"`, `"sm"`, `"md"`, `"lg"`, `"xl"`. Defaults to `"sm"`.

package/dist/button.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.js","sources":["../../src/button/button/button.ts"],"sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { when } from 'lit/directives/when.js';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './button.scss';\n\nimport type {\n  ButtonSize,\n  ButtonLevel,\n  ButtonShape,\n  ButtonVariant,\n  ButtonColor,\n} from '@/button/ButtonTypes.js';\nimport { isLink } from '@/__internal/utils/is-link.js';\nimport { observerSlotChangesWithCallback } from '@/__internal/utils/observe-slot-change.js';\nimport {\n  dispatchActivationClick,\n  isActivationClick,\n} from '@/__internal/utils/dispatch-event-utils.js';\nimport { DISABLED_REASON_ID } from '@/button/ButtonConstants.js';\nimport { mixinDelegatesAria } from '@/__internal/aria/delegate.js';\nimport { ARIAMixinStrict } from '@/__internal/aria/aria.js';\nimport { mixinFormSubmitter } from '@/__internal/mixins/form-submitter.js';\nimport { mixinElementInternals } from '@/__internal/mixins/element-internals.js';\nimport { mixinBaseButton } from '../base-button/base-button.js';\nimport { mixinFormAssociated } from '@/__internal/mixins/form-associated.js';\nimport { mixinHyperlink } from '@/__internal/mixins/hyperlink.js';\nexport type {\n  ButtonSize,\n  ButtonLevel,\n  ButtonShape,\n  ButtonVariant,\n  ButtonColor,\n} from '@/button/ButtonTypes.js';\n\n/**\n * @label Button\n * @tag wc-button\n * @rawTag button\n *\n * @summary Buttons help people initiate actions, from sending an email, to sharing a document, to liking a post.\n * @overview\n * <p>Buttons are clickable elements that are used to trigger actions. They communicate calls to action to the user and allow users to interact with pages in a variety of ways. Button labels express what action will occur when the user interacts with it.</p>\n *\n * @cssprop --button-container-shape: Defines the border radius of the button container shape.\n *\n * @cssprop --button-container-shape-start-start: Defines the start position of the button container shape.\n * @cssprop --button-container-shape-start-end: Defines the end position of the button container shape.\n * @cssprop --button-container-shape-end-start: Defines the start position of the button container shape.\n * @cssprop --button-container-shape-end-end: Defines the end position of the button container shape.\n *\n *\n * @cssprop --filled-button-container-color: Color of the filled button container.\n * @cssprop --filled-button-label-text-color: Text color of the filled button label.\n *\n * @cssprop --outlined-button-container-color: Color of the outlined button container.\n * @cssprop --outlined-button-label-text-color: Text color of the outlined button label.\n *\n * @cssprop --text-button-label-text-color: Text color of the text button label.\n *\n * @cssprop --tonal-button-container-color: Color of the tonal button container.\n * @cssprop --tonal-button-label-text-color: Text color of the tonal button label.\n *\n * @cssprop --elevated-button-container-color: Color of the elevated button container.\n * @cssprop --elevated-button-label-text-color: Text color of the elevated button label.\n *\n * @cssprop --neo-button-container-color: Color of the neo button container.\n * @cssprop --neo-button-label-text-color: Text color of the neo button label.\n *\n * @fires {MouseEvent} click - Dispatched when the button is clicked.\n *\n * @example\n * ```html\n * <wc-button>Button</wc-button>\n * ```\n * @tags display\n */\n@IndividualComponent\nexport class Button extends mixinBaseButton(\n  mixinHyperlink(\n    mixinDelegatesAria(\n      mixinFormSubmitter(\n        mixinFormAssociated(mixinElementInternals(LitElement)),\n      ),\n    ),\n  ),\n) {\n  // ── Static ───────────────────────────────────────────────────────────────\n\n  /** @nocollapse */ // eslint-disable-next-line\n  static override shadowRootOptions: ShadowRootInit = {\n    mode: 'open',\n    delegatesFocus: true,\n  };\n\n  static override styles = [styles];\n\n  // ── Properties ───────────────────────────────────────────────────────────\n\n  /**\n   * Icon alignment.\n   * Possible values are `\"start\"`, `\"end\"`. Defaults to `\"end\"`.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'trailing-icon' })\n  trailingIcon = false;\n\n  /**\n   * Button size.\n   * Possible values are `\"xs\"`, `\"sm\"`, `\"md\"`, `\"lg\"`, `\"xl\"`. Defaults to `\"sm\"`.\n   */\n  @property({ reflect: true }) size: ButtonSize = 'sm';\n\n  /**\n   * Level is preset of color and variant. If Level provided it overrides the default color and variant.\n   */\n  @property({ type: String }) level?: ButtonLevel;\n\n  /** Shape of the button container. */\n  @property({ type: String, reflect: true }) shape: ButtonShape = 'square';\n\n  /**\n   * The visual style of the button.\n   *\n   *  Possible variant values:\n   * `\"filled\"` is a filled button.\n   * `\"outlined\"` is an outlined button.\n   * `\"text\"` is a transparent button.\n   * `\"tonal\"` is a light color button.\n   * `\"elevated\"` is elevated button\n   */\n  @property({ reflect: true }) variant: ButtonVariant = 'filled';\n\n  /**\n   * Defines the primary color of the button. This can be set to predefined color names to apply specific color themes.\n   */\n  @property({ reflect: true }) color: ButtonColor = 'primary';\n\n  /** When true, renders the button in a loading skeleton state. */\n  @property({ type: Boolean, reflect: true }) skeleton: boolean = false;\n\n  /** When true, the button acts as a toggle. Use with `selected`. */\n  @property({ type: Boolean, reflect: true }) toggle: boolean = false;\n\n  /** When true (and `toggle` is set), the button is in the selected/pressed state. */\n  @property({ type: Boolean, reflect: true }) selected: boolean = false;\n\n  /** Optional tooltip text displayed on hover. */\n  @property() tooltip?: string;\n\n  // ── Queries ───────────────────────────────────────────────────────────────\n\n  @query('.button') private readonly buttonElement!: HTMLElement | null;\n\n  // ── Private fields ────────────────────────────────────────────────────────\n\n  /** Cleanup returned by observerSlotChangesWithCallback for the icon slot. */\n  private __iconSlotCleanup: (() => void) | null = null;\n\n  /** Cleanup returned by observerSlotChangesWithCallback for the label slot. */\n  private __labelSlotCleanup: (() => void) | null = null;\n\n  // ── Constructor ───────────────────────────────────────────────────────────\n\n  constructor() {\n    super();\n    this.addEventListener('click', this.__dispatchClickWithThrottle);\n  }\n\n  // ── Lifecycle ─────────────────────────────────────────────────────────────\n\n  override disconnectedCallback() {\n    // disconnect slot observers first to avoid callbacks during teardown\n    try {\n      this.__iconSlotCleanup?.();\n    } catch (e) {\n      /* ignore */\n    }\n    try {\n      this.__labelSlotCleanup?.();\n    } catch (e) {\n      /* ignore */\n    }\n\n    super.disconnectedCallback();\n  }\n\n  override firstUpdated(changedProperties: Map<PropertyKey, unknown>) {\n    super.firstUpdated(changedProperties);\n    this.__convertTypeToVariantAndColor();\n    // Initialize slot presence tracking for smooth transitions when label/icon are added/removed\n    const iconSlot = this.renderRoot.querySelector(\n      'slot[name=\"icon\"]',\n    ) as HTMLSlotElement | null;\n    const labelSlot = this.renderRoot.querySelector(\n      'slot.label',\n    ) as HTMLSlotElement | null;\n\n    // Use MutationObserver-based helper so we react to content/character changes\n    if (iconSlot) {\n      this.__iconSlotCleanup = observerSlotChangesWithCallback(\n        iconSlot,\n        has => {\n          this.toggleAttribute('has-icon', has);\n        },\n      );\n    }\n\n    if (labelSlot) {\n      this.__labelSlotCleanup = observerSlotChangesWithCallback(\n        labelSlot,\n        has => {\n          this.toggleAttribute('has-label', has);\n        },\n      );\n    }\n  }\n\n  // ── Public methods ────────────────────────────────────────────────────────\n\n  override focus() {\n    this.buttonElement?.focus();\n  }\n\n  override blur() {\n    this.buttonElement?.blur();\n  }\n\n  // ── Private methods ───────────────────────────────────────────────────────\n\n  __convertTypeToVariantAndColor() {\n    if (this.level === 'primary') {\n      this.color = 'primary';\n      this.variant = 'filled';\n    } else if (this.level === 'secondary') {\n      this.color = 'surface';\n      this.variant = 'tonal';\n    } else if (this.level === 'tertiary') {\n      this.color = 'primary';\n      this.variant = 'text';\n    } else if (this.level === 'danger') {\n      this.color = 'danger';\n      this.variant = 'filled';\n    }\n  }\n\n  __dispatchClick = (event: MouseEvent | KeyboardEvent) => {\n    // If the button is soft-disabled or a disabled link, we need to explicitly\n    // prevent the click from propagating to other event listeners as well as\n    // prevent the default action.\n    if (this.softDisabled || (this.disabled && this.href) || this.skeleton) {\n      event.stopImmediatePropagation();\n      event.preventDefault();\n      return;\n    }\n\n    if (!isActivationClick(event) || !this.buttonElement) {\n      return;\n    }\n\n    this.focus();\n    dispatchActivationClick(this.buttonElement);\n  };\n\n  // ── Render helpers ────────────────────────────────────────────────────────\n\n  renderButtonElement() {\n    const isElementLink = isLink(this);\n\n    const cssClasses: any = {\n      button: true,\n      'native-button': !isElementLink,\n      'native-link': isElementLink,\n      'trailing-icon': this.trailingIcon,\n    };\n\n    // Needed for closure conformance\n    const { ariaLabel, ariaHasPopup, ariaExpanded } = this as ARIAMixinStrict;\n\n    if (isElementLink) {\n      return html`<a\n        class=${classMap(cssClasses)}\n        id=\"link\"\n        href=${this.href}\n        target=${this.target}\n        tabindex=${this.disabled ? '-1' : '0'}\n        aria-label=\"${ariaLabel || nothing}\"\n        aria-haspopup=\"${ariaHasPopup || nothing}\"\n        aria-expanded=\"${ariaExpanded || nothing}\"\n        aria-describedby=${ifDefined(\n          this.softDisabled ? DISABLED_REASON_ID : undefined,\n        )}\n        ?aria-disabled=${this.softDisabled}\n      >\n        ${this.renderButtonContent()}\n      </a>`;\n    }\n    return html`<button\n        class=${classMap(cssClasses)}\n        id=\"button\"\n        aria-label=\"${ariaLabel || nothing}\"\n        aria-haspopup=\"${ariaHasPopup || nothing}\"\n        aria-expanded=\"${ariaExpanded || nothing}\"\n        aria-describedby=${ifDefined(\n          this.softDisabled ? DISABLED_REASON_ID : undefined,\n        )}\n        ?aria-disabled=${this.softDisabled}\n        ?disabled=${this.disabled}\n      >\n        ${this.renderButtonContent()}\n      </button>\n      ${this.renderTooltip()}`;\n  }\n\n  renderButtonContent() {\n    return html` <slot class=\"icon-slot\" name=\"icon\"></slot>\n      <slot class=\"label\"></slot>\n      <div class=\"touch\"></div>\n\n      ${this.renderDisabledReason(this.softDisabled)}`;\n  }\n\n  renderDisabledReason(softDisabled: boolean) {\n    if (softDisabled)\n      return html`<div\n        id=${DISABLED_REASON_ID}\n        role=\"tooltip\"\n        aria-label=${this.disabledReason}\n        class=\"screen-reader-only\"\n      >\n        ${this.disabledReason}\n      </div>`;\n    return nothing;\n  }\n\n  renderTooltip() {\n    if (this.tooltip) {\n      const buttonId = isLink(this) ? 'link' : 'button';\n      return html`<wc-tooltip class=\"tooltip\" for=${buttonId}\n        >${this.tooltip}</wc-tooltip\n      >`;\n    }\n    return nothing;\n  }\n\n  // ── Render ────────────────────────────────────────────────────────────────\n\n  override render() {\n    const buttonId = isLink(this) ? 'link' : 'button';\n\n    return html`\n      <wc-focus-ring class=\"focus-ring\" for=${buttonId}></wc-focus-ring>\n      <wc-elevation class=\"elevation\"></wc-elevation>\n      ${when(\n        this.variant === 'neo',\n        () => html`<div class=\"neo-background\"></div>`,\n      )}\n      <div class=\"background\"></div>\n      ${when(\n        this.variant === 'outlined' || this.variant === 'neo',\n        () => html`<div class=\"outline\"></div>`,\n      )}\n      <wc-ripple class=\"ripple\" for=${buttonId}></wc-ripple>\n      <wc-skeleton class=\"skeleton\"></wc-skeleton>\n\n      ${this.renderButtonElement()} ${this.renderTooltip()}\n    `;\n  }\n}\n"],"names":["LitElement","html","classMap","nothing","ifDefined","when","styles","property","query"],"mappings":"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"}
+{"version":3,"file":"button.js","sources":["../../src/button/button/button.ts"],"sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { when } from 'lit/directives/when.js';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './button.scss';\n\nimport type {\n  ButtonSize,\n  ButtonLevel,\n  ButtonShape,\n  ButtonVariant,\n  ButtonColor,\n} from '@/button/ButtonTypes.js';\nimport { isLink } from '@/__internal/utils/is-link.js';\nimport { observerSlotChangesWithCallback } from '@/__internal/utils/observe-slot-change.js';\nimport {\n  dispatchActivationClick,\n  isActivationClick,\n} from '@/__internal/utils/dispatch-event-utils.js';\nimport { DISABLED_REASON_ID } from '@/button/ButtonConstants.js';\nimport { mixinDelegatesAria } from '@/__internal/aria/delegate.js';\nimport { ARIAMixinStrict } from '@/__internal/aria/aria.js';\nimport { mixinFormSubmitter } from '@/__internal/mixins/form-submitter.js';\nimport { mixinElementInternals } from '@/__internal/mixins/element-internals.js';\nimport { mixinBaseButton } from '../base-button/base-button.js';\nimport { mixinFormAssociated } from '@/__internal/mixins/form-associated.js';\nimport { mixinHyperlink } from '@/__internal/mixins/hyperlink.js';\nexport type {\n  ButtonSize,\n  ButtonLevel,\n  ButtonShape,\n  ButtonVariant,\n  ButtonColor,\n} from '@/button/ButtonTypes.js';\n\n/**\n * @label Button\n * @tag wc-button\n * @rawTag button\n *\n * @summary Buttons help people initiate actions, from sending an email, to sharing a document, to liking a post.\n * @overview\n * <p>Buttons are clickable elements that are used to trigger actions. They communicate calls to action to the user and allow users to interact with pages in a variety of ways. Button labels express what action will occur when the user interacts with it.</p>\n *\n * @cssprop --button-container-shape: Defines the border radius of the button container shape.\n *\n * @cssprop --button-container-shape-start-start: Defines the start position of the button container shape.\n * @cssprop --button-container-shape-start-end: Defines the end position of the button container shape.\n * @cssprop --button-container-shape-end-start: Defines the start position of the button container shape.\n * @cssprop --button-container-shape-end-end: Defines the end position of the button container shape.\n *\n *\n * @cssprop --filled-button-container-color: Color of the filled button container.\n * @cssprop --filled-button-label-text-color: Text color of the filled button label.\n *\n * @cssprop --outlined-button-container-color: Color of the outlined button container.\n * @cssprop --outlined-button-label-text-color: Text color of the outlined button label.\n *\n * @cssprop --text-button-label-text-color: Text color of the text button label.\n *\n * @cssprop --tonal-button-container-color: Color of the tonal button container.\n * @cssprop --tonal-button-label-text-color: Text color of the tonal button label.\n *\n * @cssprop --elevated-button-container-color: Color of the elevated button container.\n * @cssprop --elevated-button-label-text-color: Text color of the elevated button label.\n *\n * @cssprop --neo-button-container-color: Color of the neo button container.\n * @cssprop --neo-button-label-text-color: Text color of the neo button label.\n *\n * @fires {MouseEvent} click - Dispatched when the button is clicked.\n *\n * @example\n * ```html\n * <wc-button>Button</wc-button>\n * ```\n * @tags display\n */\n@IndividualComponent\nexport class Button extends mixinBaseButton(\n  mixinHyperlink(\n    mixinDelegatesAria(\n      mixinFormSubmitter(\n        mixinFormAssociated(mixinElementInternals(LitElement)),\n      ),\n    ),\n  ),\n) {\n  // ── Static ───────────────────────────────────────────────────────────────\n\n  /** @nocollapse */ // eslint-disable-next-line\n  static override shadowRootOptions: ShadowRootInit = {\n    mode: 'open',\n    delegatesFocus: true,\n  };\n\n  static override styles = [styles];\n\n  // ── Properties ───────────────────────────────────────────────────────────\n\n  /**\n   * When `true` (default), the icon is placed after the label (trailing).\n   * When `false`, the icon is placed before the label (leading).\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'trailing-icon' })\n  trailingIcon = true;\n\n  /**\n   * Button size.\n   * Possible values are `\"xs\"`, `\"sm\"`, `\"md\"`, `\"lg\"`, `\"xl\"`. Defaults to `\"sm\"`.\n   */\n  @property({ reflect: true }) size: ButtonSize = 'sm';\n\n  /**\n   * Level is preset of color and variant. If Level provided it overrides the default color and variant.\n   */\n  @property({ type: String }) level?: ButtonLevel;\n\n  /** Shape of the button container. */\n  @property({ type: String, reflect: true }) shape: ButtonShape = 'square';\n\n  /**\n   * The visual style of the button.\n   *\n   *  Possible variant values:\n   * `\"filled\"` is a filled button.\n   * `\"outlined\"` is an outlined button.\n   * `\"text\"` is a transparent button.\n   * `\"tonal\"` is a light color button.\n   * `\"elevated\"` is elevated button\n   */\n  @property({ reflect: true }) variant: ButtonVariant = 'filled';\n\n  /**\n   * Defines the primary color of the button. This can be set to predefined color names to apply specific color themes.\n   */\n  @property({ reflect: true }) color: ButtonColor = 'primary';\n\n  /** When true, renders the button in a loading skeleton state. */\n  @property({ type: Boolean, reflect: true }) skeleton: boolean = false;\n\n  /** When true, the button acts as a toggle. Use with `selected`. */\n  @property({ type: Boolean, reflect: true }) toggle: boolean = false;\n\n  /** When true (and `toggle` is set), the button is in the selected/pressed state. */\n  @property({ type: Boolean, reflect: true }) selected: boolean = false;\n\n  /** Optional tooltip text displayed on hover. */\n  @property() tooltip?: string;\n\n  // ── Queries ───────────────────────────────────────────────────────────────\n\n  @query('.button') private readonly buttonElement!: HTMLElement | null;\n\n  // ── Private fields ────────────────────────────────────────────────────────\n\n  /** Cleanup returned by observerSlotChangesWithCallback for the icon slot. */\n  private __iconSlotCleanup: (() => void) | null = null;\n\n  /** Cleanup returned by observerSlotChangesWithCallback for the label slot. */\n  private __labelSlotCleanup: (() => void) | null = null;\n\n  // ── Constructor ───────────────────────────────────────────────────────────\n\n  constructor() {\n    super();\n    this.addEventListener('click', this.__dispatchClickWithThrottle);\n  }\n\n  // ── Lifecycle ─────────────────────────────────────────────────────────────\n\n  override disconnectedCallback() {\n    // disconnect slot observers first to avoid callbacks during teardown\n    try {\n      this.__iconSlotCleanup?.();\n    } catch (e) {\n      /* ignore */\n    }\n    try {\n      this.__labelSlotCleanup?.();\n    } catch (e) {\n      /* ignore */\n    }\n\n    super.disconnectedCallback();\n  }\n\n  override firstUpdated(changedProperties: Map<PropertyKey, unknown>) {\n    super.firstUpdated(changedProperties);\n    this.__convertTypeToVariantAndColor();\n    // Initialize slot presence tracking for smooth transitions when label/icon are added/removed\n    const iconSlot = this.renderRoot.querySelector(\n      'slot[name=\"icon\"]',\n    ) as HTMLSlotElement | null;\n    const labelSlot = this.renderRoot.querySelector(\n      'slot.label',\n    ) as HTMLSlotElement | null;\n\n    // Use MutationObserver-based helper so we react to content/character changes\n    if (iconSlot) {\n      this.__iconSlotCleanup = observerSlotChangesWithCallback(\n        iconSlot,\n        has => {\n          this.toggleAttribute('has-icon', has);\n        },\n      );\n    }\n\n    if (labelSlot) {\n      this.__labelSlotCleanup = observerSlotChangesWithCallback(\n        labelSlot,\n        has => {\n          this.toggleAttribute('has-label', has);\n        },\n      );\n    }\n  }\n\n  // ── Public methods ────────────────────────────────────────────────────────\n\n  override focus() {\n    this.buttonElement?.focus();\n  }\n\n  override blur() {\n    this.buttonElement?.blur();\n  }\n\n  // ── Private methods ───────────────────────────────────────────────────────\n\n  __convertTypeToVariantAndColor() {\n    if (this.level === 'primary') {\n      this.color = 'primary';\n      this.variant = 'filled';\n    } else if (this.level === 'secondary') {\n      this.color = 'surface';\n      this.variant = 'tonal';\n    } else if (this.level === 'tertiary') {\n      this.color = 'primary';\n      this.variant = 'text';\n    } else if (this.level === 'danger') {\n      this.color = 'danger';\n      this.variant = 'filled';\n    }\n  }\n\n  __dispatchClick = (event: MouseEvent | KeyboardEvent) => {\n    // If the button is soft-disabled or a disabled link, we need to explicitly\n    // prevent the click from propagating to other event listeners as well as\n    // prevent the default action.\n    if (this.softDisabled || (this.disabled && this.href) || this.skeleton) {\n      event.stopImmediatePropagation();\n      event.preventDefault();\n      return;\n    }\n\n    if (!isActivationClick(event) || !this.buttonElement) {\n      return;\n    }\n\n    this.focus();\n    dispatchActivationClick(this.buttonElement);\n  };\n\n  // ── Render helpers ────────────────────────────────────────────────────────\n\n  renderButtonElement() {\n    const isElementLink = isLink(this);\n\n    const cssClasses: any = {\n      button: true,\n      'native-button': !isElementLink,\n      'native-link': isElementLink,\n      'trailing-icon': this.trailingIcon,\n    };\n\n    // Needed for closure conformance\n    const { ariaLabel, ariaHasPopup, ariaExpanded } = this as ARIAMixinStrict;\n\n    if (isElementLink) {\n      return html`<a\n        class=${classMap(cssClasses)}\n        id=\"link\"\n        href=${this.href}\n        target=${this.target}\n        tabindex=${this.disabled ? '-1' : '0'}\n        aria-label=\"${ariaLabel || nothing}\"\n        aria-haspopup=\"${ariaHasPopup || nothing}\"\n        aria-expanded=\"${ariaExpanded || nothing}\"\n        aria-describedby=${ifDefined(\n          this.softDisabled ? DISABLED_REASON_ID : undefined,\n        )}\n        ?aria-disabled=${this.softDisabled}\n      >\n        ${this.renderButtonContent()}\n      </a>`;\n    }\n    return html`<button\n        class=${classMap(cssClasses)}\n        id=\"button\"\n        aria-label=\"${ariaLabel || nothing}\"\n        aria-haspopup=\"${ariaHasPopup || nothing}\"\n        aria-expanded=\"${ariaExpanded || nothing}\"\n        aria-describedby=${ifDefined(\n          this.softDisabled ? DISABLED_REASON_ID : undefined,\n        )}\n        ?aria-disabled=${this.softDisabled}\n        ?disabled=${this.disabled}\n      >\n        ${this.renderButtonContent()}\n      </button>\n      ${this.renderTooltip()}`;\n  }\n\n  renderButtonContent() {\n    return html` <slot class=\"icon-slot\" name=\"icon\"></slot>\n      <slot class=\"label\"></slot>\n      <div class=\"touch\"></div>\n\n      ${this.renderDisabledReason(this.softDisabled)}`;\n  }\n\n  renderDisabledReason(softDisabled: boolean) {\n    if (softDisabled)\n      return html`<div\n        id=${DISABLED_REASON_ID}\n        role=\"tooltip\"\n        aria-label=${this.disabledReason}\n        class=\"screen-reader-only\"\n      >\n        ${this.disabledReason}\n      </div>`;\n    return nothing;\n  }\n\n  renderTooltip() {\n    if (this.tooltip) {\n      const buttonId = isLink(this) ? 'link' : 'button';\n      return html`<wc-tooltip class=\"tooltip\" for=${buttonId}\n        >${this.tooltip}</wc-tooltip\n      >`;\n    }\n    return nothing;\n  }\n\n  // ── Render ────────────────────────────────────────────────────────────────\n\n  override render() {\n    const buttonId = isLink(this) ? 'link' : 'button';\n\n    return html`\n      <wc-focus-ring class=\"focus-ring\" for=${buttonId}></wc-focus-ring>\n      <wc-elevation class=\"elevation\"></wc-elevation>\n      ${when(\n        this.variant === 'neo',\n        () => html`<div class=\"neo-background\"></div>`,\n      )}\n      <div class=\"background\"></div>\n      ${when(\n        this.variant === 'outlined' || this.variant === 'neo',\n        () => html`<div class=\"outline\"></div>`,\n      )}\n      <wc-ripple class=\"ripple\" for=${buttonId}></wc-ripple>\n      <wc-skeleton class=\"skeleton\"></wc-skeleton>\n\n      ${this.renderButtonElement()} ${this.renderTooltip()}\n    `;\n  }\n}\n"],"names":["LitElement","html","classMap","nothing","ifDefined","when","styles","property","query"],"mappings":"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"}

package/dist/calendar-column-view.js

@@ -7,6 +7,7 @@ import { E as EventManager } from './event-manager-DTyX2uYD.js';
 var css_248z = i`@charset "UTF-8";
 * {
   box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
 }
 
 .screen-reader-only {

package/dist/calendar-column-view.js.map

@@ -1 +1 @@
-{"version":3,"file":"calendar-column-view.js","sources":["../../src/calendar/calendar-column-view.ts"],"sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport {\n  addDays,\n  addHours,\n  differenceInDays,\n  startOfDay,\n  endOfDay,\n  calculateDateRange,\n  formatDate,\n  getTimePercent,\n  LONG_EVENT_PADDING,\n} from './utils.js';\nimport { BaseEvent } from './base-event.js';\nimport { CalendarEvent } from './calendar-event.js';\nimport { EventManager } from './event-manager.js';\nimport type { ColumnEvent } from './event-manager.js';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './calendar-column-view.scss';\n\n/**\n * @label Calendar Column View\n * @tag wc-calendar-column-view\n * @rawTag calendar-column-view\n * @summary Internal column view component for the calendar (day/week views).\n */\n@IndividualComponent\nexport class CalendarColumnView extends LitElement {\n  static styles = [styles];\n\n  @property({ type: Array })\n  events: CalendarEvent[] = [];\n\n  @property({ type: String })\n  view: string = 'week';\n\n  @property({ type: Number })\n  days: number = 7;\n\n  @property({ type: Boolean, attribute: 'event-clickable' })\n  eventClickable: boolean = true;\n\n  @property({ type: Object, attribute: false })\n  currentTime: Date = new Date();\n\n  @property({ type: Object, attribute: false })\n  contextDate: Date = new Date();\n\n  @state()\n  private dateRange: any = {};\n\n  @state()\n  private singleDayEvents: Record<string, ColumnEvent[][]> = {};\n\n  @state()\n  private multiDayEvents: ColumnEvent[][] = [];\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this._processEvents();\n  }\n\n  override willUpdate(changedProperties: Map<string, unknown>) {\n    if (\n      changedProperties.has('events') ||\n      changedProperties.has('contextDate') ||\n      changedProperties.has('view') ||\n      changedProperties.has('days')\n    ) {\n      this._processEvents();\n    }\n  }\n\n  override firstUpdated() {\n    const viewBody = this.renderRoot.querySelector('.view-body');\n    if (viewBody) {\n      const viewBodyHeight = viewBody.scrollHeight;\n      viewBody.scrollTo({\n        top:\n          (getTimePercent(this.currentTime) / 100) * viewBodyHeight - 150,\n      });\n    }\n  }\n\n  private _processEvents() {\n    this.dateRange = calculateDateRange(this.view, this.contextDate, this.days);\n    this.singleDayEvents = {};\n\n    this._forEachDayInRange(i => {\n      const manager = new EventManager();\n      manager.addEvents(\n        this.events.filter(\n          event =>\n            event.isOverlapping(new BaseEvent(startOfDay(i), endOfDay(i))) &&\n            event.length() < 86400000,\n        ),\n      );\n      manager.process();\n      this.singleDayEvents[this._getDateOnly(i)] = manager.columns;\n    });\n\n    const multiManager = new EventManager();\n    multiManager.addEvents(\n      this.events.filter(\n        event =>\n          event.isOverlapping(\n            new BaseEvent(this.dateRange.startDate, this.dateRange.endDate),\n          ) && event.length() >= 86400000,\n      ),\n    );\n    multiManager.process();\n    this.multiDayEvents = multiManager.columns;\n  }\n\n  private _forEachDayInRange(callback: (d: Date) => void) {\n    for (\n      let i = new Date(this.dateRange.startDate);\n      differenceInDays(startOfDay(this.dateRange.endDate), i) >= 0;\n      i = addDays(i, 1)\n    ) {\n      callback(i);\n    }\n  }\n\n  private _getDateOnly(date: Date): string {\n    return formatDate(date, 'dd-MM-yyyy');\n  }\n\n  private _getDatePercent(date: Date): number {\n    const currentDay = differenceInDays(\n      startOfDay(date),\n      this.dateRange.startDate,\n    );\n    const percent = (currentDay / this.dateRange.totalDays) * 100;\n    if (percent < 0) return 0;\n    if (percent > 100) return 100;\n    return percent;\n  }\n\n  private _getDayClass(date: Date): string {\n    const diff = differenceInDays(startOfDay(date), startOfDay(this.currentTime));\n    if (diff === 0) return 'column today';\n    if (diff < 0) return 'column past';\n    return 'column future';\n  }\n\n  private _populateColorVars(\n    styles: Record<string, string>,\n    color: string,\n  ) {\n    styles['--calendar-event-bg-color'] = `var(--color-${color}-container)`;\n    styles['--calendar-event-bg-color--hover'] = `var(--color-inverse-${color})`;\n    styles['--calendar-event-border-color'] = `var(--color-${color})`;\n    styles['--calendar-event-text-color'] = `var(--color-on-${color}-container)`;\n    styles['--calendar-event-text-color--hover'] = `var(--color-on-${color})`;\n  }\n\n  private _emitDateClick(date: Date) {\n    this.dispatchEvent(\n      new CustomEvent('column-view-date-click', {\n        detail: { date },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private _emitEventClick(event: any) {\n    this.dispatchEvent(\n      new CustomEvent('column-view-event-click', {\n        detail: { event },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private _renderHeader() {\n    const columns: any[] = [];\n    this._forEachDayInRange(i => {\n      columns.push(html`\n        <div class=${this._getDayClass(i)}>\n          <div class=\"column-content\">\n            <div\n              class=\"date\"\n              @click=${() => this._emitDateClick(i)}\n            >\n              ${formatDate(i, 'dd')}\n            </div>\n            <div class=\"day\">${formatDate(i, 'E')}</div>\n          </div>\n        </div>\n      `);\n    });\n    return columns;\n  }\n\n  private _renderMultiDayBackground() {\n    const columns: any[] = [];\n    this._forEachDayInRange(i => {\n      columns.push(html`<div class=${this._getDayClass(i)}></div>`);\n    });\n    return columns;\n  }\n\n  private _renderScale() {\n    const rows: any[] = [];\n    for (let i = 0; i < 48; i++) {\n      const cls = i % 2 ? 'row hour' : 'row';\n      const sd = startOfDay(new Date());\n      rows.push(html`\n        <div class=${cls}>\n          ${i % 2 === 0 && i\n            ? html`<div class=\"time\">${formatDate(addHours(sd, i / 2), 'hh a')}</div>`\n            : nothing}\n        </div>\n      `);\n    }\n    return html`<div class=\"background\">${rows}</div>`;\n  }\n\n  private _renderBackgroundGrid() {\n    const rows: any[] = [];\n    for (let i = 0; i < 48; i++) {\n      const cls = i % 2 ? 'row hour' : 'row';\n      const columns: any[] = [];\n      this._forEachDayInRange(d => {\n        columns.push(html`<div class=${this._getDayClass(d)}></div>`);\n      });\n      rows.push(html`<div class=${cls}>${columns}</div>`);\n    }\n    return html`<div class=\"background\">${rows}</div>`;\n  }\n\n  private _renderEvents() {\n    const columns: any[] = [];\n    this._forEachDayInRange(i => {\n      const cls = this._getDayClass(i);\n      const eventDay = this.singleDayEvents[this._getDateOnly(i)];\n      columns.push(html`\n        <div class=${cls}>\n          <div class=\"column-content\">\n            ${eventDay\n              ? eventDay.map((nodes, columnIndex) =>\n                  nodes.map(node => {\n                    const evtCls = this.eventClickable\n                      ? 'event clickable'\n                      : 'event';\n                    const evtStyles: Record<string, string> = {\n                      top: `${getTimePercent(node.start, startOfDay(i))}%`,\n                      height: `${getTimePercent(node.end, startOfDay(i)) - getTimePercent(node.start, startOfDay(i))}%`,\n                      left: `${(columnIndex / eventDay.length) * 100}%`,\n                      width: `calc(${((1 * node.width) / eventDay.length) * 100}% - 1px)`,\n                    };\n                    if (node.color) {\n                      this._populateColorVars(evtStyles, node.color);\n                    }\n                    return html`\n                      <div\n                        class=${evtCls}\n                        style=${this._styleMap(evtStyles)}\n                        @click=${() => {\n                          if (this.eventClickable) this._emitEventClick(node.data);\n                        }}\n                      >\n                        <div class=\"event-title\">\n                          ${node.title || '(no title)'}\n                        </div>\n                      </div>\n                    `;\n                  }),\n                )\n              : nothing}\n          </div>\n        </div>\n      `);\n    });\n    return html`<div class=\"events-container\">${columns}</div>`;\n  }\n\n  private _renderMultiDayEvents() {\n    if (!this.multiDayEvents || !this.multiDayEvents.length) return nothing;\n    return html`\n      <div class=\"row-content\">\n        ${this.multiDayEvents.map(\n          nodes => html`\n            <div class=\"row\">\n              ${nodes.map(node => {\n                const evtCls = this.eventClickable\n                  ? 'event clickable'\n                  : 'event';\n                const evtStyles: Record<string, string> = {\n                  left: `${this._getDatePercent(node.start) + LONG_EVENT_PADDING}%`,\n                  width: `${this._getDatePercent(addDays(node.end, 1)) - this._getDatePercent(node.start) - 2 * LONG_EVENT_PADDING}%`,\n                };\n                if (node.color) {\n                  this._populateColorVars(evtStyles, node.color);\n                }\n                return html`\n                  <div\n                    class=${evtCls}\n                    style=${this._styleMap(evtStyles)}\n                    @click=${() => {\n                      if (this.eventClickable) this._emitEventClick(node.data);\n                    }}\n                  >\n                    <div class=\"event-title\">\n                      ${node.title || '(no title)'}\n                    </div>\n                  </div>\n                `;\n              })}\n            </div>\n          `,\n        )}\n        <div class=\"row-spacer\"></div>\n      </div>\n    `;\n  }\n\n  private _renderCurrentTime() {\n    if (\n      this.currentTime.valueOf() < this.dateRange.startDate?.valueOf() - 1 ||\n      this.currentTime.valueOf() > this.dateRange.endDate?.valueOf() + 1\n    ) {\n      return nothing;\n    }\n    return html`\n      <div\n        class=\"current-time-line\"\n        style=\"top: calc(${getTimePercent(this.currentTime)}% - 1px)\"\n      >\n        <div class=\"time\">${formatDate(this.currentTime, 'hh:mm a')}</div>\n        <div\n          class=\"dash-line\"\n          style=\"width: ${this._getDatePercent(this.currentTime)}%\"\n        ></div>\n        <div\n          class=\"dot\"\n          style=\"left: calc(${this._getDatePercent(this.currentTime)}% - 0.25rem)\"\n        ></div>\n        <div\n          class=\"line\"\n          style=\"left: ${this._getDatePercent(this.currentTime)}%; width: ${(1 / this.dateRange.totalDays) * 100}%\"\n        ></div>\n      </div>\n    `;\n  }\n\n  private _styleMap(styles: Record<string, string>): string {\n    return Object.entries(styles)\n      .map(([k, v]) => `${k}:${v}`)\n      .join(';');\n  }\n\n  render() {\n    return html`\n      <div class=\"calendar-column-view\">\n        <div class=\"view-header\">\n          <div class=\"scale\"></div>\n          <div class=\"columns\">${this._renderHeader()}</div>\n          <div class=\"scrollbar-placeholder\"></div>\n        </div>\n        <div class=\"multi-day-section-wrapper\">\n          <div class=\"multi-day-section-scroll\">\n            <div class=\"multi-day-section\">\n              <div class=\"multi-day-background\">\n                <div class=\"scale\"></div>\n                <div class=\"columns\">\n                  ${this._renderMultiDayBackground()}\n                </div>\n              </div>\n              <div class=\"multi-events\">\n                ${this._renderMultiDayEvents()}\n              </div>\n            </div>\n          </div>\n        </div>\n        <div class=\"view-body\">\n          <div class=\"view-body-scroll\">\n            <div class=\"scale\">${this._renderScale()}</div>\n            <div class=\"drawing-area\">\n              ${this._renderBackgroundGrid()} ${this._renderEvents()}\n            </div>\n            ${this._renderCurrentTime()}\n          </div>\n        </div>\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","html","nothing","styles","property","state"],"mappings":"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"}
+{"version":3,"file":"calendar-column-view.js","sources":["../../src/calendar/calendar-column-view.ts"],"sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport {\n  addDays,\n  addHours,\n  differenceInDays,\n  startOfDay,\n  endOfDay,\n  calculateDateRange,\n  formatDate,\n  getTimePercent,\n  LONG_EVENT_PADDING,\n} from './utils.js';\nimport { BaseEvent } from './base-event.js';\nimport { CalendarEvent } from './calendar-event.js';\nimport { EventManager } from './event-manager.js';\nimport type { ColumnEvent } from './event-manager.js';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './calendar-column-view.scss';\n\n/**\n * @label Calendar Column View\n * @tag wc-calendar-column-view\n * @rawTag calendar-column-view\n * @summary Internal column view component for the calendar (day/week views).\n */\n@IndividualComponent\nexport class CalendarColumnView extends LitElement {\n  static styles = [styles];\n\n  @property({ type: Array })\n  events: CalendarEvent[] = [];\n\n  @property({ type: String })\n  view: string = 'week';\n\n  @property({ type: Number })\n  days: number = 7;\n\n  @property({ type: Boolean, attribute: 'event-clickable' })\n  eventClickable: boolean = true;\n\n  @property({ type: Object, attribute: false })\n  currentTime: Date = new Date();\n\n  @property({ type: Object, attribute: false })\n  contextDate: Date = new Date();\n\n  @state()\n  private dateRange: any = {};\n\n  @state()\n  private singleDayEvents: Record<string, ColumnEvent[][]> = {};\n\n  @state()\n  private multiDayEvents: ColumnEvent[][] = [];\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this._processEvents();\n  }\n\n  override willUpdate(changedProperties: Map<string, unknown>) {\n    if (\n      changedProperties.has('events') ||\n      changedProperties.has('contextDate') ||\n      changedProperties.has('view') ||\n      changedProperties.has('days')\n    ) {\n      this._processEvents();\n    }\n  }\n\n  override firstUpdated() {\n    const viewBody = this.renderRoot.querySelector('.view-body');\n    if (viewBody) {\n      const viewBodyHeight = viewBody.scrollHeight;\n      viewBody.scrollTo({\n        top:\n          (getTimePercent(this.currentTime) / 100) * viewBodyHeight - 150,\n      });\n    }\n  }\n\n  private _processEvents() {\n    this.dateRange = calculateDateRange(this.view, this.contextDate, this.days);\n    this.singleDayEvents = {};\n\n    this._forEachDayInRange(i => {\n      const manager = new EventManager();\n      manager.addEvents(\n        this.events.filter(\n          event =>\n            event.isOverlapping(new BaseEvent(startOfDay(i), endOfDay(i))) &&\n            event.length() < 86400000,\n        ),\n      );\n      manager.process();\n      this.singleDayEvents[this._getDateOnly(i)] = manager.columns;\n    });\n\n    const multiManager = new EventManager();\n    multiManager.addEvents(\n      this.events.filter(\n        event =>\n          event.isOverlapping(\n            new BaseEvent(this.dateRange.startDate, this.dateRange.endDate),\n          ) && event.length() >= 86400000,\n      ),\n    );\n    multiManager.process();\n    this.multiDayEvents = multiManager.columns;\n  }\n\n  private _forEachDayInRange(callback: (d: Date) => void) {\n    for (\n      let i = new Date(this.dateRange.startDate);\n      differenceInDays(startOfDay(this.dateRange.endDate), i) >= 0;\n      i = addDays(i, 1)\n    ) {\n      callback(i);\n    }\n  }\n\n  private _getDateOnly(date: Date): string {\n    return formatDate(date, 'dd-MM-yyyy');\n  }\n\n  private _getDatePercent(date: Date): number {\n    const currentDay = differenceInDays(\n      startOfDay(date),\n      this.dateRange.startDate,\n    );\n    const percent = (currentDay / this.dateRange.totalDays) * 100;\n    if (percent < 0) return 0;\n    if (percent > 100) return 100;\n    return percent;\n  }\n\n  private _getDayClass(date: Date): string {\n    const diff = differenceInDays(startOfDay(date), startOfDay(this.currentTime));\n    if (diff === 0) return 'column today';\n    if (diff < 0) return 'column past';\n    return 'column future';\n  }\n\n  private _populateColorVars(\n    styles: Record<string, string>,\n    color: string,\n  ) {\n    styles['--calendar-event-bg-color'] = `var(--color-${color}-container)`;\n    styles['--calendar-event-bg-color--hover'] = `var(--color-inverse-${color})`;\n    styles['--calendar-event-border-color'] = `var(--color-${color})`;\n    styles['--calendar-event-text-color'] = `var(--color-on-${color}-container)`;\n    styles['--calendar-event-text-color--hover'] = `var(--color-on-${color})`;\n  }\n\n  private _emitDateClick(date: Date) {\n    this.dispatchEvent(\n      new CustomEvent('column-view-date-click', {\n        detail: { date },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private _emitEventClick(event: any) {\n    this.dispatchEvent(\n      new CustomEvent('column-view-event-click', {\n        detail: { event },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private _renderHeader() {\n    const columns: any[] = [];\n    this._forEachDayInRange(i => {\n      columns.push(html`\n        <div class=${this._getDayClass(i)}>\n          <div class=\"column-content\">\n            <div\n              class=\"date\"\n              @click=${() => this._emitDateClick(i)}\n            >\n              ${formatDate(i, 'dd')}\n            </div>\n            <div class=\"day\">${formatDate(i, 'E')}</div>\n          </div>\n        </div>\n      `);\n    });\n    return columns;\n  }\n\n  private _renderMultiDayBackground() {\n    const columns: any[] = [];\n    this._forEachDayInRange(i => {\n      columns.push(html`<div class=${this._getDayClass(i)}></div>`);\n    });\n    return columns;\n  }\n\n  private _renderScale() {\n    const rows: any[] = [];\n    for (let i = 0; i < 48; i++) {\n      const cls = i % 2 ? 'row hour' : 'row';\n      const sd = startOfDay(new Date());\n      rows.push(html`\n        <div class=${cls}>\n          ${i % 2 === 0 && i\n            ? html`<div class=\"time\">${formatDate(addHours(sd, i / 2), 'hh a')}</div>`\n            : nothing}\n        </div>\n      `);\n    }\n    return html`<div class=\"background\">${rows}</div>`;\n  }\n\n  private _renderBackgroundGrid() {\n    const rows: any[] = [];\n    for (let i = 0; i < 48; i++) {\n      const cls = i % 2 ? 'row hour' : 'row';\n      const columns: any[] = [];\n      this._forEachDayInRange(d => {\n        columns.push(html`<div class=${this._getDayClass(d)}></div>`);\n      });\n      rows.push(html`<div class=${cls}>${columns}</div>`);\n    }\n    return html`<div class=\"background\">${rows}</div>`;\n  }\n\n  private _renderEvents() {\n    const columns: any[] = [];\n    this._forEachDayInRange(i => {\n      const cls = this._getDayClass(i);\n      const eventDay = this.singleDayEvents[this._getDateOnly(i)];\n      columns.push(html`\n        <div class=${cls}>\n          <div class=\"column-content\">\n            ${eventDay\n              ? eventDay.map((nodes, columnIndex) =>\n                  nodes.map(node => {\n                    const evtCls = this.eventClickable\n                      ? 'event clickable'\n                      : 'event';\n                    const evtStyles: Record<string, string> = {\n                      top: `${getTimePercent(node.start, startOfDay(i))}%`,\n                      height: `${getTimePercent(node.end, startOfDay(i)) - getTimePercent(node.start, startOfDay(i))}%`,\n                      left: `${(columnIndex / eventDay.length) * 100}%`,\n                      width: `calc(${((1 * node.width) / eventDay.length) * 100}% - 1px)`,\n                    };\n                    if (node.color) {\n                      this._populateColorVars(evtStyles, node.color);\n                    }\n                    return html`\n                      <div\n                        class=${evtCls}\n                        style=${this._styleMap(evtStyles)}\n                        @click=${() => {\n                          if (this.eventClickable) this._emitEventClick(node.data);\n                        }}\n                      >\n                        <div class=\"event-title\">\n                          ${node.title || '(no title)'}\n                        </div>\n                      </div>\n                    `;\n                  }),\n                )\n              : nothing}\n          </div>\n        </div>\n      `);\n    });\n    return html`<div class=\"events-container\">${columns}</div>`;\n  }\n\n  private _renderMultiDayEvents() {\n    if (!this.multiDayEvents || !this.multiDayEvents.length) return nothing;\n    return html`\n      <div class=\"row-content\">\n        ${this.multiDayEvents.map(\n          nodes => html`\n            <div class=\"row\">\n              ${nodes.map(node => {\n                const evtCls = this.eventClickable\n                  ? 'event clickable'\n                  : 'event';\n                const evtStyles: Record<string, string> = {\n                  left: `${this._getDatePercent(node.start) + LONG_EVENT_PADDING}%`,\n                  width: `${this._getDatePercent(addDays(node.end, 1)) - this._getDatePercent(node.start) - 2 * LONG_EVENT_PADDING}%`,\n                };\n                if (node.color) {\n                  this._populateColorVars(evtStyles, node.color);\n                }\n                return html`\n                  <div\n                    class=${evtCls}\n                    style=${this._styleMap(evtStyles)}\n                    @click=${() => {\n                      if (this.eventClickable) this._emitEventClick(node.data);\n                    }}\n                  >\n                    <div class=\"event-title\">\n                      ${node.title || '(no title)'}\n                    </div>\n                  </div>\n                `;\n              })}\n            </div>\n          `,\n        )}\n        <div class=\"row-spacer\"></div>\n      </div>\n    `;\n  }\n\n  private _renderCurrentTime() {\n    if (\n      this.currentTime.valueOf() < this.dateRange.startDate?.valueOf() - 1 ||\n      this.currentTime.valueOf() > this.dateRange.endDate?.valueOf() + 1\n    ) {\n      return nothing;\n    }\n    return html`\n      <div\n        class=\"current-time-line\"\n        style=\"top: calc(${getTimePercent(this.currentTime)}% - 1px)\"\n      >\n        <div class=\"time\">${formatDate(this.currentTime, 'hh:mm a')}</div>\n        <div\n          class=\"dash-line\"\n          style=\"width: ${this._getDatePercent(this.currentTime)}%\"\n        ></div>\n        <div\n          class=\"dot\"\n          style=\"left: calc(${this._getDatePercent(this.currentTime)}% - 0.25rem)\"\n        ></div>\n        <div\n          class=\"line\"\n          style=\"left: ${this._getDatePercent(this.currentTime)}%; width: ${(1 / this.dateRange.totalDays) * 100}%\"\n        ></div>\n      </div>\n    `;\n  }\n\n  private _styleMap(styles: Record<string, string>): string {\n    return Object.entries(styles)\n      .map(([k, v]) => `${k}:${v}`)\n      .join(';');\n  }\n\n  render() {\n    return html`\n      <div class=\"calendar-column-view\">\n        <div class=\"view-header\">\n          <div class=\"scale\"></div>\n          <div class=\"columns\">${this._renderHeader()}</div>\n          <div class=\"scrollbar-placeholder\"></div>\n        </div>\n        <div class=\"multi-day-section-wrapper\">\n          <div class=\"multi-day-section-scroll\">\n            <div class=\"multi-day-section\">\n              <div class=\"multi-day-background\">\n                <div class=\"scale\"></div>\n                <div class=\"columns\">\n                  ${this._renderMultiDayBackground()}\n                </div>\n              </div>\n              <div class=\"multi-events\">\n                ${this._renderMultiDayEvents()}\n              </div>\n            </div>\n          </div>\n        </div>\n        <div class=\"view-body\">\n          <div class=\"view-body-scroll\">\n            <div class=\"scale\">${this._renderScale()}</div>\n            <div class=\"drawing-area\">\n              ${this._renderBackgroundGrid()} ${this._renderEvents()}\n            </div>\n            ${this._renderCurrentTime()}\n          </div>\n        </div>\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","html","nothing","styles","property","state"],"mappings":"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"}

package/dist/calendar-month-view.js

@@ -7,6 +7,7 @@ import { M as MonthEventManager } from './event-manager-DTyX2uYD.js';
 var css_248z = i`@charset "UTF-8";
 * {
   box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
 }
 
 .screen-reader-only {

package/dist/calendar-month-view.js.map

@@ -1 +1 @@
-{"version":3,"file":"calendar-month-view.js","sources":["../../src/calendar/calendar-month-view.ts"],"sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport {\n  addDays,\n  differenceInDays,\n  startOfDay,\n  endOfDay,\n  calculateMonthRange,\n  formatDate,\n  getTimePercent,\n  LONG_EVENT_PADDING,\n} from './utils.js';\nimport { BaseEvent } from './base-event.js';\nimport { CalendarEvent } from './calendar-event.js';\nimport { MonthEventManager } from './event-manager.js';\nimport type { ColumnEvent } from './event-manager.js';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './calendar-month-view.scss';\n\n/**\n * @label Calendar Month View\n * @tag wc-calendar-month-view\n * @rawTag calendar-month-view\n * @summary Internal month view component for the calendar.\n */\n@IndividualComponent\nexport class CalendarMonthView extends LitElement {\n  static styles = [styles];\n\n  @property({ type: Array })\n  events: CalendarEvent[] = [];\n\n  @property({ type: Boolean, attribute: 'event-clickable' })\n  eventClickable: boolean = true;\n\n  @property({ type: Object, attribute: false })\n  currentTime: Date = new Date();\n\n  @property({ type: Object, attribute: false })\n  contextDate: Date = new Date();\n\n  @state()\n  private dateRange: any = {};\n\n  @state()\n  private weekDayEvents: ColumnEvent[][][] = [];\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this._processEvents();\n  }\n\n  override willUpdate(changedProperties: Map<string, unknown>) {\n    if (\n      changedProperties.has('events') ||\n      changedProperties.has('contextDate')\n    ) {\n      this._processEvents();\n    }\n  }\n\n  override firstUpdated() {\n    const viewBody = this.renderRoot.querySelector('.view-body');\n    if (viewBody) {\n      const viewBodyHeight = viewBody.scrollHeight;\n      viewBody.scrollTo({\n        top:\n          (getTimePercent(this.currentTime) / 100) * viewBodyHeight - 150,\n      });\n    }\n  }\n\n  private _processEvents() {\n    this.dateRange = calculateMonthRange(this.contextDate, 1);\n    this.weekDayEvents = [];\n\n    for (\n      let i = new Date(this.dateRange.startDate), j = 0;\n      j < 6;\n      i = addDays(i, 7), j++\n    ) {\n      const manager = new MonthEventManager();\n      manager.addEvents(\n        this.events.filter(event =>\n          event.isOverlapping(\n            new BaseEvent(startOfDay(i), endOfDay(addDays(i, 6))),\n          ),\n        ),\n      );\n      manager.process();\n      this.weekDayEvents.push(manager.columns);\n    }\n  }\n\n  private _getDatePercent(date: Date, dateRangeStartDate: Date): number {\n    const currentDay = differenceInDays(startOfDay(date), dateRangeStartDate);\n    const percent = (currentDay / 7) * 100;\n    if (percent < 0) return 0;\n    if (percent > 100) return 100;\n    return percent;\n  }\n\n  private _getDayClass(date: Date): string {\n    const diff = differenceInDays(\n      startOfDay(date),\n      startOfDay(this.currentTime),\n    );\n    if (diff === 0) return 'column today';\n    if (diff < 0) return 'column past';\n    return 'column future';\n  }\n\n  private _populateColorVars(\n    styles: Record<string, string>,\n    color: string,\n  ) {\n    styles['--calendar-event-bg-color'] = `var(--color-${color}-container)`;\n    styles['--calendar-event-bg-color--hover'] = `var(--color-inverse-${color})`;\n    styles['--calendar-event-border-color'] = `var(--color-${color})`;\n    styles['--calendar-event-text-color'] = `var(--color-on-${color}-container)`;\n    styles['--calendar-event-text-color--hover'] = `var(--color-on-${color})`;\n  }\n\n  private _emitEventClick(event: any) {\n    this.dispatchEvent(\n      new CustomEvent('month-view-event-click', {\n        detail: { event },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private _renderHeader() {\n    const columns: any[] = [];\n    for (\n      let i = new Date(this.dateRange.startDate), j = 0;\n      j < 7;\n      i = addDays(i, 1), j++\n    ) {\n      columns.push(html`\n        <div class=\"column\">\n          <div class=\"column-content\">\n            <div class=\"day\">${formatDate(i, 'EEEE')}</div>\n          </div>\n        </div>\n      `);\n    }\n    return columns;\n  }\n\n  private _renderMultiDayBackground(sd: Date) {\n    const columns: any[] = [];\n    for (let i = new Date(sd), j = 0; j < 7; i = addDays(i, 1), j++) {\n      columns.push(html`\n        <div class=${this._getDayClass(i)}>\n          <div class=\"column-content\">\n            <div class=\"column-header\">\n              <div class=\"day\">${formatDate(i, 'd')}</div>\n            </div>\n          </div>\n        </div>\n      `);\n    }\n    return columns;\n  }\n\n  private _renderEvents() {\n    return this.weekDayEvents.map((eventDay, index) => {\n      const weekStartDate = addDays(this.dateRange.startDate, index * 7);\n      return html`\n        <div class=\"multi-day-section\">\n          <div class=\"multi-day-body-scroll\">\n            <div class=\"multi-day-background\">\n              <div class=\"columns\">\n                ${this._renderMultiDayBackground(weekStartDate)}\n              </div>\n            </div>\n            <div class=\"multi-events\">\n              <div class=\"row-content\">\n                ${eventDay.map(\n                  nodes => html`\n                    <div class=\"row\">\n                      ${nodes.map(node => {\n                        const evtCls = this.eventClickable\n                          ? 'event clickable'\n                          : 'event';\n                        const evtStyles: Record<string, string> = {\n                          left: `${this._getDatePercent(node.start, weekStartDate) + LONG_EVENT_PADDING}%`,\n                          width: `${this._getDatePercent(addDays(node.end, 1), weekStartDate) - this._getDatePercent(node.start, weekStartDate) - 2 * LONG_EVENT_PADDING}%`,\n                        };\n                        if (node.color) {\n                          this._populateColorVars(evtStyles, node.color);\n                        }\n                        return html`\n                          <div\n                            class=${evtCls}\n                            style=${this._styleMap(evtStyles)}\n                            @click=${() => {\n                              if (this.eventClickable)\n                                this._emitEventClick(node.data);\n                            }}\n                          >\n                            <div class=\"event-title\">\n                              ${node.title || '(no title)'}\n                            </div>\n                          </div>\n                        `;\n                      })}\n                    </div>\n                  `,\n                )}\n                <div class=\"row-spacer\"></div>\n              </div>\n            </div>\n          </div>\n        </div>\n      `;\n    });\n  }\n\n  private _styleMap(styles: Record<string, string>): string {\n    return Object.entries(styles)\n      .map(([k, v]) => `${k}:${v}`)\n      .join(';');\n  }\n\n  render() {\n    return html`\n      <div class=\"calendar-month-view\">\n        <div class=\"view-header\">\n          <div class=\"columns\">${this._renderHeader()}</div>\n          <div class=\"scrollbar-placeholder\"></div>\n        </div>\n        <div class=\"view-body\">\n          <div class=\"view-body-scroll\">\n            <div class=\"drawing-area\">${this._renderEvents()}</div>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","html","styles","property","state"],"mappings":"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"}
+{"version":3,"file":"calendar-month-view.js","sources":["../../src/calendar/calendar-month-view.ts"],"sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport {\n  addDays,\n  differenceInDays,\n  startOfDay,\n  endOfDay,\n  calculateMonthRange,\n  formatDate,\n  getTimePercent,\n  LONG_EVENT_PADDING,\n} from './utils.js';\nimport { BaseEvent } from './base-event.js';\nimport { CalendarEvent } from './calendar-event.js';\nimport { MonthEventManager } from './event-manager.js';\nimport type { ColumnEvent } from './event-manager.js';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './calendar-month-view.scss';\n\n/**\n * @label Calendar Month View\n * @tag wc-calendar-month-view\n * @rawTag calendar-month-view\n * @summary Internal month view component for the calendar.\n */\n@IndividualComponent\nexport class CalendarMonthView extends LitElement {\n  static styles = [styles];\n\n  @property({ type: Array })\n  events: CalendarEvent[] = [];\n\n  @property({ type: Boolean, attribute: 'event-clickable' })\n  eventClickable: boolean = true;\n\n  @property({ type: Object, attribute: false })\n  currentTime: Date = new Date();\n\n  @property({ type: Object, attribute: false })\n  contextDate: Date = new Date();\n\n  @state()\n  private dateRange: any = {};\n\n  @state()\n  private weekDayEvents: ColumnEvent[][][] = [];\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this._processEvents();\n  }\n\n  override willUpdate(changedProperties: Map<string, unknown>) {\n    if (\n      changedProperties.has('events') ||\n      changedProperties.has('contextDate')\n    ) {\n      this._processEvents();\n    }\n  }\n\n  override firstUpdated() {\n    const viewBody = this.renderRoot.querySelector('.view-body');\n    if (viewBody) {\n      const viewBodyHeight = viewBody.scrollHeight;\n      viewBody.scrollTo({\n        top:\n          (getTimePercent(this.currentTime) / 100) * viewBodyHeight - 150,\n      });\n    }\n  }\n\n  private _processEvents() {\n    this.dateRange = calculateMonthRange(this.contextDate, 1);\n    this.weekDayEvents = [];\n\n    for (\n      let i = new Date(this.dateRange.startDate), j = 0;\n      j < 6;\n      i = addDays(i, 7), j++\n    ) {\n      const manager = new MonthEventManager();\n      manager.addEvents(\n        this.events.filter(event =>\n          event.isOverlapping(\n            new BaseEvent(startOfDay(i), endOfDay(addDays(i, 6))),\n          ),\n        ),\n      );\n      manager.process();\n      this.weekDayEvents.push(manager.columns);\n    }\n  }\n\n  private _getDatePercent(date: Date, dateRangeStartDate: Date): number {\n    const currentDay = differenceInDays(startOfDay(date), dateRangeStartDate);\n    const percent = (currentDay / 7) * 100;\n    if (percent < 0) return 0;\n    if (percent > 100) return 100;\n    return percent;\n  }\n\n  private _getDayClass(date: Date): string {\n    const diff = differenceInDays(\n      startOfDay(date),\n      startOfDay(this.currentTime),\n    );\n    if (diff === 0) return 'column today';\n    if (diff < 0) return 'column past';\n    return 'column future';\n  }\n\n  private _populateColorVars(\n    styles: Record<string, string>,\n    color: string,\n  ) {\n    styles['--calendar-event-bg-color'] = `var(--color-${color}-container)`;\n    styles['--calendar-event-bg-color--hover'] = `var(--color-inverse-${color})`;\n    styles['--calendar-event-border-color'] = `var(--color-${color})`;\n    styles['--calendar-event-text-color'] = `var(--color-on-${color}-container)`;\n    styles['--calendar-event-text-color--hover'] = `var(--color-on-${color})`;\n  }\n\n  private _emitEventClick(event: any) {\n    this.dispatchEvent(\n      new CustomEvent('month-view-event-click', {\n        detail: { event },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private _renderHeader() {\n    const columns: any[] = [];\n    for (\n      let i = new Date(this.dateRange.startDate), j = 0;\n      j < 7;\n      i = addDays(i, 1), j++\n    ) {\n      columns.push(html`\n        <div class=\"column\">\n          <div class=\"column-content\">\n            <div class=\"day\">${formatDate(i, 'EEEE')}</div>\n          </div>\n        </div>\n      `);\n    }\n    return columns;\n  }\n\n  private _renderMultiDayBackground(sd: Date) {\n    const columns: any[] = [];\n    for (let i = new Date(sd), j = 0; j < 7; i = addDays(i, 1), j++) {\n      columns.push(html`\n        <div class=${this._getDayClass(i)}>\n          <div class=\"column-content\">\n            <div class=\"column-header\">\n              <div class=\"day\">${formatDate(i, 'd')}</div>\n            </div>\n          </div>\n        </div>\n      `);\n    }\n    return columns;\n  }\n\n  private _renderEvents() {\n    return this.weekDayEvents.map((eventDay, index) => {\n      const weekStartDate = addDays(this.dateRange.startDate, index * 7);\n      return html`\n        <div class=\"multi-day-section\">\n          <div class=\"multi-day-body-scroll\">\n            <div class=\"multi-day-background\">\n              <div class=\"columns\">\n                ${this._renderMultiDayBackground(weekStartDate)}\n              </div>\n            </div>\n            <div class=\"multi-events\">\n              <div class=\"row-content\">\n                ${eventDay.map(\n                  nodes => html`\n                    <div class=\"row\">\n                      ${nodes.map(node => {\n                        const evtCls = this.eventClickable\n                          ? 'event clickable'\n                          : 'event';\n                        const evtStyles: Record<string, string> = {\n                          left: `${this._getDatePercent(node.start, weekStartDate) + LONG_EVENT_PADDING}%`,\n                          width: `${this._getDatePercent(addDays(node.end, 1), weekStartDate) - this._getDatePercent(node.start, weekStartDate) - 2 * LONG_EVENT_PADDING}%`,\n                        };\n                        if (node.color) {\n                          this._populateColorVars(evtStyles, node.color);\n                        }\n                        return html`\n                          <div\n                            class=${evtCls}\n                            style=${this._styleMap(evtStyles)}\n                            @click=${() => {\n                              if (this.eventClickable)\n                                this._emitEventClick(node.data);\n                            }}\n                          >\n                            <div class=\"event-title\">\n                              ${node.title || '(no title)'}\n                            </div>\n                          </div>\n                        `;\n                      })}\n                    </div>\n                  `,\n                )}\n                <div class=\"row-spacer\"></div>\n              </div>\n            </div>\n          </div>\n        </div>\n      `;\n    });\n  }\n\n  private _styleMap(styles: Record<string, string>): string {\n    return Object.entries(styles)\n      .map(([k, v]) => `${k}:${v}`)\n      .join(';');\n  }\n\n  render() {\n    return html`\n      <div class=\"calendar-month-view\">\n        <div class=\"view-header\">\n          <div class=\"columns\">${this._renderHeader()}</div>\n          <div class=\"scrollbar-placeholder\"></div>\n        </div>\n        <div class=\"view-body\">\n          <div class=\"view-body-scroll\">\n            <div class=\"drawing-area\">${this._renderEvents()}</div>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","html","styles","property","state"],"mappings":"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"}

package/dist/calendar.js

@@ -5,6 +5,7 @@ import { a as addDays, b as addMonths, f as formatDate, C as CalendarEvent } fro
 
 var css_248z = i`* {
   box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
 }
 
 .screen-reader-only {

package/dist/calendar.js.map

@@ -1 +1 @@
-{"version":3,"file":"calendar.js","sources":["../../src/calendar/calendar.ts"],"sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { addDays, addMonths, formatDate } from './utils.js';\nimport { CalendarEvent } from './calendar-event.js';\nimport type { CalendarViewType, EventType } from './types.js';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './calendar.scss';\n\n/**\n * @label Calendar\n * @tag wc-calendar\n * @rawTag calendar\n * @summary A full calendar component for displaying events in day, week, or month views.\n *\n * @cssprop --calendar-border-color - Border color used throughout the calendar grid.\n * @cssprop --calendar-event-bg-color - Background color for calendar events.\n * @cssprop --calendar-event-border-color - Left border color for calendar events.\n *\n * @fires {CustomEvent} event-click - Dispatched when a calendar event is clicked. Detail contains `{ event }`.\n * @fires {CustomEvent} view-change - Dispatched when the calendar view changes. Detail contains `{ view }`.\n * @fires {CustomEvent} date-change - Dispatched when the context date changes. Detail contains `{ date }`.\n *\n * @example\n * ```html\n * <wc-calendar view=\"week\" style=\"height: 600px\"></wc-calendar>\n * ```\n */\n@IndividualComponent\nexport class Calendar extends LitElement {\n  static styles = [styles];\n\n  /**\n   * Calendar events array.\n   */\n  @property({ type: Array })\n  events: EventType[] = [];\n\n  /**\n   * Available views configuration.\n   */\n  @property({ type: Array, attribute: 'available-views' })\n  availableViews: CalendarViewType[] = [\n    { label: 'Day', value: 'day', type: 'column', days: 1 },\n    { label: 'Week', value: 'week', type: 'column', days: 7 },\n    { label: 'Month', value: 'month', type: 'month' },\n  ];\n\n  /**\n   * Current calendar view.\n   */\n  @property({ type: String, reflect: true })\n  view: string = 'week';\n\n  /**\n   * Whether events are clickable.\n   */\n  @property({ type: Boolean, attribute: 'event-clickable' })\n  eventClickable: boolean = true;\n\n  /**\n   * Show loading state.\n   */\n  @property({ type: Boolean, attribute: 'show-loader' })\n  showLoader: boolean = false;\n\n  /**\n   * Timezone string (e.g. 'America/New_York').\n   */\n  @property({ type: String })\n  timezone: string = '';\n\n  /**\n   * The context date for the calendar view.\n   */\n  @property({ type: Object, attribute: false })\n  contextDate: Date | null = null;\n\n  @state()\n  private _currentTime: Date = new Date();\n\n  @state()\n  private _currentView: CalendarViewType | undefined;\n\n  override connectedCallback() {\n    super.connectedCallback();\n    if (this.timezone) {\n      this._currentTime = new Date(\n        new Date().toLocaleString('en', { timeZone: this.timezone }),\n      );\n    } else {\n      this._currentTime = new Date();\n    }\n    if (!this.contextDate) {\n      this.contextDate = this._currentTime;\n    }\n  }\n\n  override willUpdate(changedProperties: Map<string, unknown>) {\n    if (changedProperties.has('view') || changedProperties.has('availableViews')) {\n      this._currentView = this.availableViews.find(v => v.value === this.view);\n    }\n  }\n\n  private _onColumnViewDateClick(evt: CustomEvent) {\n    evt.stopPropagation();\n    this.view = 'day';\n    this.contextDate = evt.detail.date;\n    this.dispatchEvent(\n      new CustomEvent('view-change', {\n        detail: { view: this.view },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n    this.dispatchEvent(\n      new CustomEvent('date-change', {\n        detail: { date: this.contextDate },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private _onEventClick(evt: CustomEvent) {\n    evt.stopPropagation();\n    this.dispatchEvent(\n      new CustomEvent('event-click', {\n        detail: { event: evt.detail.event },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  previous() {\n    if (!this._currentView) return;\n    if (this._currentView.days) {\n      this.contextDate = addDays(\n        this.contextDate!,\n        -1 * this._currentView.days,\n      );\n    } else if (this._currentView.type === 'month') {\n      this.contextDate = addMonths(this.contextDate!, -1);\n    }\n    this.dispatchEvent(\n      new CustomEvent('date-change', {\n        detail: { date: this.contextDate },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  next() {\n    if (!this._currentView) return;\n    if (this._currentView.days) {\n      this.contextDate = addDays(\n        this.contextDate!,\n        this._currentView.days,\n      );\n    } else if (this._currentView.type === 'month') {\n      this.contextDate = addMonths(this.contextDate!, 1);\n    }\n    this.dispatchEvent(\n      new CustomEvent('date-change', {\n        detail: { date: this.contextDate },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private _goToToday() {\n    this.contextDate = this._currentTime;\n    this.dispatchEvent(\n      new CustomEvent('date-change', {\n        detail: { date: this.contextDate },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private _onViewSegmentChange(evt: CustomEvent<{ value: string | null }>) {\n    if (!evt.detail.value) return;\n    this.view = evt.detail.value;\n    this.dispatchEvent(\n      new CustomEvent('view-change', {\n        detail: { view: this.view },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private _renderHeader() {\n    return html`\n      <div class=\"calendar-header-classic\">\n        <div class=\"header-left\">\n          <wc-button\n            variant=\"outlined\"\n            size=\"sm\"\n            class=\"color-secondary\"\n            @click=${() => this._goToToday()}\n          >\n            Today\n          </wc-button>\n          <wc-icon-button\n            variant=\"text\"\n            size=\"sm\"\n            class=\"color-secondary\"\n            @click=${() => this.previous()}\n          >\n            <wc-icon name=\"chevron_left\"></wc-icon>\n          </wc-icon-button>\n          <wc-icon-button\n            variant=\"text\"\n            size=\"sm\"\n            class=\"color-secondary\"\n            @click=${() => this.next()}\n          >\n            <wc-icon name=\"chevron_right\"></wc-icon>\n          </wc-icon-button>\n          <div class=\"title\">\n            ${this.contextDate\n              ? formatDate(this.contextDate, 'MMMM d, yyyy')\n              : ''}\n          </div>\n        </div>\n        <div class=\"header-right\">\n          <wc-segmented-button-group @change=${this._onViewSegmentChange}>\n            ${this.availableViews.map(\n              v =>\n                html`<wc-segmented-button\n                  .value=${v.value}\n                  ?selected=${this.view === v.value}\n                >\n                  ${v.label}\n                </wc-segmented-button>`,\n            )}\n          </wc-segmented-button-group>\n        </div>\n      </div>\n    `;\n  }\n\n  private _renderCalendarView() {\n    if (!this._currentView) return html`<div>Invalid view</div>`;\n\n    const calEvents = this.events.map(\n      event =>\n        new CalendarEvent(\n          event.start,\n          event.end,\n          event.title,\n          event.color,\n          event,\n        ),\n    );\n\n    if (this._currentView.type === 'column') {\n      return html`\n        <wc-calendar-column-view\n          .events=${calEvents}\n          .view=${this._currentView.value}\n          .days=${this._currentView.days || 7}\n          .currentTime=${this._currentTime}\n          .contextDate=${this.contextDate}\n          ?event-clickable=${this.eventClickable}\n          @column-view-date-click=${this._onColumnViewDateClick}\n          @column-view-event-click=${this._onEventClick}\n        ></wc-calendar-column-view>\n      `;\n    } else if (this._currentView.type === 'month') {\n      return html`\n        <wc-calendar-month-view\n          .events=${calEvents}\n          .currentTime=${this._currentTime}\n          .contextDate=${this.contextDate}\n          ?event-clickable=${this.eventClickable}\n          @month-view-event-click=${this._onEventClick}\n        ></wc-calendar-month-view>\n      `;\n    }\n    return nothing;\n  }\n\n  render() {\n    return html`\n      <div class=\"calendar\">\n        <div class=\"calendar-header\">${this._renderHeader()}</div>\n        <div class=\"calendar-body\">\n          <div class=\"view-container\">${this._renderCalendarView()}</div>\n        </div>\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","html","nothing","styles","property","state"],"mappings":"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"}
+{"version":3,"file":"calendar.js","sources":["../../src/calendar/calendar.ts"],"sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { addDays, addMonths, formatDate } from './utils.js';\nimport { CalendarEvent } from './calendar-event.js';\nimport type { CalendarViewType, EventType } from './types.js';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './calendar.scss';\n\n/**\n * @label Calendar\n * @tag wc-calendar\n * @rawTag calendar\n * @summary A full calendar component for displaying events in day, week, or month views.\n *\n * @cssprop --calendar-border-color - Border color used throughout the calendar grid.\n * @cssprop --calendar-event-bg-color - Background color for calendar events.\n * @cssprop --calendar-event-border-color - Left border color for calendar events.\n *\n * @fires {CustomEvent} event-click - Dispatched when a calendar event is clicked. Detail contains `{ event }`.\n * @fires {CustomEvent} view-change - Dispatched when the calendar view changes. Detail contains `{ view }`.\n * @fires {CustomEvent} date-change - Dispatched when the context date changes. Detail contains `{ date }`.\n *\n * @example\n * ```html\n * <wc-calendar view=\"week\" style=\"height: 600px\"></wc-calendar>\n * ```\n */\n@IndividualComponent\nexport class Calendar extends LitElement {\n  static styles = [styles];\n\n  /**\n   * Calendar events array.\n   */\n  @property({ type: Array })\n  events: EventType[] = [];\n\n  /**\n   * Available views configuration.\n   */\n  @property({ type: Array, attribute: 'available-views' })\n  availableViews: CalendarViewType[] = [\n    { label: 'Day', value: 'day', type: 'column', days: 1 },\n    { label: 'Week', value: 'week', type: 'column', days: 7 },\n    { label: 'Month', value: 'month', type: 'month' },\n  ];\n\n  /**\n   * Current calendar view.\n   */\n  @property({ type: String, reflect: true })\n  view: string = 'week';\n\n  /**\n   * Whether events are clickable.\n   */\n  @property({ type: Boolean, attribute: 'event-clickable' })\n  eventClickable: boolean = true;\n\n  /**\n   * Show loading state.\n   */\n  @property({ type: Boolean, attribute: 'show-loader' })\n  showLoader: boolean = false;\n\n  /**\n   * Timezone string (e.g. 'America/New_York').\n   */\n  @property({ type: String })\n  timezone: string = '';\n\n  /**\n   * The context date for the calendar view.\n   */\n  @property({ type: Object, attribute: false })\n  contextDate: Date | null = null;\n\n  @state()\n  private _currentTime: Date = new Date();\n\n  @state()\n  private _currentView: CalendarViewType | undefined;\n\n  override connectedCallback() {\n    super.connectedCallback();\n    if (this.timezone) {\n      this._currentTime = new Date(\n        new Date().toLocaleString('en', { timeZone: this.timezone }),\n      );\n    } else {\n      this._currentTime = new Date();\n    }\n    if (!this.contextDate) {\n      this.contextDate = this._currentTime;\n    }\n  }\n\n  override willUpdate(changedProperties: Map<string, unknown>) {\n    if (changedProperties.has('view') || changedProperties.has('availableViews')) {\n      this._currentView = this.availableViews.find(v => v.value === this.view);\n    }\n  }\n\n  private _onColumnViewDateClick(evt: CustomEvent) {\n    evt.stopPropagation();\n    this.view = 'day';\n    this.contextDate = evt.detail.date;\n    this.dispatchEvent(\n      new CustomEvent('view-change', {\n        detail: { view: this.view },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n    this.dispatchEvent(\n      new CustomEvent('date-change', {\n        detail: { date: this.contextDate },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private _onEventClick(evt: CustomEvent) {\n    evt.stopPropagation();\n    this.dispatchEvent(\n      new CustomEvent('event-click', {\n        detail: { event: evt.detail.event },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  previous() {\n    if (!this._currentView) return;\n    if (this._currentView.days) {\n      this.contextDate = addDays(\n        this.contextDate!,\n        -1 * this._currentView.days,\n      );\n    } else if (this._currentView.type === 'month') {\n      this.contextDate = addMonths(this.contextDate!, -1);\n    }\n    this.dispatchEvent(\n      new CustomEvent('date-change', {\n        detail: { date: this.contextDate },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  next() {\n    if (!this._currentView) return;\n    if (this._currentView.days) {\n      this.contextDate = addDays(\n        this.contextDate!,\n        this._currentView.days,\n      );\n    } else if (this._currentView.type === 'month') {\n      this.contextDate = addMonths(this.contextDate!, 1);\n    }\n    this.dispatchEvent(\n      new CustomEvent('date-change', {\n        detail: { date: this.contextDate },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private _goToToday() {\n    this.contextDate = this._currentTime;\n    this.dispatchEvent(\n      new CustomEvent('date-change', {\n        detail: { date: this.contextDate },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private _onViewSegmentChange(evt: CustomEvent<{ value: string | null }>) {\n    if (!evt.detail.value) return;\n    this.view = evt.detail.value;\n    this.dispatchEvent(\n      new CustomEvent('view-change', {\n        detail: { view: this.view },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private _renderHeader() {\n    return html`\n      <div class=\"calendar-header-classic\">\n        <div class=\"header-left\">\n          <wc-button\n            variant=\"outlined\"\n            size=\"sm\"\n            class=\"color-secondary\"\n            @click=${() => this._goToToday()}\n          >\n            Today\n          </wc-button>\n          <wc-icon-button\n            variant=\"text\"\n            size=\"sm\"\n            class=\"color-secondary\"\n            @click=${() => this.previous()}\n          >\n            <wc-icon name=\"chevron_left\"></wc-icon>\n          </wc-icon-button>\n          <wc-icon-button\n            variant=\"text\"\n            size=\"sm\"\n            class=\"color-secondary\"\n            @click=${() => this.next()}\n          >\n            <wc-icon name=\"chevron_right\"></wc-icon>\n          </wc-icon-button>\n          <div class=\"title\">\n            ${this.contextDate\n              ? formatDate(this.contextDate, 'MMMM d, yyyy')\n              : ''}\n          </div>\n        </div>\n        <div class=\"header-right\">\n          <wc-segmented-button-group @change=${this._onViewSegmentChange}>\n            ${this.availableViews.map(\n              v =>\n                html`<wc-segmented-button\n                  .value=${v.value}\n                  ?selected=${this.view === v.value}\n                >\n                  ${v.label}\n                </wc-segmented-button>`,\n            )}\n          </wc-segmented-button-group>\n        </div>\n      </div>\n    `;\n  }\n\n  private _renderCalendarView() {\n    if (!this._currentView) return html`<div>Invalid view</div>`;\n\n    const calEvents = this.events.map(\n      event =>\n        new CalendarEvent(\n          event.start,\n          event.end,\n          event.title,\n          event.color,\n          event,\n        ),\n    );\n\n    if (this._currentView.type === 'column') {\n      return html`\n        <wc-calendar-column-view\n          .events=${calEvents}\n          .view=${this._currentView.value}\n          .days=${this._currentView.days || 7}\n          .currentTime=${this._currentTime}\n          .contextDate=${this.contextDate}\n          ?event-clickable=${this.eventClickable}\n          @column-view-date-click=${this._onColumnViewDateClick}\n          @column-view-event-click=${this._onEventClick}\n        ></wc-calendar-column-view>\n      `;\n    } else if (this._currentView.type === 'month') {\n      return html`\n        <wc-calendar-month-view\n          .events=${calEvents}\n          .currentTime=${this._currentTime}\n          .contextDate=${this.contextDate}\n          ?event-clickable=${this.eventClickable}\n          @month-view-event-click=${this._onEventClick}\n        ></wc-calendar-month-view>\n      `;\n    }\n    return nothing;\n  }\n\n  render() {\n    return html`\n      <div class=\"calendar\">\n        <div class=\"calendar-header\">${this._renderHeader()}</div>\n        <div class=\"calendar-body\">\n          <div class=\"view-container\">${this._renderCalendarView()}</div>\n        </div>\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","html","nothing","styles","property","state"],"mappings":"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"}

package/dist/canvas.js

@@ -5,6 +5,7 @@ import './directive-ZPhl09Yt.js';
 
 var css_248z = i`* {
   box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
 }
 
 .screen-reader-only {

package/dist/canvas.js.map

@@ -1 +1 @@
-{"version":3,"file":"canvas.js","sources":["../../src/canvas/canvas.ts"],"sourcesContent":["import { html, LitElement, svg, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './canvas.scss';\n\nexport type CanvasDirection = 'up' | 'down' | 'left' | 'right';\n\nexport type CanvasStrokeVariant = 'solid' | 'dashed' | 'animated-dashed';\n\nexport interface CanvasPoint {\n  x: number;\n  y: number;\n}\n\nexport interface CanvasPathSegment {\n  direction: CanvasDirection;\n  length: number;\n}\n\ninterface BaseCanvasShape {\n  color?: string;\n}\n\ninterface BaseCanvasStrokeShape extends BaseCanvasShape {\n  variant?: CanvasStrokeVariant;\n  showArrow?: boolean;\n  clickable?: boolean;\n}\n\nexport interface CanvasCircleShape extends BaseCanvasShape {\n  type: 'circle';\n  x?: number;\n  y?: number;\n  radius?: number;\n}\n\nexport interface CanvasRectShape extends BaseCanvasShape {\n  type: 'rect';\n  x?: number;\n  y?: number;\n  width?: number;\n  height?: number;\n}\n\nexport interface CanvasLineShape extends BaseCanvasStrokeShape {\n  type: 'line';\n  start?: CanvasPoint;\n  end?: CanvasPoint;\n}\n\nexport interface CanvasConnectorShape extends BaseCanvasStrokeShape {\n  type: 'connector';\n  start?: CanvasPoint;\n  path?: CanvasPathSegment[];\n}\n\nexport type CanvasShape =\n  | CanvasCircleShape\n  | CanvasRectShape\n  | CanvasLineShape\n  | CanvasConnectorShape;\n\nconst GRID_GAP = 10;\nconst GRID_DOT_RADIUS = 1;\n\ninterface CanvasBounds {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n}\n\ninterface CanvasExtents {\n  minX: number;\n  minY: number;\n  maxX: number;\n  maxY: number;\n}\n\ninterface CanvasViewBox {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n}\n\n/**\n * @label Canvas\n * @tag wc-canvas\n * @rawTag canvas\n * @summary A SVG canvas for drawing shapes, lines, and connectors on a dotted grid.\n *\n * @cssprop --canvas-background - Background color for the canvas wrapper. Defaults to surface-container-low.\n * @cssprop --canvas-dot-color - Color of the background grid dots. Defaults to outline-variant.\n * @cssprop --canvas-line-color - Default stroke color for lines and connectors. Defaults to on-surface.\n * @cssprop --canvas-hover-color - Stroke color on hover for clickable shapes. Defaults to primary.\n * @cssprop --canvas-arrow-color - Stroke color for arrow markers. Defaults to on-surface.\n *\n * @example\n * ```html\n * <wc-canvas id=\"my-canvas\"></wc-canvas>\n * <script>\n *   document.querySelector('#my-canvas').shapes = [\n *     { type: 'circle', x: 0, y: 0, radius: 0.25, color: 'red' },\n *   ];\n * </script>\n * ```\n */\n@IndividualComponent\nexport class Canvas extends LitElement {\n  static styles = [styles];\n\n  /**\n   * Array of shape objects to render on the canvas.\n   */\n  @property({ type: Array })\n  shapes: CanvasShape[] = [];\n\n  /**\n   * Padding around the computed viewbox (in grid units).\n   */\n  @property({ type: Number, reflect: true })\n  padding: number = 1;\n\n  /**\n   * Zoom multiplier for the canvas dimensions.\n   */\n  @property({ type: Number, reflect: true })\n  zoom: number = 1;\n\n  /**\n   * Optional viewbox override string (e.g. \"0 0 100 100\").\n   */\n  @property({ type: String })\n  viewbox?: string;\n\n  private static getNextPoint(\n    point: CanvasPoint,\n    direction: CanvasDirection,\n    length: number,\n  ): CanvasPoint {\n    if (direction === 'down') return { x: point.x, y: point.y + length };\n    if (direction === 'up') return { x: point.x, y: point.y - length };\n    if (direction === 'left') return { x: point.x - length, y: point.y };\n    if (direction === 'right') return { x: point.x + length, y: point.y };\n    return { x: point.x, y: point.y };\n  }\n\n  private static updateExtents(\n    extents: CanvasExtents,\n    x: number,\n    y: number,\n  ) {\n    if (x < extents.minX) extents.minX = x;\n    if (x > extents.maxX) extents.maxX = x;\n    if (y < extents.minY) extents.minY = y;\n    if (y > extents.maxY) extents.maxY = y;\n  }\n\n  private static getStrokeVariantClasses(variant?: CanvasStrokeVariant) {\n    return {\n      line: true,\n      'variant-dashed': variant === 'dashed' || variant === 'animated-dashed',\n      'variant-animated-dashed': variant === 'animated-dashed',\n    };\n  }\n\n  private computeShapes(initialBounds: CanvasBounds) {\n    // Track world-space bounds (grid units) as shapes are processed.\n    const extents: CanvasExtents = {\n      minX: initialBounds.x,\n      minY: initialBounds.y,\n      maxX: initialBounds.x + initialBounds.width,\n      maxY: initialBounds.y + initialBounds.height,\n    };\n\n    const shapes = this.shapes.map(shape => {\n      switch (shape.type) {\n        case 'circle': {\n          const r = shape.radius || 1;\n          const cx = shape.x || 0;\n          const cy = shape.y || 0;\n          Canvas.updateExtents(extents, cx - r, cy - r);\n          Canvas.updateExtents(extents, cx + r, cy + r);\n\n          // Convert from grid units to SVG pixels using the fixed gap.\n          return svg`<circle\n            cx=${cx * GRID_GAP + GRID_DOT_RADIUS}\n            cy=${cy * GRID_GAP + GRID_DOT_RADIUS}\n            r=${r * GRID_GAP}\n            fill=${shape.color || 'var(--canvas-line-color, var(--color-on-surface))'}\n          />`;\n        }\n        case 'rect': {\n          const w = shape.width || 1;\n          const h = shape.height || 1;\n          const rx = shape.x || 0;\n          const ry = shape.y || 0;\n          Canvas.updateExtents(extents, rx, ry);\n          Canvas.updateExtents(extents, rx + w, ry + h);\n\n          return svg`<rect\n            x=${rx * GRID_GAP + GRID_DOT_RADIUS}\n            y=${ry * GRID_GAP}\n            width=${w * GRID_GAP + GRID_DOT_RADIUS}\n            height=${h * GRID_GAP + GRID_DOT_RADIUS}\n            fill=${shape.color || 'var(--canvas-line-color, var(--color-on-surface))'}\n          />`;\n        }\n        case 'line': {\n          const start = shape.start || { x: 0, y: 0 };\n          const end = shape.end || { x: 0, y: 0 };\n          Canvas.updateExtents(extents, start.x, start.y);\n          Canvas.updateExtents(extents, end.x, end.y);\n          const pathString = `M${start.x * GRID_GAP + GRID_DOT_RADIUS} ${start.y * GRID_GAP + GRID_DOT_RADIUS} L${end.x * GRID_GAP + GRID_DOT_RADIUS} ${end.y * GRID_GAP + GRID_DOT_RADIUS}`;\n          const strokeColor =\n            shape.color ||\n            'var(--canvas-line-color, var(--color-on-surface))';\n\n          return svg`<path\n            class=${classMap({\n              ...Canvas.getStrokeVariantClasses(shape.variant),\n              clickable: !!shape.clickable,\n            })}\n            stroke-width=\"2\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n            stroke=${strokeColor}\n            marker-end=${shape.showArrow ? 'url(#endarrow)' : ''}\n            d=${pathString}\n            stroke-dasharray=${shape.variant === 'dashed' || shape.variant === 'animated-dashed' ? '6,6' : nothing}\n            fill=\"none\"\n          />`;\n        }\n        case 'connector': {\n          const start = shape.start || { x: 0, y: 0 };\n          let pathString = `M${start.x * GRID_GAP + GRID_DOT_RADIUS} ${start.y * GRID_GAP + GRID_DOT_RADIUS}`;\n          let current = { ...start };\n          Canvas.updateExtents(extents, current.x, current.y);\n\n          const pathSegments = shape.path || [];\n          for (let i = 0; i < pathSegments.length; i += 1) {\n            const path = pathSegments[i];\n\n            if (i === 0) {\n              // Move one unit first so curved corner joins don't overlap start.\n              const point = Canvas.getNextPoint(current, path.direction, 1);\n              pathString += ` L${point.x * GRID_GAP + GRID_DOT_RADIUS} ${point.y * GRID_GAP + GRID_DOT_RADIUS}`;\n              current = { ...point };\n              Canvas.updateExtents(extents, current.x, current.y);\n            }\n\n            const point = Canvas.getNextPoint(\n              current,\n              path.direction,\n              path.length - 2,\n            );\n            pathString += ` L${point.x * GRID_GAP + GRID_DOT_RADIUS} ${point.y * GRID_GAP + GRID_DOT_RADIUS}`;\n            current = { ...point };\n            Canvas.updateExtents(extents, current.x, current.y);\n\n            if (i === pathSegments.length - 1) {\n              const endPoint = Canvas.getNextPoint(current, path.direction, 1);\n              pathString += ` L${endPoint.x * GRID_GAP + GRID_DOT_RADIUS} ${endPoint.y * GRID_GAP + GRID_DOT_RADIUS}`;\n              current = { ...endPoint };\n              Canvas.updateExtents(extents, current.x, current.y);\n            } else {\n              const nextPath = pathSegments[i + 1];\n              const midPoint = Canvas.getNextPoint(current, path.direction, 1);\n              Canvas.updateExtents(extents, midPoint.x, midPoint.y);\n              const nextPoint = Canvas.getNextPoint(\n                midPoint,\n                nextPath.direction,\n                1,\n              );\n              // Use a quadratic segment to round corners between directions.\n              pathString += ` Q ${midPoint.x * GRID_GAP + GRID_DOT_RADIUS} ${midPoint.y * GRID_GAP + GRID_DOT_RADIUS} ${nextPoint.x * GRID_GAP + GRID_DOT_RADIUS} ${nextPoint.y * GRID_GAP + GRID_DOT_RADIUS}`;\n              current = { ...nextPoint };\n              Canvas.updateExtents(extents, current.x, current.y);\n            }\n          }\n\n          const strokeColor =\n            shape.color ||\n            'var(--canvas-line-color, var(--color-on-surface))';\n\n          return svg`<g class=${classMap({ clickable: !!shape.clickable })}>\n            <path\n              class=${classMap({\n                ...Canvas.getStrokeVariantClasses(shape.variant),\n              })}\n              stroke-width=\"2\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n              stroke=${strokeColor}\n              marker-end=${shape.showArrow ? 'url(#endarrow)' : ''}\n              d=${pathString}\n              stroke-dasharray=${shape.variant === 'dashed' || shape.variant === 'animated-dashed' ? '6,6' : nothing}\n              fill=\"none\"\n            />\n            <path\n              stroke-width=\"10\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n              stroke=\"transparent\"\n              d=${pathString}\n              fill=\"none\"\n            />\n          </g>`;\n        }\n        default:\n          return nothing;\n      }\n    });\n\n    // Expand bounds with padding so shapes are not flush to the edge.\n    const computedViewbox = {\n      x: extents.minX - this.padding,\n      y: extents.minY - this.padding,\n      width: Math.max(extents.maxX - extents.minX + this.padding * 2, 0),\n      height: Math.max(extents.maxY - extents.minY + this.padding * 2, 0),\n    };\n\n    return { shapes, computedViewbox };\n  }\n\n  private renderBackgroundSvg(computedViewBox: CanvasViewBox, svgViewBox: string) {\n    return html`\n      <svg\n        class=\"canvas canvas-background\"\n        height=\"100%\"\n        width=\"100%\"\n        viewBox=${svgViewBox}\n        aria-hidden=\"true\"\n      >\n        <defs>\n          <pattern\n            id=\"canvas-background\"\n            patternUnits=\"userSpaceOnUse\"\n            width=${GRID_GAP}\n            height=${GRID_GAP}\n          >\n            <circle cx=\"1\" cy=\"1\" r=${GRID_DOT_RADIUS} />\n          </pattern>\n        </defs>\n\n        <rect\n          x=${computedViewBox.x * GRID_GAP}\n          y=${computedViewBox.y * GRID_GAP}\n          width=\"100%\"\n          height=\"100%\"\n          fill=\"url(#canvas-background)\"\n        />\n      </svg>\n    `;\n  }\n\n  private renderShapesSvg(shapes: unknown[], svgViewBox: string) {\n    return html`\n      <svg\n        class=\"canvas canvas-shapes\"\n        height=\"100%\"\n        width=\"100%\"\n        viewBox=${svgViewBox}\n      >\n        <defs>\n          <marker id=\"endarrow\" markerWidth=\"10\" markerHeight=\"10\" refX=\"5\" refY=\"5\" markerUnits=\"strokeWidth\" orient=\"auto\">\n            <polyline  points=\"0 2, 5 5, 0 8\"></polyline>\n          </marker>\n        </defs>\n\n        ${shapes}\n      </svg>\n    `;\n  }\n\n  protected render() {\n    let computedViewBox = { width: 0, height: 0, x: 0, y: 0 };\n\n    const { shapes, computedViewbox } = this.computeShapes(computedViewBox);\n    computedViewBox = computedViewbox;\n\n    if (this.viewbox) {\n      const viewBox = this.viewbox.split(' ');\n      computedViewBox = {\n        x: parseInt(viewBox[0], 10),\n        y: parseInt(viewBox[1], 10),\n        width: parseInt(viewBox[2], 10),\n        height: parseInt(viewBox[3], 10),\n      };\n    }\n\n    // Zoom scales the outer viewport size while the SVG viewBox stays in world units.\n    const wrapperWidth =\n      (computedViewBox.width * GRID_GAP + 2) * GRID_DOT_RADIUS * this.zoom;\n    const wrapperHeight =\n      (computedViewBox.height * GRID_GAP + 2) * GRID_DOT_RADIUS * this.zoom;\n\n    // viewBox maps world-space extents into the internal SVG coordinate system.\n    const svgViewBox = `${computedViewBox.x * GRID_GAP} ${computedViewBox.y * GRID_GAP} ${computedViewBox.width * GRID_GAP + 2 * GRID_DOT_RADIUS} ${computedViewBox.height * GRID_GAP + 2 * GRID_DOT_RADIUS}`;\n\n    return html`\n      <div\n        class=\"canvas-wrapper\"\n        style=\"width: ${wrapperWidth}px; height: ${wrapperHeight}px;\"\n      >\n        ${this.renderBackgroundSvg(computedViewBox, svgViewBox)}\n        ${this.renderShapesSvg(shapes, svgViewBox)}\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","svg","w","classMap","nothing","html","styles","property"],"mappings":"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"}
+{"version":3,"file":"canvas.js","sources":["../../src/canvas/canvas.ts"],"sourcesContent":["import { html, LitElement, svg, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './canvas.scss';\n\nexport type CanvasDirection = 'up' | 'down' | 'left' | 'right';\n\nexport type CanvasStrokeVariant = 'solid' | 'dashed' | 'animated-dashed';\n\nexport interface CanvasPoint {\n  x: number;\n  y: number;\n}\n\nexport interface CanvasPathSegment {\n  direction: CanvasDirection;\n  length: number;\n}\n\ninterface BaseCanvasShape {\n  color?: string;\n}\n\ninterface BaseCanvasStrokeShape extends BaseCanvasShape {\n  variant?: CanvasStrokeVariant;\n  showArrow?: boolean;\n  clickable?: boolean;\n}\n\nexport interface CanvasCircleShape extends BaseCanvasShape {\n  type: 'circle';\n  x?: number;\n  y?: number;\n  radius?: number;\n}\n\nexport interface CanvasRectShape extends BaseCanvasShape {\n  type: 'rect';\n  x?: number;\n  y?: number;\n  width?: number;\n  height?: number;\n}\n\nexport interface CanvasLineShape extends BaseCanvasStrokeShape {\n  type: 'line';\n  start?: CanvasPoint;\n  end?: CanvasPoint;\n}\n\nexport interface CanvasConnectorShape extends BaseCanvasStrokeShape {\n  type: 'connector';\n  start?: CanvasPoint;\n  path?: CanvasPathSegment[];\n}\n\nexport type CanvasShape =\n  | CanvasCircleShape\n  | CanvasRectShape\n  | CanvasLineShape\n  | CanvasConnectorShape;\n\nconst GRID_GAP = 10;\nconst GRID_DOT_RADIUS = 1;\n\ninterface CanvasBounds {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n}\n\ninterface CanvasExtents {\n  minX: number;\n  minY: number;\n  maxX: number;\n  maxY: number;\n}\n\ninterface CanvasViewBox {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n}\n\n/**\n * @label Canvas\n * @tag wc-canvas\n * @rawTag canvas\n * @summary A SVG canvas for drawing shapes, lines, and connectors on a dotted grid.\n *\n * @cssprop --canvas-background - Background color for the canvas wrapper. Defaults to surface-container-low.\n * @cssprop --canvas-dot-color - Color of the background grid dots. Defaults to outline-variant.\n * @cssprop --canvas-line-color - Default stroke color for lines and connectors. Defaults to on-surface.\n * @cssprop --canvas-hover-color - Stroke color on hover for clickable shapes. Defaults to primary.\n * @cssprop --canvas-arrow-color - Stroke color for arrow markers. Defaults to on-surface.\n *\n * @example\n * ```html\n * <wc-canvas id=\"my-canvas\"></wc-canvas>\n * <script>\n *   document.querySelector('#my-canvas').shapes = [\n *     { type: 'circle', x: 0, y: 0, radius: 0.25, color: 'red' },\n *   ];\n * </script>\n * ```\n */\n@IndividualComponent\nexport class Canvas extends LitElement {\n  static styles = [styles];\n\n  /**\n   * Array of shape objects to render on the canvas.\n   */\n  @property({ type: Array })\n  shapes: CanvasShape[] = [];\n\n  /**\n   * Padding around the computed viewbox (in grid units).\n   */\n  @property({ type: Number, reflect: true })\n  padding: number = 1;\n\n  /**\n   * Zoom multiplier for the canvas dimensions.\n   */\n  @property({ type: Number, reflect: true })\n  zoom: number = 1;\n\n  /**\n   * Optional viewbox override string (e.g. \"0 0 100 100\").\n   */\n  @property({ type: String })\n  viewbox?: string;\n\n  private static getNextPoint(\n    point: CanvasPoint,\n    direction: CanvasDirection,\n    length: number,\n  ): CanvasPoint {\n    if (direction === 'down') return { x: point.x, y: point.y + length };\n    if (direction === 'up') return { x: point.x, y: point.y - length };\n    if (direction === 'left') return { x: point.x - length, y: point.y };\n    if (direction === 'right') return { x: point.x + length, y: point.y };\n    return { x: point.x, y: point.y };\n  }\n\n  private static updateExtents(\n    extents: CanvasExtents,\n    x: number,\n    y: number,\n  ) {\n    if (x < extents.minX) extents.minX = x;\n    if (x > extents.maxX) extents.maxX = x;\n    if (y < extents.minY) extents.minY = y;\n    if (y > extents.maxY) extents.maxY = y;\n  }\n\n  private static getStrokeVariantClasses(variant?: CanvasStrokeVariant) {\n    return {\n      line: true,\n      'variant-dashed': variant === 'dashed' || variant === 'animated-dashed',\n      'variant-animated-dashed': variant === 'animated-dashed',\n    };\n  }\n\n  private computeShapes(initialBounds: CanvasBounds) {\n    // Track world-space bounds (grid units) as shapes are processed.\n    const extents: CanvasExtents = {\n      minX: initialBounds.x,\n      minY: initialBounds.y,\n      maxX: initialBounds.x + initialBounds.width,\n      maxY: initialBounds.y + initialBounds.height,\n    };\n\n    const shapes = this.shapes.map(shape => {\n      switch (shape.type) {\n        case 'circle': {\n          const r = shape.radius || 1;\n          const cx = shape.x || 0;\n          const cy = shape.y || 0;\n          Canvas.updateExtents(extents, cx - r, cy - r);\n          Canvas.updateExtents(extents, cx + r, cy + r);\n\n          // Convert from grid units to SVG pixels using the fixed gap.\n          return svg`<circle\n            cx=${cx * GRID_GAP + GRID_DOT_RADIUS}\n            cy=${cy * GRID_GAP + GRID_DOT_RADIUS}\n            r=${r * GRID_GAP}\n            fill=${shape.color || 'var(--canvas-line-color, var(--color-on-surface))'}\n          />`;\n        }\n        case 'rect': {\n          const w = shape.width || 1;\n          const h = shape.height || 1;\n          const rx = shape.x || 0;\n          const ry = shape.y || 0;\n          Canvas.updateExtents(extents, rx, ry);\n          Canvas.updateExtents(extents, rx + w, ry + h);\n\n          return svg`<rect\n            x=${rx * GRID_GAP + GRID_DOT_RADIUS}\n            y=${ry * GRID_GAP}\n            width=${w * GRID_GAP + GRID_DOT_RADIUS}\n            height=${h * GRID_GAP + GRID_DOT_RADIUS}\n            fill=${shape.color || 'var(--canvas-line-color, var(--color-on-surface))'}\n          />`;\n        }\n        case 'line': {\n          const start = shape.start || { x: 0, y: 0 };\n          const end = shape.end || { x: 0, y: 0 };\n          Canvas.updateExtents(extents, start.x, start.y);\n          Canvas.updateExtents(extents, end.x, end.y);\n          const pathString = `M${start.x * GRID_GAP + GRID_DOT_RADIUS} ${start.y * GRID_GAP + GRID_DOT_RADIUS} L${end.x * GRID_GAP + GRID_DOT_RADIUS} ${end.y * GRID_GAP + GRID_DOT_RADIUS}`;\n          const strokeColor =\n            shape.color ||\n            'var(--canvas-line-color, var(--color-on-surface))';\n\n          return svg`<path\n            class=${classMap({\n              ...Canvas.getStrokeVariantClasses(shape.variant),\n              clickable: !!shape.clickable,\n            })}\n            stroke-width=\"2\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n            stroke=${strokeColor}\n            marker-end=${shape.showArrow ? 'url(#endarrow)' : ''}\n            d=${pathString}\n            stroke-dasharray=${shape.variant === 'dashed' || shape.variant === 'animated-dashed' ? '6,6' : nothing}\n            fill=\"none\"\n          />`;\n        }\n        case 'connector': {\n          const start = shape.start || { x: 0, y: 0 };\n          let pathString = `M${start.x * GRID_GAP + GRID_DOT_RADIUS} ${start.y * GRID_GAP + GRID_DOT_RADIUS}`;\n          let current = { ...start };\n          Canvas.updateExtents(extents, current.x, current.y);\n\n          const pathSegments = shape.path || [];\n          for (let i = 0; i < pathSegments.length; i += 1) {\n            const path = pathSegments[i];\n\n            if (i === 0) {\n              // Move one unit first so curved corner joins don't overlap start.\n              const point = Canvas.getNextPoint(current, path.direction, 1);\n              pathString += ` L${point.x * GRID_GAP + GRID_DOT_RADIUS} ${point.y * GRID_GAP + GRID_DOT_RADIUS}`;\n              current = { ...point };\n              Canvas.updateExtents(extents, current.x, current.y);\n            }\n\n            const point = Canvas.getNextPoint(\n              current,\n              path.direction,\n              path.length - 2,\n            );\n            pathString += ` L${point.x * GRID_GAP + GRID_DOT_RADIUS} ${point.y * GRID_GAP + GRID_DOT_RADIUS}`;\n            current = { ...point };\n            Canvas.updateExtents(extents, current.x, current.y);\n\n            if (i === pathSegments.length - 1) {\n              const endPoint = Canvas.getNextPoint(current, path.direction, 1);\n              pathString += ` L${endPoint.x * GRID_GAP + GRID_DOT_RADIUS} ${endPoint.y * GRID_GAP + GRID_DOT_RADIUS}`;\n              current = { ...endPoint };\n              Canvas.updateExtents(extents, current.x, current.y);\n            } else {\n              const nextPath = pathSegments[i + 1];\n              const midPoint = Canvas.getNextPoint(current, path.direction, 1);\n              Canvas.updateExtents(extents, midPoint.x, midPoint.y);\n              const nextPoint = Canvas.getNextPoint(\n                midPoint,\n                nextPath.direction,\n                1,\n              );\n              // Use a quadratic segment to round corners between directions.\n              pathString += ` Q ${midPoint.x * GRID_GAP + GRID_DOT_RADIUS} ${midPoint.y * GRID_GAP + GRID_DOT_RADIUS} ${nextPoint.x * GRID_GAP + GRID_DOT_RADIUS} ${nextPoint.y * GRID_GAP + GRID_DOT_RADIUS}`;\n              current = { ...nextPoint };\n              Canvas.updateExtents(extents, current.x, current.y);\n            }\n          }\n\n          const strokeColor =\n            shape.color ||\n            'var(--canvas-line-color, var(--color-on-surface))';\n\n          return svg`<g class=${classMap({ clickable: !!shape.clickable })}>\n            <path\n              class=${classMap({\n                ...Canvas.getStrokeVariantClasses(shape.variant),\n              })}\n              stroke-width=\"2\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n              stroke=${strokeColor}\n              marker-end=${shape.showArrow ? 'url(#endarrow)' : ''}\n              d=${pathString}\n              stroke-dasharray=${shape.variant === 'dashed' || shape.variant === 'animated-dashed' ? '6,6' : nothing}\n              fill=\"none\"\n            />\n            <path\n              stroke-width=\"10\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n              stroke=\"transparent\"\n              d=${pathString}\n              fill=\"none\"\n            />\n          </g>`;\n        }\n        default:\n          return nothing;\n      }\n    });\n\n    // Expand bounds with padding so shapes are not flush to the edge.\n    const computedViewbox = {\n      x: extents.minX - this.padding,\n      y: extents.minY - this.padding,\n      width: Math.max(extents.maxX - extents.minX + this.padding * 2, 0),\n      height: Math.max(extents.maxY - extents.minY + this.padding * 2, 0),\n    };\n\n    return { shapes, computedViewbox };\n  }\n\n  private renderBackgroundSvg(computedViewBox: CanvasViewBox, svgViewBox: string) {\n    return html`\n      <svg\n        class=\"canvas canvas-background\"\n        height=\"100%\"\n        width=\"100%\"\n        viewBox=${svgViewBox}\n        aria-hidden=\"true\"\n      >\n        <defs>\n          <pattern\n            id=\"canvas-background\"\n            patternUnits=\"userSpaceOnUse\"\n            width=${GRID_GAP}\n            height=${GRID_GAP}\n          >\n            <circle cx=\"1\" cy=\"1\" r=${GRID_DOT_RADIUS} />\n          </pattern>\n        </defs>\n\n        <rect\n          x=${computedViewBox.x * GRID_GAP}\n          y=${computedViewBox.y * GRID_GAP}\n          width=\"100%\"\n          height=\"100%\"\n          fill=\"url(#canvas-background)\"\n        />\n      </svg>\n    `;\n  }\n\n  private renderShapesSvg(shapes: unknown[], svgViewBox: string) {\n    return html`\n      <svg\n        class=\"canvas canvas-shapes\"\n        height=\"100%\"\n        width=\"100%\"\n        viewBox=${svgViewBox}\n      >\n        <defs>\n          <marker id=\"endarrow\" markerWidth=\"10\" markerHeight=\"10\" refX=\"5\" refY=\"5\" markerUnits=\"strokeWidth\" orient=\"auto\">\n            <polyline  points=\"0 2, 5 5, 0 8\"></polyline>\n          </marker>\n        </defs>\n\n        ${shapes}\n      </svg>\n    `;\n  }\n\n  protected render() {\n    let computedViewBox = { width: 0, height: 0, x: 0, y: 0 };\n\n    const { shapes, computedViewbox } = this.computeShapes(computedViewBox);\n    computedViewBox = computedViewbox;\n\n    if (this.viewbox) {\n      const viewBox = this.viewbox.split(' ');\n      computedViewBox = {\n        x: parseInt(viewBox[0], 10),\n        y: parseInt(viewBox[1], 10),\n        width: parseInt(viewBox[2], 10),\n        height: parseInt(viewBox[3], 10),\n      };\n    }\n\n    // Zoom scales the outer viewport size while the SVG viewBox stays in world units.\n    const wrapperWidth =\n      (computedViewBox.width * GRID_GAP + 2) * GRID_DOT_RADIUS * this.zoom;\n    const wrapperHeight =\n      (computedViewBox.height * GRID_GAP + 2) * GRID_DOT_RADIUS * this.zoom;\n\n    // viewBox maps world-space extents into the internal SVG coordinate system.\n    const svgViewBox = `${computedViewBox.x * GRID_GAP} ${computedViewBox.y * GRID_GAP} ${computedViewBox.width * GRID_GAP + 2 * GRID_DOT_RADIUS} ${computedViewBox.height * GRID_GAP + 2 * GRID_DOT_RADIUS}`;\n\n    return html`\n      <div\n        class=\"canvas-wrapper\"\n        style=\"width: ${wrapperWidth}px; height: ${wrapperHeight}px;\"\n      >\n        ${this.renderBackgroundSvg(computedViewBox, svgViewBox)}\n        ${this.renderShapesSvg(shapes, svgViewBox)}\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","svg","w","classMap","nothing","html","styles","property"],"mappings":"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"}

package/dist/card.js

@@ -13,6 +13,7 @@ import './directive-ZPhl09Yt.js';
 
 var css_248z$1 = i`* {
   box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
 }
 
 .screen-reader-only {