From 9976aa033343bc2ab221a8a191d325c4821a5441 Mon Sep 17 00:00:00 2001 From: Hunter Johnston Date: Fri, 18 Aug 2023 18:33:00 -0400 Subject: [PATCH 1/2] fix menubar & rename hovercard --- ...-pandas-speak.md => twenty-ravens-type.md} | 2 +- CHANGELOG.md | 7 ++ package.json | 4 +- pnpm-lock.yaml | 14 +-- src/components/test-menubar.svelte | 93 +++++++++++++++++++ .../{hover-card.md => link-preview.md} | 12 +-- src/lib/bits/hover-card/index.ts | 15 --- src/lib/bits/index.ts | 2 +- .../components/LinkPreview.svelte} | 0 .../components/LinkPreviewContent.svelte} | 0 .../components/LinkPreviewTrigger.svelte} | 1 - .../bits/{hover-card => link-preview}/ctx.ts | 12 +-- src/lib/bits/link-preview/index.ts | 15 +++ .../{hover-card => link-preview}/types.ts | 12 +-- .../menubar/components/MenubarContent.svelte | 17 ++-- src/lib/bits/menubar/ctx.ts | 1 + 16 files changed, 156 insertions(+), 51 deletions(-) rename .changeset/{tender-pandas-speak.md => twenty-ravens-type.md} (52%) create mode 100644 src/components/test-menubar.svelte rename src/content/components/{hover-card.md => link-preview.md} (53%) delete mode 100644 src/lib/bits/hover-card/index.ts rename src/lib/bits/{hover-card/components/HoverCard.svelte => link-preview/components/LinkPreview.svelte} (100%) rename src/lib/bits/{hover-card/components/HoverCardContent.svelte => link-preview/components/LinkPreviewContent.svelte} (100%) rename src/lib/bits/{hover-card/components/HoverCardTrigger.svelte => link-preview/components/LinkPreviewTrigger.svelte} (97%) rename src/lib/bits/{hover-card => link-preview}/ctx.ts (65%) create mode 100644 src/lib/bits/link-preview/index.ts rename src/lib/bits/{hover-card => link-preview}/types.ts (66%) diff --git a/.changeset/tender-pandas-speak.md b/.changeset/twenty-ravens-type.md similarity index 52% rename from .changeset/tender-pandas-speak.md rename to .changeset/twenty-ravens-type.md index c28d6d02f..6bab4fd4a 100644 --- a/.changeset/tender-pandas-speak.md +++ b/.changeset/twenty-ravens-type.md @@ -2,4 +2,4 @@ "bits-ui": patch --- -Properly type Accordion +Fix menubar keyboard diff --git a/CHANGELOG.md b/CHANGELOG.md index 7734aabc2..cd5209687 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,12 @@ # @huntabyte/primitives +## 0.0.21 + +### Patch Changes + +- 77d1a14: Fix Menubar bug +- 3bbeda0: Properly type Accordion + ## 0.0.20 ### Patch Changes diff --git a/package.json b/package.json index 3066a1980..c0c898162 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "bits-ui", - "version": "0.0.20", + "version": "0.0.21", "license": "MIT", "scripts": { "dev": "vite dev", @@ -73,7 +73,7 @@ "types": "./dist/index.d.ts", "type": "module", "dependencies": { - "@melt-ui/svelte": "0.36.0", + "@melt-ui/svelte": "0.37.2", "@sveltejs/adapter-vercel": "^3.0.3", "nanoid": "^4.0.2", "shiki": "^0.14.3", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 7c71b53ff..0bc5e8e3c 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -6,8 +6,8 @@ settings: dependencies: '@melt-ui/svelte': - specifier: 0.36.0 - version: 0.36.0(svelte@4.1.2) + specifier: 0.37.2 + version: 0.37.2(svelte@4.1.2) '@sveltejs/adapter-vercel': specifier: ^3.0.3 version: 3.0.3(@sveltejs/kit@1.22.4) @@ -30,7 +30,7 @@ devDependencies: version: 0.16.5(svelte@4.1.2) '@melt-ui/pp': specifier: ^0.1.2 - version: 0.1.2(@melt-ui/svelte@0.36.0)(svelte@4.1.2) + version: 0.1.2(@melt-ui/svelte@0.37.2)(svelte@4.1.2) '@playwright/test': specifier: ^1.28.1 version: 1.36.2 @@ -700,19 +700,19 @@ packages: - supports-color dev: false - /@melt-ui/pp@0.1.2(@melt-ui/svelte@0.36.0)(svelte@4.1.2): + /@melt-ui/pp@0.1.2(@melt-ui/svelte@0.37.2)(svelte@4.1.2): resolution: {integrity: sha512-GZeqp7UWLNZUC2dJpREnZrWMR88vy27WO7C3cIBz4KW3/CFD19FjNkd3VbSRfcRryrMkdnEs9nu2VUa8/0u58w==} engines: {pnpm: '>=8.6.3'} peerDependencies: '@melt-ui/svelte': '>= 0.29.0' svelte: ^3.55.0 || ^4.0.0 dependencies: - '@melt-ui/svelte': 0.36.0(svelte@4.1.2) + '@melt-ui/svelte': 0.37.2(svelte@4.1.2) svelte: 4.1.2 dev: true - /@melt-ui/svelte@0.36.0(svelte@4.1.2): - resolution: {integrity: sha512-Qk6uGvCY3hcpTKc48x6VOAtmg0W/VXnVc2yTccqxK2+PlrKH4YSeVEIiZLaHWKdFDF/aL34r7YwNC5fq3swU6Q==} + /@melt-ui/svelte@0.37.2(svelte@4.1.2): + resolution: {integrity: sha512-MdFnsY/yL2p/y0m2PqaM/tGmJ/ZsUAhACksPXCbrTXBw042rHkZHC8ykp5E5MVXGPn/eWc9nt9Vh3tmB+2CjXw==} peerDependencies: svelte: '>=3 <5' dependencies: diff --git a/src/components/test-menubar.svelte b/src/components/test-menubar.svelte new file mode 100644 index 000000000..1498aeb2b --- /dev/null +++ b/src/components/test-menubar.svelte @@ -0,0 +1,93 @@ + + + + + File + + + New Tab ⌘T + + + New Window ⌘N + + New Incognito Window + + + Share + + Email link + Messages + Notes + + + + + Print... ⌘P + + + + + Edit + + + Undo ⌘Z + + + Redo ⇧⌘Z + + + + Find + + Search the web + + Find... + Find Next + Find Previous + + + + Cut + Copy + Paste + + + + View + + Always Show Bookmarks Bar + Always Show Full URLs + + + Reload ⌘R + + + Force Reload ⇧⌘R + + + Toggle Fullscreen + + Hide Sidebar + + + + Profiles + + + Andy + Benoit + Luis + + + Edit... + + Add Profile... + + + diff --git a/src/content/components/hover-card.md b/src/content/components/link-preview.md similarity index 53% rename from src/content/components/hover-card.md rename to src/content/components/link-preview.md index 9b35f876d..878669056 100644 --- a/src/content/components/hover-card.md +++ b/src/content/components/link-preview.md @@ -1,5 +1,5 @@ --- -title: Hover Card +title: Link Preview description: Enable sighted users to preview content behind a link. --- @@ -7,13 +7,13 @@ description: Enable sighted users to preview content behind a link. ```svelte - - - - + + + + ``` 🚧 **UNDER CONSTRUCTION** 🚧 diff --git a/src/lib/bits/hover-card/index.ts b/src/lib/bits/hover-card/index.ts deleted file mode 100644 index 62e5cce6d..000000000 --- a/src/lib/bits/hover-card/index.ts +++ /dev/null @@ -1,15 +0,0 @@ -import Root from "./components/HoverCard.svelte"; -import Content from "./components/HoverCardContent.svelte"; -import Trigger from "./components/HoverCardTrigger.svelte"; - -export { - Root, - Content, - Trigger, - // - Root as HoverCard, - Content as HoverCardContent, - Trigger as HoverCardTrigger -}; - -export * from "./types.js"; diff --git a/src/lib/bits/index.ts b/src/lib/bits/index.ts index 261dbb429..2ef544b21 100644 --- a/src/lib/bits/index.ts +++ b/src/lib/bits/index.ts @@ -8,7 +8,7 @@ export * as Collapsible from "./collapsible/index.js"; export * as ContextMenu from "./context-menu/index.js"; export * as Dialog from "./dialog/index.js"; export * as DropdownMenu from "./dropdown-menu/index.js"; -export * as HoverCard from "./hover-card/index.js"; +export * as HoverCard from "./link-preview/index.js"; export * as Label from "./label/index.js"; export * as Menubar from "./menubar/index.js"; export * as Popover from "./popover/index.js"; diff --git a/src/lib/bits/hover-card/components/HoverCard.svelte b/src/lib/bits/link-preview/components/LinkPreview.svelte similarity index 100% rename from src/lib/bits/hover-card/components/HoverCard.svelte rename to src/lib/bits/link-preview/components/LinkPreview.svelte diff --git a/src/lib/bits/hover-card/components/HoverCardContent.svelte b/src/lib/bits/link-preview/components/LinkPreviewContent.svelte similarity index 100% rename from src/lib/bits/hover-card/components/HoverCardContent.svelte rename to src/lib/bits/link-preview/components/LinkPreviewContent.svelte diff --git a/src/lib/bits/hover-card/components/HoverCardTrigger.svelte b/src/lib/bits/link-preview/components/LinkPreviewTrigger.svelte similarity index 97% rename from src/lib/bits/hover-card/components/HoverCardTrigger.svelte rename to src/lib/bits/link-preview/components/LinkPreviewTrigger.svelte index 52639ba7f..c6c030779 100644 --- a/src/lib/bits/hover-card/components/HoverCardTrigger.svelte +++ b/src/lib/bits/link-preview/components/LinkPreviewTrigger.svelte @@ -21,7 +21,6 @@ on:m-focus on:m-pointerenter on:m-pointerleave - on:m-touchstart > diff --git a/src/lib/bits/hover-card/ctx.ts b/src/lib/bits/link-preview/ctx.ts similarity index 65% rename from src/lib/bits/hover-card/ctx.ts rename to src/lib/bits/link-preview/ctx.ts index 2587a0117..5bc9cb2ff 100644 --- a/src/lib/bits/hover-card/ctx.ts +++ b/src/lib/bits/link-preview/ctx.ts @@ -1,8 +1,8 @@ import { getOptionUpdater, removeUndefined } from "$internal/index.js"; import { - createHoverCard, - type CreateHoverCardProps, - type HoverCard as HoverCardReturn + createLinkPreview, + type CreateLinkPreviewProps, + type LinkPreview as LinkPreviewReturn } from "@melt-ui/svelte"; import { getContext, setContext } from "svelte"; @@ -14,11 +14,11 @@ export const ctx = { }; function get() { - return getContext(NAME); + return getContext(NAME); } -function set(props: CreateHoverCardProps) { - const hovercard = createHoverCard({ +function set(props: CreateLinkPreviewProps) { + const hovercard = createLinkPreview({ ...removeUndefined(props), forceVisible: true }); diff --git a/src/lib/bits/link-preview/index.ts b/src/lib/bits/link-preview/index.ts new file mode 100644 index 000000000..641fbccca --- /dev/null +++ b/src/lib/bits/link-preview/index.ts @@ -0,0 +1,15 @@ +import Root from "./components/LinkPreview.svelte"; +import Content from "./components/LinkPreviewContent.svelte"; +import Trigger from "./components/LinkPreviewTrigger.svelte"; + +export { + Root, + Content, + Trigger, + // + Root as LinkPreview, + Content as LinkPreviewContent, + Trigger as LinkPreviewTrigger +}; + +export * from "./types.js"; diff --git a/src/lib/bits/hover-card/types.ts b/src/lib/bits/link-preview/types.ts similarity index 66% rename from src/lib/bits/hover-card/types.ts rename to src/lib/bits/link-preview/types.ts index 295c8c9aa..fb80efdc9 100644 --- a/src/lib/bits/hover-card/types.ts +++ b/src/lib/bits/link-preview/types.ts @@ -7,13 +7,13 @@ import type { TransitionParams, AsChild } from "$internal/index.js"; -import type { CreateHoverCardProps, HoverCardComponentEvents } from "@melt-ui/svelte"; +import type { CreateLinkPreviewProps, LinkPreviewComponentEvents } from "@melt-ui/svelte"; import type { HTMLAnchorAttributes } from "svelte/elements"; type Props = Expand< - OmitOpen & { - open?: CreateHoverCardProps["defaultOpen"]; - onOpenChange?: OnChangeFn; + OmitOpen & { + open?: CreateLinkPreviewProps["defaultOpen"]; + onOpenChange?: OnChangeFn; } >; @@ -24,8 +24,8 @@ type ContentProps = { } & AsChild & HTMLDivAttributes; -type TriggerEvents = HoverCardComponentEvents["trigger"]; -type ContentEvents = HoverCardComponentEvents["content"]; +type TriggerEvents = LinkPreviewComponentEvents["trigger"]; +type ContentEvents = LinkPreviewComponentEvents["content"]; export type { Props, diff --git a/src/lib/bits/menubar/components/MenubarContent.svelte b/src/lib/bits/menubar/components/MenubarContent.svelte index 08bccb4ef..9477243c0 100644 --- a/src/lib/bits/menubar/components/MenubarContent.svelte +++ b/src/lib/bits/menubar/components/MenubarContent.svelte @@ -7,14 +7,19 @@ type $$Events = ContentEvents; export let sideOffset: $$Props["sideOffset"] = 4; export let asChild = false; - const menu = ctx.getContent(sideOffset).elements.menu; + const { + elements: { menu }, + states: { open } + } = ctx.getContent(sideOffset); -{#if asChild} - -{:else} -
+{#if $open} + {#if asChild} -
+ {:else} +
+ +
+ {/if} {/if} diff --git a/src/lib/bits/menubar/ctx.ts b/src/lib/bits/menubar/ctx.ts index 728d3bcc2..8fff86dba 100644 --- a/src/lib/bits/menubar/ctx.ts +++ b/src/lib/bits/menubar/ctx.ts @@ -48,6 +48,7 @@ function get() { function set(props: MenubarProps) { const menubar = createMenubar(removeUndefined(props)); setContext(NAME, menubar); + return { ...menubar, updateOption: getOptionUpdater(menubar.options) From 8f72add5995413d6d5e8d6f3d44c9cee3c83c408 Mon Sep 17 00:00:00 2001 From: Hunter Johnston <64506580+huntabyte@users.noreply.github.com> Date: Fri, 18 Aug 2023 18:36:17 -0400 Subject: [PATCH 2/2] add changeset --- .changeset/heavy-geese-hang.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/heavy-geese-hang.md diff --git a/.changeset/heavy-geese-hang.md b/.changeset/heavy-geese-hang.md new file mode 100644 index 000000000..7dcff9aaf --- /dev/null +++ b/.changeset/heavy-geese-hang.md @@ -0,0 +1,5 @@ +--- +"bits-ui": patch +--- + +fix menubar & rename hovercard