@lostgradient/cinder 0.1.1 → 0.2.0

package/dist/server/components/choice-grid-item/choice-grid-item.variables.js

@@ -0,0 +1,43 @@
+import { createRequire } from "node:module";
+var __create = Object.create;
+var __getProtoOf = Object.getPrototypeOf;
+var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+function __accessProp(key) {
+  return this[key];
+}
+var __toESMCache_node;
+var __toESMCache_esm;
+var __toESM = (mod, isNodeMode, target) => {
+  var canCache = mod != null && typeof mod === "object";
+  if (canCache) {
+    var cache = isNodeMode ? __toESMCache_node ??= new WeakMap : __toESMCache_esm ??= new WeakMap;
+    var cached = cache.get(mod);
+    if (cached)
+      return cached;
+  }
+  target = mod != null ? __create(__getProtoOf(mod)) : {};
+  const to = isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target;
+  for (let key of __getOwnPropNames(mod))
+    if (!__hasOwnProp.call(to, key))
+      __defProp(to, key, {
+        get: __accessProp.bind(mod, key),
+        enumerable: true
+      });
+  if (canCache)
+    cache.set(mod, to);
+  return to;
+};
+var __commonJS = (cb, mod) => () => (mod || cb((mod = { exports: {} }).exports, mod), mod.exports);
+var __esm = (fn, res) => () => (fn && (res = fn(fn = 0)), res);
+var __require = /* @__PURE__ */ createRequire(import.meta.url);
+
+// src/components/choice-grid-item/choice-grid-item.variables.ts
+var variables = [];
+var choice_grid_item_variables_default = variables;
+export {
+  choice_grid_item_variables_default as default
+};
+
+//# debugId=37B629BDF4F439A964756E2164756E21

package/dist/server/components/choice-grid-item/index.css

@@ -0,0 +1,86 @@
+/* src/components/choice-grid-item/choice-grid-item.css */
+@layer cinder.tokens, cinder.foundation, cinder.components, cinder.utilities;
+
+@layer cinder.components {
+  .cinder-choice-grid-item {
+    display: flex;
+    text-align: center;
+    padding: var(--cinder-space-4) var(--cinder-space-3);
+    border-radius: var(--cinder-radius-lg);
+    border: 2px solid var(--cinder-border-muted);
+    background: var(--cinder-surface);
+    color: var(--cinder-text);
+    cursor: pointer;
+    user-select: none;
+    outline: none;
+    touch-action: manipulation;
+    justify-content: center;
+    align-items:  center;
+    min-block-size: 4rem;
+    transition: background .12s, border-color .12s, box-shadow .12s;
+  }
+
+  .cinder-choice-grid-item__content {
+    display: inline-flex;
+    align-items:  center;
+    gap: var(--cinder-space-1);
+    font-size: var(--cinder-text-base);
+    font-weight: var(--cinder-font-medium);
+    line-height: var(--cinder-leading-snug);
+    pointer-events: none;
+    flex-direction: column;
+  }
+
+  @media (hover: hover) {
+    .cinder-choice-grid-item:not([data-cinder-disabled]):not([data-cinder-selected]):not([data-cinder-state]):hover {
+      border-color: var(--cinder-border);
+      background: var(--cinder-surface-raised);
+    }
+  }
+
+  .cinder-choice-grid-item:focus-visible {
+    border-color: var(--cinder-accent);
+    box-shadow: var(--_cinder-focus-ring-shadow);
+  }
+
+  @media (forced-colors: active) {
+    .cinder-choice-grid-item:focus-visible {
+      outline: var(--cinder-ring-width) solid ButtonText;
+      outline-offset: 2px;
+    }
+  }
+
+  .cinder-choice-grid-item[data-cinder-selected] {
+    border-color: var(--cinder-accent);
+    color: var(--cinder-accent-text);
+  }
+
+  @media (hover: hover) {
+    .cinder-choice-grid-item[data-cinder-selected]:not([data-cinder-disabled]):not([data-cinder-state]):hover {
+      border-color: var(--cinder-accent-hover);
+    }
+  }
+
+  .cinder-choice-grid-item[data-cinder-disabled] {
+    cursor: not-allowed;
+    opacity: .45;
+  }
+
+  .cinder-choice-grid-item[data-cinder-state="correct"] {
+    border-color: var(--cinder-color-success-border);
+    background: var(--cinder-color-success-bg);
+    color: var(--cinder-color-success-fg);
+  }
+
+  .cinder-choice-grid-item[data-cinder-state="incorrect"] {
+    border-color: var(--cinder-color-danger-border);
+    background: var(--cinder-color-danger-bg);
+    color: var(--cinder-color-danger-fg);
+  }
+
+  .cinder-choice-grid-item[data-cinder-state="pending"] {
+    border-color: var(--cinder-color-warning-border);
+    background: var(--cinder-color-warning-bg);
+    color: var(--cinder-color-warning-fg);
+  }
+}

package/dist/server/components/choice-grid-item/index.js

@@ -0,0 +1,139 @@
+import { createRequire } from "node:module";
+var __create = Object.create;
+var __getProtoOf = Object.getPrototypeOf;
+var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+function __accessProp(key) {
+  return this[key];
+}
+var __toESMCache_node;
+var __toESMCache_esm;
+var __toESM = (mod, isNodeMode, target) => {
+  var canCache = mod != null && typeof mod === "object";
+  if (canCache) {
+    var cache = isNodeMode ? __toESMCache_node ??= new WeakMap : __toESMCache_esm ??= new WeakMap;
+    var cached = cache.get(mod);
+    if (cached)
+      return cached;
+  }
+  target = mod != null ? __create(__getProtoOf(mod)) : {};
+  const to = isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target;
+  for (let key of __getOwnPropNames(mod))
+    if (!__hasOwnProp.call(to, key))
+      __defProp(to, key, {
+        get: __accessProp.bind(mod, key),
+        enumerable: true
+      });
+  if (canCache)
+    cache.set(mod, to);
+  return to;
+};
+var __commonJS = (cb, mod) => () => (mod || cb((mod = { exports: {} }).exports, mod), mod.exports);
+var __esm = (fn, res) => () => (fn && (res = fn(fn = 0)), res);
+var __require = /* @__PURE__ */ createRequire(import.meta.url);
+
+// src/components/choice-grid-item/choice-grid-item.svelte
+import * as $ from "svelte/internal/server";
+import { untrack } from "svelte";
+
+// src/components/choice-grid/choice-grid-context.ts
+import { createContext } from "svelte";
+var [getChoiceGridContextStrict, setChoiceGridContext] = createContext();
+var getChoiceGridContext = getChoiceGridContextStrict;
+
+// src/utilities/class-names.ts
+function classNames(...parts) {
+  return parts.filter((part) => typeof part === "string" && part.length > 0).join(" ");
+}
+
+// src/_internal/collection.ts
+function createSingleSelection(getValue, setValue) {
+  return {
+    get value() {
+      return getValue();
+    },
+    select(next) {
+      setValue(next);
+    },
+    isSelected(candidate) {
+      return getValue() === candidate;
+    }
+  };
+}
+function createMultiSelection(getValues, setValues) {
+  return {
+    get values() {
+      return getValues();
+    },
+    toggle(item) {
+      const current = getValues();
+      const index = current.indexOf(item);
+      if (index === -1) {
+        setValues([...current, item]);
+      } else {
+        setValues(current.filter((existing) => existing !== item));
+      }
+    },
+    isSelected(candidate) {
+      return getValues().includes(candidate);
+    }
+  };
+}
+function rovingTabIndex(isActive) {
+  return isActive ? 0 : -1;
+}
+
+// ../../node_modules/esm-env/false.js
+var false_default = false;
+// ../../node_modules/esm-env/true.js
+var true_default = true;
+// src/utilities/dev-warn.ts
+function devWarn(message, ...args) {
+  if (!true_default)
+    return;
+  console.warn(message, ...args);
+}
+
+// src/components/choice-grid-item/choice-grid-item.svelte
+function Choice_grid_item($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    const ITEM_STATES = ["neutral", "correct", "incorrect", "pending"];
+    let {
+      value,
+      state: stateProp = "neutral",
+      disabled = false,
+      class: className,
+      children
+    } = $$props;
+    const feedbackState = $.derived(() => ITEM_STATES.includes(stateProp) ? stateProp : "neutral");
+    const context = getChoiceGridContext();
+    const registeredValue = untrack(() => value);
+    const isSelected = $.derived(() => context.isSelected(registeredValue));
+    const isDisabled = $.derived(() => disabled || context.disabled);
+    const isFocusable = $.derived(() => context.isFocusable(registeredValue));
+    const tabIndex = $.derived(() => rovingTabIndex(isFocusable()));
+    const role = $.derived(() => context.multiple ? "checkbox" : "radio");
+    let elementRef = null;
+    function handleClick() {
+      if (isDisabled())
+        return;
+      context.select(registeredValue);
+    }
+    function handleKeydown(event) {
+      context.handleKeydown(event);
+    }
+    $$renderer2.push(`<div${$.attr("role", role())}${$.attr("aria-checked", isSelected())}${$.attr("aria-disabled", isDisabled() || undefined)}${$.attr("tabindex", tabIndex())}${$.attr_class($.clsx(classNames("cinder-choice-grid-item", className)))}${$.attr("data-cinder-selected", isSelected() || undefined)}${$.attr("data-cinder-disabled", isDisabled() || undefined)}${$.attr("data-cinder-state", feedbackState() !== "neutral" ? feedbackState() : undefined)}><span class="cinder-choice-grid-item__content">`);
+    children($$renderer2);
+    $$renderer2.push(`<!----></span></div>`);
+  });
+}
+
+// src/components/choice-grid-item/index.ts
+var choice_grid_item_default = Choice_grid_item;
+export {
+  choice_grid_item_default as default,
+  Choice_grid_item as ChoiceGridItem
+};
+
+//# debugId=E79272160168C0D164756E2164756E21

package/dist/server/components/color-field/index.css

@@ -23,10 +23,8 @@
   }
 
   .cinder-color-field__swatch[data-cinder-alpha]:not([data-cinder-empty]) {
-    --_cinder-color-field-checker-base: #fff;
-    --_cinder-color-field-checker-tile: #ccc;
-    background-color: var(--_cinder-color-field-checker-base);
-    background-image: linear-gradient(var(--cinder-color-field-swatch, transparent), var(--cinder-color-field-swatch, transparent)), linear-gradient(45deg, var(--_cinder-color-field-checker-tile) 25%, transparent 25%), linear-gradient(-45deg, var(--_cinder-color-field-checker-tile) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--_cinder-color-field-checker-tile) 75%), linear-gradient(-45deg, transparent 75%, var(--_cinder-color-field-checker-tile) 75%);
+    background-color: var(--cinder-color-checker-base);
+    background-image: linear-gradient(var(--cinder-color-field-swatch, transparent), var(--cinder-color-field-swatch, transparent)), linear-gradient(45deg, var(--cinder-color-checker-tile) 25%, transparent 25%), linear-gradient(-45deg, var(--cinder-color-checker-tile) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--cinder-color-checker-tile) 75%), linear-gradient(-45deg, transparent 75%, var(--cinder-color-checker-tile) 75%);
     background-position: 0 0, 0 0, 0 3px, 3px -3px, -3px 0;
     background-size: auto, 6px 6px, 6px 6px, 6px 6px, 6px 6px;
   }

package/dist/server/components/color-picker/index.css

@@ -7,8 +7,12 @@
     container-name: cinder-color-picker;
     display: flex;
     gap: var(--cinder-space-2);
-    --_cinder-color-picker-checker-base: #fff;
-    --_cinder-color-picker-checker-tile: #ccc;
+    --_cinder-color-picker-thumb-border: #fff;
+    --_cinder-color-picker-thumb-shadow-edge: #00000080;
+    --_cinder-color-picker-thumb-shadow-support-light: transparent;
+    --_cinder-color-picker-thumb-shadow-support-dark: #ffffffa6;
+    --_cinder-color-picker-thumb-shadow-support: light-dark(var(--_cinder-color-picker-thumb-shadow-support-light), var(--_cinder-color-picker-thumb-shadow-support-dark));
+    --_cinder-color-picker-thumb-shadow: 0 0 0 1px var(--_cinder-color-picker-thumb-shadow-edge), 0 0 0 2px var(--_cinder-color-picker-thumb-shadow-support);
     flex-direction: column;
     width: 100%;
     max-width: 280px;
@@ -41,13 +45,13 @@
 
   .cinder-color-picker__gradient-handle {
     position: absolute;
+    border: 2px solid var(--_cinder-color-picker-thumb-border);
+    box-shadow: var(--_cinder-color-picker-thumb-shadow);
     pointer-events: none;
-    border: 2px solid #fff;
     border-radius: 50%;
     width: 14px;
     height: 14px;
     transform: translate(-50%, -50%);
-    box-shadow: 0 0 0 1px #00000080;
   }
 
   .cinder-color-picker__hue, .cinder-color-picker__alpha {
@@ -64,8 +68,8 @@
   }
 
   .cinder-color-picker__alpha {
-    background-color: var(--_cinder-color-picker-checker-base);
-    background-image: linear-gradient(to right, transparent, var(--cinder-color-picker-base, currentColor)), linear-gradient(45deg, var(--_cinder-color-picker-checker-tile) 25%, transparent 25%), linear-gradient(-45deg, var(--_cinder-color-picker-checker-tile) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--_cinder-color-picker-checker-tile) 75%), linear-gradient(-45deg, transparent 75%, var(--_cinder-color-picker-checker-tile) 75%);
+    background-color: var(--cinder-color-checker-base);
+    background-image: linear-gradient(to right, transparent, var(--cinder-color-picker-base, currentColor)), linear-gradient(45deg, var(--cinder-color-checker-tile) 25%, transparent 25%), linear-gradient(-45deg, var(--cinder-color-checker-tile) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--cinder-color-checker-tile) 75%), linear-gradient(-45deg, transparent 75%, var(--cinder-color-checker-tile) 75%);
     background-position: 0 0, 0 0, 0 4px, 4px -4px, -4px 0;
     background-size: auto, 8px 8px, 8px 8px, 8px 8px, 8px 8px;
   }
@@ -77,15 +81,15 @@
 
   .cinder-color-picker__hue-thumb, .cinder-color-picker__alpha-thumb {
     position: absolute;
+    border: 2px solid var(--_cinder-color-picker-thumb-border);
+    box-shadow: var(--_cinder-color-picker-thumb-shadow);
     pointer-events: none;
     background: none;
-    border: 2px solid #fff;
     border-radius: 50%;
     width: 14px;
     height: 14px;
     top: 50%;
     transform: translate(-50%, -50%);
-    box-shadow: 0 0 0 1px #00000080;
   }
 
   .cinder-color-picker__footer {
@@ -104,8 +108,8 @@
   }
 
   .cinder-color-picker__preview[data-cinder-alpha] {
-    background-color: var(--_cinder-color-picker-checker-base);
-    background-image: linear-gradient(var(--cinder-color-picker-preview, transparent), var(--cinder-color-picker-preview, transparent)), linear-gradient(45deg, var(--_cinder-color-picker-checker-tile) 25%, transparent 25%), linear-gradient(-45deg, var(--_cinder-color-picker-checker-tile) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--_cinder-color-picker-checker-tile) 75%), linear-gradient(-45deg, transparent 75%, var(--_cinder-color-picker-checker-tile) 75%);
+    background-color: var(--cinder-color-checker-base);
+    background-image: linear-gradient(var(--cinder-color-picker-preview, transparent), var(--cinder-color-picker-preview, transparent)), linear-gradient(45deg, var(--cinder-color-checker-tile) 25%, transparent 25%), linear-gradient(-45deg, var(--cinder-color-checker-tile) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--cinder-color-checker-tile) 75%), linear-gradient(-45deg, transparent 75%, var(--cinder-color-checker-tile) 75%);
     background-position: 0 0, 0 0, 0 4px, 4px -4px, -4px 0;
     background-size: auto, 8px 8px, 8px 8px, 8px 8px, 8px 8px;
   }

package/dist/server/components/color-swatch-picker/index.css

@@ -59,10 +59,8 @@
   }
 
   .cinder-color-swatch-picker__swatch[data-cinder-alpha] {
-    --_cinder-color-swatch-picker-checker-base: #fff;
-    --_cinder-color-swatch-picker-checker-tile: #ccc;
-    background-color: var(--_cinder-color-swatch-picker-checker-base);
-    background-image: linear-gradient(var(--swatch-color), var(--swatch-color)), linear-gradient(45deg, var(--_cinder-color-swatch-picker-checker-tile) 25%, transparent 25%), linear-gradient(-45deg, var(--_cinder-color-swatch-picker-checker-tile) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--_cinder-color-swatch-picker-checker-tile) 75%), linear-gradient(-45deg, transparent 75%, var(--_cinder-color-swatch-picker-checker-tile) 75%);
+    background-color: var(--cinder-color-checker-base);
+    background-image: linear-gradient(var(--swatch-color), var(--swatch-color)), linear-gradient(45deg, var(--cinder-color-checker-tile) 25%, transparent 25%), linear-gradient(-45deg, var(--cinder-color-checker-tile) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--cinder-color-checker-tile) 75%), linear-gradient(-45deg, transparent 75%, var(--cinder-color-checker-tile) 75%);
     background-position: 0 0, 0 0, 0 4px, 4px -4px, -4px 0;
     background-size: auto, 8px 8px, 8px 8px, 8px 8px, 8px 8px;
   }

package/dist/server/components/confirm-dialog/index.js

@@ -75,6 +75,9 @@ function Button($$renderer, $$props) {
       "aria-busy": consumerAriaBusy,
       "aria-label": ariaLabel,
       "aria-labelledby": ariaLabelledBy,
+      "aria-expanded": ariaExpanded,
+      "aria-controls": ariaControls,
+      "aria-haspopup": ariaHaspopup,
       $$slots,
       $$events,
       ...rest
@@ -163,7 +166,10 @@ function Button($$renderer, $$props) {
         "aria-disabled": resolvedAriaDisabled(),
         "aria-busy": resolvedAriaBusy(),
         "aria-label": resolvedAriaLabel(),
-        "aria-labelledby": resolvedAriaLabelledBy()
+        "aria-labelledby": resolvedAriaLabelledBy(),
+        "aria-expanded": ariaExpanded,
+        "aria-controls": ariaControls,
+        "aria-haspopup": ariaHaspopup
       })}>`);
       buttonContent($$renderer2);
       $$renderer2.push(`<!----></a>`);
@@ -178,7 +184,10 @@ function Button($$renderer, $$props) {
         "aria-disabled": resolvedAriaDisabled(),
         "aria-busy": resolvedAriaBusy(),
         "aria-label": resolvedAriaLabel(),
-        "aria-labelledby": resolvedAriaLabelledBy()
+        "aria-labelledby": resolvedAriaLabelledBy(),
+        "aria-expanded": ariaExpanded,
+        "aria-controls": ariaControls,
+        "aria-haspopup": ariaHaspopup
       })}>`);
       buttonContent($$renderer2);
       $$renderer2.push(`<!----></button>`);
@@ -582,4 +591,4 @@ export {
   Confirm_dialog as ConfirmDialog
 };
 
-//# debugId=67B1EACAB50EBD0E64756E2164756E21
+//# debugId=62DD3CA9658C1D1464756E2164756E21

package/dist/server/components/context-menu/index.js

@@ -182,7 +182,7 @@ function Context_menu_trigger($$renderer, $$props) {
     let startX = 0;
     let startY = 0;
     let suppressClick = false;
-    let suppressNextContextmenuUntil = 0;
+    let suppressNextContextmenu = false;
     onDestroy(clearLongPress);
     function clearLongPress() {
       clearTimeout(longPressTimer);
@@ -196,7 +196,7 @@ function Context_menu_trigger($$renderer, $$props) {
         callTriggerHandler(oncontextmenu, event);
         return;
       }
-      if (Date.now() < suppressNextContextmenuUntil) {
+      if (suppressNextContextmenu) {
         event.preventDefault();
         callTriggerHandler(oncontextmenu, event);
         return;
@@ -211,14 +211,16 @@ function Context_menu_trigger($$renderer, $$props) {
         return;
       }
       if (event.pointerType !== "touch") {
+        suppressNextContextmenu = false;
         callTriggerHandler(onpointerdown, event);
         return;
       }
+      suppressNextContextmenu = false;
       startX = event.clientX;
       startY = event.clientY;
       clearLongPress();
       longPressTimer = setTimeout(() => {
-        suppressNextContextmenuUntil = Date.now() + 700;
+        suppressNextContextmenu = true;
         suppressClick = true;
         context.openAt(startX, startY);
       }, context.longPressDelay);
@@ -337,40 +339,90 @@ function Dropdown_item($$renderer, $$props) {
       closeOnSelect = true,
       class: customClassName,
       onclick,
+      onkeydown,
+      href,
       children,
       $$slots,
       $$events,
       ...rest
     } = $$props;
     const context = getDropdownContext();
+    const isLink = $5.derived(() => href !== undefined);
+    const sharedClass = $5.derived(() => classNames("cinder-_option-row", "cinder-dropdown-item", inset && "cinder-dropdown-item--inset", customClassName));
     function handleClick(event) {
-      if (disabled)
+      if (disabled) {
+        event.preventDefault();
         return;
+      }
       if (typeof onclick === "function") {
-        onclick(event);
+        if (isLink()) {
+          onclick(event);
+        } else {
+          onclick(event);
+        }
       }
       if (closeOnSelect) {
         context.close();
       }
     }
-    $$renderer2.push(`<button${$5.attributes({
-      ...rest,
-      type: "button",
-      role: "menuitem",
-      class: $5.clsx(classNames("cinder-_option-row", "cinder-dropdown-item", inset && "cinder-dropdown-item--inset", customClassName)),
-      "data-cinder-variant": variant,
-      tabindex: -1,
-      "data-disabled": disabled ? "" : undefined,
-      "aria-disabled": disabled ? "true" : undefined
-    })}>`);
-    if (children) {
+    function handleAnchorKeydown(event) {
+      if (typeof onkeydown === "function") {
+        onkeydown(event);
+      }
+      if (event.defaultPrevented)
+        return;
+      if (event.key !== " " && event.key !== "Spacebar")
+        return;
+      event.preventDefault();
+      if (disabled)
+        return;
+      event.currentTarget.click();
+    }
+    const anchorAttributes = rest;
+    const buttonAttributes = rest;
+    const buttonType = $5.derived(() => rest.type ?? "button");
+    if (isLink()) {
       $$renderer2.push("<!--[0-->");
-      children($$renderer2);
-      $$renderer2.push(`<!---->`);
+      $$renderer2.push(`<a${$5.attributes({
+        ...anchorAttributes,
+        href,
+        role: "menuitem",
+        class: $5.clsx(sharedClass()),
+        "data-cinder-variant": variant,
+        tabindex: -1,
+        "data-disabled": disabled ? "" : undefined,
+        "aria-disabled": disabled ? "true" : undefined
+      })}>`);
+      if (children) {
+        $$renderer2.push("<!--[0-->");
+        children($$renderer2);
+        $$renderer2.push(`<!---->`);
+      } else {
+        $$renderer2.push("<!--[-1-->");
+      }
+      $$renderer2.push(`<!--]--></a>`);
     } else {
       $$renderer2.push("<!--[-1-->");
+      $$renderer2.push(`<button${$5.attributes({
+        ...buttonAttributes,
+        type: buttonType(),
+        role: "menuitem",
+        class: $5.clsx(sharedClass()),
+        "data-cinder-variant": variant,
+        tabindex: -1,
+        "data-disabled": disabled ? "" : undefined,
+        "aria-disabled": disabled ? "true" : undefined
+      })}>`);
+      if (children) {
+        $$renderer2.push("<!--[0-->");
+        children($$renderer2);
+        $$renderer2.push(`<!---->`);
+      } else {
+        $$renderer2.push("<!--[-1-->");
+      }
+      $$renderer2.push(`<!--]--></button>`);
     }
-    $$renderer2.push(`<!--]--></button>`);
+    $$renderer2.push(`<!--]-->`);
   });
 }
 
@@ -849,4 +901,4 @@ export {
   ContextMenu
 };
 
-//# debugId=CB3829A4F9AD664B64756E2164756E21
+//# debugId=030FDC71379F9B0D64756E2164756E21

package/dist/server/components/context-menu-trigger/index.js

@@ -83,7 +83,7 @@ function Context_menu_trigger($$renderer, $$props) {
     let startX = 0;
     let startY = 0;
     let suppressClick = false;
-    let suppressNextContextmenuUntil = 0;
+    let suppressNextContextmenu = false;
     onDestroy(clearLongPress);
     function clearLongPress() {
       clearTimeout(longPressTimer);
@@ -97,7 +97,7 @@ function Context_menu_trigger($$renderer, $$props) {
         callTriggerHandler(oncontextmenu, event);
         return;
       }
-      if (Date.now() < suppressNextContextmenuUntil) {
+      if (suppressNextContextmenu) {
         event.preventDefault();
         callTriggerHandler(oncontextmenu, event);
         return;
@@ -112,14 +112,16 @@ function Context_menu_trigger($$renderer, $$props) {
         return;
       }
       if (event.pointerType !== "touch") {
+        suppressNextContextmenu = false;
         callTriggerHandler(onpointerdown, event);
         return;
       }
+      suppressNextContextmenu = false;
       startX = event.clientX;
       startY = event.clientY;
       clearLongPress();
       longPressTimer = setTimeout(() => {
-        suppressNextContextmenuUntil = Date.now() + 700;
+        suppressNextContextmenu = true;
         suppressClick = true;
         context.openAt(startX, startY);
       }, context.longPressDelay);
@@ -184,4 +186,4 @@ export {
   Context_menu_trigger as ContextMenuTrigger
 };
 
-//# debugId=5EB1F7E695F8FB0064756E2164756E21
+//# debugId=105E6BED637333E164756E2164756E21