npm - @svgrid/grid - Versions diffs - 2.2.0 → 2.2.1 - Mend

@svgrid/grid 2.2.0 → 2.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (114) hide show

package/dist/FlexRender.svelte +96 -96
package/dist/GridFooter.svelte +178 -178
package/dist/SvCarousel.svelte +141 -141
package/dist/SvColorInput.svelte +187 -187
package/dist/SvContextMenu.svelte +116 -116
package/dist/SvDrawer.svelte +250 -250
package/dist/SvGrid.svelte +3131 -3131
package/dist/SvGridBoard.svelte +2339 -2339
package/dist/SvGridChart.svelte +1724 -1724
package/dist/SvGridChartPanel.svelte +485 -485
package/dist/SvGridDropdown.svelte +689 -689
package/dist/SvGroupCell.svelte +109 -109
package/dist/SvMenu.svelte +124 -124
package/dist/SvMenuList.svelte +117 -117
package/dist/SvNumberInput.svelte +131 -131
package/dist/SvOtpInput.svelte +158 -158
package/dist/SvPopover.svelte +139 -139
package/dist/SvRowGroupPanel.svelte +170 -170
package/dist/SvScrollArea.svelte +61 -61
package/dist/SvTooltip.svelte +127 -127
package/dist/SvTour.svelte +204 -204
package/dist/SvTree.svelte +377 -377
package/dist/SvTreeSelect.svelte +230 -230
package/dist/cdn/svgrid.js +8 -8
package/dist/cdn/svgrid.svelte-external.js +8 -8
package/dist/chart-export.js +8 -8
package/package.json +10 -10
package/src/FlexRender.svelte +96 -96
package/src/GridFooter.svelte +178 -178
package/src/SvCarousel.svelte +141 -141
package/src/SvColorInput.svelte +187 -187
package/src/SvContextMenu.svelte +116 -116
package/src/SvDrawer.svelte +250 -250
package/src/SvGrid.controller.svelte.ts +3158 -3158
package/src/SvGrid.svelte +3131 -3131
package/src/SvGrid.types.ts +1489 -1489
package/src/SvGridBoard.svelte +2339 -2339
package/src/SvGridChart.svelte +1724 -1724
package/src/SvGridChartPanel.svelte +485 -485
package/src/SvGridDropdown.svelte +689 -689
package/src/SvGroupCell.svelte +109 -109
package/src/SvMenu.svelte +124 -124
package/src/SvMenu.test.ts +97 -97
package/src/SvMenuList.svelte +117 -117
package/src/SvNumberInput.svelte +131 -131
package/src/SvOtpInput.svelte +158 -158
package/src/SvPopover.svelte +139 -139
package/src/SvRowGroupPanel.svelte +170 -170
package/src/SvScrollArea.svelte +61 -61
package/src/SvTooltip.svelte +127 -127
package/src/SvTour.svelte +204 -204
package/src/SvTree.svelte +377 -377
package/src/SvTreeSelect.svelte +230 -230
package/src/a11y.contract.test.ts +49 -49
package/src/a11y.test.ts +59 -59
package/src/a11y.ts +61 -61
package/src/build-api.ts +870 -870
package/src/cell-formatting.ts +169 -169
package/src/cell-render.ts +469 -469
package/src/chart-export.ts +201 -201
package/src/chart.ts +2296 -2296
package/src/collaboration.test.ts +104 -104
package/src/collaboration.ts +167 -167
package/src/core.performance.test.ts +30 -30
package/src/core.ts +1111 -1111
package/src/createAutocomplete.svelte.ts +132 -132
package/src/createCombobox.svelte.ts +179 -179
package/src/createCountryInput.svelte.ts +157 -157
package/src/createDropdownList.svelte.ts +162 -162
package/src/createGrid.svelte.ts +42 -42
package/src/createGrid.test.ts +10 -10
package/src/createGridState.svelte.ts +17 -17
package/src/createMenu.svelte.ts +202 -202
package/src/createPopoverSelect.svelte.ts +206 -206
package/src/createTree.svelte.ts +319 -319
package/src/editing.test.ts +859 -859
package/src/editing.ts +675 -675
package/src/export-data-api.test.ts +126 -126
package/src/export-format.test.ts +107 -107
package/src/export-format.ts +598 -598
package/src/flex-render.ts +3 -3
package/src/index.ts +623 -623
package/src/keyboard.test.ts +59 -59
package/src/keyboard.ts +97 -97
package/src/list-nav.test.ts +49 -49
package/src/list-nav.ts +29 -29
package/src/menus.ts +639 -639
package/src/merge-objects.ts +48 -48
package/src/overlays.test.ts +90 -90
package/src/render-component.ts +28 -28
package/src/selection.test.ts +754 -754
package/src/selection.ts +600 -600
package/src/server-data-source.test.ts +289 -289
package/src/server-data-source.ts +413 -413
package/src/sparkline.test.ts +68 -68
package/src/sparkline.ts +169 -169
package/src/spreadsheet.test.ts +489 -489
package/src/spreadsheet.ts +312 -312
package/src/static-functions.ts +11 -11
package/src/subscribe.ts +38 -38
package/src/svgrid-wrapper.types.ts +501 -501
package/src/svgrid.behavior.test.ts +706 -706
package/src/svgrid.charting.test.ts +527 -527
package/src/svgrid.features.test.ts +157 -157
package/src/svgrid.new-features.wrapper.test.ts +251 -251
package/src/svgrid.wrapper.test.ts +40 -40
package/src/test-setup.ts +62 -62
package/src/themes/index.ts +159 -159
package/src/virtualization/column-virtualizer.test.ts +27 -27
package/src/virtualization/column-virtualizer.ts +30 -30
package/src/virtualization/svelte-virtualizer.svelte.ts +26 -26
package/src/virtualization/types.ts +30 -30
package/src/virtualization/virtualizer.test.ts +47 -47
package/src/virtualization/virtualizer.ts +296 -296

package/dist/SvTooltip.svelte CHANGED Viewed

@@ -1,127 +1,127 @@
-<script lang="ts">
-  /**
-   * SvTooltip - a small hover/focus tooltip anchored to its child, portalled to
-   * <body> so it is never clipped. Shows after a short delay, hides on leave /
-   * blur / Escape, and is wired via `aria-describedby` (role="tooltip") onto the
-   * focusable child itself, so AT users get it announced on focus, not just
-   * sighted users on hover.
-   *
-   * ```svelte
-   * <SvTooltip text="Delete row"><button aria-label="Delete">🗑</button></SvTooltip>
-   * ```
-   */
-  import type { Snippet } from 'svelte'
-  import { portalToBody, popIn } from './popover'
-  import { getFocusable } from './a11y/focus-trap'
-  import { createTooltip } from './createTooltip.svelte'
-  type Props = {
-    text: string
-    placement?: 'top' | 'bottom'
-    /** Show delay in ms. Default 300. */
-    delay?: number
-    disabled?: boolean
-    children?: Snippet
-  }
-  let { text, placement = 'top', delay = 300, disabled = false, children }: Props = $props()
-  let anchorEl = $state<HTMLSpanElement | null>(null)
-  let tipEl = $state<HTMLDivElement | null>(null)
-  let pos = $state({ top: 0, left: 0, arrowX: 12 })
-  // Open state, show-delay and Escape-to-hide live in the shared headless core;
-  // this component owns only the DOM concerns (positioning + describedby merge).
-  const tip = createTooltip({ text: () => text, disabled: () => disabled, delay: () => delay })
-  const tid = tip.tipId
-  function place() {
-    if (!anchorEl) return
-    const r = anchorEl.getBoundingClientRect()
-    const tipH = tipEl?.offsetHeight ?? 30
-    const tipW = tipEl?.offsetWidth ?? 0
-    const top = placement === 'top' ? r.top - tipH - 8 : r.bottom + 8
-    let left = r.left + r.width / 2 - tipW / 2
-    left = Math.max(4, Math.min(left, window.innerWidth - tipW - 4))
-    // Keep the arrow under the anchor's center even when the tip is clamped.
-    const arrowX = Math.max(10, Math.min(tipW - 10, r.left + r.width / 2 - left))
-    pos = { top, left, arrowX }
-  }
-  // Reposition while open (and on scroll/resize). Escape-to-hide is the core's.
-  $effect(() => {
-    if (!tip.open) return
-    queueMicrotask(place)
-    const rp = () => place()
-    window.addEventListener('scroll', rp, true)
-    window.addEventListener('resize', rp)
-    return () => {
-      window.removeEventListener('scroll', rp, true)
-      window.removeEventListener('resize', rp)
-    }
-  })
-  // The wrapper span above is never itself Tab-focusable, so putting
-  // aria-describedby only on it does nothing for keyboard/AT users - they
-  // focus the real interactive child (e.g. the <button> in the doc example),
-  // and that's the element whose accessible description actually gets
-  // announced. Mirror the id onto that child too, merging with (and later
-  // restoring) any aria-describedby it already carries.
-  $effect(() => {
-    if (!tip.open || !anchorEl) return
-    const child = getFocusable(anchorEl)[0]
-    if (!child) return
-    const before = child.getAttribute('aria-describedby')
-    const ids = new Set((before ?? '').split(/\s+/).filter(Boolean))
-    ids.add(tid)
-    child.setAttribute('aria-describedby', [...ids].join(' '))
-    return () => {
-      const remaining = (child.getAttribute('aria-describedby') ?? '')
-        .split(/\s+/)
-        .filter((id) => id && id !== tid)
-      if (remaining.length) child.setAttribute('aria-describedby', remaining.join(' '))
-      else child.removeAttribute('aria-describedby')
-    }
-  })
-</script>
-<!-- svelte-ignore a11y_no_static_element_interactions -->
-<span
-  bind:this={anchorEl}
-  class="sv-tip__anchor"
-  {...tip.anchorProps()}
->
-  {@render children?.()}
-</span>
-{#if tip.open}
-  <div
-    bind:this={tipEl}
-    id={tid}
-    class="sv-tip"
-    role="tooltip"
-    use:portalToBody
-    use:popIn={{ up: placement === 'top', duration: 110, scale: 0.9 }}
-    class:sv-tip--bottom={placement === 'bottom'}
-    style:position="fixed"
-    style:top={`${pos.top}px`}
-    style:left={`${pos.left}px`}
-    style:--tip-arrow-x={`${pos.arrowX}px`}
-  >{text}<span class="sv-tip__arrow" aria-hidden="true"></span></div>
-{/if}
-<style>
-  .sv-tip__anchor { display: inline-flex; }
-  :global(.sv-tip) {
-    z-index: 2147483647; pointer-events: none; position: relative;
-    max-width: 240px; padding: 5px 9px; font-size: 12px; line-height: 1.4; font-weight: 500;
-    background: var(--sg-fg, #0f172a); color: var(--sg-bg, #fff);
-    border-radius: 6px; box-shadow: 0 6px 20px -6px rgba(15, 23, 42, 0.5); white-space: normal;
-  }
-  :global(.sv-tip__arrow) {
-    position: absolute; inset-inline-start: var(--tip-arrow-x, 12px); width: 8px; height: 8px;
-    background: var(--sg-fg, #0f172a); transform: translateX(-50%) rotate(45deg);
-  }
-  :global(.sv-tip:not(.sv-tip--bottom) .sv-tip__arrow) { bottom: -3px; }
-  :global(.sv-tip--bottom .sv-tip__arrow) { top: -3px; }
-</style>
+<script lang="ts">
+  /**
+   * SvTooltip - a small hover/focus tooltip anchored to its child, portalled to
+   * <body> so it is never clipped. Shows after a short delay, hides on leave /
+   * blur / Escape, and is wired via `aria-describedby` (role="tooltip") onto the
+   * focusable child itself, so AT users get it announced on focus, not just
+   * sighted users on hover.
+   *
+   * ```svelte
+   * <SvTooltip text="Delete row"><button aria-label="Delete">🗑</button></SvTooltip>
+   * ```
+   */
+  import type { Snippet } from 'svelte'
+  import { portalToBody, popIn } from './popover'
+  import { getFocusable } from './a11y/focus-trap'
+  import { createTooltip } from './createTooltip.svelte'
+  type Props = {
+    text: string
+    placement?: 'top' | 'bottom'
+    /** Show delay in ms. Default 300. */
+    delay?: number
+    disabled?: boolean
+    children?: Snippet
+  }
+  let { text, placement = 'top', delay = 300, disabled = false, children }: Props = $props()
+  let anchorEl = $state<HTMLSpanElement | null>(null)
+  let tipEl = $state<HTMLDivElement | null>(null)
+  let pos = $state({ top: 0, left: 0, arrowX: 12 })
+  // Open state, show-delay and Escape-to-hide live in the shared headless core;
+  // this component owns only the DOM concerns (positioning + describedby merge).
+  const tip = createTooltip({ text: () => text, disabled: () => disabled, delay: () => delay })
+  const tid = tip.tipId
+  function place() {
+    if (!anchorEl) return
+    const r = anchorEl.getBoundingClientRect()
+    const tipH = tipEl?.offsetHeight ?? 30
+    const tipW = tipEl?.offsetWidth ?? 0
+    const top = placement === 'top' ? r.top - tipH - 8 : r.bottom + 8
+    let left = r.left + r.width / 2 - tipW / 2
+    left = Math.max(4, Math.min(left, window.innerWidth - tipW - 4))
+    // Keep the arrow under the anchor's center even when the tip is clamped.
+    const arrowX = Math.max(10, Math.min(tipW - 10, r.left + r.width / 2 - left))
+    pos = { top, left, arrowX }
+  }
+  // Reposition while open (and on scroll/resize). Escape-to-hide is the core's.
+  $effect(() => {
+    if (!tip.open) return
+    queueMicrotask(place)
+    const rp = () => place()
+    window.addEventListener('scroll', rp, true)
+    window.addEventListener('resize', rp)
+    return () => {
+      window.removeEventListener('scroll', rp, true)
+      window.removeEventListener('resize', rp)
+    }
+  })
+  // The wrapper span above is never itself Tab-focusable, so putting
+  // aria-describedby only on it does nothing for keyboard/AT users - they
+  // focus the real interactive child (e.g. the <button> in the doc example),
+  // and that's the element whose accessible description actually gets
+  // announced. Mirror the id onto that child too, merging with (and later
+  // restoring) any aria-describedby it already carries.
+  $effect(() => {
+    if (!tip.open || !anchorEl) return
+    const child = getFocusable(anchorEl)[0]
+    if (!child) return
+    const before = child.getAttribute('aria-describedby')
+    const ids = new Set((before ?? '').split(/\s+/).filter(Boolean))
+    ids.add(tid)
+    child.setAttribute('aria-describedby', [...ids].join(' '))
+    return () => {
+      const remaining = (child.getAttribute('aria-describedby') ?? '')
+        .split(/\s+/)
+        .filter((id) => id && id !== tid)
+      if (remaining.length) child.setAttribute('aria-describedby', remaining.join(' '))
+      else child.removeAttribute('aria-describedby')
+    }
+  })
+</script>
+<!-- svelte-ignore a11y_no_static_element_interactions -->
+<span
+  bind:this={anchorEl}
+  class="sv-tip__anchor"
+  {...tip.anchorProps()}
+>
+  {@render children?.()}
+</span>
+{#if tip.open}
+  <div
+    bind:this={tipEl}
+    id={tid}
+    class="sv-tip"
+    role="tooltip"
+    use:portalToBody
+    use:popIn={{ up: placement === 'top', duration: 110, scale: 0.9 }}
+    class:sv-tip--bottom={placement === 'bottom'}
+    style:position="fixed"
+    style:top={`${pos.top}px`}
+    style:left={`${pos.left}px`}
+    style:--tip-arrow-x={`${pos.arrowX}px`}
+  >{text}<span class="sv-tip__arrow" aria-hidden="true"></span></div>
+{/if}
+<style>
+  .sv-tip__anchor { display: inline-flex; }
+  :global(.sv-tip) {
+    z-index: 2147483647; pointer-events: none; position: relative;
+    max-width: 240px; padding: 5px 9px; font-size: 12px; line-height: 1.4; font-weight: 500;
+    background: var(--sg-fg, #0f172a); color: var(--sg-bg, #fff);
+    border-radius: 6px; box-shadow: 0 6px 20px -6px rgba(15, 23, 42, 0.5); white-space: normal;
+  }
+  :global(.sv-tip__arrow) {
+    position: absolute; inset-inline-start: var(--tip-arrow-x, 12px); width: 8px; height: 8px;
+    background: var(--sg-fg, #0f172a); transform: translateX(-50%) rotate(45deg);
+  }
+  :global(.sv-tip:not(.sv-tip--bottom) .sv-tip__arrow) { bottom: -3px; }
+  :global(.sv-tip--bottom .sv-tip__arrow) { top: -3px; }
+</style>