@cruglobal/cornerstone-components 0.1.2 → 0.1.3

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

@@ -1,290 +0,0 @@
-/*! Cornerstone Components 0.1.2 - MIT licensed. See LICENSE.md and NOTICE. */
-import {
-  RenderedWatcher
-} from "./chunk.WZNMKCTM.js";
-import {
-  lockBodyScrolling,
-  unlockBodyScrolling
-} from "./chunk.ANWBZNKT.js";
-import {
-  parseSpaceDelimitedTokens
-} from "./chunk.NIHFTMFY.js";
-import {
-  CsShowEvent
-} from "./chunk.PFWLJLQH.js";
-import {
-  CsHideEvent
-} from "./chunk.S2L52YIY.js";
-import {
-  CsAfterHideEvent
-} from "./chunk.FWJNRWJQ.js";
-import {
-  CsAfterShowEvent
-} from "./chunk.FYZ4XPZB.js";
-import {
-  dialog_styles_default
-} from "./chunk.WQOJKHOE.js";
-import {
-  isTopDismissible,
-  registerDismissible,
-  unregisterDismissible
-} from "./chunk.YTVB3RDP.js";
-import {
-  HasSlotController
-} from "./chunk.YU2E4JNS.js";
-import {
-  animateWithClass
-} from "./chunk.YGNKXK2X.js";
-import {
-  watch
-} from "./chunk.CZUH2SE2.js";
-import {
-  CornerstoneElement,
-  customElement
-} from "./chunk.MJGPJYHJ.js";
-import {
-  LocalizeController
-} from "./chunk.Z3FB4NQE.js";
-import {
-  __decorateClass
-} from "./chunk.BGNVR6GC.js";
-
-// src/components/dialog/dialog.ts
-import { html, isServer } from "lit";
-import { property, query } from "lit/decorators.js";
-import { classMap } from "lit/directives/class-map.js";
-import { ifDefined } from "lit/directives/if-defined.js";
-var CsDialog = class extends CornerstoneElement {
-  constructor() {
-    super(...arguments);
-    this.localize = new LocalizeController(this);
-    this.hasSlotController = new HasSlotController(this, "footer");
-    this.renderedWatcher = new RenderedWatcher(this, (isRendered) => this.handleRenderedChange(isRendered));
-    this.open = false;
-    this.label = "";
-    this.withoutHeader = false;
-    this.lightDismiss = false;
-    this.ssrFooter = false;
-    this.handleDocumentKeyDown = (event) => {
-      if (event.key === "Escape" && this.open && isTopDismissible(this)) {
-        event.preventDefault();
-        event.stopPropagation();
-        this.requestClose(this.dialog);
-      }
-    };
-  }
-  firstUpdated(changedProperties) {
-    super.firstUpdated(changedProperties);
-    if (this.open) {
-      this.addOpenListeners();
-      this.dialog.showModal();
-      lockBodyScrolling(this);
-      this.renderedWatcher.start(this.dialog);
-    }
-  }
-  disconnectedCallback() {
-    super.disconnectedCallback();
-    this.renderedWatcher.stop();
-    unlockBodyScrolling(this);
-    this.removeOpenListeners();
-  }
-  async requestClose(source) {
-    const csHideEvent = new CsHideEvent({ source });
-    this.dispatchEvent(csHideEvent);
-    if (csHideEvent.defaultPrevented) {
-      this.open = true;
-      animateWithClass(this.dialog, "pulse");
-      return;
-    }
-    this.removeOpenListeners();
-    await animateWithClass(this.dialog, "hide");
-    this.open = false;
-    this.dialog.close();
-    unlockBodyScrolling(this);
-    this.renderedWatcher.stop();
-    const trigger = this.originalTrigger;
-    if (typeof trigger?.focus === "function") {
-      setTimeout(() => trigger.focus());
-    }
-    this.dispatchEvent(new CsAfterHideEvent());
-  }
-  addOpenListeners() {
-    document.addEventListener("keydown", this.handleDocumentKeyDown);
-    registerDismissible(this);
-  }
-  removeOpenListeners() {
-    document.removeEventListener("keydown", this.handleDocumentKeyDown);
-    unregisterDismissible(this);
-  }
-  handleDialogCancel(event) {
-    event.preventDefault();
-    if (!this.dialog.classList.contains("hide") && event.target === this.dialog && isTopDismissible(this)) {
-      this.requestClose(this.dialog);
-    }
-  }
-  handleDialogClick(event) {
-    const target = event.target;
-    const button = target.closest('[data-dialog="close"]');
-    if (button) {
-      event.stopPropagation();
-      this.requestClose(button);
-    }
-  }
-  async handleDialogPointerDown(event) {
-    if (event.target === this.dialog) {
-      if (this.lightDismiss) {
-        this.requestClose(this.dialog);
-      } else {
-        await animateWithClass(this.dialog, "pulse");
-      }
-    }
-  }
-  /**
-   * Suspends the modal when third-party CSS (e.g. cookie banner blockers) hides an open dialog, so the page isn't
-   * left scroll locked and inert. "open" stays true so the modal resumes if the dialog is rendered again.
-   */
-  handleRenderedChange(isRendered) {
-    if (!this.open) {
-      this.renderedWatcher.stop();
-      return;
-    }
-    if (!isRendered && this.dialog.open) {
-      this.removeOpenListeners();
-      this.dialog.close();
-      unlockBodyScrolling(this);
-    } else if (isRendered && !this.dialog.open) {
-      this.addOpenListeners();
-      this.dialog.showModal();
-      lockBodyScrolling(this);
-    }
-  }
-  handleOpenChange() {
-    if (this.open && !this.dialog.open) {
-      this.show();
-    } else if (!this.open && this.dialog.open) {
-      this.open = true;
-      this.requestClose(this.dialog);
-    } else if (!this.open) {
-      this.renderedWatcher.stop();
-    }
-  }
-  /** Shows the dialog. */
-  async show() {
-    const csShowEvent = new CsShowEvent();
-    this.dispatchEvent(csShowEvent);
-    if (csShowEvent.defaultPrevented) {
-      this.open = false;
-      return;
-    }
-    this.addOpenListeners();
-    this.originalTrigger = document.activeElement;
-    this.open = true;
-    this.dialog.showModal();
-    lockBodyScrolling(this);
-    this.renderedWatcher.start(this.dialog);
-    requestAnimationFrame(() => {
-      const elementToFocus = this.querySelector("[autofocus]");
-      if (elementToFocus && typeof elementToFocus.focus === "function") {
-        elementToFocus.focus();
-      } else {
-        this.dialog.focus();
-      }
-    });
-    await animateWithClass(this.dialog, "show");
-    this.dispatchEvent(new CsAfterShowEvent());
-  }
-  render() {
-    const hasHeader = !this.withoutHeader;
-    const labelledBy = hasHeader ? "title" : void 0;
-    const hasFooter = this.hasSlotController.test("footer", "ssrFooter");
-    return html`
-      <dialog
-        part="dialog"
-        aria-labelledby=${ifDefined(labelledBy)}
-        class=${classMap({
-      dialog: true,
-      open: this.open
-    })}
-        @cancel=${this.handleDialogCancel}
-        @click=${this.handleDialogClick}
-        @pointerdown=${this.handleDialogPointerDown}
-      >
-        ${hasHeader ? html`
-                <header part="header" class="header">
-                  <h2 part="title" class="title" id="title">
-                    <!-- If there's no label, use an invisible character to prevent the header from collapsing -->
-                    <slot name="label"> ${this.label.length > 0 ? this.label : String.fromCharCode(8203)} </slot>
-                  </h2>
-                  <div part="header-actions" class="header-actions">
-                    <slot name="header-actions"></slot>
-                    <cs-button
-                      part="close-button"
-                      exportparts="button:close-button__button"
-                      class="close"
-                      appearance="plain"
-                      @click="${(event) => this.requestClose(event.target)}"
-                    >
-                      <cs-icon name="close" label=${this.localize.term("close")} library="system"></cs-icon>
-                    </cs-button>
-                  </div>
-                </header>
-              ` : ""}
-
-        <div part="body" class="body"><slot></slot></div>
-
-        <!-- Use a hidden element so we still get "slotchange" events. -->
-        <footer part="footer" class="footer" ?hidden=${!hasFooter}>
-          <slot name="footer"></slot>
-        </footer>
-      </dialog>
-    `;
-  }
-};
-CsDialog.css = dialog_styles_default;
-__decorateClass([
-  query(".dialog")
-], CsDialog.prototype, "dialog", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], CsDialog.prototype, "open", 2);
-__decorateClass([
-  property({ reflect: true })
-], CsDialog.prototype, "label", 2);
-__decorateClass([
-  property({ attribute: "without-header", type: Boolean, reflect: true })
-], CsDialog.prototype, "withoutHeader", 2);
-__decorateClass([
-  property({ attribute: "light-dismiss", type: Boolean })
-], CsDialog.prototype, "lightDismiss", 2);
-__decorateClass([
-  property({ attribute: "ssr-footer", type: Boolean })
-], CsDialog.prototype, "ssrFooter", 2);
-__decorateClass([
-  watch("open", { waitUntilFirstUpdate: true })
-], CsDialog.prototype, "handleOpenChange", 1);
-CsDialog = __decorateClass([
-  customElement("cs-dialog")
-], CsDialog);
-if (!isServer) {
-  document.addEventListener("click", (event) => {
-    const dialogAttrEl = event.target.closest("[data-dialog]");
-    if (dialogAttrEl instanceof Element) {
-      const [command, id] = parseSpaceDelimitedTokens(dialogAttrEl.getAttribute("data-dialog") || "");
-      if (command === "open" && id?.length) {
-        const doc = dialogAttrEl.getRootNode();
-        const dialog = doc.getElementById(id);
-        if (dialog?.localName === "cs-dialog") {
-          dialog.open = true;
-        } else {
-          console.warn(`A dialog with an ID of "${id}" could not be found in this document.`);
-        }
-      }
-    }
-  });
-  document.addEventListener("pointerdown", () => {
-  });
-}
-
-export {
-  CsDialog
-};

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

@@ -1,24 +0,0 @@
-/*! Cornerstone Components 0.1.2 - MIT licensed. See LICENSE.md and NOTICE. */
-import {
-  CsSlider
-} from "./chunk.MA5GW6LP.js";
-
-// src/react/slider/index.ts
-import * as React from "react";
-import { createComponent } from "@lit/react";
-import "@lit/react";
-var tagName = "cs-slider";
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: CsSlider,
-  react: React,
-  events: {
-    onCsInvalid: "cs-invalid"
-  },
-  displayName: "CsSlider"
-});
-var slider_default = reactWrapper;
-
-export {
-  slider_default
-};

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

@@ -1,21 +0,0 @@
-/*! Cornerstone Components 0.1.2 - MIT licensed. See LICENSE.md and NOTICE. */
-import {
-  CsFormatBytes
-} from "./chunk.L5KKR37G.js";
-
-// src/react/format-bytes/index.ts
-import * as React from "react";
-import { createComponent } from "@lit/react";
-var tagName = "cs-format-bytes";
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: CsFormatBytes,
-  react: React,
-  events: {},
-  displayName: "CsFormatBytes"
-});
-var format_bytes_default = reactWrapper;
-
-export {
-  format_bytes_default
-};

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

@@ -1,76 +0,0 @@
-/*! Cornerstone Components 0.1.2 - MIT licensed. See LICENSE.md and NOTICE. */
-
-// src/components/progress-bar/progress-bar.styles.ts
-import { css } from "lit";
-var progress_bar_styles_default = css`
-  :host {
-    --track-height: 1rem;
-    --track-color: var(--cs-color-neutral-fill-normal);
-    --indicator-color: var(--cs-color-brand-fill-loud);
-
-    display: flex;
-  }
-
-  .progress-bar {
-    flex: 1 1 auto;
-    display: flex;
-    position: relative;
-    overflow: hidden;
-    height: var(--track-height);
-    border-radius: var(--cs-border-radius-pill);
-    background-color: var(--track-color);
-    color: var(--cs-color-brand-on-loud);
-    font-size: var(--cs-font-size-s);
-  }
-
-  .indicator {
-    width: var(--percentage);
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    background-color: var(--indicator-color);
-    text-align: center;
-    white-space: nowrap;
-    overflow: hidden;
-    line-height: 1;
-    font-weight: var(--cs-font-weight-semibold);
-    transition: all var(--cs-transition-slow, 200ms) var(--cs-transition-easing, ease);
-    user-select: none;
-    -webkit-user-select: none;
-  }
-
-  /* Indeterminate */
-  :host([indeterminate]) .indicator {
-    position: absolute;
-    inset-block: 0;
-    inline-size: 50%;
-    animation: cs-progress-indeterminate 2.5s infinite cubic-bezier(0.37, 0, 0.63, 1);
-  }
-
-  @media (forced-colors: active) {
-    .progress-bar {
-      outline: solid 1px SelectedItem;
-      background-color: var(--cs-color-surface-default);
-    }
-
-    .indicator {
-      outline: solid 1px SelectedItem;
-      background-color: SelectedItem;
-    }
-  }
-
-  @keyframes cs-progress-indeterminate {
-    0% {
-      inset-inline-start: -50%;
-    }
-
-    75%,
-    100% {
-      inset-inline-start: 100%;
-    }
-  }
-`;
-
-export {
-  progress_bar_styles_default
-};

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

@@ -1,239 +0,0 @@
-/*! Cornerstone Components 0.1.2 - MIT licensed. See LICENSE.md and NOTICE. */
-
-// src/components/tab-group/tab-group.styles.ts
-import { css } from "lit";
-var tab_group_styles_default = css`
-  :host {
-    --indicator-color: var(--cs-color-brand-fill-loud);
-    --track-color: var(--cs-color-neutral-fill-normal);
-    --track-width: 0.125rem;
-
-    /* Private */
-    --safe-track-width: max(0.5px, round(var(--track-width), 0.5px));
-
-    display: block;
-  }
-
-  .tab-group {
-    display: flex;
-    border-radius: 0;
-  }
-
-  .tabs {
-    display: flex;
-    position: relative;
-  }
-
-  .indicator {
-    position: absolute;
-  }
-
-  .tab-group-has-scroll-controls .nav-container {
-    position: relative;
-    padding: 0 1.5em;
-  }
-
-  .body {
-    display: block;
-  }
-
-  .scroll-button {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    width: 1.5em;
-  }
-
-  .scroll-button-start {
-    inset-inline-start: 0;
-  }
-
-  .scroll-button-end {
-    inset-inline-end: 0;
-  }
-
-  /*
-    * Top
-    */
-
-  .tab-group-top {
-    flex-direction: column;
-  }
-
-  .tab-group-top .nav-container {
-    order: 1;
-  }
-
-  .tab-group-top .nav {
-    display: flex;
-    overflow-x: auto;
-
-    /* Hide scrollbar in Firefox */
-    scrollbar-width: none;
-  }
-
-  /* Hide scrollbar in Chrome/Safari */
-  .tab-group-top .nav::-webkit-scrollbar {
-    width: 0;
-    height: 0;
-  }
-
-  .tab-group-top .tabs {
-    flex: 1 1 auto;
-    position: relative;
-    flex-direction: row;
-    border-bottom: solid var(--safe-track-width) var(--track-color);
-  }
-
-  .tab-group-top .indicator {
-    bottom: calc(-1 * var(--safe-track-width));
-    border-bottom: solid var(--safe-track-width) var(--indicator-color);
-  }
-
-  .tab-group-top .body {
-    order: 2;
-  }
-
-  /* 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. */
-  .tab-group-top ::slotted(cs-tab[active]) {
-    border-block-end: solid var(--safe-track-width) var(--indicator-color);
-    margin-block-end: calc(-1 * var(--safe-track-width)) !important;
-  }
-
-  .tab-group-top .body slot::slotted(cs-tab-panel) {
-    --padding: var(--cs-space-xl) 0;
-  }
-
-  /*
-    * Bottom
-    */
-
-  .tab-group-bottom {
-    flex-direction: column;
-  }
-
-  .tab-group-bottom .nav-container {
-    order: 2;
-  }
-
-  .tab-group-bottom .nav {
-    display: flex;
-    overflow-x: auto;
-
-    /* Hide scrollbar in Firefox */
-    scrollbar-width: none;
-  }
-
-  /* Hide scrollbar in Chrome/Safari */
-  .tab-group-bottom .nav::-webkit-scrollbar {
-    width: 0;
-    height: 0;
-  }
-
-  .tab-group-bottom .tabs {
-    flex: 1 1 auto;
-    position: relative;
-    flex-direction: row;
-    border-top: solid var(--safe-track-width) var(--track-color);
-  }
-
-  .tab-group-bottom .indicator {
-    top: calc(-1 * var(--safe-track-width));
-    border-top: solid var(--safe-track-width) var(--indicator-color);
-  }
-
-  .tab-group-bottom .body {
-    order: 1;
-  }
-
-  .tab-group-bottom ::slotted(cs-tab[active]) {
-    border-block-start: solid var(--safe-track-width) var(--indicator-color);
-    margin-block-start: calc(-1 * var(--safe-track-width)) !important;
-  }
-
-  .tab-group-bottom .body slot::slotted(cs-tab-panel) {
-    --padding: var(--cs-space-xl) 0;
-  }
-
-  /*
-    * Start
-    */
-
-  .tab-group-start {
-    flex-direction: row;
-  }
-
-  .tab-group-start .nav-container {
-    order: 1;
-  }
-
-  .tab-group-start .tabs {
-    flex: 0 0 auto;
-    flex-direction: column;
-    border-inline-end: solid var(--safe-track-width) var(--track-color);
-  }
-
-  .tab-group-start .indicator {
-    inset-inline-end: calc(-1 * var(--safe-track-width));
-    border-right: solid var(--safe-track-width) var(--indicator-color);
-  }
-
-  .tab-group-start .body {
-    flex: 1 1 auto;
-    order: 2;
-  }
-
-  .tab-group-start ::slotted(cs-tab[active]) {
-    border-inline-end: solid var(--safe-track-width) var(--indicator-color);
-    margin-inline-end: calc(-1 * var(--safe-track-width)) !important;
-  }
-
-  .tab-group-start .body slot::slotted(cs-tab-panel) {
-    --padding: 0 var(--cs-space-xl);
-  }
-
-  /*
-    * End
-    */
-
-  .tab-group-end {
-    flex-direction: row;
-  }
-
-  .tab-group-end .nav-container {
-    order: 2;
-  }
-
-  .tab-group-end .tabs {
-    flex: 0 0 auto;
-    flex-direction: column;
-    border-left: solid var(--safe-track-width) var(--track-color);
-  }
-
-  .tab-group-end .indicator {
-    inset-inline-start: calc(-1 * var(--safe-track-width));
-    border-inline-start: solid var(--safe-track-width) var(--indicator-color);
-  }
-
-  .tab-group-end .body {
-    flex: 1 1 auto;
-    order: 1;
-  }
-
-  .tab-group-end ::slotted(cs-tab[active]) {
-    border-inline-start: solid var(--safe-track-width) var(--indicator-color);
-    margin-inline-start: calc(-1 * var(--safe-track-width)) !important;
-  }
-
-  .tab-group-end .body slot::slotted(cs-tab-panel) {
-    --padding: 0 var(--cs-space-xl);
-  }
-`;
-
-export {
-  tab_group_styles_default
-};

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

@@ -1,12 +0,0 @@
-/*! Cornerstone Components 0.1.2 - MIT licensed. See LICENSE.md and NOTICE. */
-
-// src/events/after-hide.ts
-var CsAfterHideEvent = class extends Event {
-  constructor() {
-    super("cs-after-hide", { bubbles: true, cancelable: false, composed: true });
-  }
-};
-
-export {
-  CsAfterHideEvent
-};

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

@@ -1,12 +0,0 @@
-/*! Cornerstone Components 0.1.2 - MIT licensed. See LICENSE.md and NOTICE. */
-
-// src/events/after-show.ts
-var CsAfterShowEvent = class extends Event {
-  constructor() {
-    super("cs-after-show", { bubbles: true, cancelable: false, composed: true });
-  }
-};
-
-export {
-  CsAfterShowEvent
-};

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

@@ -1,12 +0,0 @@
-/*! Cornerstone Components 0.1.2 - MIT licensed. See LICENSE.md and NOTICE. */
-
-// src/events/error.ts
-var CsErrorEvent = class extends Event {
-  constructor() {
-    super("cs-error", { bubbles: true, cancelable: false, composed: true });
-  }
-};
-
-export {
-  CsErrorEvent
-};