@cruglobal/cornerstone-components 0.1.3 → 0.6.1

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

@@ -1,291 +0,0 @@
-/*! Cornerstone Components 0.1.3 - MIT licensed. See LICENSE.md and NOTICE. */
-import {
-  popover_styles_default
-} from "./chunk.LDU55L2S.js";
-import {
-  CsShowEvent
-} from "./chunk.7OGYK7JC.js";
-import {
-  CsHideEvent
-} from "./chunk.YZPBLI7S.js";
-import {
-  CsAfterHideEvent
-} from "./chunk.CMUSZKOP.js";
-import {
-  CsAfterShowEvent
-} from "./chunk.4TDWMHO6.js";
-import {
-  CsPopup
-} from "./chunk.VKOXCGEZ.js";
-import {
-  isTopDismissible,
-  registerDismissible,
-  unregisterDismissible
-} from "./chunk.3XC5LOZZ.js";
-import {
-  uniqueId
-} from "./chunk.OQW3LNFH.js";
-import {
-  waitForEvent
-} from "./chunk.QE6GTLC3.js";
-import {
-  animateWithClass
-} from "./chunk.BHWZGHBO.js";
-import {
-  watch
-} from "./chunk.MBVC472U.js";
-import {
-  CornerstoneElement,
-  customElement
-} from "./chunk.LGF4LDQG.js";
-import {
-  __decorateClass
-} from "./chunk.6UN6XRW4.js";
-
-// src/components/popover/popover.ts
-import { html } from "lit";
-import { property, query, state } from "lit/decorators.js";
-import { classMap } from "lit/directives/class-map.js";
-var openPopovers = /* @__PURE__ */ new Set();
-var CsPopover = class extends CornerstoneElement {
-  constructor() {
-    super(...arguments);
-    this.anchor = null;
-    this.placement = "top";
-    this.open = false;
-    this.distance = 8;
-    this.skidding = 0;
-    this.for = null;
-    this.withoutArrow = false;
-    this.eventController = new AbortController();
-    this.handleAnchorClick = () => {
-      this.open = !this.open;
-    };
-    this.handleBodyClick = (event) => {
-      const target = event.target;
-      const button = target.closest('[data-popover="close"]');
-      if (button) {
-        event.stopPropagation();
-        this.open = false;
-      }
-    };
-    this.handleDocumentKeyDown = (event) => {
-      if (event.key === "Escape" && this.open && isTopDismissible(this)) {
-        event.preventDefault();
-        event.stopPropagation();
-        this.open = false;
-        const anchor = this.anchor;
-        if (anchor && typeof anchor.focus === "function") {
-          anchor.focus({ preventScroll: true });
-        }
-      }
-    };
-    this.handleDocumentClick = (event) => {
-      if (this.anchor && event.composedPath().includes(this.anchor)) {
-        return;
-      }
-      if (!event.composedPath().includes(this)) {
-        this.open = false;
-      }
-    };
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    if (!this.id) {
-      this.id = uniqueId("cs-popover-");
-    }
-    if (this.eventController.signal.aborted) {
-      this.eventController = new AbortController();
-    }
-    if (this.for && this.anchor) {
-      this.anchor = null;
-      this.handleForChange();
-    }
-  }
-  disconnectedCallback() {
-    super.disconnectedCallback();
-    document.removeEventListener("keydown", this.handleDocumentKeyDown);
-    unregisterDismissible(this);
-    this.eventController.abort();
-  }
-  firstUpdated(changedProperties) {
-    super.firstUpdated(changedProperties);
-    if (this.open) {
-      this.dialog.show();
-      this.popup.active = true;
-      this.popup.reposition();
-    }
-  }
-  updated(changedProperties) {
-    if (changedProperties.has("open")) {
-      this.customStates.set("open", this.open);
-    }
-  }
-  async handleOpenChange() {
-    if (this.open) {
-      const csShowEvent = new CsShowEvent();
-      this.dispatchEvent(csShowEvent);
-      if (csShowEvent.defaultPrevented) {
-        this.open = false;
-        return;
-      }
-      openPopovers.forEach((popover) => popover.open = false);
-      document.addEventListener("keydown", this.handleDocumentKeyDown, { signal: this.eventController.signal });
-      document.addEventListener("click", this.handleDocumentClick, { signal: this.eventController.signal });
-      this.dialog.setAttribute("open", "");
-      this.popup.active = true;
-      openPopovers.add(this);
-      registerDismissible(this);
-      requestAnimationFrame(() => {
-        const elementToFocus = this.querySelector("[autofocus]");
-        if (elementToFocus && typeof elementToFocus.focus === "function") {
-          elementToFocus.focus({ preventScroll: true });
-        } else {
-          this.dialog.focus({ preventScroll: true });
-        }
-      });
-      await animateWithClass(this.popup.popup, "show-with-scale");
-      this.popup.reposition();
-      this.dispatchEvent(new CsAfterShowEvent());
-    } else {
-      const csHideEvent = new CsHideEvent();
-      this.dispatchEvent(csHideEvent);
-      if (csHideEvent.defaultPrevented) {
-        this.open = true;
-        return;
-      }
-      document.removeEventListener("keydown", this.handleDocumentKeyDown);
-      document.removeEventListener("click", this.handleDocumentClick);
-      openPopovers.delete(this);
-      unregisterDismissible(this);
-      await animateWithClass(this.popup.popup, "hide-with-scale");
-      this.popup.active = false;
-      this.dialog.close();
-      this.dispatchEvent(new CsAfterHideEvent());
-    }
-  }
-  handleForChange() {
-    const rootNode = this.getRootNode();
-    if (!rootNode) {
-      return;
-    }
-    const newAnchor = this.for ? rootNode.getElementById(this.for) : null;
-    const oldAnchor = this.anchor;
-    if (newAnchor === oldAnchor) {
-      return;
-    }
-    const { signal } = this.eventController;
-    if (newAnchor) {
-      newAnchor.addEventListener("click", this.handleAnchorClick, { signal });
-    }
-    if (oldAnchor) {
-      oldAnchor.removeEventListener("click", this.handleAnchorClick);
-    }
-    this.anchor = newAnchor;
-    if (this.for && !newAnchor) {
-      console.warn(
-        `A popover was assigned to an element with an ID of "${this.for}" but the element could not be found.`,
-        this
-      );
-    }
-  }
-  async handleOptionsChange() {
-    if (this.hasUpdated) {
-      await this.updateComplete;
-      this.popup.reposition();
-    }
-  }
-  /** Shows the popover. */
-  async show() {
-    if (this.open) {
-      return void 0;
-    }
-    this.open = true;
-    return waitForEvent(this, "cs-after-show");
-  }
-  /** Hides the popover. */
-  async hide() {
-    if (!this.open) {
-      return void 0;
-    }
-    this.open = false;
-    return waitForEvent(this, "cs-after-hide");
-  }
-  render() {
-    return html`
-      <dialog part="dialog" class="dialog">
-        <cs-popup
-          part="popup"
-          exportparts="
-            popup:popup__popup,
-            arrow:popup__arrow
-          "
-          class=${classMap({
-      popover: true,
-      "popover-open": this.open
-    })}
-          placement=${this.placement}
-          distance=${this.distance}
-          skidding=${this.skidding}
-          flip
-          shift
-          shift-padding="8"
-          ?arrow=${!this.withoutArrow}
-          .anchor=${this.anchor}
-        >
-          <div part="body" class="body" @click=${this.handleBodyClick}>
-            <slot></slot>
-          </div>
-        </cs-popup>
-      </dialog>
-    `;
-  }
-};
-CsPopover.css = popover_styles_default;
-CsPopover.dependencies = { "cs-popup": CsPopup };
-__decorateClass([
-  query("dialog")
-], CsPopover.prototype, "dialog", 2);
-__decorateClass([
-  query(".body")
-], CsPopover.prototype, "body", 2);
-__decorateClass([
-  query("cs-popup")
-], CsPopover.prototype, "popup", 2);
-__decorateClass([
-  state()
-], CsPopover.prototype, "anchor", 2);
-__decorateClass([
-  property()
-], CsPopover.prototype, "placement", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], CsPopover.prototype, "open", 2);
-__decorateClass([
-  property({ type: Number })
-], CsPopover.prototype, "distance", 2);
-__decorateClass([
-  property({ type: Number })
-], CsPopover.prototype, "skidding", 2);
-__decorateClass([
-  property()
-], CsPopover.prototype, "for", 2);
-__decorateClass([
-  property({ attribute: "without-arrow", type: Boolean, reflect: true })
-], CsPopover.prototype, "withoutArrow", 2);
-__decorateClass([
-  watch("open", { waitUntilFirstUpdate: true })
-], CsPopover.prototype, "handleOpenChange", 1);
-__decorateClass([
-  watch("for")
-], CsPopover.prototype, "handleForChange", 1);
-__decorateClass([
-  watch(["distance", "placement", "skidding"])
-], CsPopover.prototype, "handleOptionsChange", 1);
-CsPopover = __decorateClass([
-  customElement("cs-popover")
-], CsPopover);
-
-export {
-  CsPopover
-};

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

@@ -1,27 +0,0 @@
-/*! Cornerstone Components 0.1.3 - MIT licensed. See LICENSE.md and NOTICE. */
-import {
-  CsDialog
-} from "./chunk.DPLOUU4S.js";
-
-// src/react/dialog/index.ts
-import * as React from "react";
-import { createComponent } from "@lit/react";
-import "@lit/react";
-var tagName = "cs-dialog";
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: CsDialog,
-  react: React,
-  events: {
-    onCsShow: "cs-show",
-    onCsAfterShow: "cs-after-show",
-    onCsHide: "cs-hide",
-    onCsAfterHide: "cs-after-hide"
-  },
-  displayName: "CsDialog"
-});
-var dialog_default = reactWrapper;
-
-export {
-  dialog_default
-};

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

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

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

@@ -1,27 +0,0 @@
-/*! Cornerstone Components 0.1.3 - MIT licensed. See LICENSE.md and NOTICE. */
-import {
-  CsDetails
-} from "./chunk.VWDVSU5B.js";
-
-// src/react/details/index.ts
-import * as React from "react";
-import { createComponent } from "@lit/react";
-import "@lit/react";
-var tagName = "cs-details";
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: CsDetails,
-  react: React,
-  events: {
-    onCsShow: "cs-show",
-    onCsAfterShow: "cs-after-show",
-    onCsHide: "cs-hide",
-    onCsAfterHide: "cs-after-hide"
-  },
-  displayName: "CsDetails"
-});
-var details_default = reactWrapper;
-
-export {
-  details_default
-};

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

@@ -1,91 +0,0 @@
-/*! Cornerstone Components 0.1.3 - MIT licensed. See LICENSE.md and NOTICE. */
-import {
-  breadcrumb_styles_default
-} from "./chunk.E2SU5NWX.js";
-import {
-  CornerstoneElement,
-  customElement
-} from "./chunk.LGF4LDQG.js";
-import {
-  LocalizeController
-} from "./chunk.FZ4QCNJ4.js";
-import {
-  __decorateClass
-} from "./chunk.6UN6XRW4.js";
-
-// src/components/breadcrumb/breadcrumb.ts
-import { html } from "lit";
-import { property, query } from "lit/decorators.js";
-var CsBreadcrumb = class extends CornerstoneElement {
-  constructor() {
-    super(...arguments);
-    this.localize = new LocalizeController(this);
-    this.separatorDir = this.localize.dir();
-    this.label = "";
-  }
-  // Generates a clone of the separator element to use for each breadcrumb item
-  getSeparator() {
-    const separator = this.separatorSlot.assignedElements({ flatten: true })[0];
-    const clone = separator.cloneNode(true);
-    [clone, ...clone.querySelectorAll("[id]")].forEach((el) => el.removeAttribute("id"));
-    clone.setAttribute("data-default", "");
-    clone.slot = "separator";
-    return clone;
-  }
-  handleSlotChange() {
-    const items = [...this.defaultSlot.assignedElements({ flatten: true })].filter(
-      (item) => item.tagName.toLowerCase() === "cs-breadcrumb-item"
-    );
-    items.forEach((item, index) => {
-      const separator = item.querySelector('[slot="separator"]');
-      if (separator === null) {
-        item.append(this.getSeparator());
-      } else if (separator.hasAttribute("data-default")) {
-        separator.replaceWith(this.getSeparator());
-      } else {
-      }
-      if (index === items.length - 1) {
-        item.setAttribute("aria-current", "page");
-      } else {
-        item.removeAttribute("aria-current");
-      }
-    });
-  }
-  render() {
-    if (this.separatorDir !== this.localize.dir()) {
-      this.separatorDir = this.localize.dir();
-      this.updateComplete.then(() => this.handleSlotChange());
-    }
-    return html`
-      <nav part="breadcrumb" class="breadcrumb" aria-label=${this.label}>
-        <slot @slotchange=${this.handleSlotChange}></slot>
-      </nav>
-
-      <span hidden aria-hidden="true">
-        <slot name="separator">
-          <cs-icon
-            name=${this.localize.dir() === "rtl" ? "keyboard_arrow_left" : "keyboard_arrow_right"}
-            library="system"
-          ></cs-icon>
-        </slot>
-      </span>
-    `;
-  }
-};
-CsBreadcrumb.css = breadcrumb_styles_default;
-__decorateClass([
-  query("slot")
-], CsBreadcrumb.prototype, "defaultSlot", 2);
-__decorateClass([
-  query('slot[name="separator"]')
-], CsBreadcrumb.prototype, "separatorSlot", 2);
-__decorateClass([
-  property()
-], CsBreadcrumb.prototype, "label", 2);
-CsBreadcrumb = __decorateClass([
-  customElement("cs-breadcrumb")
-], CsBreadcrumb);
-
-export {
-  CsBreadcrumb
-};

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

@@ -1,25 +0,0 @@
-/*! Cornerstone Components 0.1.3 - MIT licensed. See LICENSE.md and NOTICE. */
-import {
-  CsIcon
-} from "./chunk.BG3O242I.js";
-
-// src/react/icon/index.ts
-import * as React from "react";
-import { createComponent } from "@lit/react";
-import "@lit/react";
-var tagName = "cs-icon";
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: CsIcon,
-  react: React,
-  events: {
-    onCsLoad: "cs-load",
-    onCsError: "cs-error"
-  },
-  displayName: "CsIcon"
-});
-var icon_default = reactWrapper;
-
-export {
-  icon_default
-};

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

@@ -1,24 +0,0 @@
-/*! Cornerstone Components 0.1.3 - MIT licensed. See LICENSE.md and NOTICE. */
-import {
-  CsCarousel
-} from "./chunk.KZ6SLPON.js";
-
-// src/react/carousel/index.ts
-import * as React from "react";
-import { createComponent } from "@lit/react";
-import "@lit/react";
-var tagName = "cs-carousel";
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: CsCarousel,
-  react: React,
-  events: {
-    onCsSlideChange: "cs-slide-change"
-  },
-  displayName: "CsCarousel"
-});
-var carousel_default = reactWrapper;
-
-export {
-  carousel_default
-};

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

@@ -1,178 +0,0 @@
-/*! Cornerstone Components 0.1.3 - MIT licensed. See LICENSE.md and NOTICE. */
-
-// src/translations/en.ts
-import { registerTranslation } from "@shoelace-style/localize";
-var translation = {
-  $code: "en",
-  $name: "English",
-  $dir: "ltr",
-  am: "AM",
-  autosizeColumn: "Autosize column",
-  captions: "Captions",
-  carousel: "Carousel",
-  chooseDate: "Choose date",
-  chooseDecade: "Choose decade",
-  chooseMonth: "Choose month",
-  chooseTime: "Choose time",
-  chooseYear: "Choose year",
-  clearEntry: "Clear entry",
-  clearFilter: "Clear filter",
-  clearSort: "Clear sort",
-  close: "Close",
-  closeCalendar: "Close calendar",
-  closeTimeInput: "Close time picker",
-  collapseRow: "Collapse row",
-  columnMenu: "Column options",
-  columnMovedToPosition: (label, position, total) => `${label} moved to position ${position} of ${total}`,
-  columns: "Columns",
-  compactPageXOfY: (page, total) => `${page} of ${total}`,
-  copied: "Copied",
-  copy: "Copy",
-  createOption: (value) => `Create "${value}"`,
-  currentlyPlaying: "currently playing",
-  currentValue: "Current value",
-  date: "Date",
-  datePickerKeyboardHelp: "Use arrow keys to change values; press Alt+Down Arrow to open the calendar.",
-  day: "Day",
-  dayPeriod: "AM/PM",
-  decrement: "Decrement",
-  deselectAllRows: "Deselect all rows",
-  dropFileHere: "Drop file here or click to browse",
-  dropFilesHere: "Drop files here or click to browse",
-  empty: "Empty",
-  endDate: "End date",
-  enterFullscreen: "Enter fullscreen",
-  error: "Error",
-  exitFullscreen: "Exit fullscreen",
-  expandRow: "Expand row",
-  filterByColumn: (label) => `Filter by ${label}`,
-  filterFrom: "From",
-  filterMax: "Max",
-  filterMin: "Min",
-  filterTo: "To",
-  firstPage: "First page",
-  goToSlide: (slide, count) => `Go to slide ${slide} of ${count}`,
-  hideColumn: "Hide column",
-  hidePassword: "Hide password",
-  hour: "Hour",
-  incompleteDate: "Enter a valid date.",
-  increment: "Increment",
-  jumpBackwardX: (count) => `Jump back ${count} pages`,
-  jumpForwardX: (count) => `Jump forward ${count} pages`,
-  lastPage: "Last page",
-  loading: "Loading",
-  minute: "Minute",
-  month: "Month",
-  moreOptions: "More Options",
-  mute: "Mute",
-  nextDecade: "Next decade",
-  nextMonth: "Next month",
-  nextPage: "Next page",
-  nextSlide: "Next slide",
-  nextVideo: "Next Video",
-  nextYear: "Next year",
-  noData: "No data",
-  noResults: "No matching results",
-  now: "Now",
-  numCharacters: (num) => {
-    if (num === 1) {
-      return "1 character";
-    }
-    return `${num} characters`;
-  },
-  numCharactersRemaining: (num) => {
-    if (num === 1) {
-      return "1 character remaining";
-    }
-    return `${num} characters remaining`;
-  },
-  numOptionsSelected: (num) => {
-    if (num === 0) {
-      return "No options selected";
-    }
-    if (num === 1) {
-      return "1 option selected";
-    }
-    return `${num} options selected`;
-  },
-  numRowsCopied: (num) => num === 1 ? "1 row copied" : `${num} rows copied`,
-  numRowsSelected: (num) => num === 1 ? "1 row selected" : `${num} rows selected`,
-  pageXOfY: (page, total) => `Page ${page} of ${total}`,
-  pagination: "Pagination",
-  pause: "Pause",
-  pauseAnimation: "Pause animation",
-  pictureInPicture: "Picture in picture",
-  pinLeft: "Pin left",
-  pinRight: "Pin right",
-  play: "Play",
-  playAnimation: "Play animation",
-  playbackSpeed: "Playback speed",
-  playlist: "Playlist",
-  pm: "PM",
-  previousDecade: "Previous decade",
-  previousMonth: "Previous month",
-  previousPage: "Previous page",
-  previousSlide: "Previous slide",
-  previousVideo: "Previous video",
-  previousYear: "Previous year",
-  progress: "Progress",
-  rangeTooLong: (max) => {
-    if (max === 1) {
-      return "Select a range no longer than 1 day";
-    }
-    return `Select a range no longer than ${max} days`;
-  },
-  rangeTooShort: (min) => {
-    if (min === 1) {
-      return "Select a range at least 1 day long";
-    }
-    return `Select a range at least ${min} days long`;
-  },
-  readonly: "Read-only",
-  remove: "Remove",
-  resetColumns: "Reset columns",
-  resize: "Resize",
-  resizeColumn: "Resize column",
-  rowsPerPage: "Rows per page",
-  scrollableRegion: "Scrollable region",
-  scrollToEnd: "Scroll to end",
-  scrollToStart: "Scroll to start",
-  search: "Search",
-  second: "Second",
-  seek: "Seek",
-  seekProgress: (current, duration) => `${current} of ${duration}`,
-  selectAColorFromTheScreen: "Select a color from the screen",
-  selectAllRows: "Select all rows",
-  selected: "Selected",
-  selectedDateLabel: (date) => `Selected: ${date}`,
-  selectedRangeLabel: (range) => `Selected range: ${range}`,
-  selectGroup: "Select group",
-  selectionCleared: "Selection cleared",
-  selectRow: "Select row",
-  showingNofMRows: (shown, total) => `Showing ${shown} of ${total} rows`,
-  showingXtoYofZ: (start, end, total) => `${start}\u2013${end} of ${total}`,
-  showPassword: "Show password",
-  slideNum: (slide) => `Slide ${slide}`,
-  sortAscending: "Sort ascending",
-  sortColumn: "Sort column",
-  sortDescending: "Sort descending",
-  startDate: "Start date",
-  time: "Time",
-  timeInputKeyboardHelp: "Use arrow keys to change values; press Alt+Down Arrow to open the time picker.",
-  today: "Today",
-  toggleColorFormat: "Toggle color format",
-  unmute: "Unmute",
-  unpin: "Unpin",
-  unpinColumn: "Unpin column",
-  videoPlayer: "Video player",
-  volume: "Volume",
-  year: "Year",
-  zoomIn: "Zoom in",
-  zoomOut: "Zoom out"
-};
-registerTranslation(translation);
-var en_default = translation;
-
-export {
-  en_default
-};

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

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