@cruglobal/cornerstone-components 0.1.0 → 0.1.2

package/dist/unbundled/chunks/chunk.XXGD4S2Z.js

@@ -1,168 +0,0 @@
-/*! Cornerstone Components 0.1.0 - MIT licensed. See LICENSE.md and NOTICE. */
-
-// src/components/pagination/pagination.styles.ts
-import { css } from "lit";
-var pagination_styles_default = css`
-  @layer cs-component {
-    :host {
-      display: contents;
-    }
-  }
-
-  .container {
-    display: flex;
-    align-items: center;
-    flex-wrap: wrap;
-    /* Sizing is relative to the current font size, so we use em rather than spacing tokens */
-    gap: 1em;
-  }
-
-  .summary {
-    font-size: 0.875em;
-    color: var(--cs-color-text-quiet);
-    white-space: nowrap;
-  }
-
-  /* Compact layout */
-  .label {
-    display: inline-flex;
-    align-items: center;
-    min-height: max(2.16em, 24px);
-    padding-inline: 0.75em;
-    color: var(--cs-color-text-normal);
-    white-space: nowrap;
-  }
-
-  .pagination {
-    display: flex;
-  }
-
-  .pages {
-    display: flex;
-    align-items: center;
-    flex-wrap: wrap;
-    gap: 0.25em;
-    margin: 0;
-    padding: 0;
-    list-style: none;
-  }
-
-  .pages li {
-    display: flex;
-  }
-
-  .button {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    box-sizing: border-box;
-
-    /* Guarantee a minimum 24×24px target (WCAG 2.5.8) while still scaling with font-size. */
-    min-width: max(2.16em, 24px);
-    min-height: max(2.16em, 24px);
-    padding-inline: 0.25em;
-
-    font: inherit;
-    font-size: inherit;
-    line-height: 1;
-    color: var(--cs-color-text-normal);
-    text-decoration: none;
-
-    background-color: transparent;
-    /* Default (outlined) appearance */
-    border: solid var(--cs-border-width-s) var(--cs-color-neutral-border-quiet);
-    border-radius: var(--cs-border-radius-m);
-    cursor: pointer;
-    user-select: none;
-    -webkit-user-select: none;
-    transition:
-      background-color var(--cs-transition-fast),
-      border-color var(--cs-transition-fast),
-      color var(--cs-transition-fast);
-  }
-
-  /* Ellipsis */
-  .button.ellipsis {
-    color: var(--cs-color-text-quiet);
-    position: relative;
-  }
-
-  .button.ellipsis:hover,
-  .button.ellipsis:focus-visible {
-    color: var(--cs-color-text-normal);
-  }
-
-  .button:hover {
-    background-color: var(--cs-color-neutral-fill-quiet);
-  }
-
-  .button:focus {
-    outline: none;
-  }
-
-  .button:focus-visible {
-    outline: var(--cs-focus-ring);
-    outline-offset: var(--cs-focus-ring-offset);
-  }
-
-  /* Current page */
-  .button.current {
-    font-weight: var(--cs-font-weight-bold);
-    color: var(--cs-color-brand-on-loud);
-    background-color: var(--cs-form-control-activated-color);
-    /* Read as a solid chip: drop the outlined border so it doesn't double up against the fill. */
-    border-color: transparent;
-  }
-
-  .button.current:hover {
-    background-color: var(--cs-form-control-activated-color);
-  }
-
-  /* Disabled (pagination buttons use aria-disabled so they stay focusable) */
-  .button[aria-disabled='true'] {
-    opacity: 0.5;
-    cursor: not-allowed;
-  }
-
-  .button[aria-disabled='true']:hover {
-    background-color: transparent;
-  }
-
-  cs-icon {
-    font-size: 0.875em;
-  }
-
-  /* Filled */
-  :host([appearance='filled']) .button {
-    background-color: var(--cs-color-neutral-fill-quiet);
-    border-color: transparent;
-  }
-
-  :host([appearance='filled']) .button:hover {
-    background-color: var(--cs-color-neutral-fill-normal);
-  }
-
-  :host([appearance='filled']) .button.current,
-  :host([appearance='filled']) .button.current:hover {
-    background-color: var(--cs-form-control-activated-color);
-  }
-
-  /* Plain */
-  :host([appearance='plain']) .button {
-    background-color: transparent;
-    border-color: transparent;
-  }
-
-  :host([appearance='plain']) .button:hover {
-    background-color: transparent;
-  }
-
-  :host([appearance='plain']) .button.current {
-    color: var(--cs-color-brand-on-loud);
-    background-color: var(--cs-form-control-activated-color);
-  }
-`;
-
-export {
-  pagination_styles_default
-};

package/dist/unbundled/chunks/chunk.Y7YQ7MTR.js

@@ -1,49 +0,0 @@
-/*! Cornerstone Components 0.1.0 - MIT licensed. See LICENSE.md and NOTICE. */
-
-// src/styles/component/form-control.styles.ts
-import { css } from "lit";
-var form_control_styles_default = css`
-  :host {
-    display: flex;
-    flex-direction: column;
-  }
-
-  /* Treat wrapped labels, inputs, and hints as direct children of the host element */
-  [part~='form-control'] {
-    display: contents;
-  }
-
-  /* Label */
-  :is([part~='form-control-label'], [part~='label']):has(*:not(:empty)),
-  :is([part~='form-control-label'], [part~='label']).has-label {
-    display: inline-flex;
-    color: var(--cs-form-control-label-color);
-    font-weight: var(--cs-form-control-label-font-weight);
-    line-height: var(--cs-form-control-label-line-height);
-    margin-block-end: 0.5em;
-  }
-
-  :host([required]) :is([part~='form-control-label'], [part~='label'])::after {
-    content: var(--cs-form-control-required-content);
-    margin-inline-start: var(--cs-form-control-required-content-offset);
-    color: var(--cs-form-control-required-content-color);
-  }
-
-  /* Help text */
-  [part~='hint'] {
-    display: block;
-    color: var(--cs-form-control-hint-color);
-    font-weight: var(--cs-form-control-hint-font-weight);
-    line-height: var(--cs-form-control-hint-line-height);
-    margin-block-start: 0.5em;
-    font-size: var(--cs-font-size-smaller);
-
-    &:not(.has-slotted, .has-hint, .has-count) {
-      display: none;
-    }
-  }
-`;
-
-export {
-  form_control_styles_default
-};

package/dist/unbundled/chunks/chunk.YBRM4CVR.js

@@ -1,225 +0,0 @@
-/*! Cornerstone Components 0.1.0 - MIT licensed. See LICENSE.md and NOTICE. */
-import {
-  toast_item_styles_default
-} from "./chunk.SOGOWBTP.js";
-import {
-  CsShowEvent
-} from "./chunk.BNGGMXK5.js";
-import {
-  CsHideEvent
-} from "./chunk.5MGJKMWB.js";
-import {
-  CsAfterHideEvent
-} from "./chunk.A2JHAWF4.js";
-import {
-  CsAfterShowEvent
-} from "./chunk.KCSF6NHY.js";
-import {
-  HasSlotController
-} from "./chunk.3XMRDGUU.js";
-import {
-  size_styles_default
-} from "./chunk.4BSDHHLS.js";
-import {
-  variants_styles_default
-} from "./chunk.T24BSOWI.js";
-import {
-  animateWithClass
-} from "./chunk.IQJMSIWD.js";
-import {
-  CornerstoneElement,
-  customElement
-} from "./chunk.MHH4NIPT.js";
-import {
-  LocalizeController
-} from "./chunk.QGC4W2JQ.js";
-import {
-  __decorateClass
-} from "./chunk.M2YES2WV.js";
-
-// src/components/toast-item/toast-item.ts
-import { html } from "lit";
-import { property, query, state } from "lit/decorators.js";
-import { classMap } from "lit/directives/class-map.js";
-var CsToastItem = class extends CornerstoneElement {
-  constructor() {
-    super(...arguments);
-    this.hasSlotController = new HasSlotController(this, "icon");
-    this.localize = new LocalizeController(this);
-    this.animationFrame = null;
-    this.startTime = null;
-    this.isHovering = false;
-    this.isFocused = false;
-    this.timeLeft = 100;
-    this.variant = "neutral";
-    this.size = "m";
-    this.duration = 5e3;
-    this.ssrIcon = false;
-    this.tick = () => {
-      if (!this.startTime) {
-        return;
-      }
-      const elapsed = performance.now() - this.startTime;
-      const progress = Math.min(elapsed / this.duration, 1);
-      this.timeLeft = 100 * (1 - progress);
-      if (progress < 1) {
-        this.animationFrame = requestAnimationFrame(this.tick);
-      } else {
-        this.hide();
-      }
-    };
-    this.handlePointerEnter = (event) => {
-      if (event.pointerType === "mouse" || event.pointerType === "pen") {
-        this.isHovering = true;
-        this.pauseTimer();
-      }
-    };
-    this.handlePointerLeave = () => {
-      if (this.isHovering) {
-        this.isHovering = false;
-        this.resumeTimer();
-      }
-    };
-    this.handleFocusIn = () => {
-      this.isFocused = true;
-      this.pauseTimer();
-    };
-    this.handleFocusOut = () => {
-      this.isFocused = false;
-      this.resumeTimer();
-    };
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    this.addEventListener("pointerenter", this.handlePointerEnter);
-    this.addEventListener("pointerleave", this.handlePointerLeave);
-  }
-  disconnectedCallback() {
-    super.disconnectedCallback();
-    this.stopTimer();
-    this.removeEventListener("pointerenter", this.handlePointerEnter);
-    this.removeEventListener("pointerleave", this.handlePointerLeave);
-  }
-  /** @internal Starts the toast item's timer and shows it. Called by the parent toast component. */
-  async startTimer() {
-    const showEvent = new CsShowEvent();
-    this.dispatchEvent(showEvent);
-    if (showEvent.defaultPrevented) {
-      return;
-    }
-    await this.updateComplete;
-    await animateWithClass(this.toastItemElement, "show");
-    this.dispatchEvent(new CsAfterShowEvent());
-    if (this.duration > 0 && Number.isFinite(this.duration)) {
-      this.startTime = performance.now();
-      this.timeLeft = 100;
-      this.tick();
-    }
-  }
-  /** @internal Stops the toast item's timer. */
-  stopTimer() {
-    if (this.animationFrame !== null) {
-      cancelAnimationFrame(this.animationFrame);
-      this.animationFrame = null;
-    }
-  }
-  /** Hides the toast item with animation and removes it from the DOM. */
-  async hide() {
-    this.stopTimer();
-    const hideEvent = new CsHideEvent();
-    this.dispatchEvent(hideEvent);
-    if (hideEvent.defaultPrevented) {
-      return;
-    }
-    await animateWithClass(this.toastItemElement, "hide");
-    this.dispatchEvent(new CsAfterHideEvent());
-    this.remove();
-  }
-  handleCloseClick() {
-    this.hide();
-  }
-  pauseTimer() {
-    this.stopTimer();
-    this.timeLeft = 100;
-  }
-  resumeTimer() {
-    if (!this.isHovering && !this.isFocused && this.duration > 0) {
-      this.startTime = performance.now();
-      this.tick();
-    }
-  }
-  render() {
-    const hasIcon = this.hasSlotController.test("icon", "ssrIcon");
-    const hasDuration = this.duration > 0;
-    return html`
-      <div
-        part="toast-item"
-        class=${classMap({
-      "toast-item": true,
-      "toast-item--has-icon": hasIcon,
-      "toast-item--has-duration": hasDuration
-    })}
-      >
-        <div part="accent" class="accent"></div>
-
-        <div part="icon" class="icon">
-          <slot name="icon"></slot>
-        </div>
-
-        <div part="content" class="content">
-          <slot></slot>
-        </div>
-
-        <button
-          part="close-button"
-          class="close-button"
-          type="button"
-          aria-label=${this.localize.term("close")}
-          @click=${this.handleCloseClick}
-          @focusin=${this.handleFocusIn}
-          @focusout=${this.handleFocusOut}
-        >
-          <cs-progress-ring
-            part="progress-ring"
-            exportparts="
-              progress-ring:progress-ring__progress-ring,
-              label:progress-ring__label,
-              track:progress-ring__track,
-              indicator:progress-ring__indicator
-            "
-            value=${this.timeLeft}
-            aria-hidden="true"
-          >
-            <cs-icon part="close-icon" exportparts="svg:close-icon__svg" name="close" library="system"></cs-icon>
-          </cs-progress-ring>
-        </button>
-      </div>
-    `;
-  }
-};
-CsToastItem.css = [toast_item_styles_default, variants_styles_default, size_styles_default];
-__decorateClass([
-  query(".toast-item")
-], CsToastItem.prototype, "toastItemElement", 2);
-__decorateClass([
-  state()
-], CsToastItem.prototype, "timeLeft", 2);
-__decorateClass([
-  property({ reflect: true })
-], CsToastItem.prototype, "variant", 2);
-__decorateClass([
-  property({ reflect: true })
-], CsToastItem.prototype, "size", 2);
-__decorateClass([
-  property({ type: Number })
-], CsToastItem.prototype, "duration", 2);
-__decorateClass([
-  property({ attribute: "ssr-icon", type: Boolean })
-], CsToastItem.prototype, "ssrIcon", 2);
-CsToastItem = __decorateClass([
-  customElement("cs-toast-item")
-], CsToastItem);
-
-export {
-  CsToastItem
-};

package/dist/unbundled/chunks/chunk.YFRAY3EX.js

@@ -1,44 +0,0 @@
-/*! Cornerstone Components 0.1.0 - MIT licensed. See LICENSE.md and NOTICE. */
-
-// src/internal/submit-on-enter.ts
-function submitOnEnter(event, el) {
-  const hasModifier = event.metaKey || event.ctrlKey || event.shiftKey || event.altKey;
-  if (event.key === "Enter" && !hasModifier) {
-    setTimeout(() => {
-      if (!event.defaultPrevented && !event.isComposing) {
-        submitForm(el);
-      }
-    });
-  }
-}
-function submitForm(el) {
-  let form = null;
-  if ("form" in el) {
-    form = el.form;
-  }
-  if (!form && "getForm" in el) {
-    form = el.getForm();
-  }
-  if (!form) {
-    return;
-  }
-  const formElements = [...form.elements];
-  if (formElements.length === 1) {
-    form.requestSubmit(null);
-    return;
-  }
-  const button = formElements.find((el2) => el2.type === "submit" && !el2.matches(":disabled"));
-  if (!button) {
-    return;
-  }
-  if (["input", "button"].includes(button.localName)) {
-    form.requestSubmit(button);
-  } else {
-    button.click();
-  }
-}
-
-export {
-  submitOnEnter,
-  submitForm
-};

package/dist/unbundled/chunks/chunk.YR4AIV36.js

@@ -1,61 +0,0 @@
-/*! Cornerstone Components 0.1.0 - MIT licensed. See LICENSE.md and NOTICE. */
-
-// src/components/carousel/autoplay-controller.ts
-var AutoplayController = class {
-  constructor(host, tickCallback) {
-    this.timerId = 0;
-    this.activeInteractions = 0;
-    this.paused = false;
-    this.stopped = true;
-    this.pause = () => {
-      if (!this.activeInteractions++) {
-        this.paused = true;
-        this.host.requestUpdate();
-      }
-    };
-    this.resume = () => {
-      if (!--this.activeInteractions) {
-        this.paused = false;
-        this.host.requestUpdate();
-      }
-    };
-    host.addController(this);
-    this.host = host;
-    this.tickCallback = tickCallback;
-  }
-  hostConnected() {
-    this.host.addEventListener("mouseenter", this.pause);
-    this.host.addEventListener("mouseleave", this.resume);
-    this.host.addEventListener("focusin", this.pause);
-    this.host.addEventListener("focusout", this.resume);
-    this.host.addEventListener("touchstart", this.pause, { passive: true });
-    this.host.addEventListener("touchend", this.resume);
-  }
-  hostDisconnected() {
-    this.stop();
-    this.host.removeEventListener("mouseenter", this.pause);
-    this.host.removeEventListener("mouseleave", this.resume);
-    this.host.removeEventListener("focusin", this.pause);
-    this.host.removeEventListener("focusout", this.resume);
-    this.host.removeEventListener("touchstart", this.pause);
-    this.host.removeEventListener("touchend", this.resume);
-  }
-  start(interval) {
-    this.stop();
-    this.stopped = false;
-    this.timerId = window.setInterval(() => {
-      if (!this.paused) {
-        this.tickCallback();
-      }
-    }, interval);
-  }
-  stop() {
-    clearInterval(this.timerId);
-    this.stopped = true;
-    this.host.requestUpdate();
-  }
-};
-
-export {
-  AutoplayController
-};

package/dist/unbundled/chunks/chunk.YVXLKJJD.js

@@ -1,93 +0,0 @@
-/*! Cornerstone Components 0.1.0 - MIT licensed. See LICENSE.md and NOTICE. */
-
-// src/components/breadcrumb-item/breadcrumb-item.styles.ts
-import { css } from "lit";
-var breadcrumb_item_styles_default = css`
-  :host {
-    color: var(--cs-color-text-link);
-    display: inline-flex;
-    align-items: center;
-    font: inherit;
-    font-weight: var(--cs-font-weight-action);
-    line-height: var(--cs-line-height-normal);
-    white-space: nowrap;
-  }
-
-  :host(:last-of-type) {
-    color: var(--cs-color-text-quiet);
-  }
-
-  .label {
-    display: inline-block;
-    font: inherit;
-    text-decoration: none;
-    color: currentColor;
-    background: none;
-    border: none;
-    border-radius: var(--cs-border-radius-m);
-    padding: 0;
-    margin: 0;
-    cursor: pointer;
-    transition: color var(--cs-transition-normal) var(--cs-transition-easing);
-  }
-
-  @media (hover: hover) {
-    :host(:not(:last-of-type)) .label:hover {
-      color: color-mix(in oklab, currentColor, var(--cs-color-mix-hover));
-    }
-  }
-
-  :host(:not(:last-of-type)) .label:active {
-    color: color-mix(in oklab, currentColor, var(--cs-color-mix-active));
-  }
-
-  .label:focus {
-    outline: none;
-  }
-
-  .label:focus-visible {
-    outline: var(--cs-focus-ring);
-    outline-offset: var(--cs-focus-ring-offset);
-  }
-
-  .start,
-  .end {
-    display: none;
-    flex: 0 0 auto;
-    display: flex;
-    align-items: center;
-  }
-
-  .start,
-  .end {
-    display: inline-flex;
-    color: var(--cs-color-text-quiet);
-  }
-
-  /* These are !important because a document-level universal margin reset would otherwise beat them:
-     a slotted element belongs to the outer tree. See callout.styles.ts for the full note. */
-  ::slotted([slot='start']) {
-    margin-inline-end: var(--cs-space-s) !important;
-  }
-
-  ::slotted([slot='end']) {
-    margin-inline-start: var(--cs-space-s) !important;
-  }
-
-  :host(:last-of-type) .separator {
-    display: none;
-  }
-
-  .separator {
-    color: var(--cs-color-text-quiet);
-    display: inline-flex;
-    align-items: center;
-    margin: 0 var(--cs-space-s);
-    user-select: none;
-    -webkit-user-select: none;
-  }
-`;
-
-export {
-  breadcrumb_item_styles_default
-};