🎩 You're Invited:Meet the Socket team at Black Hat in Las Vegas, August 3-6.RSVP
Sign In

@isoftdata/svelte-context-menu

Package Overview
Dependencies
Maintainers
11
Versions
20
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@isoftdata/svelte-context-menu - npm Package Compare versions

Comparing version
2.0.1
to
2.0.2
+9
-9
dist/ContextMenu.svelte
<script lang="ts">
import type { Snippet } from "svelte"
import { computePosition, flip, type Placement } from "@floating-ui/dom"
import type { Snippet } from 'svelte'
import { computePosition, flip, type Placement } from '@floating-ui/dom'

@@ -20,3 +20,3 @@ interface Props {

menuItemClickCloses = true,
placement = "bottom-start",
placement = 'bottom-start',
children,

@@ -30,7 +30,7 @@ open: openCb,

let positionTop = $state(0)
let strategy = $state("absolute")
let strategy = $state('absolute')
let menu: HTMLElement | undefined = $state()
export async function open(event: MouseEvent, targetId: string = "") {
export async function open(event: MouseEvent, targetId: string = '') {
event.stopPropagation()

@@ -76,6 +76,6 @@ if (menu) {

console.log(event.key, event.currentTarget, event.target)
if ((event.key === " " || event.key === "Enter") && target.tagName === "BUTTON") {
if ((event.key === ' ' || event.key === 'Enter') && target.tagName === 'BUTTON') {
target.click()
} else if (target === event.currentTarget && event.key === "Tab") {
target.querySelector("button")?.focus()
} else if (target === event.currentTarget && event.key === 'Tab') {
target.querySelector('button')?.focus()
}

@@ -87,3 +87,3 @@ }

onclick={close}
onkeydown={event => event.key === "Escape" && close()}
onkeydown={event => event.key === 'Escape' && close()}
/>

@@ -90,0 +90,0 @@

@@ -1,3 +0,3 @@

import type { Snippet } from "svelte";
import { type Placement } from "@floating-ui/dom";
import type { Snippet } from 'svelte';
import { type Placement } from '@floating-ui/dom';
interface Props {

@@ -4,0 +4,0 @@ id?: string;

<script lang="ts">
import type { ComponentProps, Snippet } from "svelte"
import DropdownItem from "./DropdownItem.svelte"
interface Props extends Omit<ComponentProps<typeof DropdownItem>, "children"> {
import type { ComponentProps, Snippet } from 'svelte'
import DropdownItem from './DropdownItem.svelte'
interface Props extends Omit<ComponentProps<typeof DropdownItem>, 'children'> {
checked?: boolean

@@ -19,4 +19,4 @@ children?: Snippet<[{ checked: boolean }]>

icon={{
icon: checked ? "check-square" : "square",
prefix: "far",
icon: checked ? 'check-square' : 'square',
prefix: 'far',
}}

@@ -23,0 +23,0 @@ onclick={event => {

@@ -1,4 +0,4 @@

import type { ComponentProps, Snippet } from "svelte";
import DropdownItem from "./DropdownItem.svelte";
interface Props extends Omit<ComponentProps<typeof DropdownItem>, "children"> {
import type { ComponentProps, Snippet } from 'svelte';
import DropdownItem from './DropdownItem.svelte';
interface Props extends Omit<ComponentProps<typeof DropdownItem>, 'children'> {
checked?: boolean;

@@ -5,0 +5,0 @@ children?: Snippet<[{

<script lang="ts">
import type { ComponentProps, Snippet } from "svelte"
import type { HTMLButtonAttributes } from "svelte/elements"
import Icon, { getIconProps } from "@isoftdata/svelte-icon"
import type { ComponentProps, Snippet } from 'svelte'
import type { HTMLButtonAttributes } from 'svelte/elements'
import Icon, { getIconProps } from '@isoftdata/svelte-icon'
interface Props extends Omit<HTMLButtonAttributes, `on:${string}` | `bind:${string}` | `aria-${string}`> {
icon?: ComponentProps<Icon>["icon"] | ComponentProps<Icon>
icon?: ComponentProps<Icon>['icon'] | ComponentProps<Icon>
children?: Snippet

@@ -25,3 +25,3 @@ }

{...rest}
>{#if icon}<span class="mr-1"
>{#if icon}<span class="mr-1 me-1"
><Icon

@@ -28,0 +28,0 @@ fixedWidth

@@ -1,6 +0,6 @@

import type { ComponentProps, Snippet } from "svelte";
import type { HTMLButtonAttributes } from "svelte/elements";
import Icon from "@isoftdata/svelte-icon";
import type { ComponentProps, Snippet } from 'svelte';
import type { HTMLButtonAttributes } from 'svelte/elements';
import Icon from '@isoftdata/svelte-icon';
interface Props extends Omit<HTMLButtonAttributes, `on:${string}` | `bind:${string}` | `aria-${string}`> {
icon?: ComponentProps<Icon>["icon"] | ComponentProps<Icon>;
icon?: ComponentProps<Icon>['icon'] | ComponentProps<Icon>;
children?: Snippet;

@@ -7,0 +7,0 @@ }

{
"name": "@isoftdata/svelte-context-menu",
"version": "2.0.1",
"version": "2.0.2",
"exports": {

@@ -5,0 +5,0 @@ ".": {

@@ -7,4 +7,4 @@ # Svelte ContextMenu

```bash
npm i @isoftdata/svelte-context-menu
```sh
pnpm i @isoftdata/svelte-context-menu
```

@@ -11,0 +11,0 @@