From 96a7862be462d5bbe8f6ca4963ae1b9ca867118a Mon Sep 17 00:00:00 2001 From: christianmat Date: Tue, 1 Oct 2024 11:09:45 -0700 Subject: [PATCH 001/213] fix: do not autocomplete flows with incomplete steps --- .changeset/silly-bears-teach.md | 6 ++ .../stories/Checklist/Checklist.stories.tsx | 1 - .../ChecklistInteractionTests.stories.tsx | 74 +++++++++++++++++++ packages/js-api/src/core/flow.ts | 12 ++- 4 files changed, 89 insertions(+), 4 deletions(-) create mode 100644 .changeset/silly-bears-teach.md create mode 100644 apps/smithy/src/stories/Checklist/ChecklistInteractionTests.stories.tsx diff --git a/.changeset/silly-bears-teach.md b/.changeset/silly-bears-teach.md new file mode 100644 index 00000000..4b0dbf00 --- /dev/null +++ b/.changeset/silly-bears-teach.md @@ -0,0 +1,6 @@ +--- +"@frigade/js": patch +"@frigade/react": patch +--- + +Fixes an issue where checklists complete when finishing the last step diff --git a/apps/smithy/src/stories/Checklist/Checklist.stories.tsx b/apps/smithy/src/stories/Checklist/Checklist.stories.tsx index 913f4dde..cbfe2758 100644 --- a/apps/smithy/src/stories/Checklist/Checklist.stories.tsx +++ b/apps/smithy/src/stories/Checklist/Checklist.stories.tsx @@ -64,7 +64,6 @@ export const Collapsible = { test: TestStep, }, width: "500px", - forceMount: true, dismissible: true, }, }; diff --git a/apps/smithy/src/stories/Checklist/ChecklistInteractionTests.stories.tsx b/apps/smithy/src/stories/Checklist/ChecklistInteractionTests.stories.tsx new file mode 100644 index 00000000..be732623 --- /dev/null +++ b/apps/smithy/src/stories/Checklist/ChecklistInteractionTests.stories.tsx @@ -0,0 +1,74 @@ +import { Checklist, useFlow } from "@frigade/react"; +import { type Meta, type StoryObj } from "@storybook/react"; +import { expect, userEvent, within } from "@storybook/test"; + +type ChecklistStory = StoryObj; + +function sleep(ms: number) { + return new Promise((resolve) => setTimeout(resolve, ms)); +} + +const StoryMeta: Meta = { + title: "Components/Checklist", + component: Checklist.Collapsible, +}; + +export default StoryMeta; + +export const InteractionTests: ChecklistStory = { + args: { + flowId: "flow_K2dmIlteW8eGbGoo", + }, + decorators: [ + (Story, { args }) => { + const { flow } = useFlow(args.flowId); + + return ( + <> + + + + ); + }, + ], + + play: async ({ step, canvasElement }) => { + await sleep(1000); + const canvas = within(canvasElement); + const checklistElement = document.querySelector(".fr-checklist"); + + await step("Test interactions", async () => { + // test that checklistElement is in the document + expect(checklistElement).toBeInTheDocument(); + + const lastHeader = canvas.getByText("Donec id diam lectus"); + let checkboxes = document.querySelectorAll(".fr-field-radio-value"); + + // expectd lastCheckbox to not have any children + expect(checkboxes[checkboxes.length - 1]?.childNodes.length).toBe(0); + // click last header + await userEvent.click(lastHeader); + // Click the primary button that says "Testing" + await userEvent.click(canvas.getByText("Testing")); + await sleep(100); + + checkboxes = document.querySelectorAll(".fr-field-radio-value"); + // expect lastCheckbox to have a child (it is checked) + expect( + checkboxes[checkboxes.length - 1]?.childNodes.length + ).toBeGreaterThanOrEqual(1); + await sleep(1000); + expect(checklistElement).toBeInTheDocument(); + + await userEvent.click(canvas.getByText("Reset Flow")); + }); + }, +}; diff --git a/packages/js-api/src/core/flow.ts b/packages/js-api/src/core/flow.ts index a6bb5c03..910e9663 100644 --- a/packages/js-api/src/core/flow.ts +++ b/packages/js-api/src/core/flow.ts @@ -230,6 +230,11 @@ export class Flow extends Fetchable { } const isLastStep = this.getCurrentStepOrder() + 1 === this.getNumberOfAvailableSteps() + const isLastIncompleteStep = + Array.from(this.steps.values()).filter( + (step) => step.$state.visible && !step.$state.completed && !step.$state.skipped + ).length === 1 + if (optimistic) { const copy = clone(this.getGlobalState().flowStates[this.id]) @@ -249,7 +254,8 @@ export class Flow extends Fetchable { copy.$state.currentStepIndex = nextStepIndex copy.data.steps[nextStepIndex].$state.started = true } - } else { + } + if (isLastIncompleteStep) { copy.$state.completed = true copy.$state.visible = false } @@ -257,7 +263,7 @@ export class Flow extends Fetchable { this.getGlobalState().flowStates[this.id] = copy this.resyncState() - if (isLastStep) { + if (isLastIncompleteStep) { this.optimisticallyMarkFlowCompleted() } } @@ -267,7 +273,7 @@ export class Flow extends Fetchable { properties, thisStep.id ) - if (isLastStep) { + if (isLastIncompleteStep) { await this.sendFlowStateToAPI(COMPLETED_FLOW, properties) } } From 31f5d33b44ec532d72ec257f214778503fe61f09 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Tue, 1 Oct 2024 11:19:54 -0700 Subject: [PATCH 002/213] Version Packages (#384) Co-authored-by: github-actions[bot] --- .changeset/silly-bears-teach.md | 6 ------ packages/js-api/CHANGELOG.md | 6 ++++++ packages/js-api/package.json | 2 +- packages/react/CHANGELOG.md | 8 ++++++++ packages/react/package.json | 4 ++-- 5 files changed, 17 insertions(+), 9 deletions(-) delete mode 100644 .changeset/silly-bears-teach.md diff --git a/.changeset/silly-bears-teach.md b/.changeset/silly-bears-teach.md deleted file mode 100644 index 4b0dbf00..00000000 --- a/.changeset/silly-bears-teach.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -"@frigade/js": patch -"@frigade/react": patch ---- - -Fixes an issue where checklists complete when finishing the last step diff --git a/packages/js-api/CHANGELOG.md b/packages/js-api/CHANGELOG.md index b0ccb97f..b45902d3 100644 --- a/packages/js-api/CHANGELOG.md +++ b/packages/js-api/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/js +## 0.7.16 + +### Patch Changes + +- 96a7862: Fixes an issue where checklists complete when finishing the last step + ## 0.7.15 ### Patch Changes diff --git a/packages/js-api/package.json b/packages/js-api/package.json index e01c667e..dfd0e23c 100644 --- a/packages/js-api/package.json +++ b/packages/js-api/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/js", - "version": "0.7.15", + "version": "0.7.16", "description": "The official Javascript SDK for Frigade.", "type": "module", "main": "./dist/index.js", diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index fee4fede..14b0fae5 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,13 @@ # @frigade/react +## 2.5.18 + +### Patch Changes + +- 96a7862: Fixes an issue where checklists complete when finishing the last step +- Updated dependencies [96a7862] + - @frigade/js@0.7.16 + ## 2.5.17 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 6d008739..6b4989ee 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.5.17", + "version": "2.5.18", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", @@ -50,7 +50,7 @@ "dependencies": { "@emotion/react": "^11.11.4", "@floating-ui/react": "^0.26.22", - "@frigade/js": "^0.7.15", + "@frigade/js": "^0.7.16", "@radix-ui/react-checkbox": "^1.1.1", "@radix-ui/react-collapsible": "^1.0.3", "@radix-ui/react-dialog": "^1.0.5", From c6ecaf6fa616a4318b0bb91411ff52c5b2742ca0 Mon Sep 17 00:00:00 2001 From: christianmat Date: Tue, 1 Oct 2024 11:20:33 -0700 Subject: [PATCH 003/213] fix: yarn install --- yarn.lock | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/yarn.lock b/yarn.lock index f4daf985..5ba011b3 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3721,7 +3721,7 @@ __metadata: languageName: node linkType: hard -"@frigade/js@npm:^0.7.15, @frigade/js@workspace:packages/js-api": +"@frigade/js@npm:^0.7.16, @frigade/js@workspace:packages/js-api": version: 0.0.0-use.local resolution: "@frigade/js@workspace:packages/js-api" dependencies: @@ -3755,7 +3755,7 @@ __metadata: dependencies: "@emotion/react": "npm:^11.11.4" "@floating-ui/react": "npm:^0.26.22" - "@frigade/js": "npm:^0.7.15" + "@frigade/js": "npm:^0.7.16" "@radix-ui/react-checkbox": "npm:^1.1.1" "@radix-ui/react-collapsible": "npm:^1.0.3" "@radix-ui/react-dialog": "npm:^1.0.5" From db9ec80bff1fefc3e31050e1c91b6cb685c19b13 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Tue, 1 Oct 2024 18:23:39 +0000 Subject: [PATCH 004/213] chore: run prepublish script --- packages/js-api/src/version.ts | 2 +- packages/react/src/version.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/js-api/src/version.ts b/packages/js-api/src/version.ts index b04a322c..de8e29c3 100644 --- a/packages/js-api/src/version.ts +++ b/packages/js-api/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '0.7.15'; \ No newline at end of file +export const SDK_VERSION = '0.7.16'; \ No newline at end of file diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index c184cb18..3f69b1c6 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.5.17'; \ No newline at end of file +export const SDK_VERSION = '2.5.18'; \ No newline at end of file From 19ab368688eeb4f79c125dc17ebf00fc4af7e2b3 Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Fri, 27 Sep 2024 10:40:46 -0700 Subject: [PATCH 005/213] Add container prop to Tour --- apps/smithy/src/stories/Hint/Hint.stories.tsx | 2 +- apps/smithy/src/stories/Tour/Tour.stories.tsx | 78 ++++++++++++++++++- packages/react/src/components/Tour/Tour.tsx | 10 ++- 3 files changed, 85 insertions(+), 5 deletions(-) diff --git a/apps/smithy/src/stories/Hint/Hint.stories.tsx b/apps/smithy/src/stories/Hint/Hint.stories.tsx index b5aee7ff..9de8a467 100644 --- a/apps/smithy/src/stories/Hint/Hint.stories.tsx +++ b/apps/smithy/src/stories/Hint/Hint.stories.tsx @@ -12,7 +12,7 @@ export const Default = { alignOffset: 0, anchor: "#tooltip-storybook-0", children: Hello, - defaultOpen: false, + defaultOpen: true, side: "left", sideOffset: 0, }, diff --git a/apps/smithy/src/stories/Tour/Tour.stories.tsx b/apps/smithy/src/stories/Tour/Tour.stories.tsx index 75ffea3e..399717f2 100644 --- a/apps/smithy/src/stories/Tour/Tour.stories.tsx +++ b/apps/smithy/src/stories/Tour/Tour.stories.tsx @@ -92,7 +92,7 @@ export const Default = { style={{ background: "lightgreen", width: "200px", - marginTop: "1400px", // Add significant margin to force scrolling + marginTop: "200vh", // Add significant margin to force scrolling }} > Scroll to see this anchor @@ -102,3 +102,79 @@ export const Default = { }, ], }; + +export const WithScrollContainer = { + args: { + container: "#tour-scroll-container", + flowId: "flow_U63A5pndRrvCwxNs", + modal: false, + spotlight: false, + variables: { + firstName: "Euronymous Bosch", + }, + }, + decorators: [ + (_: StoryFn, options: StoryContext) => { + return ( + <> + + + + + { + // no-op + }} + /> + + + + Second anchor + + + + Scroll to see this anchor + + + + + + + ); + }, + ], +}; diff --git a/packages/react/src/components/Tour/Tour.tsx b/packages/react/src/components/Tour/Tour.tsx index 1dd030da..7ac87dfc 100644 --- a/packages/react/src/components/Tour/Tour.tsx +++ b/packages/react/src/components/Tour/Tour.tsx @@ -6,12 +6,11 @@ import { useClientPortal } from '@/hooks/useClientPortal' export interface TourProps extends FlowPropsWithoutChildren, Omit { /** - * Whether the tour should be completed by the end-user in sequential order. + * Whether the Tour should be completed by the end-user in sequential order. * If `false`, all steps will be rendered at once. * Defaults to `true`, which means only one step will be rendered at a time in sequential order. */ sequential?: boolean - /** * The alignment of the tooltip relative to the anchor. * Possible values: `after`, `before`, `center`, `end`, `start`. @@ -21,6 +20,10 @@ export interface TourProps extends FlowPropsWithoutChildren, Omit[1] /** * Whether the tooltip should be open by default. */ @@ -56,6 +59,7 @@ export function Tour({ align = 'after', alignOffset = 0, as, + container = 'body', defaultOpen, dismissible = false, flowId, @@ -168,6 +172,6 @@ export function Tour({ }) }} , - 'body' + container ) } From 55141d576d6e4ab3e5e9b4c4b72c9284d798d06b Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Fri, 27 Sep 2024 12:06:26 -0700 Subject: [PATCH 006/213] Move portal inside Tour, rearrange Tour props to accept YAML overrides --- apps/smithy/src/stories/Tour/Tour.stories.tsx | 2 +- .../components/ClientPortal/ClientPortal.tsx | 10 +++ packages/react/src/components/Tour/Tour.tsx | 73 +++++++++++-------- 3 files changed, 55 insertions(+), 30 deletions(-) create mode 100644 packages/react/src/components/ClientPortal/ClientPortal.tsx diff --git a/apps/smithy/src/stories/Tour/Tour.stories.tsx b/apps/smithy/src/stories/Tour/Tour.stories.tsx index 399717f2..9a994238 100644 --- a/apps/smithy/src/stories/Tour/Tour.stories.tsx +++ b/apps/smithy/src/stories/Tour/Tour.stories.tsx @@ -105,7 +105,7 @@ export const Default = { export const WithScrollContainer = { args: { - container: "#tour-scroll-container", + // container: "#tour-scroll-container", flowId: "flow_U63A5pndRrvCwxNs", modal: false, spotlight: false, diff --git a/packages/react/src/components/ClientPortal/ClientPortal.tsx b/packages/react/src/components/ClientPortal/ClientPortal.tsx new file mode 100644 index 00000000..41692f06 --- /dev/null +++ b/packages/react/src/components/ClientPortal/ClientPortal.tsx @@ -0,0 +1,10 @@ +import { useClientPortal } from '@/hooks/useClientPortal' + +export interface ClientPortalProps { + children?: React.ReactNode + container?: Parameters[1] +} + +export function ClientPortal({ children, container = 'body' }: ClientPortalProps) { + return children != null ? useClientPortal(children, container) : null +} diff --git a/packages/react/src/components/Tour/Tour.tsx b/packages/react/src/components/Tour/Tour.tsx index 7ac87dfc..65ab233d 100644 --- a/packages/react/src/components/Tour/Tour.tsx +++ b/packages/react/src/components/Tour/Tour.tsx @@ -1,9 +1,9 @@ +import { Box } from '@/components/Box' +import { ClientPortal, type ClientPortalProps } from '@/components/ClientPortal/ClientPortal' import { Flow, type FlowPropsWithoutChildren } from '@/components/Flow' import { AlignValue, SideValue, type HintProps } from '@/components/Hint' import { TourStep } from '@/components/Tour/TourStep' -import { useClientPortal } from '@/hooks/useClientPortal' - export interface TourProps extends FlowPropsWithoutChildren, Omit { /** * Whether the Tour should be completed by the end-user in sequential order. @@ -23,7 +23,7 @@ export interface TourProps extends FlowPropsWithoutChildren, Omit[1] + container?: ClientPortalProps['container'] /** * Whether the tooltip should be open by default. */ @@ -55,28 +55,28 @@ export interface TourProps extends FlowPropsWithoutChildren, Omit - {({ flow, handleDismiss, parentProps: { containerProps }, step }) => { + return ( + + {({ flow, handleDismiss, parentProps, step }) => { + const { + align = 'after', + alignOffset = 0, + container = 'body', + defaultOpen, + dismissible = false, + modal, + part, + sequential = true, + side = 'bottom', + sideOffset = 0, + spotlight, + zIndex = 9999, + ...containerProps + } = parentProps.containerProps as Partial + const sequentialStepProps = { align, alignOffset, @@ -91,19 +91,27 @@ export function Tour({ sideOffset, spotlight, step, - zIndex: step.props?.zIndex ?? containerProps?.zIndex ?? zIndex, + zIndex, ...(step.props ?? {}), } if (sequential) { return ( - + + + + + ) } // TODO: Only render spotlight if current step // TODO: Only render modal overlay once - return Array.from(flow.steps.values()) + const tourSteps = Array.from(flow.steps.values()) .filter((currentStep) => { const { blocked, completed, skipped, visible } = currentStep.$state @@ -129,7 +137,7 @@ export function Tour({ const shouldShowSpotlight = spotlight && currentStep.id === step.id - const currentStepZIndex = currentStep.props?.zIndex ?? containerProps?.zIndex ?? zIndex + const currentStepZIndex = currentStep.props?.zIndex ?? zIndex const nonSequentialStepProps = { align, @@ -170,8 +178,15 @@ export function Tour({ /> ) }) + + return ( + + + {tourSteps} + + + ) }} - , - container + ) } From 0249bc22f19bf8e679979aee4fd829302a01b10b Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Mon, 30 Sep 2024 15:16:12 -0700 Subject: [PATCH 007/213] Add autoScroll prop to Hint/Tour, add animation to Overlay --- apps/smithy/src/stories/Tour/Tour.stories.tsx | 3 +- packages/react/src/components/Hint/index.tsx | 38 +++++++++++- .../react/src/components/Overlay/index.tsx | 32 ++++------ packages/react/src/components/Tour/Tour.tsx | 62 +++++++++++++------ .../react/src/components/Tour/TourStep.tsx | 2 + 5 files changed, 95 insertions(+), 42 deletions(-) diff --git a/apps/smithy/src/stories/Tour/Tour.stories.tsx b/apps/smithy/src/stories/Tour/Tour.stories.tsx index 9a994238..02c0715a 100644 --- a/apps/smithy/src/stories/Tour/Tour.stories.tsx +++ b/apps/smithy/src/stories/Tour/Tour.stories.tsx @@ -105,7 +105,8 @@ export const Default = { export const WithScrollContainer = { args: { - // container: "#tour-scroll-container", + autoScroll: true, + container: "#tour-scroll-container", flowId: "flow_U63A5pndRrvCwxNs", modal: false, spotlight: false, diff --git a/packages/react/src/components/Hint/index.tsx b/packages/react/src/components/Hint/index.tsx index ba76d890..7fa66622 100644 --- a/packages/react/src/components/Hint/index.tsx +++ b/packages/react/src/components/Hint/index.tsx @@ -1,4 +1,4 @@ -import { useState } from 'react' +import { useEffect, useState } from 'react' import { Box, type BoxProps } from '@/components/Box' import { Overlay } from '@/components/Overlay' @@ -16,6 +16,7 @@ export interface HintProps extends BoxProps { align?: AlignValue alignOffset?: number anchor: string + autoScroll?: ScrollIntoViewOptions | boolean children?: React.ReactNode defaultOpen?: boolean modal?: boolean @@ -30,6 +31,7 @@ export function Hint({ align = 'center', alignOffset = 0, anchor, + autoScroll = false, children, defaultOpen = true, modal = false, @@ -43,6 +45,7 @@ export function Hint({ ...props }: HintProps) { const [internalOpen, setInteralOpen] = useState(defaultOpen) + const [scrollComplete, setScrollComplete] = useState(false) // Defer to controlled open prop, otherwise manage open state internally const canonicalOpen = open ?? internalOpen @@ -66,7 +69,38 @@ export function Hint({ const [finalSide, finalAlign] = placement.split('-') const referenceProps = getReferenceProps() - if (refs.reference.current == null) { + useEffect(() => { + if (!scrollComplete && autoScroll && refs.reference.current instanceof Element) { + const scrollOptions: ScrollIntoViewOptions = + typeof autoScroll !== 'boolean' ? autoScroll : { behavior: 'smooth' } + + /* + * NOTE: "scrollend" event isn't supported widely enough yet :( + * + * We'll listen to a capture-phase "scroll" instead, and when it stops + * bouncing, we can infer that the scroll we initiated is over. + */ + let scrollTimeout: ReturnType + window.addEventListener( + 'scroll', + function scrollHandler() { + clearTimeout(scrollTimeout) + + scrollTimeout = setTimeout(() => { + window.removeEventListener('scroll', scrollHandler) + setScrollComplete(true) + }, 100) + }, + true + ) + + refs.reference.current.scrollIntoView(scrollOptions) + } else if (!autoScroll) { + setScrollComplete(true) + } + }, [autoScroll, refs.reference.current]) + + if (refs.reference.current == null || !scrollComplete) { return null } diff --git a/packages/react/src/components/Overlay/index.tsx b/packages/react/src/components/Overlay/index.tsx index 67c35283..ee604bb8 100644 --- a/packages/react/src/components/Overlay/index.tsx +++ b/packages/react/src/components/Overlay/index.tsx @@ -1,4 +1,5 @@ import * as React from 'react' +import { keyframes } from '@emotion/react' import { Box, type BoxProps } from '@/components/Box' @@ -6,35 +7,28 @@ import { RemoveScroll } from 'react-remove-scroll' export interface OverlayProps extends BoxProps {} -// export function Overlay({ children, part, ...props }: OverlayProps) { -// return ( -// -// -// {children} -// -// -// ) -// } - function OverlayWithRef( - { children, part, ...props }: OverlayProps, + { children, part, opacity = 0.5, ...props }: OverlayProps, ref: React.ForwardedRef ) { + const fadeIn = keyframes` + from { + opacity: 0; + } + to { + opacity: ${opacity} + } + ` + return ( {children} diff --git a/packages/react/src/components/Tour/Tour.tsx b/packages/react/src/components/Tour/Tour.tsx index 65ab233d..5c852ddc 100644 --- a/packages/react/src/components/Tour/Tour.tsx +++ b/packages/react/src/components/Tour/Tour.tsx @@ -5,12 +5,6 @@ import { AlignValue, SideValue, type HintProps } from '@/components/Hint' import { TourStep } from '@/components/Tour/TourStep' export interface TourProps extends FlowPropsWithoutChildren, Omit { - /** - * Whether the Tour should be completed by the end-user in sequential order. - * If `false`, all steps will be rendered at once. - * Defaults to `true`, which means only one step will be rendered at a time in sequential order. - */ - sequential?: boolean /** * The alignment of the tooltip relative to the anchor. * Possible values: `after`, `before`, `center`, `end`, `start`. @@ -20,6 +14,10 @@ export interface TourProps extends FlowPropsWithoutChildren, Omit) { + return ( + + + {children} + + + ) +} + export function Tour({ as, flowId, ...props }: TourProps) { const { onDismiss, onPrimary, onSecondary } = props @@ -64,6 +78,7 @@ export function Tour({ as, flowId, ...props }: TourProps) { const { align = 'after', alignOffset = 0, + autoScroll = false, container = 'body', defaultOpen, dismissible = false, @@ -80,6 +95,7 @@ export function Tour({ as, flowId, ...props }: TourProps) { const sequentialStepProps = { align, alignOffset, + autoScroll, dismissible, flow, handleDismiss, @@ -97,15 +113,16 @@ export function Tour({ as, flowId, ...props }: TourProps) { if (sequential) { return ( - - - - - + + + ) } @@ -180,11 +197,16 @@ export function Tour({ as, flowId, ...props }: TourProps) { }) return ( - - - {tourSteps} - - + + {tourSteps} + ) }} diff --git a/packages/react/src/components/Tour/TourStep.tsx b/packages/react/src/components/Tour/TourStep.tsx index d337694b..37f6be07 100644 --- a/packages/react/src/components/Tour/TourStep.tsx +++ b/packages/react/src/components/Tour/TourStep.tsx @@ -27,6 +27,7 @@ export interface TourStepProps export function TourStep({ align, alignOffset, + autoScroll, defaultOpen, dismissible, flow, @@ -55,6 +56,7 @@ export function TourStep({ align={align} alignOffset={alignOffset} anchor={step.selector as string} + autoScroll={autoScroll} data-step-id={step.id} defaultOpen={defaultOpen} modal={modal} From 91a75c6cc462a80b45c80823e6c98e3987633c4b Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Tue, 1 Oct 2024 13:07:45 -0700 Subject: [PATCH 008/213] Check for Tour/Hint presence on screen, tighten up animations --- apps/smithy/src/stories/Tour/Tour.stories.tsx | 2 +- packages/react/src/components/Hint/index.tsx | 47 ++++++++++++------- .../src/components/Hint/useFloatingHint.ts | 4 ++ packages/react/src/components/Ping/index.tsx | 14 +++++- .../react/src/hooks/useBoundingClientRect.ts | 27 +++++------ packages/react/src/hooks/useVisibility.ts | 37 +++++++++++++++ 6 files changed, 98 insertions(+), 33 deletions(-) create mode 100644 packages/react/src/hooks/useVisibility.ts diff --git a/apps/smithy/src/stories/Tour/Tour.stories.tsx b/apps/smithy/src/stories/Tour/Tour.stories.tsx index 02c0715a..4388fb6e 100644 --- a/apps/smithy/src/stories/Tour/Tour.stories.tsx +++ b/apps/smithy/src/stories/Tour/Tour.stories.tsx @@ -136,7 +136,7 @@ export const WithScrollContainer = { position="relative" width="50vw" > - + {}, @@ -50,29 +52,32 @@ export function Hint({ // Defer to controlled open prop, otherwise manage open state internally const canonicalOpen = open ?? internalOpen - const { getFloatingProps, getReferenceProps, floatingStyles, placement, refs } = useFloatingHint({ - align, - alignOffset, - anchor, - onOpenChange: (newOpen) => { - onOpenChange(newOpen) - - if (open == null) { - setInteralOpen(newOpen) - } - }, - open: canonicalOpen, - side, - sideOffset, - }) + const { getFloatingProps, getReferenceProps, floatingStyles, placement, refs, status } = + useFloatingHint({ + align, + alignOffset, + anchor, + onOpenChange: (newOpen) => { + onOpenChange(newOpen) + + if (open == null) { + setInteralOpen(newOpen) + } + }, + open: canonicalOpen, + side, + sideOffset, + }) const [finalSide, finalAlign] = placement.split('-') const referenceProps = getReferenceProps() + const { isVisible } = useVisibility(refs.reference.current as Element | null) + useEffect(() => { if (!scrollComplete && autoScroll && refs.reference.current instanceof Element) { const scrollOptions: ScrollIntoViewOptions = - typeof autoScroll !== 'boolean' ? autoScroll : { behavior: 'smooth' } + typeof autoScroll !== 'boolean' ? autoScroll : { behavior: 'smooth', block: 'center' } /* * NOTE: "scrollend" event isn't supported widely enough yet :( @@ -100,7 +105,7 @@ export function Hint({ } }, [autoScroll, refs.reference.current]) - if (refs.reference.current == null || !scrollComplete) { + if (refs.reference.current == null || !scrollComplete || !isVisible) { return null } @@ -110,6 +115,14 @@ export function Hint({ {modal && !spotlight && canonicalOpen && } } function getOriginalAlign(align: AlignValue) { @@ -94,6 +96,7 @@ export function useFloatingHint({ outsidePress: false, }) const role = useRole(context) + const status = useTransitionStatus(context) // Merge all the interactions into prop getters const { getFloatingProps, getReferenceProps } = useInteractions([click, dismiss, role]) @@ -125,5 +128,6 @@ export function useFloatingHint({ floatingStyles, placement: finalPlacement.join('-') as ExtendedPlacement, refs, + status, } } diff --git a/packages/react/src/components/Ping/index.tsx b/packages/react/src/components/Ping/index.tsx index faa27045..24cb7efc 100644 --- a/packages/react/src/components/Ping/index.tsx +++ b/packages/react/src/components/Ping/index.tsx @@ -1,4 +1,5 @@ import { keyframes } from '@emotion/react' +import { useEffect, useState } from 'react' import { Box, type BoxProps } from '@/components/Box' @@ -21,7 +22,13 @@ export interface PingProps extends BoxProps { clickable?: boolean } -export function Ping({ clickable = false, part = '', ...props }: PingProps) { +export function Ping({ clickable = false, part = '', style = {}, ...props }: PingProps) { + const [hasMounted, setHasMounted] = useState(false) + + useEffect(() => { + setHasMounted(true) + }, []) + return ( {}, +} + export function useBoundingClientRect() { - const initialRect = - 'DOMRect' in globalThis - ? new DOMRect() - : { - height: 0, - width: 0, - x: 0, - y: 0, - bottom: 0, - top: 0, - right: 0, - left: 0, - toJSON: () => {}, - } + const initialRect = 'DOMRect' in globalThis ? new DOMRect() : EmptyDOMRect const [rect, setRect] = useState(initialRect) const [node, setNode] = useState(null) diff --git a/packages/react/src/hooks/useVisibility.ts b/packages/react/src/hooks/useVisibility.ts new file mode 100644 index 00000000..79e095b8 --- /dev/null +++ b/packages/react/src/hooks/useVisibility.ts @@ -0,0 +1,37 @@ +import { ClientRectObject } from '@floating-ui/react' +import { useEffect, useState } from 'react' + +import { EmptyDOMRect } from '@/hooks/useBoundingClientRect' + +export function useVisibility(element: Element | null) { + const [isIntersecting, setIsIntersecting] = useState(false) + const [clientRect, setClientRect] = useState(EmptyDOMRect) + + const hasDimensions = clientRect.height > 0 && clientRect.width > 0 + + useEffect(() => { + if (element == null) { + return + } + + const observer = new IntersectionObserver( + (entries) => { + const el = entries[0] + + setClientRect(el.boundingClientRect) + setIsIntersecting(el.isIntersecting) + }, + { root: null } + ) + + observer.observe(element) + + return () => { + observer.disconnect() + } + }, [element]) + + return { + isVisible: isIntersecting && hasDimensions, + } +} From 4f01414c8202df2097a7edb39c95f09bb2782a0d Mon Sep 17 00:00:00 2001 From: christianmat Date: Mon, 7 Oct 2024 16:19:06 -0700 Subject: [PATCH 009/213] fix: race condition where variables are not applied until refresh --- packages/js-api/src/core/flow.ts | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/packages/js-api/src/core/flow.ts b/packages/js-api/src/core/flow.ts index 910e9663..ec54d9c8 100644 --- a/packages/js-api/src/core/flow.ts +++ b/packages/js-api/src/core/flow.ts @@ -143,7 +143,7 @@ export class Flow extends Fetchable { }) if (this.getGlobalState().variables[this.id]) { - this.applyVariables(this.getGlobalState().variables[this.id] ?? {}) + this.applyVariablesInternal(this.getGlobalState().variables[this.id] ?? {}) } } @@ -345,7 +345,7 @@ export class Flow extends Fetchable { this.getGlobalState().variables[this.id] && Object.keys(this.getGlobalState().variables[this.id]).length > 0 ) { - this.applyVariables(this.getGlobalState().variables[this.id]) + this.applyVariablesInternal(this.getGlobalState().variables[this.id] ?? {}) } } @@ -540,6 +540,10 @@ export class Flow extends Fetchable { * @param variables A record of variables to apply to the flow. */ public applyVariables(variables: Record) { + this.applyVariablesInternal(variables, true) + } + + private applyVariablesInternal(variables: Record, resyncState: boolean = false) { // Check if variables have changed if (this.getGlobalState().variables[this.id]) { @@ -592,6 +596,7 @@ export class Flow extends Fetchable { if (this.steps) { this.steps.forEach((step) => { try { + console applyVariablesToStep(step) } catch (e) { // ignore any failures @@ -600,6 +605,10 @@ export class Flow extends Fetchable { } this.getGlobalState().variables[this.id] = variables + + if (resyncState) { + this.resyncState() + } } /** From 6c8748e2c0f449098f0eb777f0d45d47a1ab4f75 Mon Sep 17 00:00:00 2001 From: christianmat Date: Mon, 7 Oct 2024 16:20:48 -0700 Subject: [PATCH 010/213] changeset --- .changeset/flat-trainers-argue.md | 6 ++++++ 1 file changed, 6 insertions(+) create mode 100644 .changeset/flat-trainers-argue.md diff --git a/.changeset/flat-trainers-argue.md b/.changeset/flat-trainers-argue.md new file mode 100644 index 00000000..f480482d --- /dev/null +++ b/.changeset/flat-trainers-argue.md @@ -0,0 +1,6 @@ +--- +"@frigade/js": patch +"@frigade/react": patch +--- + +Contains a series of minor bug fixes related to tours and variables From 13c3cd78a73b694559334b6a9481f6a428b5167e Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Mon, 7 Oct 2024 16:24:11 -0700 Subject: [PATCH 011/213] Version Packages (#385) Co-authored-by: github-actions[bot] --- .changeset/flat-trainers-argue.md | 6 ------ packages/js-api/CHANGELOG.md | 6 ++++++ packages/js-api/package.json | 2 +- packages/react/CHANGELOG.md | 8 ++++++++ packages/react/package.json | 4 ++-- 5 files changed, 17 insertions(+), 9 deletions(-) delete mode 100644 .changeset/flat-trainers-argue.md diff --git a/.changeset/flat-trainers-argue.md b/.changeset/flat-trainers-argue.md deleted file mode 100644 index f480482d..00000000 --- a/.changeset/flat-trainers-argue.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -"@frigade/js": patch -"@frigade/react": patch ---- - -Contains a series of minor bug fixes related to tours and variables diff --git a/packages/js-api/CHANGELOG.md b/packages/js-api/CHANGELOG.md index b45902d3..7a29c7b0 100644 --- a/packages/js-api/CHANGELOG.md +++ b/packages/js-api/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/js +## 0.7.17 + +### Patch Changes + +- 6c8748e: Contains a series of minor bug fixes related to tours and variables + ## 0.7.16 ### Patch Changes diff --git a/packages/js-api/package.json b/packages/js-api/package.json index dfd0e23c..7bfb27a6 100644 --- a/packages/js-api/package.json +++ b/packages/js-api/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/js", - "version": "0.7.16", + "version": "0.7.17", "description": "The official Javascript SDK for Frigade.", "type": "module", "main": "./dist/index.js", diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 14b0fae5..29acfc21 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,13 @@ # @frigade/react +## 2.5.19 + +### Patch Changes + +- 6c8748e: Contains a series of minor bug fixes related to tours and variables +- Updated dependencies [6c8748e] + - @frigade/js@0.7.17 + ## 2.5.18 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 6b4989ee..778586e7 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.5.18", + "version": "2.5.19", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", @@ -50,7 +50,7 @@ "dependencies": { "@emotion/react": "^11.11.4", "@floating-ui/react": "^0.26.22", - "@frigade/js": "^0.7.16", + "@frigade/js": "^0.7.17", "@radix-ui/react-checkbox": "^1.1.1", "@radix-ui/react-collapsible": "^1.0.3", "@radix-ui/react-dialog": "^1.0.5", From 802d1a1960562a6082b4da858446d059b56c485d Mon Sep 17 00:00:00 2001 From: christianmat Date: Mon, 7 Oct 2024 16:24:24 -0700 Subject: [PATCH 012/213] fix: yarn install --- yarn.lock | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/yarn.lock b/yarn.lock index 5ba011b3..3ff0cdc8 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3721,7 +3721,7 @@ __metadata: languageName: node linkType: hard -"@frigade/js@npm:^0.7.16, @frigade/js@workspace:packages/js-api": +"@frigade/js@npm:^0.7.17, @frigade/js@workspace:packages/js-api": version: 0.0.0-use.local resolution: "@frigade/js@workspace:packages/js-api" dependencies: @@ -3755,7 +3755,7 @@ __metadata: dependencies: "@emotion/react": "npm:^11.11.4" "@floating-ui/react": "npm:^0.26.22" - "@frigade/js": "npm:^0.7.16" + "@frigade/js": "npm:^0.7.17" "@radix-ui/react-checkbox": "npm:^1.1.1" "@radix-ui/react-collapsible": "npm:^1.0.3" "@radix-ui/react-dialog": "npm:^1.0.5" From 52ea7972b6b49872ec215e6fafd01da5db5efd4c Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Mon, 7 Oct 2024 23:25:44 +0000 Subject: [PATCH 013/213] chore: run prepublish script --- packages/js-api/src/version.ts | 2 +- packages/react/src/version.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/js-api/src/version.ts b/packages/js-api/src/version.ts index de8e29c3..63e42e0d 100644 --- a/packages/js-api/src/version.ts +++ b/packages/js-api/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '0.7.16'; \ No newline at end of file +export const SDK_VERSION = '0.7.17'; \ No newline at end of file diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 3f69b1c6..7c1ba2d3 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.5.18'; \ No newline at end of file +export const SDK_VERSION = '2.5.19'; \ No newline at end of file From 177f6bb3859bdd375491b12e29a2339b9eaa55d0 Mon Sep 17 00:00:00 2001 From: christianmat Date: Mon, 7 Oct 2024 16:50:48 -0700 Subject: [PATCH 014/213] fix: delayed updates to step variables --- .changeset/tall-pens-lay.md | 6 ++++++ apps/smithy/src/stories/Form/Form.stories.tsx | 21 +++++++++++++------ packages/js-api/src/core/flow.ts | 11 ---------- 3 files changed, 21 insertions(+), 17 deletions(-) create mode 100644 .changeset/tall-pens-lay.md diff --git a/.changeset/tall-pens-lay.md b/.changeset/tall-pens-lay.md new file mode 100644 index 00000000..dcd4c1a1 --- /dev/null +++ b/.changeset/tall-pens-lay.md @@ -0,0 +1,6 @@ +--- +"@frigade/js": patch +"@frigade/react": patch +--- + +Fixes an edge cases where variables used in form fields do not update in some cases diff --git a/apps/smithy/src/stories/Form/Form.stories.tsx b/apps/smithy/src/stories/Form/Form.stories.tsx index f96df805..4162a83e 100644 --- a/apps/smithy/src/stories/Form/Form.stories.tsx +++ b/apps/smithy/src/stories/Form/Form.stories.tsx @@ -5,7 +5,7 @@ import { type FormFieldProps, SelectField, } from "@frigade/react"; -import { useState } from "react"; +import { useEffect, useState } from "react"; export default { title: "Components/Form", @@ -114,11 +114,20 @@ export const VariablesInForms = { const [testVar, setTestVar] = useState("test1"); const [otherVar, setOtherVar] = useState("test2"); - // setTimeout to simulate async data fetching - setTimeout(() => { - setTestVar("updated var 1"); - setOtherVar("updated var 2"); - }, 1000); + useEffect(() => { + // setTimeout to simulate async data fetching + setTimeout(() => { + setTestVar("updated var 1"); + setOtherVar("updated var 2"); + }, 1000); + + // update it again after 2000ms + setTimeout(() => { + setTestVar("updated var 1 again"); + setOtherVar("updated var 2 again"); + }, 2000); + }, []); + ``; return (
diff --git a/packages/js-api/src/core/flow.ts b/packages/js-api/src/core/flow.ts index ec54d9c8..0814e9a2 100644 --- a/packages/js-api/src/core/flow.ts +++ b/packages/js-api/src/core/flow.ts @@ -544,17 +544,6 @@ export class Flow extends Fetchable { } private applyVariablesInternal(variables: Record, resyncState: boolean = false) { - // Check if variables have changed - - if (this.getGlobalState().variables[this.id]) { - // If they have changed, reset the flow's content so variables can be replaced again. - if (JSON.stringify(this.getGlobalState().variables[this.id]) !== JSON.stringify(variables)) { - this.getGlobalState().variables[this.id] = variables - this.reload() - return - } - } - // Replace ${variable} with the value of the variable const replaceVariables = (str: string) => { const matches = str.match(/\${(.*?)}/g) From d9a3a43d944acc4b49e855dcf282d7b6027e0719 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Mon, 7 Oct 2024 17:02:21 -0700 Subject: [PATCH 015/213] Version Packages (#386) Co-authored-by: github-actions[bot] --- .changeset/tall-pens-lay.md | 6 ------ packages/js-api/CHANGELOG.md | 6 ++++++ packages/js-api/package.json | 2 +- packages/react/CHANGELOG.md | 8 ++++++++ packages/react/package.json | 4 ++-- 5 files changed, 17 insertions(+), 9 deletions(-) delete mode 100644 .changeset/tall-pens-lay.md diff --git a/.changeset/tall-pens-lay.md b/.changeset/tall-pens-lay.md deleted file mode 100644 index dcd4c1a1..00000000 --- a/.changeset/tall-pens-lay.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -"@frigade/js": patch -"@frigade/react": patch ---- - -Fixes an edge cases where variables used in form fields do not update in some cases diff --git a/packages/js-api/CHANGELOG.md b/packages/js-api/CHANGELOG.md index 7a29c7b0..b44a8e0a 100644 --- a/packages/js-api/CHANGELOG.md +++ b/packages/js-api/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/js +## 0.7.18 + +### Patch Changes + +- 177f6bb: Fixes an edge cases where variables used in form fields do not update in some cases + ## 0.7.17 ### Patch Changes diff --git a/packages/js-api/package.json b/packages/js-api/package.json index 7bfb27a6..a2b209dd 100644 --- a/packages/js-api/package.json +++ b/packages/js-api/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/js", - "version": "0.7.17", + "version": "0.7.18", "description": "The official Javascript SDK for Frigade.", "type": "module", "main": "./dist/index.js", diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 29acfc21..6412bb93 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,13 @@ # @frigade/react +## 2.5.20 + +### Patch Changes + +- 177f6bb: Fixes an edge cases where variables used in form fields do not update in some cases +- Updated dependencies [177f6bb] + - @frigade/js@0.7.18 + ## 2.5.19 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 778586e7..73e3a209 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.5.19", + "version": "2.5.20", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", @@ -50,7 +50,7 @@ "dependencies": { "@emotion/react": "^11.11.4", "@floating-ui/react": "^0.26.22", - "@frigade/js": "^0.7.17", + "@frigade/js": "^0.7.18", "@radix-ui/react-checkbox": "^1.1.1", "@radix-ui/react-collapsible": "^1.0.3", "@radix-ui/react-dialog": "^1.0.5", From f0de6a95112f9b95e41409f4b936b8b6f64f1ecf Mon Sep 17 00:00:00 2001 From: christianmat Date: Mon, 7 Oct 2024 17:02:38 -0700 Subject: [PATCH 016/213] fix: yarn install --- yarn.lock | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/yarn.lock b/yarn.lock index 3ff0cdc8..7dccf10b 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3721,7 +3721,7 @@ __metadata: languageName: node linkType: hard -"@frigade/js@npm:^0.7.17, @frigade/js@workspace:packages/js-api": +"@frigade/js@npm:^0.7.18, @frigade/js@workspace:packages/js-api": version: 0.0.0-use.local resolution: "@frigade/js@workspace:packages/js-api" dependencies: @@ -3755,7 +3755,7 @@ __metadata: dependencies: "@emotion/react": "npm:^11.11.4" "@floating-ui/react": "npm:^0.26.22" - "@frigade/js": "npm:^0.7.17" + "@frigade/js": "npm:^0.7.18" "@radix-ui/react-checkbox": "npm:^1.1.1" "@radix-ui/react-collapsible": "npm:^1.0.3" "@radix-ui/react-dialog": "npm:^1.0.5" From b2eac8d55cd2c2e1d7251653073d43617acd3c4f Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Tue, 8 Oct 2024 00:05:33 +0000 Subject: [PATCH 017/213] chore: run prepublish script --- packages/js-api/src/version.ts | 2 +- packages/react/src/version.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/js-api/src/version.ts b/packages/js-api/src/version.ts index 63e42e0d..e9a8f6da 100644 --- a/packages/js-api/src/version.ts +++ b/packages/js-api/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '0.7.17'; \ No newline at end of file +export const SDK_VERSION = '0.7.18'; \ No newline at end of file diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 7c1ba2d3..4e3ae314 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.5.19'; \ No newline at end of file +export const SDK_VERSION = '2.5.20'; \ No newline at end of file From 2982a193d2844d288aeb1c99580c29d65d8c48e3 Mon Sep 17 00:00:00 2001 From: christianmat Date: Tue, 8 Oct 2024 16:40:30 -0700 Subject: [PATCH 018/213] fix: variables with useflow hook --- .changeset/healthy-radios-talk.md | 6 ++++++ packages/js-api/src/core/flow.ts | 4 +++- packages/js-api/test/frigade.int.test.ts | 4 ++-- packages/react/src/hooks/useFlow.ts | 13 +++++++------ 4 files changed, 18 insertions(+), 9 deletions(-) create mode 100644 .changeset/healthy-radios-talk.md diff --git a/.changeset/healthy-radios-talk.md b/.changeset/healthy-radios-talk.md new file mode 100644 index 00000000..b6a645ec --- /dev/null +++ b/.changeset/healthy-radios-talk.md @@ -0,0 +1,6 @@ +--- +"@frigade/js": patch +"@frigade/react": patch +--- + +Fixes an issue where variables are sometimes not applied when using useFlow() with the same Flow ID in a component diff --git a/packages/js-api/src/core/flow.ts b/packages/js-api/src/core/flow.ts index 0814e9a2..490d5a11 100644 --- a/packages/js-api/src/core/flow.ts +++ b/packages/js-api/src/core/flow.ts @@ -345,7 +345,9 @@ export class Flow extends Fetchable { this.getGlobalState().variables[this.id] && Object.keys(this.getGlobalState().variables[this.id]).length > 0 ) { - this.applyVariablesInternal(this.getGlobalState().variables[this.id] ?? {}) + this.applyVariablesInternal(this.getGlobalState().variables[this.id]) + } else { + this.applyVariablesInternal({}) } } diff --git a/packages/js-api/test/frigade.int.test.ts b/packages/js-api/test/frigade.int.test.ts index 1147a515..a96393ca 100644 --- a/packages/js-api/test/frigade.int.test.ts +++ b/packages/js-api/test/frigade.int.test.ts @@ -413,8 +413,8 @@ describe('Basic Checklist integration test', () => { const flow = await frigade.getFlow(testFlowId) expect(flow).toBeDefined() expect(flow.getStepByIndex(0)).toBeDefined() - expect(flow.getStepByIndex(0).subtitle).toContain('${email}') - expect(flow.getStepByIndex(0).subtitle).toContain('${name}') + expect(flow.getStepByIndex(0).subtitle).not.toContain('${email}') + expect(flow.getStepByIndex(0).subtitle).not.toContain('${name}') const step = flow.steps.get(testFlowStepId) const customVariables = { name: 'John Doe', diff --git a/packages/react/src/hooks/useFlow.ts b/packages/react/src/hooks/useFlow.ts index 2d48a09c..490b0fae 100644 --- a/packages/react/src/hooks/useFlow.ts +++ b/packages/react/src/hooks/useFlow.ts @@ -1,5 +1,5 @@ import { type Flow } from '@frigade/js' -import { useCallback, useContext, useState, useSyncExternalStore } from 'react' +import { useCallback, useContext, useEffect, useState, useSyncExternalStore } from 'react' import { FrigadeContext } from '@/components/Provider' @@ -55,11 +55,12 @@ export function useFlow( () => frigade?.getFlowSync(flowId) ) - flow?.applyVariables({ - ...variables, - ...config?.variables, - }) - + useEffect(() => { + flow?.applyVariables({ + ...variables, + ...config?.variables, + }) + }, [config?.variables, flowId, variables]) return { flow, isLoading: frigade?.hasFailedToLoad() ? false : !flow, From b337afa2290c784939ead24da5ce3d2cdd7096d6 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Tue, 8 Oct 2024 16:50:40 -0700 Subject: [PATCH 019/213] Version Packages (#387) Co-authored-by: github-actions[bot] --- .changeset/healthy-radios-talk.md | 6 ------ packages/js-api/CHANGELOG.md | 6 ++++++ packages/js-api/package.json | 2 +- packages/react/CHANGELOG.md | 8 ++++++++ packages/react/package.json | 4 ++-- 5 files changed, 17 insertions(+), 9 deletions(-) delete mode 100644 .changeset/healthy-radios-talk.md diff --git a/.changeset/healthy-radios-talk.md b/.changeset/healthy-radios-talk.md deleted file mode 100644 index b6a645ec..00000000 --- a/.changeset/healthy-radios-talk.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -"@frigade/js": patch -"@frigade/react": patch ---- - -Fixes an issue where variables are sometimes not applied when using useFlow() with the same Flow ID in a component diff --git a/packages/js-api/CHANGELOG.md b/packages/js-api/CHANGELOG.md index b44a8e0a..1975104d 100644 --- a/packages/js-api/CHANGELOG.md +++ b/packages/js-api/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/js +## 0.7.19 + +### Patch Changes + +- 2982a19: Fixes an issue where variables are sometimes not applied when using useFlow() with the same Flow ID in a component + ## 0.7.18 ### Patch Changes diff --git a/packages/js-api/package.json b/packages/js-api/package.json index a2b209dd..19b4e6cb 100644 --- a/packages/js-api/package.json +++ b/packages/js-api/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/js", - "version": "0.7.18", + "version": "0.7.19", "description": "The official Javascript SDK for Frigade.", "type": "module", "main": "./dist/index.js", diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 6412bb93..3f83bd88 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,13 @@ # @frigade/react +## 2.5.21 + +### Patch Changes + +- 2982a19: Fixes an issue where variables are sometimes not applied when using useFlow() with the same Flow ID in a component +- Updated dependencies [2982a19] + - @frigade/js@0.7.19 + ## 2.5.20 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 73e3a209..1689e2f9 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.5.20", + "version": "2.5.21", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", @@ -50,7 +50,7 @@ "dependencies": { "@emotion/react": "^11.11.4", "@floating-ui/react": "^0.26.22", - "@frigade/js": "^0.7.18", + "@frigade/js": "^0.7.19", "@radix-ui/react-checkbox": "^1.1.1", "@radix-ui/react-collapsible": "^1.0.3", "@radix-ui/react-dialog": "^1.0.5", From d22b424c1cc34e697500eba148428048dcbf7a26 Mon Sep 17 00:00:00 2001 From: christianmat Date: Tue, 8 Oct 2024 16:52:28 -0700 Subject: [PATCH 020/213] fix: yarn install --- yarn.lock | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/yarn.lock b/yarn.lock index 7dccf10b..c4f14b8d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3721,7 +3721,7 @@ __metadata: languageName: node linkType: hard -"@frigade/js@npm:^0.7.18, @frigade/js@workspace:packages/js-api": +"@frigade/js@npm:^0.7.19, @frigade/js@workspace:packages/js-api": version: 0.0.0-use.local resolution: "@frigade/js@workspace:packages/js-api" dependencies: @@ -3755,7 +3755,7 @@ __metadata: dependencies: "@emotion/react": "npm:^11.11.4" "@floating-ui/react": "npm:^0.26.22" - "@frigade/js": "npm:^0.7.18" + "@frigade/js": "npm:^0.7.19" "@radix-ui/react-checkbox": "npm:^1.1.1" "@radix-ui/react-collapsible": "npm:^1.0.3" "@radix-ui/react-dialog": "npm:^1.0.5" From 3022788138a45af80fd34c9e292fa244a13c0f35 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Tue, 8 Oct 2024 23:55:21 +0000 Subject: [PATCH 021/213] chore: run prepublish script --- packages/js-api/src/version.ts | 2 +- packages/react/src/version.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/js-api/src/version.ts b/packages/js-api/src/version.ts index e9a8f6da..6d17bc1d 100644 --- a/packages/js-api/src/version.ts +++ b/packages/js-api/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '0.7.18'; \ No newline at end of file +export const SDK_VERSION = '0.7.19'; \ No newline at end of file diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 4e3ae314..3fd729df 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.5.20'; \ No newline at end of file +export const SDK_VERSION = '2.5.21'; \ No newline at end of file From 51b644478c67ecfaa7bcad25c42adaf0e89de3c7 Mon Sep 17 00:00:00 2001 From: christianmat Date: Tue, 8 Oct 2024 17:17:59 -0700 Subject: [PATCH 022/213] fix: merge variables on subsequent calls --- .changeset/ninety-rivers-dress.md | 6 ++++++ packages/js-api/src/core/flow.ts | 22 ++++++++-------------- packages/react/src/hooks/useFlow.ts | 1 + 3 files changed, 15 insertions(+), 14 deletions(-) create mode 100644 .changeset/ninety-rivers-dress.md diff --git a/.changeset/ninety-rivers-dress.md b/.changeset/ninety-rivers-dress.md new file mode 100644 index 00000000..b6a645ec --- /dev/null +++ b/.changeset/ninety-rivers-dress.md @@ -0,0 +1,6 @@ +--- +"@frigade/js": patch +"@frigade/react": patch +--- + +Fixes an issue where variables are sometimes not applied when using useFlow() with the same Flow ID in a component diff --git a/packages/js-api/src/core/flow.ts b/packages/js-api/src/core/flow.ts index 490d5a11..63c087dc 100644 --- a/packages/js-api/src/core/flow.ts +++ b/packages/js-api/src/core/flow.ts @@ -144,6 +144,8 @@ export class Flow extends Fetchable { if (this.getGlobalState().variables[this.id]) { this.applyVariablesInternal(this.getGlobalState().variables[this.id] ?? {}) + } else { + this.applyVariablesInternal({}) } } @@ -167,9 +169,6 @@ export class Flow extends Fetchable { */ private init() { const statefulFlow = this.getStatefulFlow() - - this.resyncState() - const newSteps = new Map() statefulFlow.data.steps.forEach((step, index) => { @@ -339,16 +338,8 @@ export class Flow extends Fetchable { newSteps.set(step.id, stepObj as FlowStep) }) this.steps = newSteps - // Check if empty object - if ( - this.getGlobalState().variables && - this.getGlobalState().variables[this.id] && - Object.keys(this.getGlobalState().variables[this.id]).length > 0 - ) { - this.applyVariablesInternal(this.getGlobalState().variables[this.id]) - } else { - this.applyVariablesInternal({}) - } + + this.resyncState() } /** @@ -595,7 +586,10 @@ export class Flow extends Fetchable { }) } - this.getGlobalState().variables[this.id] = variables + this.getGlobalState().variables[this.id] = { + ...this.getGlobalState().variables[this.id], + ...variables, + } if (resyncState) { this.resyncState() diff --git a/packages/react/src/hooks/useFlow.ts b/packages/react/src/hooks/useFlow.ts index 490b0fae..d4dcd1f6 100644 --- a/packages/react/src/hooks/useFlow.ts +++ b/packages/react/src/hooks/useFlow.ts @@ -61,6 +61,7 @@ export function useFlow( ...config?.variables, }) }, [config?.variables, flowId, variables]) + return { flow, isLoading: frigade?.hasFailedToLoad() ? false : !flow, From 05fe8d0af947eb5b07d92b2b48a61ef909ad01b7 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Tue, 8 Oct 2024 17:25:01 -0700 Subject: [PATCH 023/213] Version Packages (#388) Co-authored-by: github-actions[bot] --- .changeset/ninety-rivers-dress.md | 6 ------ packages/js-api/CHANGELOG.md | 6 ++++++ packages/js-api/package.json | 2 +- packages/react/CHANGELOG.md | 8 ++++++++ packages/react/package.json | 4 ++-- 5 files changed, 17 insertions(+), 9 deletions(-) delete mode 100644 .changeset/ninety-rivers-dress.md diff --git a/.changeset/ninety-rivers-dress.md b/.changeset/ninety-rivers-dress.md deleted file mode 100644 index b6a645ec..00000000 --- a/.changeset/ninety-rivers-dress.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -"@frigade/js": patch -"@frigade/react": patch ---- - -Fixes an issue where variables are sometimes not applied when using useFlow() with the same Flow ID in a component diff --git a/packages/js-api/CHANGELOG.md b/packages/js-api/CHANGELOG.md index 1975104d..70f62f1c 100644 --- a/packages/js-api/CHANGELOG.md +++ b/packages/js-api/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/js +## 0.7.20 + +### Patch Changes + +- 51b6444: Fixes an issue where variables are sometimes not applied when using useFlow() with the same Flow ID in a component + ## 0.7.19 ### Patch Changes diff --git a/packages/js-api/package.json b/packages/js-api/package.json index 19b4e6cb..7d69a9bc 100644 --- a/packages/js-api/package.json +++ b/packages/js-api/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/js", - "version": "0.7.19", + "version": "0.7.20", "description": "The official Javascript SDK for Frigade.", "type": "module", "main": "./dist/index.js", diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 3f83bd88..fced2f51 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,13 @@ # @frigade/react +## 2.5.22 + +### Patch Changes + +- 51b6444: Fixes an issue where variables are sometimes not applied when using useFlow() with the same Flow ID in a component +- Updated dependencies [51b6444] + - @frigade/js@0.7.20 + ## 2.5.21 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 1689e2f9..3ef26da6 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.5.21", + "version": "2.5.22", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", @@ -50,7 +50,7 @@ "dependencies": { "@emotion/react": "^11.11.4", "@floating-ui/react": "^0.26.22", - "@frigade/js": "^0.7.19", + "@frigade/js": "^0.7.20", "@radix-ui/react-checkbox": "^1.1.1", "@radix-ui/react-collapsible": "^1.0.3", "@radix-ui/react-dialog": "^1.0.5", From 21f3c93783458615263c3b70f1cfb7b0cdff368d Mon Sep 17 00:00:00 2001 From: christianmat Date: Tue, 8 Oct 2024 17:25:19 -0700 Subject: [PATCH 024/213] fix: yarn install --- yarn.lock | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/yarn.lock b/yarn.lock index c4f14b8d..60df2042 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3721,7 +3721,7 @@ __metadata: languageName: node linkType: hard -"@frigade/js@npm:^0.7.19, @frigade/js@workspace:packages/js-api": +"@frigade/js@npm:^0.7.20, @frigade/js@workspace:packages/js-api": version: 0.0.0-use.local resolution: "@frigade/js@workspace:packages/js-api" dependencies: @@ -3755,7 +3755,7 @@ __metadata: dependencies: "@emotion/react": "npm:^11.11.4" "@floating-ui/react": "npm:^0.26.22" - "@frigade/js": "npm:^0.7.19" + "@frigade/js": "npm:^0.7.20" "@radix-ui/react-checkbox": "npm:^1.1.1" "@radix-ui/react-collapsible": "npm:^1.0.3" "@radix-ui/react-dialog": "npm:^1.0.5" From 5132fdf20bb3b8f0843ab791962d3982c011b746 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Wed, 9 Oct 2024 00:28:11 +0000 Subject: [PATCH 025/213] chore: run prepublish script --- packages/js-api/src/version.ts | 2 +- packages/react/src/version.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/js-api/src/version.ts b/packages/js-api/src/version.ts index 6d17bc1d..23923b46 100644 --- a/packages/js-api/src/version.ts +++ b/packages/js-api/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '0.7.19'; \ No newline at end of file +export const SDK_VERSION = '0.7.20'; \ No newline at end of file diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 3fd729df..6bd0a3ca 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.5.21'; \ No newline at end of file +export const SDK_VERSION = '2.5.22'; \ No newline at end of file From 7d96719d4e1f0579de3184e3e6adbddbdd671d6f Mon Sep 17 00:00:00 2001 From: christianmat Date: Wed, 9 Oct 2024 15:23:19 -0700 Subject: [PATCH 026/213] fix: premature form finishing edge case; add additional integration tests of forms --- .changeset/brown-cows-divide.md | 6 ++++ apps/smithy/src/stories/Form/Form.stories.tsx | 1 + .../Form/FormInteractionTests.stories.tsx | 35 +++++++++++++++++++ packages/js-api/src/core/flow.ts | 2 +- .../react/src/components/Form/FormStep.tsx | 4 +++ packages/react/src/hooks/useFlowHandlers.ts | 2 +- 6 files changed, 48 insertions(+), 2 deletions(-) create mode 100644 .changeset/brown-cows-divide.md diff --git a/.changeset/brown-cows-divide.md b/.changeset/brown-cows-divide.md new file mode 100644 index 00000000..9e501cb0 --- /dev/null +++ b/.changeset/brown-cows-divide.md @@ -0,0 +1,6 @@ +--- +"@frigade/js": patch +"@frigade/react": patch +--- + +Fixes a minor bug where multiple flow back and forth navigations can result in a 2 page form to finish prematurely diff --git a/apps/smithy/src/stories/Form/Form.stories.tsx b/apps/smithy/src/stories/Form/Form.stories.tsx index 4162a83e..9645e61a 100644 --- a/apps/smithy/src/stories/Form/Form.stories.tsx +++ b/apps/smithy/src/stories/Form/Form.stories.tsx @@ -84,6 +84,7 @@ export const CustomForm = { console.log("Secondary"); return true; }, + onComplete: (e, properties) => console.log("Complete", e, properties), }, }; diff --git a/apps/smithy/src/stories/Form/FormInteractionTests.stories.tsx b/apps/smithy/src/stories/Form/FormInteractionTests.stories.tsx index 8e0be290..6735a908 100644 --- a/apps/smithy/src/stories/Form/FormInteractionTests.stories.tsx +++ b/apps/smithy/src/stories/Form/FormInteractionTests.stories.tsx @@ -74,6 +74,41 @@ export const InteractionTests: FormStory = { await expect(document.querySelector(".fr-form")).not.toBeInTheDocument(); await userEvent.click(canvas.getByText("Reset Flow")); await sleep(1000); + await userEvent.click(canvas.getByText("Reset Flow")); + await sleep(1000); }); + + // test navigating back and forth 3 times between step 1 and 2 + await step( + "Test navigating back and forth 3 times between step 1 and 2", + async () => { + const canvas = within(document.body); + + for (let i = 0; i < 3; i++) { + await canvas.findByText("This is page 1"); + await userEvent.click(canvas.getByText("Continue to page 2")); + await userEvent.click(canvas.getByText("Next")); + await canvas.findByText("This is page 2"); + await userEvent.click(canvas.getByText("Back")); + } + + // now finish the flow + await canvas.findByText("This is page 1"); + await userEvent.click(canvas.getByText("Continue to page 2")); + await userEvent.click(canvas.getByText("Next")); + await canvas.findByText("This is page 2"); + await userEvent.click(canvas.getByText("Next")); + await canvas.findByText("This is page 3"); + await userEvent.click(canvas.getByText("Radio 1")); + await userEvent.click(canvas.getByText("Finish")); + await sleep(500); + await expect( + document.querySelector(".fr-form") + ).not.toBeInTheDocument(); + + await userEvent.click(canvas.getByText("Reset Flow")); + await sleep(1000); + } + ); }, }; diff --git a/packages/js-api/src/core/flow.ts b/packages/js-api/src/core/flow.ts index 63c087dc..e128538c 100644 --- a/packages/js-api/src/core/flow.ts +++ b/packages/js-api/src/core/flow.ts @@ -232,7 +232,7 @@ export class Flow extends Fetchable { const isLastIncompleteStep = Array.from(this.steps.values()).filter( (step) => step.$state.visible && !step.$state.completed && !step.$state.skipped - ).length === 1 + ).length === 1 && isLastStep if (optimistic) { const copy = clone(this.getGlobalState().flowStates[this.id]) diff --git a/packages/react/src/components/Form/FormStep.tsx b/packages/react/src/components/Form/FormStep.tsx index a9fbecc1..4b28212e 100644 --- a/packages/react/src/components/Form/FormStep.tsx +++ b/packages/react/src/components/Form/FormStep.tsx @@ -94,6 +94,10 @@ export function FormStep({ } }, [fieldDatas]) + useEffect(() => { + formContext.trigger() + }, [step.id]) + const [isSubmitting, setIsSubmitting] = useState(false) const fields = [] diff --git a/packages/react/src/hooks/useFlowHandlers.ts b/packages/react/src/hooks/useFlowHandlers.ts index 91ccb847..29aab589 100644 --- a/packages/react/src/hooks/useFlowHandlers.ts +++ b/packages/react/src/hooks/useFlowHandlers.ts @@ -32,12 +32,12 @@ export function useFlowHandlers(flow: Flow, { onComplete, onDismiss }: FlowHandl async function callHandler() { if (flow.isCompleted && lastCompleted.current === false) { + lastCompleted.current = true await onComplete?.(flow) } } callHandler() - lastCompleted.current = flow?.isCompleted return () => { callHandler() From 1144f7a7b239eb7c2ecf0d26814b63926b56ba5e Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Wed, 9 Oct 2024 15:32:57 -0700 Subject: [PATCH 027/213] Version Packages (#389) Co-authored-by: github-actions[bot] --- .changeset/brown-cows-divide.md | 6 ------ packages/js-api/CHANGELOG.md | 6 ++++++ packages/js-api/package.json | 2 +- packages/react/CHANGELOG.md | 8 ++++++++ packages/react/package.json | 4 ++-- 5 files changed, 17 insertions(+), 9 deletions(-) delete mode 100644 .changeset/brown-cows-divide.md diff --git a/.changeset/brown-cows-divide.md b/.changeset/brown-cows-divide.md deleted file mode 100644 index 9e501cb0..00000000 --- a/.changeset/brown-cows-divide.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -"@frigade/js": patch -"@frigade/react": patch ---- - -Fixes a minor bug where multiple flow back and forth navigations can result in a 2 page form to finish prematurely diff --git a/packages/js-api/CHANGELOG.md b/packages/js-api/CHANGELOG.md index 70f62f1c..bb960515 100644 --- a/packages/js-api/CHANGELOG.md +++ b/packages/js-api/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/js +## 0.7.21 + +### Patch Changes + +- 7d96719: Fixes a minor bug where multiple flow back and forth navigations can result in a 2 page form to finish prematurely + ## 0.7.20 ### Patch Changes diff --git a/packages/js-api/package.json b/packages/js-api/package.json index 7d69a9bc..df602801 100644 --- a/packages/js-api/package.json +++ b/packages/js-api/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/js", - "version": "0.7.20", + "version": "0.7.21", "description": "The official Javascript SDK for Frigade.", "type": "module", "main": "./dist/index.js", diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index fced2f51..1a3ce53e 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,13 @@ # @frigade/react +## 2.5.23 + +### Patch Changes + +- 7d96719: Fixes a minor bug where multiple flow back and forth navigations can result in a 2 page form to finish prematurely +- Updated dependencies [7d96719] + - @frigade/js@0.7.21 + ## 2.5.22 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 3ef26da6..c3df8dad 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.5.22", + "version": "2.5.23", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", @@ -50,7 +50,7 @@ "dependencies": { "@emotion/react": "^11.11.4", "@floating-ui/react": "^0.26.22", - "@frigade/js": "^0.7.20", + "@frigade/js": "^0.7.21", "@radix-ui/react-checkbox": "^1.1.1", "@radix-ui/react-collapsible": "^1.0.3", "@radix-ui/react-dialog": "^1.0.5", From b16691605678ceb8a539ff3b9be41582268d0084 Mon Sep 17 00:00:00 2001 From: christianmat Date: Wed, 9 Oct 2024 15:33:25 -0700 Subject: [PATCH 028/213] fix: yarn install --- yarn.lock | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/yarn.lock b/yarn.lock index 60df2042..050538de 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3721,7 +3721,7 @@ __metadata: languageName: node linkType: hard -"@frigade/js@npm:^0.7.20, @frigade/js@workspace:packages/js-api": +"@frigade/js@npm:^0.7.21, @frigade/js@workspace:packages/js-api": version: 0.0.0-use.local resolution: "@frigade/js@workspace:packages/js-api" dependencies: @@ -3755,7 +3755,7 @@ __metadata: dependencies: "@emotion/react": "npm:^11.11.4" "@floating-ui/react": "npm:^0.26.22" - "@frigade/js": "npm:^0.7.20" + "@frigade/js": "npm:^0.7.21" "@radix-ui/react-checkbox": "npm:^1.1.1" "@radix-ui/react-collapsible": "npm:^1.0.3" "@radix-ui/react-dialog": "npm:^1.0.5" From 0e2df128a149fb01ab9c61cb41466ffbb2b79cfe Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Wed, 9 Oct 2024 22:36:38 +0000 Subject: [PATCH 029/213] chore: run prepublish script --- packages/js-api/src/version.ts | 2 +- packages/react/src/version.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/js-api/src/version.ts b/packages/js-api/src/version.ts index 23923b46..3b30fa8a 100644 --- a/packages/js-api/src/version.ts +++ b/packages/js-api/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '0.7.20'; \ No newline at end of file +export const SDK_VERSION = '0.7.21'; \ No newline at end of file diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 6bd0a3ca..b0955d10 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.5.22'; \ No newline at end of file +export const SDK_VERSION = '2.5.23'; \ No newline at end of file From 595957bc6b011a4fa6ebcfc99db3515141422119 Mon Sep 17 00:00:00 2001 From: christianmat Date: Wed, 9 Oct 2024 16:47:51 -0700 Subject: [PATCH 030/213] fix: check isDirty before triggering errors --- .changeset/lazy-starfishes-know.md | 5 +++++ packages/react/src/components/Form/FormStep.tsx | 8 +++++++- 2 files changed, 12 insertions(+), 1 deletion(-) create mode 100644 .changeset/lazy-starfishes-know.md diff --git a/.changeset/lazy-starfishes-know.md b/.changeset/lazy-starfishes-know.md new file mode 100644 index 00000000..965d1b6b --- /dev/null +++ b/.changeset/lazy-starfishes-know.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": patch +--- + +Fixes an issue where form state triggers on step change even if no fields are dirty diff --git a/packages/react/src/components/Form/FormStep.tsx b/packages/react/src/components/Form/FormStep.tsx index 4b28212e..666e128e 100644 --- a/packages/react/src/components/Form/FormStep.tsx +++ b/packages/react/src/components/Form/FormStep.tsx @@ -95,7 +95,13 @@ export function FormStep({ }, [fieldDatas]) useEffect(() => { - formContext.trigger() + if ( + Object.keys(formContext.formState.dirtyFields).some((field) => + fieldDatas.some((data) => data.id === field) + ) + ) { + formContext.trigger() + } }, [step.id]) const [isSubmitting, setIsSubmitting] = useState(false) From f842cee8766791c91ccec5e04962c74859d2d1a9 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Wed, 9 Oct 2024 16:58:02 -0700 Subject: [PATCH 031/213] Version Packages (#390) Co-authored-by: github-actions[bot] --- .changeset/lazy-starfishes-know.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/lazy-starfishes-know.md diff --git a/.changeset/lazy-starfishes-know.md b/.changeset/lazy-starfishes-know.md deleted file mode 100644 index 965d1b6b..00000000 --- a/.changeset/lazy-starfishes-know.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": patch ---- - -Fixes an issue where form state triggers on step change even if no fields are dirty diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 1a3ce53e..d4a26853 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/react +## 2.5.24 + +### Patch Changes + +- 595957b: Fixes an issue where form state triggers on step change even if no fields are dirty + ## 2.5.23 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index c3df8dad..5c261c4d 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.5.23", + "version": "2.5.24", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From c2ed1741825871ad29e315be39a1ebe6b2be66b6 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Thu, 10 Oct 2024 00:00:41 +0000 Subject: [PATCH 032/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index b0955d10..d8957096 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.5.23'; \ No newline at end of file +export const SDK_VERSION = '2.5.24'; \ No newline at end of file From db3984456cc7902ea783007da11fda4cc01ee4a3 Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Thu, 10 Oct 2024 11:30:23 -0700 Subject: [PATCH 033/213] Fix dismissible prop in Tour --- apps/smithy/src/stories/Tour/Tour.stories.tsx | 2 +- packages/react/src/components/Tour/Tour.tsx | 3 ++- 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/apps/smithy/src/stories/Tour/Tour.stories.tsx b/apps/smithy/src/stories/Tour/Tour.stories.tsx index 4388fb6e..c6d1d6bb 100644 --- a/apps/smithy/src/stories/Tour/Tour.stories.tsx +++ b/apps/smithy/src/stories/Tour/Tour.stories.tsx @@ -10,7 +10,7 @@ export default { export const Default = { args: { align: "after", - dismissible: false, + dismissible: true, defaultOpen: true, flowId: "flow_U63A5pndRrvCwxNs", modal: false, diff --git a/packages/react/src/components/Tour/Tour.tsx b/packages/react/src/components/Tour/Tour.tsx index 5c852ddc..1f6f128e 100644 --- a/packages/react/src/components/Tour/Tour.tsx +++ b/packages/react/src/components/Tour/Tour.tsx @@ -81,7 +81,6 @@ export function Tour({ as, flowId, ...props }: TourProps) { autoScroll = false, container = 'body', defaultOpen, - dismissible = false, modal, part, sequential = true, @@ -92,6 +91,8 @@ export function Tour({ as, flowId, ...props }: TourProps) { ...containerProps } = parentProps.containerProps as Partial + const { dismissible } = parentProps + const sequentialStepProps = { align, alignOffset, From 1eef79d5dbb2c35851db129d32d7d16a074d00ee Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Thu, 10 Oct 2024 11:31:08 -0700 Subject: [PATCH 034/213] Changeset --- .changeset/tame-ears-bathe.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/tame-ears-bathe.md diff --git a/.changeset/tame-ears-bathe.md b/.changeset/tame-ears-bathe.md new file mode 100644 index 00000000..c9269033 --- /dev/null +++ b/.changeset/tame-ears-bathe.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": patch +--- + +Fix dismissible prop in Tour From 962671c7b91a8c17f5301550aa975a13c6c3701c Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Thu, 10 Oct 2024 12:24:14 -0700 Subject: [PATCH 035/213] Partially de-flake Form tests --- .../Form/FormInteractionTests.stories.tsx | 34 ++++++++++++++----- 1 file changed, 25 insertions(+), 9 deletions(-) diff --git a/apps/smithy/src/stories/Form/FormInteractionTests.stories.tsx b/apps/smithy/src/stories/Form/FormInteractionTests.stories.tsx index 6735a908..ea6bfd68 100644 --- a/apps/smithy/src/stories/Form/FormInteractionTests.stories.tsx +++ b/apps/smithy/src/stories/Form/FormInteractionTests.stories.tsx @@ -1,6 +1,6 @@ import { Form, useFlow } from "@frigade/react"; import { type Meta, type StoryObj } from "@storybook/react"; -import { expect, userEvent, within } from "@storybook/test"; +import { expect, userEvent, waitFor, within } from "@storybook/test"; type FormStory = StoryObj; @@ -44,19 +44,35 @@ export const InteractionTests: FormStory = { play: async ({ step }) => { await step("Test linear flow of Form", async () => { const canvas = within(document.body); - await sleep(500); + await canvas.findByText("This is page 1"); await userEvent.click(canvas.getByText("Continue to page 2")); await userEvent.click(canvas.getByText("Next")); + await canvas.findByText("This is page 2"); await userEvent.click(canvas.getByText("Next")); + await canvas.findByText("This is page 3"); - await sleep(100); - await expect(canvas.getByText("Finish").closest("button")).toBeDisabled(); + + const finishButton = await canvas.findByRole("button", { + name: "Finish", + }); + + await waitFor(async () => { + await expect(finishButton).toBeDisabled(); + }); + await userEvent.click(canvas.getByText("Radio 1")); - await userEvent.click(canvas.getByText("Finish")); - await sleep(500); - await expect(document.querySelector(".fr-form")).not.toBeInTheDocument(); + await userEvent.click(finishButton); + + await waitFor(async () => { + await expect( + document.querySelector(".fr-form") + ).not.toBeInTheDocument(); + }); + + await sleep(1000); + await userEvent.click(canvas.getByText("Reset Flow")); await sleep(1000); }); @@ -85,10 +101,10 @@ export const InteractionTests: FormStory = { const canvas = within(document.body); for (let i = 0; i < 3; i++) { - await canvas.findByText("This is page 1"); + await canvas.findByText("This is page 1", {}, { timeout: 5000 }); await userEvent.click(canvas.getByText("Continue to page 2")); await userEvent.click(canvas.getByText("Next")); - await canvas.findByText("This is page 2"); + await canvas.findByText("This is page 2", {}, { timeout: 5000 }); await userEvent.click(canvas.getByText("Back")); } From e9053ec5ccb362e4303c3941ed35077bf127b041 Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Thu, 10 Oct 2024 12:26:37 -0700 Subject: [PATCH 036/213] Changeset --- .changeset/smart-otters-admire.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/smart-otters-admire.md diff --git a/.changeset/smart-otters-admire.md b/.changeset/smart-otters-admire.md new file mode 100644 index 00000000..78101516 --- /dev/null +++ b/.changeset/smart-otters-admire.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": patch +--- + +Partially de-flake Form tests From 4651bf9d22f021153b95ae2e0fc194cea8c8d91e Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Thu, 10 Oct 2024 13:41:52 -0700 Subject: [PATCH 037/213] Version Packages (#391) Co-authored-by: github-actions[bot] --- .changeset/smart-otters-admire.md | 5 ----- .changeset/tame-ears-bathe.md | 5 ----- packages/react/CHANGELOG.md | 7 +++++++ packages/react/package.json | 2 +- 4 files changed, 8 insertions(+), 11 deletions(-) delete mode 100644 .changeset/smart-otters-admire.md delete mode 100644 .changeset/tame-ears-bathe.md diff --git a/.changeset/smart-otters-admire.md b/.changeset/smart-otters-admire.md deleted file mode 100644 index 78101516..00000000 --- a/.changeset/smart-otters-admire.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": patch ---- - -Partially de-flake Form tests diff --git a/.changeset/tame-ears-bathe.md b/.changeset/tame-ears-bathe.md deleted file mode 100644 index c9269033..00000000 --- a/.changeset/tame-ears-bathe.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": patch ---- - -Fix dismissible prop in Tour diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index d4a26853..abfc5495 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,12 @@ # @frigade/react +## 2.5.25 + +### Patch Changes + +- e9053ec: Partially de-flake Form tests +- 1eef79d: Fix dismissible prop in Tour + ## 2.5.24 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 5c261c4d..ab150b6e 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.5.24", + "version": "2.5.25", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From 2857e3aac1afc9be31d570e6cd334da074a7a571 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Thu, 10 Oct 2024 20:44:26 +0000 Subject: [PATCH 038/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index d8957096..0f5aaa3e 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.5.24'; \ No newline at end of file +export const SDK_VERSION = '2.5.25'; \ No newline at end of file From 6abafc86221b66f84e185dcf2ed1381caca23324 Mon Sep 17 00:00:00 2001 From: christianmat Date: Mon, 14 Oct 2024 11:09:21 -0700 Subject: [PATCH 039/213] docs: add more docs to container prop --- packages/react/src/components/Tour/Tour.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/react/src/components/Tour/Tour.tsx b/packages/react/src/components/Tour/Tour.tsx index 1f6f128e..3da3cdfd 100644 --- a/packages/react/src/components/Tour/Tour.tsx +++ b/packages/react/src/components/Tour/Tour.tsx @@ -19,7 +19,8 @@ export interface TourProps extends FlowPropsWithoutChildren, Omit Date: Mon, 14 Oct 2024 11:11:14 -0700 Subject: [PATCH 040/213] docs: ignore internal method --- packages/js-api/src/core/flow.ts | 3 +++ 1 file changed, 3 insertions(+) diff --git a/packages/js-api/src/core/flow.ts b/packages/js-api/src/core/flow.ts index e128538c..bc03e3ab 100644 --- a/packages/js-api/src/core/flow.ts +++ b/packages/js-api/src/core/flow.ts @@ -536,6 +536,9 @@ export class Flow extends Fetchable { this.applyVariablesInternal(variables, true) } + /** + * @ignore + */ private applyVariablesInternal(variables: Record, resyncState: boolean = false) { // Replace ${variable} with the value of the variable const replaceVariables = (str: string) => { From e8de2d966e88c9c88238cf69c67cbfe339f1559d Mon Sep 17 00:00:00 2001 From: christianmat Date: Mon, 28 Oct 2024 22:15:49 -0700 Subject: [PATCH 041/213] fix: add try catch to local storage --- .changeset/odd-lies-wave.md | 6 ++++++ packages/js-api/src/shared/utils.ts | 13 +++++++++++-- 2 files changed, 17 insertions(+), 2 deletions(-) create mode 100644 .changeset/odd-lies-wave.md diff --git a/.changeset/odd-lies-wave.md b/.changeset/odd-lies-wave.md new file mode 100644 index 00000000..0b0e7930 --- /dev/null +++ b/.changeset/odd-lies-wave.md @@ -0,0 +1,6 @@ +--- +"@frigade/js": patch +"@frigade/react": patch +--- + +Adds a `try/catch` to localStorage getter/setter diff --git a/packages/js-api/src/shared/utils.ts b/packages/js-api/src/shared/utils.ts index ee8a43af..2a2763d1 100644 --- a/packages/js-api/src/shared/utils.ts +++ b/packages/js-api/src/shared/utils.ts @@ -43,14 +43,23 @@ export function getHeaders(config: FrigadeConfig) { function getLocalStorage(key: string) { if (isWeb()) { - return window.localStorage.getItem(`${LOCAL_STORAGE_PREFIX}${key}`) + try { + return window.localStorage.getItem(`${LOCAL_STORAGE_PREFIX}${key}`) + } catch (e) { + console.debug('Error getting localStorage:', e) + return null + } } return null } function setLocalStorage(key: string, value: string) { if (isWeb()) { - window.localStorage.setItem(`${LOCAL_STORAGE_PREFIX}${key}`, value) + try { + window.localStorage.setItem(`${LOCAL_STORAGE_PREFIX}${key}`, value) + } catch (e) { + console.debug('Error setting localStorage:', e) + } } } From 75b8dce6873ea6714d5cedb86aa926b7f63fe7f5 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Mon, 28 Oct 2024 22:19:41 -0700 Subject: [PATCH 042/213] Version Packages (#392) Co-authored-by: github-actions[bot] --- .changeset/odd-lies-wave.md | 6 ------ packages/js-api/CHANGELOG.md | 6 ++++++ packages/js-api/package.json | 2 +- packages/react/CHANGELOG.md | 8 ++++++++ packages/react/package.json | 4 ++-- 5 files changed, 17 insertions(+), 9 deletions(-) delete mode 100644 .changeset/odd-lies-wave.md diff --git a/.changeset/odd-lies-wave.md b/.changeset/odd-lies-wave.md deleted file mode 100644 index 0b0e7930..00000000 --- a/.changeset/odd-lies-wave.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -"@frigade/js": patch -"@frigade/react": patch ---- - -Adds a `try/catch` to localStorage getter/setter diff --git a/packages/js-api/CHANGELOG.md b/packages/js-api/CHANGELOG.md index bb960515..f509bf40 100644 --- a/packages/js-api/CHANGELOG.md +++ b/packages/js-api/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/js +## 0.7.22 + +### Patch Changes + +- e8de2d9: Adds a `try/catch` to localStorage getter/setter + ## 0.7.21 ### Patch Changes diff --git a/packages/js-api/package.json b/packages/js-api/package.json index df602801..3157189c 100644 --- a/packages/js-api/package.json +++ b/packages/js-api/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/js", - "version": "0.7.21", + "version": "0.7.22", "description": "The official Javascript SDK for Frigade.", "type": "module", "main": "./dist/index.js", diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index abfc5495..12ed0367 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,13 @@ # @frigade/react +## 2.5.26 + +### Patch Changes + +- e8de2d9: Adds a `try/catch` to localStorage getter/setter +- Updated dependencies [e8de2d9] + - @frigade/js@0.7.22 + ## 2.5.25 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index ab150b6e..9f9772ae 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.5.25", + "version": "2.5.26", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", @@ -50,7 +50,7 @@ "dependencies": { "@emotion/react": "^11.11.4", "@floating-ui/react": "^0.26.22", - "@frigade/js": "^0.7.21", + "@frigade/js": "^0.7.22", "@radix-ui/react-checkbox": "^1.1.1", "@radix-ui/react-collapsible": "^1.0.3", "@radix-ui/react-dialog": "^1.0.5", From c5fb529b4bab3a40185b3fe61bd5b7f27e8435a7 Mon Sep 17 00:00:00 2001 From: christianmat Date: Mon, 28 Oct 2024 22:25:14 -0700 Subject: [PATCH 043/213] fix: yarn install --- yarn.lock | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/yarn.lock b/yarn.lock index 050538de..e9930191 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3721,7 +3721,7 @@ __metadata: languageName: node linkType: hard -"@frigade/js@npm:^0.7.21, @frigade/js@workspace:packages/js-api": +"@frigade/js@npm:^0.7.22, @frigade/js@workspace:packages/js-api": version: 0.0.0-use.local resolution: "@frigade/js@workspace:packages/js-api" dependencies: @@ -3755,7 +3755,7 @@ __metadata: dependencies: "@emotion/react": "npm:^11.11.4" "@floating-ui/react": "npm:^0.26.22" - "@frigade/js": "npm:^0.7.21" + "@frigade/js": "npm:^0.7.22" "@radix-ui/react-checkbox": "npm:^1.1.1" "@radix-ui/react-collapsible": "npm:^1.0.3" "@radix-ui/react-dialog": "npm:^1.0.5" From 83d814cd7cb6c31b5751e5a33d45ff5fb225bfae Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Tue, 29 Oct 2024 05:27:53 +0000 Subject: [PATCH 044/213] chore: run prepublish script --- packages/js-api/src/version.ts | 2 +- packages/react/src/version.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/js-api/src/version.ts b/packages/js-api/src/version.ts index 3b30fa8a..beffbcf3 100644 --- a/packages/js-api/src/version.ts +++ b/packages/js-api/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '0.7.21'; \ No newline at end of file +export const SDK_VERSION = '0.7.22'; \ No newline at end of file diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 0f5aaa3e..909c5013 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.5.25'; \ No newline at end of file +export const SDK_VERSION = '2.5.26'; \ No newline at end of file From 2ca159e3ac44e088517dbc2b9b5d0d84e96bd58f Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Fri, 1 Nov 2024 16:07:13 -0700 Subject: [PATCH 045/213] Allow video HTML props to be passed into Tour --- packages/react/src/components/Media/Media.tsx | 6 +-- packages/react/src/components/Media/Video.tsx | 52 ++++++++++++++++--- .../src/components/Media/videoPropNames.ts | 14 +++++ .../react/src/components/Tour/TourStep.tsx | 16 +++++- 4 files changed, 77 insertions(+), 11 deletions(-) create mode 100644 packages/react/src/components/Media/videoPropNames.ts diff --git a/packages/react/src/components/Media/Media.tsx b/packages/react/src/components/Media/Media.tsx index f23ae7a8..820839fb 100644 --- a/packages/react/src/components/Media/Media.tsx +++ b/packages/react/src/components/Media/Media.tsx @@ -1,9 +1,7 @@ import { Image } from './Image' -import { Video } from './Video' -import { BoxProps } from '@/components/Box' +import { Video, type VideoProps } from './Video' -export interface MediaProps extends BoxProps { - src: string +export interface MediaProps extends VideoProps { type?: 'image' | 'video' } diff --git a/packages/react/src/components/Media/Video.tsx b/packages/react/src/components/Media/Video.tsx index 9d63cf49..7d10ec88 100644 --- a/packages/react/src/components/Media/Video.tsx +++ b/packages/react/src/components/Media/Video.tsx @@ -1,5 +1,8 @@ +import * as React from 'react' import { Box, BoxProps } from '@/components/Box' +import { VIDEO_PROP_NAMES } from '@/components/Media/videoPropNames' + function getVideoEmbedSrc(videoUri: string) { if (videoUri.includes('youtube')) { const videoId = videoUri.split('v=')[1]?.split('&')[0] @@ -26,17 +29,54 @@ function getVideoEmbedSrc(videoUri: string) { return null } -export interface VideoProps extends BoxProps { - src: string -} +export type VideoPropName = (typeof VIDEO_PROP_NAMES)[number] + +export interface VideoProps + extends BoxProps, + Pick, VideoPropName> {} -export function Video({ part, src, ...props }: VideoProps) { +export function Video({ + autoPlay, + controls, + controlsList, + crossOrigin, + disablePictureInPicture, + disableRemotePlayback, + loop, + muted, + playsInline, + poster, + preload, + part, + src, + ...props +}: VideoProps) { const videoEmbedSrc = getVideoEmbedSrc(src) if (!videoEmbedSrc) { // Check if it's a url that ends in .mp4 if (src?.endsWith('.mp4')) { - return + return ( + + ) } console.error( @@ -47,7 +87,7 @@ export function Video({ part, src, ...props }: VideoProps) { return ( name === propName)) { + mediaProps[propName] = propValue + } else { + hintProps[propName] = propValue + } + } + const primaryButtonTitle = step.primaryButton?.title ?? step.primaryButtonTitle const secondaryButtonTitle = step.secondaryButton?.title ?? step.secondaryButtonTitle const disabled = !!step.$state.blocked @@ -64,7 +77,7 @@ export function TourStep({ side={side} sideOffset={sideOffset} spotlight={spotlight} - {...props} + {...hintProps} > Date: Fri, 1 Nov 2024 16:08:49 -0700 Subject: [PATCH 046/213] Changeset --- .changeset/breezy-lions-glow.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/breezy-lions-glow.md diff --git a/.changeset/breezy-lions-glow.md b/.changeset/breezy-lions-glow.md new file mode 100644 index 00000000..4b354183 --- /dev/null +++ b/.changeset/breezy-lions-glow.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": patch +--- + +Allow video HTML props to be passed into Tour From 0336946a6924d1a5f7e0d1a7d614be124050cd72 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Fri, 1 Nov 2024 16:23:29 -0700 Subject: [PATCH 047/213] Version Packages (#393) Co-authored-by: github-actions[bot] --- .changeset/breezy-lions-glow.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/breezy-lions-glow.md diff --git a/.changeset/breezy-lions-glow.md b/.changeset/breezy-lions-glow.md deleted file mode 100644 index 4b354183..00000000 --- a/.changeset/breezy-lions-glow.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": patch ---- - -Allow video HTML props to be passed into Tour diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 12ed0367..a388675b 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/react +## 2.5.27 + +### Patch Changes + +- 76343a0: Allow video HTML props to be passed into Tour + ## 2.5.26 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 9f9772ae..45f3ec97 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.5.26", + "version": "2.5.27", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From 5e246a9eeb5a91cffc08ec4ad776ed934773b4fe Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Fri, 1 Nov 2024 23:25:57 +0000 Subject: [PATCH 048/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 909c5013..74adc60a 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.5.26'; \ No newline at end of file +export const SDK_VERSION = '2.5.27'; \ No newline at end of file From c4345428dd824ef9cac8a80550304ce6f8ba52cf Mon Sep 17 00:00:00 2001 From: christianmat Date: Mon, 4 Nov 2024 12:27:53 -0800 Subject: [PATCH 049/213] fix: wrap remaining functions in useCallback --- packages/reactv1/src/api/flows.ts | 190 +++++++++++++++++------------- 1 file changed, 107 insertions(+), 83 deletions(-) diff --git a/packages/reactv1/src/api/flows.ts b/packages/reactv1/src/api/flows.ts index 068ec165..720ff892 100644 --- a/packages/reactv1/src/api/flows.ts +++ b/packages/reactv1/src/api/flows.ts @@ -529,36 +529,43 @@ export function useFlows() { return true } + const getStepStatus = useCallback( + (flowId: string, stepId: string): StepActionType | null => { + const maybeFlowResponse = getStepStateForFlow(flowId, stepId) - function getStepStatus(flowId: string, stepId: string): StepActionType | null { - const maybeFlowResponse = getStepStateForFlow(flowId, stepId) - - if (isLoadingUserFlowStateData) { - return null - } - - return (maybeFlowResponse ? maybeFlowResponse.actionType : NOT_STARTED_STEP) as StepActionType - } + if (isLoadingUserFlowStateData) { + return null + } - function isStepBlocked(flowId: string, stepId: string): boolean { - const maybeFlowResponse = getStepStateForFlow(flowId, stepId) + return (maybeFlowResponse ? maybeFlowResponse.actionType : NOT_STARTED_STEP) as StepActionType + }, + [userFlowStatesData, isLoadingUserFlowStateData] + ) + const isStepBlocked = useCallback( + (flowId: string, stepId: string): boolean => { + const maybeFlowResponse = getStepStateForFlow(flowId, stepId) - if (!maybeFlowResponse) { - return false - } + if (!maybeFlowResponse) { + return false + } - return maybeFlowResponse.blocked - } + return maybeFlowResponse.blocked + }, + [userFlowStatesData, isLoadingUserFlowStateData] + ) - function isStepHidden(flowId: string, stepId: string): boolean { - const maybeFlowResponse = getStepStateForFlow(flowId, stepId) + const isStepHidden = useCallback( + (flowId: string, stepId: string): boolean => { + const maybeFlowResponse = getStepStateForFlow(flowId, stepId) - if (!maybeFlowResponse) { - return false - } + if (!maybeFlowResponse) { + return false + } - return maybeFlowResponse.hidden - } + return maybeFlowResponse.hidden + }, + [userFlowStatesData, isLoadingUserFlowStateData] + ) function getStepStateForFlow(flowId: string, stepId: string): FlowResponse | null { if (isLoadingUserFlowStateData) { @@ -615,79 +622,96 @@ export function useFlows() { return total === 0 ? undefined : completed / total } - function getFlowStatus(flowId: string) { - const userFlowState = userFlowStatesData?.find((f) => f.flowId === flowId) - if (!userFlowState) { - return null - } - return userFlowState.flowState - } - - function getNumberOfStepsCompleted(flowId: string): number { - const steps = getFlowSteps(flowId) - if (steps.length === 0) { - return 0 - } + const getFlowStatus = useCallback( + (flowId: string) => { + const userFlowState = userFlowStatesData?.find((f) => f.flowId === flowId) + if (!userFlowState) { + return null + } + return userFlowState.flowState + }, + [userFlowStatesData] + ) + const getNumberOfStepsCompleted = useCallback( + (flowId: string): number => { + const steps = getFlowSteps(flowId) + if (steps.length === 0) { + return 0 + } - const completedSteps = steps.filter((s) => getStepStatus(flowId, s.id) === COMPLETED_STEP) + const completedSteps = steps.filter((s) => getStepStatus(flowId, s.id) === COMPLETED_STEP) - return completedSteps.length - } + return completedSteps.length + }, + [userFlowStatesData, isLoadingUserFlowStateData] + ) - function getNumberOfSteps(flowId: string) { - return getFlowSteps(flowId).length - } + const getNumberOfSteps = useCallback( + (flowId: string) => { + return getFlowSteps(flowId).length + }, + [userFlowStatesData, isLoadingUserFlowStateData] + ) /** * Generic method for getting the raw Flow data as a Javascript object. * For typescript, pass in T to get the correct type. * @param flowId */ - function getFlowData(flowId: string): T | null { - const maybeFlow = flows.find((f) => f.slug === flowId) - if (!maybeFlow) { - return null - } - if (flowDataOverrides && flowDataOverrides[flowId]) { - maybeFlow.data = flowDataOverrides[flowId] - } - return safeParse(maybeFlow.data) - } - - function targetingLogicShouldHideFlow(flow: Flow) { - if (readonly) { - return false - } - if (isLoadingUserFlowStateData) { - return true - } - if (shouldGracefullyDegrade) { - return true - } - if (flow?.targetingLogic && userFlowStatesData) { - // Iterate through matching userFlowState for the flow and if shouldTrigger is true, return false - const matchingUserFlowState = userFlowStatesData.find((ufs) => ufs.flowId === flow.slug) - if (matchingUserFlowState) { - return matchingUserFlowState.shouldTrigger === false + const getFlowData = useCallback( + (flowId: string): T | null => { + const maybeFlow = flows.find((f) => f.slug === flowId) + if (!maybeFlow) { + return null } - } - if (flow?.targetingLogic && userId && userId.startsWith('guest_')) { - return true - } + if (flowDataOverrides && flowDataOverrides[flowId]) { + maybeFlow.data = flowDataOverrides[flowId] + } + return safeParse(maybeFlow.data) + }, + [flows, flowDataOverrides] + ) - return false - } + const targetingLogicShouldHideFlow = useCallback( + (flow: Flow) => { + if (readonly) { + return false + } + if (isLoadingUserFlowStateData) { + return true + } + if (shouldGracefullyDegrade) { + return true + } + if (flow?.targetingLogic && userFlowStatesData) { + // Iterate through matching userFlowState for the flow and if shouldTrigger is true, return false + const matchingUserFlowState = userFlowStatesData.find((ufs) => ufs.flowId === flow.slug) + if (matchingUserFlowState) { + return matchingUserFlowState.shouldTrigger === false + } + } + if (flow?.targetingLogic && userId && userId.startsWith('guest_')) { + return true + } - function isFlowAvailableToUser(flowId: string) { - const flow = getFlow(flowId) - if (!flow) { return false - } - if (flow.active === false) { - return false - } - return !targetingLogicShouldHideFlow(getFlow(flowId)) - } + }, + [readonly, isLoadingUserFlowStateData, shouldGracefullyDegrade, userFlowStatesData, userId] + ) + + const isFlowAvailableToUser = useCallback( + (flowId: string) => { + const flow = getFlow(flowId) + if (!flow) { + return false + } + if (flow.active === false) { + return false + } + return !targetingLogicShouldHideFlow(getFlow(flowId)) + }, + [userId, organizationId, userFlowStatesData] + ) function refresh() { if (userId) { From 09d4d17058a8b6c2aa13972d1649a7009e040c4b Mon Sep 17 00:00:00 2001 From: christianmat Date: Mon, 4 Nov 2024 12:28:54 -0800 Subject: [PATCH 050/213] chore: version bump --- packages/reactv1/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/reactv1/package.json b/packages/reactv1/package.json index a559f6c1..9a325ee1 100644 --- a/packages/reactv1/package.json +++ b/packages/reactv1/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/reactv1", - "version": "1.38.51", + "version": "1.38.52", "description": "Build better product onboarding, faster.", "main": "./dist/index.js", "private": true, From cd77e0c12acd622cdbaad2f5fd36e9b3b5eb3a46 Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Fri, 8 Nov 2024 11:04:36 -0800 Subject: [PATCH 051/213] Add video props to Announcement --- .../src/components/Announcement/index.tsx | 5 +++ packages/react/src/components/Media/Video.tsx | 4 +-- .../src/components/Media/videoPropNames.ts | 14 -------- .../react/src/components/Media/videoProps.ts | 34 +++++++++++++++++++ .../react/src/components/Tour/TourStep.tsx | 17 +++------- 5 files changed, 44 insertions(+), 30 deletions(-) delete mode 100644 packages/react/src/components/Media/videoPropNames.ts create mode 100644 packages/react/src/components/Media/videoProps.ts diff --git a/packages/react/src/components/Announcement/index.tsx b/packages/react/src/components/Announcement/index.tsx index 87a75674..aa2e932c 100644 --- a/packages/react/src/components/Announcement/index.tsx +++ b/packages/react/src/components/Announcement/index.tsx @@ -2,6 +2,8 @@ import { Dialog, type DialogProps } from '@/components/Dialog' import { Flex } from '@/components/Flex' import { Flow, type FlowPropsWithoutChildren } from '@/components/Flow' +import { getVideoProps } from '@/components/Media/videoProps' + export interface AnnouncementProps extends FlowPropsWithoutChildren, DialogProps { /** * @ignore @@ -53,6 +55,8 @@ export function Announcement({ flowId, part, ...props }: AnnouncementProps) { const disabled = step.$state.blocked + const { videoProps } = getVideoProps(stepProps) + return ( , VideoPropName> {} diff --git a/packages/react/src/components/Media/videoPropNames.ts b/packages/react/src/components/Media/videoPropNames.ts deleted file mode 100644 index 1cd765fb..00000000 --- a/packages/react/src/components/Media/videoPropNames.ts +++ /dev/null @@ -1,14 +0,0 @@ -export const VIDEO_PROP_NAMES = [ - 'autoPlay', - 'controls', - 'controlsList', - 'crossOrigin', - 'disablePictureInPicture', - 'disableRemotePlayback', - 'loop', - 'muted', - 'playsInline', - 'poster', - 'preload', - 'src', -] as const diff --git a/packages/react/src/components/Media/videoProps.ts b/packages/react/src/components/Media/videoProps.ts new file mode 100644 index 00000000..6d076cb5 --- /dev/null +++ b/packages/react/src/components/Media/videoProps.ts @@ -0,0 +1,34 @@ +export const VIDEO_PROP_NAMES = [ + 'autoPlay', + 'controls', + 'controlsList', + 'crossOrigin', + 'disablePictureInPicture', + 'disableRemotePlayback', + 'loop', + 'muted', + 'playsInline', + 'poster', + 'preload', + 'src', +] as const + +export type VideoPropName = (typeof VIDEO_PROP_NAMES)[number] + +export function getVideoProps(props: Record) { + const videoProps = {} + const otherProps = {} + + for (const [propName, propValue] of Object.entries(props)) { + if (VIDEO_PROP_NAMES.some((name) => name === propName)) { + videoProps[propName] = propValue + } else { + otherProps[propName] = propValue + } + } + + return { + otherProps, + videoProps, + } +} diff --git a/packages/react/src/components/Tour/TourStep.tsx b/packages/react/src/components/Tour/TourStep.tsx index d28c919d..94abf303 100644 --- a/packages/react/src/components/Tour/TourStep.tsx +++ b/packages/react/src/components/Tour/TourStep.tsx @@ -7,7 +7,7 @@ import * as Progress from '@/components/Progress' import { useStepHandlers } from '@/hooks/useStepHandlers' -import { VIDEO_PROP_NAMES } from '@/components/Media/videoPropNames' +import { getVideoProps } from '@/components/Media/videoProps' const fadeIn = keyframes` from { @@ -49,16 +49,7 @@ export function TourStep({ onSecondary, }) - const mediaProps = {} - const hintProps = {} - - for (const [propName, propValue] of Object.entries(props)) { - if (VIDEO_PROP_NAMES.some((name) => name === propName)) { - mediaProps[propName] = propValue - } else { - hintProps[propName] = propValue - } - } + const { videoProps, otherProps } = getVideoProps(props) const primaryButtonTitle = step.primaryButton?.title ?? step.primaryButtonTitle const secondaryButtonTitle = step.secondaryButton?.title ?? step.secondaryButtonTitle @@ -77,7 +68,7 @@ export function TourStep({ side={side} sideOffset={sideOffset} spotlight={spotlight} - {...hintProps} + {...otherProps} > Date: Fri, 8 Nov 2024 15:02:00 -0800 Subject: [PATCH 052/213] Add video props to FlowCard and Checklist.Collapsible --- packages/react/src/components/Card/FlowCard.tsx | 11 ++++++++++- .../react/src/components/Checklist/Collapsible.tsx | 5 +++++ 2 files changed, 15 insertions(+), 1 deletion(-) diff --git a/packages/react/src/components/Card/FlowCard.tsx b/packages/react/src/components/Card/FlowCard.tsx index 18ff0359..015e8e44 100644 --- a/packages/react/src/components/Card/FlowCard.tsx +++ b/packages/react/src/components/Card/FlowCard.tsx @@ -2,6 +2,8 @@ import { Card } from '@/components/Card' import { Flex } from '@/components/Flex' import { Flow, type FlowProps } from '@/components/Flow' +import { getVideoProps } from '@/components/Media/videoProps' + export function FlowCard({ part, ...props }: FlowProps) { return ( - + diff --git a/packages/react/src/components/Checklist/Collapsible.tsx b/packages/react/src/components/Checklist/Collapsible.tsx index ec70abd3..189bdba6 100644 --- a/packages/react/src/components/Checklist/Collapsible.tsx +++ b/packages/react/src/components/Checklist/Collapsible.tsx @@ -10,6 +10,8 @@ import { Text } from '@/components/Text' import { type StepHandlerProp, useStepHandlers } from '@/hooks/useStepHandlers' +import { getVideoProps } from '@/components/Media/videoProps' + export interface CollapsibleStepProps extends FlowChildrenProps { onOpenChange: (isOpening: boolean) => void open: boolean @@ -71,6 +73,8 @@ function DefaultCollapsibleStep({ const disabled = blocked ? true : false + const { videoProps } = getVideoProps(stepProps) + return ( {subtitle} From 25e7a98359cf48b52c1a36130f48e55d79aa3300 Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Fri, 8 Nov 2024 15:02:47 -0800 Subject: [PATCH 053/213] Changeset --- .changeset/beige-gifts-stare.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/beige-gifts-stare.md diff --git a/.changeset/beige-gifts-stare.md b/.changeset/beige-gifts-stare.md new file mode 100644 index 00000000..ec6b8e90 --- /dev/null +++ b/.changeset/beige-gifts-stare.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": patch +--- + +Add video props to Announcement, Card, Collapsible From 7c2762aaec63fc6a7f8dd9b7a70fddafa4f0a562 Mon Sep 17 00:00:00 2001 From: christianmat Date: Fri, 8 Nov 2024 15:55:51 -0800 Subject: [PATCH 054/213] tests: increase intervals --- .../stories/Form/FormInteractionTests.stories.tsx | 12 ++++++++++-- 1 file changed, 10 insertions(+), 2 deletions(-) diff --git a/apps/smithy/src/stories/Form/FormInteractionTests.stories.tsx b/apps/smithy/src/stories/Form/FormInteractionTests.stories.tsx index ea6bfd68..8fe58ed1 100644 --- a/apps/smithy/src/stories/Form/FormInteractionTests.stories.tsx +++ b/apps/smithy/src/stories/Form/FormInteractionTests.stories.tsx @@ -101,10 +101,18 @@ export const InteractionTests: FormStory = { const canvas = within(document.body); for (let i = 0; i < 3; i++) { - await canvas.findByText("This is page 1", {}, { timeout: 5000 }); + await canvas.findByText( + "This is page 1", + {}, + { timeout: 5000, interval: 500 } + ); await userEvent.click(canvas.getByText("Continue to page 2")); await userEvent.click(canvas.getByText("Next")); - await canvas.findByText("This is page 2", {}, { timeout: 5000 }); + await canvas.findByText( + "This is page 2", + {}, + { timeout: 5000, interval: 500 } + ); await userEvent.click(canvas.getByText("Back")); } From fb9c917c3ad6ad799fcf270c7297d3db46eb9340 Mon Sep 17 00:00:00 2001 From: christianmat Date: Fri, 8 Nov 2024 15:56:45 -0800 Subject: [PATCH 055/213] fix: remove assert --- packages/react/prepublish.mjs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/prepublish.mjs b/packages/react/prepublish.mjs index d01892ba..62a56d5f 100644 --- a/packages/react/prepublish.mjs +++ b/packages/react/prepublish.mjs @@ -1,7 +1,7 @@ import {writeFileSync} from 'fs'; import {fileURLToPath} from 'url'; import {dirname, resolve} from 'path'; -import packageJson from './package.json' assert {type: 'json'}; +import packageJson from './package.json'; // Mimic __dirname in ES modules const __filename = fileURLToPath(import.meta.url); From b41b2d13cf0cd89357f130863f31780d6a5e8703 Mon Sep 17 00:00:00 2001 From: christianmat Date: Fri, 8 Nov 2024 15:57:46 -0800 Subject: [PATCH 056/213] fix: remove assert --- packages/react/prepublish.mjs | 2 +- packages/react/src/version.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/react/prepublish.mjs b/packages/react/prepublish.mjs index 62a56d5f..7e641369 100644 --- a/packages/react/prepublish.mjs +++ b/packages/react/prepublish.mjs @@ -1,7 +1,7 @@ import {writeFileSync} from 'fs'; import {fileURLToPath} from 'url'; import {dirname, resolve} from 'path'; -import packageJson from './package.json'; +const packageJson = await import('./package.json', { assert: { type: 'json' } }); // Mimic __dirname in ES modules const __filename = fileURLToPath(import.meta.url); diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 74adc60a..f93eebd5 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.5.27'; \ No newline at end of file +export const SDK_VERSION = 'undefined'; \ No newline at end of file From 46916c70da93ba3d214dd0e9d0c8b89609a208f9 Mon Sep 17 00:00:00 2001 From: christianmat Date: Fri, 8 Nov 2024 16:04:29 -0800 Subject: [PATCH 057/213] tests: add additional interval --- .../Collection/CollectionInteractionTests.stories.tsx | 2 ++ packages/react/prepublish.mjs | 6 ++++-- packages/react/src/version.ts | 2 +- 3 files changed, 7 insertions(+), 3 deletions(-) diff --git a/apps/smithy/src/stories/Collection/CollectionInteractionTests.stories.tsx b/apps/smithy/src/stories/Collection/CollectionInteractionTests.stories.tsx index a8e1eaf0..0a80229c 100644 --- a/apps/smithy/src/stories/Collection/CollectionInteractionTests.stories.tsx +++ b/apps/smithy/src/stories/Collection/CollectionInteractionTests.stories.tsx @@ -151,6 +151,8 @@ export const InteractionTests: CollectionStory = { // expect banner to contain the text "Banner title" await expect(banner.getByText("Banner title")).toBeInTheDocument(); + await sleep(200); + // Click button with Primary CTA await userEvent.click( banner.getByRole("button", { diff --git a/packages/react/prepublish.mjs b/packages/react/prepublish.mjs index 7e641369..4b49eb3e 100644 --- a/packages/react/prepublish.mjs +++ b/packages/react/prepublish.mjs @@ -1,7 +1,9 @@ -import {writeFileSync} from 'fs'; +import {writeFileSync, readFileSync} from 'fs'; import {fileURLToPath} from 'url'; import {dirname, resolve} from 'path'; -const packageJson = await import('./package.json', { assert: { type: 'json' } }); + +const packageJson = JSON.parse(readFileSync('./package.json', 'utf-8')); + // Mimic __dirname in ES modules const __filename = fileURLToPath(import.meta.url); diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index f93eebd5..74adc60a 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = 'undefined'; \ No newline at end of file +export const SDK_VERSION = '2.5.27'; \ No newline at end of file From 6f82822c46795705d63b755c286671242cd772b7 Mon Sep 17 00:00:00 2001 From: christianmat Date: Fri, 8 Nov 2024 16:09:40 -0800 Subject: [PATCH 058/213] fix: prepublish script for js-api --- packages/js-api/prepublish.mjs | 17 +++++++++-------- 1 file changed, 9 insertions(+), 8 deletions(-) diff --git a/packages/js-api/prepublish.mjs b/packages/js-api/prepublish.mjs index d01892ba..b0f21401 100644 --- a/packages/js-api/prepublish.mjs +++ b/packages/js-api/prepublish.mjs @@ -1,16 +1,17 @@ -import {writeFileSync} from 'fs'; -import {fileURLToPath} from 'url'; -import {dirname, resolve} from 'path'; -import packageJson from './package.json' assert {type: 'json'}; +import { writeFileSync, readFileSync } from 'fs' +import { fileURLToPath } from 'url' +import { dirname, resolve } from 'path' + +const packageJson = JSON.parse(readFileSync('./package.json', 'utf-8')) // Mimic __dirname in ES modules -const __filename = fileURLToPath(import.meta.url); -const __dirname = dirname(__filename); +const __filename = fileURLToPath(import.meta.url) +const __dirname = dirname(__filename) // Define the path to the version file -const versionFilePath = resolve(__dirname, 'src/version.ts'); +const versionFilePath = resolve(__dirname, 'src/version.ts') // Write the version to the file -writeFileSync(versionFilePath, `export const SDK_VERSION = '${packageJson.version}';`, 'utf8'); +writeFileSync(versionFilePath, `export const SDK_VERSION = '${packageJson.version}';`, 'utf8') console.log(`Successfully wrote version number`) From 99a7b686b20f624091fcca07cb0f38a91a72d2fe Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Fri, 8 Nov 2024 16:14:06 -0800 Subject: [PATCH 059/213] Version Packages (#394) Co-authored-by: github-actions[bot] --- .changeset/beige-gifts-stare.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/beige-gifts-stare.md diff --git a/.changeset/beige-gifts-stare.md b/.changeset/beige-gifts-stare.md deleted file mode 100644 index ec6b8e90..00000000 --- a/.changeset/beige-gifts-stare.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": patch ---- - -Add video props to Announcement, Card, Collapsible diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index a388675b..9390379d 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/react +## 2.5.28 + +### Patch Changes + +- 25e7a98: Add video props to Announcement, Card, Collapsible + ## 2.5.27 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 45f3ec97..daff269c 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.5.27", + "version": "2.5.28", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From eebabf29618f09fe3dcc7154b402934c301f612e Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Sat, 9 Nov 2024 00:15:49 +0000 Subject: [PATCH 060/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 74adc60a..c457ec54 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.5.27'; \ No newline at end of file +export const SDK_VERSION = '2.5.28'; \ No newline at end of file From 381fabf33d1a7edce38c995aab6610c6c32c4b6f Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Mon, 18 Nov 2024 14:50:26 -0800 Subject: [PATCH 061/213] Fix Button active styles --- .../react/src/components/Button/Button.styles.ts | 15 ++++++++------- packages/react/src/shared/tokens/palette.ts | 2 +- packages/react/src/shared/tokens/semantic.ts | 6 +++--- 3 files changed, 12 insertions(+), 11 deletions(-) diff --git a/packages/react/src/components/Button/Button.styles.ts b/packages/react/src/components/Button/Button.styles.ts index 1f54e70d..d9a6c29a 100644 --- a/packages/react/src/components/Button/Button.styles.ts +++ b/packages/react/src/components/Button/Button.styles.ts @@ -1,6 +1,7 @@ import { keyframes } from '@emotion/react' const base = { + alignItems: 'center', borderWidth: 'md', borderRadius: 'md', borderStyle: 'solid', @@ -9,6 +10,9 @@ const base = { gap: '2', padding: '2 4', fontFamily: 'inherit', + + 'opacity:disabled': '0.6', + 'pointerEvents:disabled': 'none', } export const Primary = { @@ -17,12 +21,9 @@ export const Primary = { borderColor: 'primary.border', color: 'primary.foreground', - 'backgroundColor:disabled': 'primary.surface', 'backgroundColor:hover': 'primary.hover.surface', - - 'opacity:disabled': '0.6', - - 'pointerEvents:disabled': 'none', + 'backgroundColor:active': 'primary.active.surface', + 'backgroundColor:disabled': 'primary.surface', } export const Secondary = { @@ -33,9 +34,8 @@ export const Secondary = { color: 'secondary.foreground', 'backgroundColor:hover': 'secondary.hover.background', - + 'backgroundColor:active': 'secondary.active.surface', 'backgroundColor:disabled': 'secondary.background', - 'opacity:disabled': '0.6', } export const Link = { @@ -46,6 +46,7 @@ export const Link = { color: 'primary.surface', 'color:hover': 'primary.hover.surface', + 'color:active': 'primary.active.surface', } export const Plain = { diff --git a/packages/react/src/shared/tokens/palette.ts b/packages/react/src/shared/tokens/palette.ts index 0e138b32..45fefd4e 100644 --- a/packages/react/src/shared/tokens/palette.ts +++ b/packages/react/src/shared/tokens/palette.ts @@ -82,7 +82,7 @@ export const palette = { blue500: scaledColors.blue['500'], blue800: scaledColors.blue['800'], blue900: scaledColors.blue['900'], - green400: scaledColors.blue['400'], + green400: scaledColors.green['400'], green500: scaledColors.green['500'], green800: scaledColors.green['800'], red500: scaledColors.red['500'], diff --git a/packages/react/src/shared/tokens/semantic.ts b/packages/react/src/shared/tokens/semantic.ts index 947c0a91..0c59838b 100644 --- a/packages/react/src/shared/tokens/semantic.ts +++ b/packages/react/src/shared/tokens/semantic.ts @@ -154,10 +154,10 @@ export const semantic: SemanticColors = { surface: colorVar('primary-500'), active: { - background: colorVar('primary-400'), - border: colorVar('primary-400'), + background: colorVar('primary-300'), + border: colorVar('primary-300'), foreground: colorVar('white'), - surface: colorVar('primary-400'), + surface: colorVar('primary-300'), }, focus: { background: colorVar('primary-500'), From 4d15c302585799c41aefce2aed3739c3a8021cc1 Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Mon, 18 Nov 2024 14:51:17 -0800 Subject: [PATCH 062/213] Remove vestigial storybook preview.jsx --- apps/smithy/.storybook/preview.jsx | 89 ------------------------------ apps/smithy/.storybook/preview.tsx | 14 +++++ 2 files changed, 14 insertions(+), 89 deletions(-) delete mode 100644 apps/smithy/.storybook/preview.jsx diff --git a/apps/smithy/.storybook/preview.jsx b/apps/smithy/.storybook/preview.jsx deleted file mode 100644 index eb229bc0..00000000 --- a/apps/smithy/.storybook/preview.jsx +++ /dev/null @@ -1,89 +0,0 @@ -import "./global.css"; - -import * as React from "react"; -import { useEffect } from "react"; -import { Provider } from "@frigade/react"; - -// LOCAL DEV -// const FRIGADE_API_KEY = -// "api_public_0FaxqVs527bAVQsFK4RcuJYjVqHeC5U7CGJLfsVXRE36eAKiLjwAEugZYeFijCI2"; -// const API_URL = "https://localhost:3443/v1/public"; - -// FRIGADE DEV -const FRIGADE_API_KEY = - "api_public_GY6O5JS99XTL2HAXU0D6OQHYQ7I706P5I9C9I7CEZFNFUFRARD2DVDSMFW3YT3SV"; -const API_URL = "https://api.frigade.com"; - -// const userId = `jonathan_livingston_smeagol`; -const userId = `jonathan_livingston_smeagol_${Math.random() - .toString(36) - .substring(2, 9)}`; - -const preview = { - parameters: { - actions: { argTypesRegex: "^on[A-Z].*" }, - controls: { - matchers: { - color: /(background|color)$/i, - date: /Date$/, - }, - }, - }, - decorators: [ - (Story) => { - const [delayedUserId, setDelayedUserId] = React.useState(undefined); - - useEffect(() => { - setTimeout(() => { - setDelayedUserId(userId); - }, 1000); - }, []); - - return ( - - - - ); - }, - ], -}; - -export default preview; diff --git a/apps/smithy/.storybook/preview.tsx b/apps/smithy/.storybook/preview.tsx index 16d6f4fb..20b41f41 100644 --- a/apps/smithy/.storybook/preview.tsx +++ b/apps/smithy/.storybook/preview.tsx @@ -38,6 +38,20 @@ const preview = { // generateGuestId={false} userId={FRIGADE_USER_ID} // syncOnWindowUpdates={false} + + // theme={{ + // colors: { + // primary: { + // surface: "pink", + // active: { + // surface: "teal", + // }, + // hover: { + // surface: "orange", + // }, + // }, + // }, + // }} userProperties={{ firstName: "Jonathan", lastName: "Livingston", From b59ede2a7230473a331c12a684c69473efd4fe2e Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Mon, 18 Nov 2024 14:52:02 -0800 Subject: [PATCH 063/213] Changeset --- .changeset/wise-wombats-fix.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/wise-wombats-fix.md diff --git a/.changeset/wise-wombats-fix.md b/.changeset/wise-wombats-fix.md new file mode 100644 index 00000000..579d9e2b --- /dev/null +++ b/.changeset/wise-wombats-fix.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": patch +--- + +Fix Button active styles From c2d54b81b255328fcf03dff82a6354977a2fa85f Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Mon, 18 Nov 2024 15:15:53 -0800 Subject: [PATCH 064/213] Version Packages (#395) Co-authored-by: github-actions[bot] --- .changeset/wise-wombats-fix.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/wise-wombats-fix.md diff --git a/.changeset/wise-wombats-fix.md b/.changeset/wise-wombats-fix.md deleted file mode 100644 index 579d9e2b..00000000 --- a/.changeset/wise-wombats-fix.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": patch ---- - -Fix Button active styles diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 9390379d..d24fbf03 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/react +## 2.5.29 + +### Patch Changes + +- b59ede2: Fix Button active styles + ## 2.5.28 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index daff269c..431bdda4 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.5.28", + "version": "2.5.29", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From aa3dc82b77eef3c0691655a7475f98bf28442ccb Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Mon, 18 Nov 2024 23:18:31 +0000 Subject: [PATCH 065/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index c457ec54..2c6b67e9 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.5.28'; \ No newline at end of file +export const SDK_VERSION = '2.5.29'; \ No newline at end of file From aafafbae903796bf38e936d0b58b8ffded3d1326 Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Wed, 20 Nov 2024 17:08:59 -0800 Subject: [PATCH 066/213] Refactor useModal --- .../Announcement/Announcement.stories.tsx | 8 +- .../src/stories/hooks/useModal.stories.tsx | 2 +- packages/react/src/components/Flow/index.tsx | 10 +-- .../src/components/Provider/FrigadeContext.ts | 6 +- .../src/components/Provider/Provider.tsx | 3 + packages/react/src/hooks/useModal.ts | 77 +++++++++++-------- packages/react/src/index.ts | 1 - 7 files changed, 62 insertions(+), 45 deletions(-) diff --git a/apps/smithy/src/stories/Announcement/Announcement.stories.tsx b/apps/smithy/src/stories/Announcement/Announcement.stories.tsx index c47b0d06..d998ac1f 100644 --- a/apps/smithy/src/stories/Announcement/Announcement.stories.tsx +++ b/apps/smithy/src/stories/Announcement/Announcement.stories.tsx @@ -1,4 +1,4 @@ -import { Announcement, useFlow, useFrigade } from "@frigade/react"; +import { Announcement, Tour, useFlow, useFrigade } from "@frigade/react"; export default { title: "Components/Announcement", @@ -52,8 +52,10 @@ export const ModalCollisions = { return (
- + + + + +
Tour anchor
); }, diff --git a/apps/smithy/src/stories/hooks/useModal.stories.tsx b/apps/smithy/src/stories/hooks/useModal.stories.tsx index c7697bee..c825bcab 100644 --- a/apps/smithy/src/stories/hooks/useModal.stories.tsx +++ b/apps/smithy/src/stories/hooks/useModal.stories.tsx @@ -8,8 +8,8 @@ export function Default() { return (
Anchor
- + {/* */}
); diff --git a/packages/react/src/components/Flow/index.tsx b/packages/react/src/components/Flow/index.tsx index d68bad6c..7d4f26c4 100644 --- a/packages/react/src/components/Flow/index.tsx +++ b/packages/react/src/components/Flow/index.tsx @@ -6,7 +6,7 @@ import { Box } from '@/components/Box' import { useFlow } from '@/hooks/useFlow' import { useFlowHandlers } from '@/hooks/useFlowHandlers' import { useStepHandlers } from '@/hooks/useStepHandlers' -import { useModal } from '@/hooks/useModal' +import { useCheckForModalCollision } from '@/hooks/useModal' import type { FlowProps } from '@/components/Flow/FlowProps' // import { FrigadeContext } from '@/components/Provider' @@ -63,7 +63,7 @@ export function Flow({ (typeof as === 'function' && as?.displayName === 'Dialog') || [FlowType.ANNOUNCEMENT, FlowType.TOUR].includes(flow?.rawData?.flowType) - const { isCurrentModal } = useModal(flow, isModal) + const { hasModalCollision } = useCheckForModalCollision(flow, isModal) // useEffect(() => { // return () => { @@ -89,11 +89,7 @@ export function Flow({ // } // }) - if (!flow.isVisible && !shouldForceMount) { - return null - } - - if (!shouldForceMount && !isCurrentModal) { + if ((!flow.isVisible || hasModalCollision) && !shouldForceMount) { return null } diff --git a/packages/react/src/components/Provider/FrigadeContext.ts b/packages/react/src/components/Provider/FrigadeContext.ts index 7c03a59b..a04ec85e 100644 --- a/packages/react/src/components/Provider/FrigadeContext.ts +++ b/packages/react/src/components/Provider/FrigadeContext.ts @@ -1,9 +1,11 @@ import type { CollectionsRegistryCallback, Frigade } from '@frigade/js' -import { createContext } from 'react' +import { createContext, type Dispatch, type SetStateAction } from 'react' import type { ProviderProps } from './Provider' export interface ProviderContext extends Omit { + currentModal: string | null + setCurrentModal: Dispatch> frigade?: Frigade hasInitialized: boolean registerComponent: (flowId: string, callback?: CollectionsRegistryCallback) => void @@ -13,6 +15,8 @@ export interface ProviderContext extends Omit({ apiKey: '', + currentModal: null, + setCurrentModal: () => {}, navigate: () => {}, hasInitialized: false, registerComponent: () => {}, diff --git a/packages/react/src/components/Provider/Provider.tsx b/packages/react/src/components/Provider/Provider.tsx index 68472de0..a80da297 100644 --- a/packages/react/src/components/Provider/Provider.tsx +++ b/packages/react/src/components/Provider/Provider.tsx @@ -143,6 +143,7 @@ export function Provider({ const registeredComponents = useRef(new Map()) const intervalRef = useRef() const [hasInitialized, setHasInitialized] = useState(false) + const [currentModal, setCurrentModal] = useState(null) const frigade = useMemo(() => { setHasInitialized(false) @@ -240,6 +241,8 @@ export function Provider({ return ( = new Set() +import { FrigadeContext } from '@/components/Provider' -export function useModal(flow: Flow, isModal: boolean = true) { - const removeModal = useCallback(() => { - if (globalModalState.has(flow?.id)) { - globalModalState.delete(flow?.id) - } - }, [globalModalState, isModal]) +export function useCheckForModalCollision(flow: Flow, isModal = true) { + const { currentModal, setCurrentModal } = useContext(FrigadeContext) + + const claimLock = useCallback( + (flowId: string) => { + if (isModal && flow.isVisible) { + setCurrentModal(flowId) + } + }, + [isModal, flow?.isVisible] + ) - const registerModal = useCallback(() => { - if (isModal && flow?.isVisible && !globalModalState.has(flow.id)) { - globalModalState.add(flow.id) + const releaseLock = useCallback(() => { + if (flow != null && currentModal === flow?.id) { + setCurrentModal(null) } - }, [globalModalState, isModal]) + }, [currentModal, flow?.id]) useEffect(() => { - return () => { - removeModal() + if (flow != null && currentModal === null && flow.isVisible) { + claimLock(flow.id) } - }, []) - useEffect(() => { - registerModal() + return releaseLock + }, [currentModal, flow?.id, flow?.isVisible]) - const handleRouteChange = () => { - removeModal() + // Edge case: The current modal may become non-modal while still mounted + useEffect(() => { + if (flow != null && (!isModal || !flow.isVisible)) { + releaseLock() } + }, [flow?.isVisible, isModal]) - window.addEventListener('popstate', handleRouteChange) - window.addEventListener('beforeunload', handleRouteChange) - - return () => { - removeModal() - window.removeEventListener('popstate', handleRouteChange) - window.removeEventListener('beforeunload', handleRouteChange) + // No flow? No problem. + if (flow == null) { + return { + hasModalCollision: false, } - }, [registerModal, removeModal]) + } - if (!flow?.isVisible) { - removeModal() - } else { - registerModal() + // Non-modal and hidden components, by definition, can't collide with modals + if (!isModal || !flow.isVisible) { + return { + hasModalCollision: false, + } } - const currentModal = globalModalState.size > 0 ? globalModalState.values().next().value : null + // We already have the lock, send it + if (currentModal === flow.id) { + return { + hasModalCollision: false, + } + } + // If we didn't short circuit and didn't have the lock, assume that we're out of lock luck. return { - isCurrentModal: !isModal ? true : currentModal === flow?.id || globalModalState.size == 0, + hasModalCollision: true, } } diff --git a/packages/react/src/index.ts b/packages/react/src/index.ts index 5b17d838..c8faea3d 100644 --- a/packages/react/src/index.ts +++ b/packages/react/src/index.ts @@ -52,7 +52,6 @@ export { type FlowHandlerProp, type FlowHandlerProps, } from './hooks/useFlowHandlers' -export { useModal } from './hooks/useModal' export { useStepHandlers, type StepHandler, From ae705d13b635b5f08eed29dc1baae904b15d3b69 Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Wed, 20 Nov 2024 17:10:22 -0800 Subject: [PATCH 067/213] Changeset --- .changeset/kind-moons-beg.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/kind-moons-beg.md diff --git a/.changeset/kind-moons-beg.md b/.changeset/kind-moons-beg.md new file mode 100644 index 00000000..0c329be6 --- /dev/null +++ b/.changeset/kind-moons-beg.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": minor +--- + +Refactored useModal. Modal collision detection should behave more consistently with SSR / caching. From b513b0b96442442ffdc24659d7ed3f947915055b Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Wed, 20 Nov 2024 17:39:30 -0800 Subject: [PATCH 068/213] Version Packages (#396) Co-authored-by: github-actions[bot] --- .changeset/kind-moons-beg.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/kind-moons-beg.md diff --git a/.changeset/kind-moons-beg.md b/.changeset/kind-moons-beg.md deleted file mode 100644 index 0c329be6..00000000 --- a/.changeset/kind-moons-beg.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": minor ---- - -Refactored useModal. Modal collision detection should behave more consistently with SSR / caching. diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index d24fbf03..8b4fbf52 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/react +## 2.6.0 + +### Minor Changes + +- ae705d1: Refactored useModal. Modal collision detection should behave more consistently with SSR / caching. + ## 2.5.29 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 431bdda4..658051db 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.5.29", + "version": "2.6.0", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From d5c93b019b817606b837676e5bcfde521b07a433 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Thu, 21 Nov 2024 01:42:04 +0000 Subject: [PATCH 069/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 2c6b67e9..f8aba024 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.5.29'; \ No newline at end of file +export const SDK_VERSION = '2.6.0'; \ No newline at end of file From 7690f55c5c43efe553a32ad85fbe45eebe9d3344 Mon Sep 17 00:00:00 2001 From: christianmat Date: Thu, 21 Nov 2024 15:46:29 -0800 Subject: [PATCH 070/213] docs: better docs on type --- packages/js-api/src/core/types.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/js-api/src/core/types.ts b/packages/js-api/src/core/types.ts index 74310237..d75422ea 100644 --- a/packages/js-api/src/core/types.ts +++ b/packages/js-api/src/core/types.ts @@ -201,7 +201,7 @@ export interface FlowStep extends StatefulStep { [x: string | number | symbol]: unknown /** - * Marks the step started. + * Marks the step started. This will move the current step index to the given step. */ start: (properties?: PropertyPayload) => Promise From 67be7ebd9eb80b62aaa0a800cec61493ccbd37df Mon Sep 17 00:00:00 2001 From: Micah Snyder <28678+dfltr@users.noreply.github.com> Date: Thu, 21 Nov 2024 16:02:33 -0800 Subject: [PATCH 071/213] Fix typo in FlowProps (#397) --- packages/react/src/components/Flow/FlowProps.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/react/src/components/Flow/FlowProps.ts b/packages/react/src/components/Flow/FlowProps.ts index aff33e5d..51585e13 100644 --- a/packages/react/src/components/Flow/FlowProps.ts +++ b/packages/react/src/components/Flow/FlowProps.ts @@ -38,12 +38,12 @@ export interface FlowPropsWithoutChildren extends BoxPropsWithoutChildren { onDismiss?: FlowHandlerProp /** * Handler for when primary button is clicked. - * If this function a promise that evaluates to `false`, the step will not be automatically completed when clicked. + * If this function returns false or a promise that resolves to `false`, the step will not be automatically completed when clicked. */ onPrimary?: StepHandlerProp /** * Handler for when secondary button is clicked. - * If this function a promise that evaluates to `false`, the step will not be automatically completed when clicked. + * If this function returns false or a promise that resolves to `false`, the step will not be automatically completed when clicked. */ onSecondary?: StepHandlerProp /** From 52ddbc6674a365eab3d0c1dde4ae2fc26c69b604 Mon Sep 17 00:00:00 2001 From: Micah Snyder <28678+dfltr@users.noreply.github.com> Date: Tue, 26 Nov 2024 11:46:03 -0800 Subject: [PATCH 072/213] Flow props standardization (#398) * Update Form to YAML props standard * Exclude video props from YAML passthrough * Banner no longer needs the as={null} pattern for YAML props * Convert Announcement to use merged props, generalize default esc handler for Dialog in Flow, standardize dismissible prop handling across components * Use an actual Announcement flow type in Storybook, remove Dialog from Form story. --- .../Announcement/Announcement.stories.tsx | 2 +- apps/smithy/src/stories/Form/Form.stories.tsx | 2 +- .../src/components/Announcement/index.tsx | 147 +++++++----------- .../react/src/components/Banner/index.tsx | 43 +++-- packages/react/src/components/Card/index.tsx | 8 + .../src/components/Checklist/Collapsible.tsx | 4 +- packages/react/src/components/Flow/index.tsx | 40 ++++- .../react/src/components/Form/FormStep.tsx | 6 +- packages/react/src/components/Form/index.tsx | 3 +- 9 files changed, 128 insertions(+), 127 deletions(-) diff --git a/apps/smithy/src/stories/Announcement/Announcement.stories.tsx b/apps/smithy/src/stories/Announcement/Announcement.stories.tsx index d998ac1f..af2ea2c8 100644 --- a/apps/smithy/src/stories/Announcement/Announcement.stories.tsx +++ b/apps/smithy/src/stories/Announcement/Announcement.stories.tsx @@ -8,7 +8,7 @@ export default { export const Default = { args: { dismissible: true, - flowId: "flow_8Ybz7lMK", + flowId: "flow_vLivpwoH", modal: true, onDismiss: () => console.log("Dismissed"), }, diff --git a/apps/smithy/src/stories/Form/Form.stories.tsx b/apps/smithy/src/stories/Form/Form.stories.tsx index 9645e61a..ca316668 100644 --- a/apps/smithy/src/stories/Form/Form.stories.tsx +++ b/apps/smithy/src/stories/Form/Form.stories.tsx @@ -32,7 +32,7 @@ export const Default = { fieldTypes: { customTest: CustomStep, }, - as: Dialog, + // as: Dialog, variables: { testVar: "hello world", }, diff --git a/packages/react/src/components/Announcement/index.tsx b/packages/react/src/components/Announcement/index.tsx index aa2e932c..e739aec0 100644 --- a/packages/react/src/components/Announcement/index.tsx +++ b/packages/react/src/components/Announcement/index.tsx @@ -19,114 +19,83 @@ export interface AnnouncementProps extends FlowPropsWithoutChildren, DialogProps defaultOpen?: boolean } -const flowPropNames = [ - 'dismissible', - 'flowId', - 'forceMount', - 'onComplete', - 'onDismiss', - 'onPrimary', - 'onSecondary', - 'variables', -] - export function Announcement({ flowId, part, ...props }: AnnouncementProps) { - const flowProps = Object.fromEntries( - Object.entries(props).filter(([k]) => flowPropNames.some((name) => k === name)) - ) - const dialogProps = Object.fromEntries( - Object.entries(props).filter(([k]) => flowPropNames.indexOf(k) === -1) - ) - return ( - + {({ flow, handleDismiss, handlePrimary, handleSecondary, - parentProps: { containerProps, dismissible }, + parentProps: { dismissible }, step, }) => { - const stepProps = step.props ?? {} - const primaryButtonTitle = step.primaryButton?.title ?? step.primaryButtonTitle const secondaryButtonTitle = step.secondaryButton?.title ?? step.secondaryButtonTitle const disabled = step.$state.blocked - const { videoProps } = getVideoProps(stepProps) + const { videoProps } = getVideoProps(step.props ?? {}) return ( - { - if (props.dismissible === false) { - e.preventDefault() - return - } - if (typeof props.onEscapeKeyDown === 'function') { - props.onEscapeKeyDown(e) - } - - if (!e.defaultPrevented) { - handleDismiss(e) - } - }} - > - - {dismissible && } - - {step.title} - {step.subtitle} - + <> + {dismissible && } + + {step.title} + {step.subtitle} + - + - + - button': { - flexBasis: '50%', - flexGrow: 1, - }, - }} - gap={3} - part="announcement-footer" - > - {secondaryButtonTitle && ( - - )} - {primaryButtonTitle && ( - - )} - - - + button': { + flexBasis: '50%', + flexGrow: 1, + }, + }} + gap={3} + part="announcement-footer" + > + {secondaryButtonTitle && ( + + )} + {primaryButtonTitle && ( + + )} + + ) }} diff --git a/packages/react/src/components/Banner/index.tsx b/packages/react/src/components/Banner/index.tsx index 7cc9d1b6..3268d45d 100644 --- a/packages/react/src/components/Banner/index.tsx +++ b/packages/react/src/components/Banner/index.tsx @@ -5,37 +5,30 @@ import { Box } from '@/components/Box' export interface BannerProps extends FlowPropsWithoutChildren {} -export function Banner({ dismissible, flowId, part, ...props }: BannerProps) { +export function Banner({ flowId, part, ...props }: BannerProps) { return ( - - {({ - handleDismiss, - handlePrimary, - handleSecondary, - parentProps: { containerProps }, - step, - }) => { - const stepProps = step.props ?? {} - + + {({ handleDismiss, handlePrimary, handleSecondary, parentProps: { dismissible }, step }) => { const primaryButtonTitle = step.primaryButton?.title ?? step.primaryButtonTitle const secondaryButtonTitle = step.secondaryButton?.title ?? step.secondaryButtonTitle const disabled = step.$state.blocked return ( - + <> {step.imageUri && ( {dismissible && } - + ) }} diff --git a/packages/react/src/components/Card/index.tsx b/packages/react/src/components/Card/index.tsx index 7d52a707..86b4568b 100644 --- a/packages/react/src/components/Card/index.tsx +++ b/packages/react/src/components/Card/index.tsx @@ -86,6 +86,14 @@ Card.Footer = ({ children, part, ...props }: BoxProps) => { } Card.Header = ({ dismissible, handleDismiss, part, subtitle, title, ...props }) => { + if ( + !dismissible && + (title == null || title?.length === 0) && + (subtitle == null || subtitle?.length === 0) + ) { + return null + } + return ( diff --git a/packages/react/src/components/Flow/index.tsx b/packages/react/src/components/Flow/index.tsx index 7d4f26c4..7b3dbb68 100644 --- a/packages/react/src/components/Flow/index.tsx +++ b/packages/react/src/components/Flow/index.tsx @@ -9,6 +9,7 @@ import { useStepHandlers } from '@/hooks/useStepHandlers' import { useCheckForModalCollision } from '@/hooks/useModal' import type { FlowProps } from '@/components/Flow/FlowProps' +import { getVideoProps } from '@/components/Media/videoProps' // import { FrigadeContext } from '@/components/Provider' export type { @@ -17,6 +18,10 @@ export type { FlowPropsWithoutChildren, } from '@/components/Flow/FlowProps' +function isDialog(component) { + return typeof component === 'function' && component.displayName === 'Dialog' +} + export function Flow({ as, children, @@ -35,19 +40,25 @@ export function Flow({ variables, }) + const step = flow?.getCurrentStep() + + const initialStepProps = step?.props ?? {} + + // Discard video props when merging step props onto top-level container + const { otherProps: stepProps } = getVideoProps(initialStepProps) + const { - dismissible = false, + dismissible = isDialog(as) ? true : false, forceMount = false, ...mergedProps } = { ...props, ...(flow?.props ?? {}), + ...(flow?.rawData?.flowType === FlowType.CHECKLIST ? {} : stepProps), } // const { hasInitialized, registerComponent, unregisterComponent } = useContext(FrigadeContext) - const step = flow?.getCurrentStep() - const { handleDismiss } = useFlowHandlers(flow, { onComplete, onDismiss, @@ -60,11 +71,26 @@ export function Flow({ const isModal = mergedProps?.modal || - (typeof as === 'function' && as?.displayName === 'Dialog') || + isDialog(as) || [FlowType.ANNOUNCEMENT, FlowType.TOUR].includes(flow?.rawData?.flowType) const { hasModalCollision } = useCheckForModalCollision(flow, isModal) + function handleEscapeKeyDown(e) { + if (dismissible === false) { + e.preventDefault() + return + } + + if (typeof props.onEscapeKeyDown === 'function') { + props.onEscapeKeyDown(e) + } + + if (!e.defaultPrevented) { + handleDismiss(e) + } + } + // useEffect(() => { // return () => { // unregisterComponent(flowId) @@ -103,11 +129,15 @@ export function Flow({ const ContainerElement = as === null ? Fragment : as ?? Box - const containerProps = { + const containerProps: Record = { ...mergedProps, 'data-flow-id': flow.id, } + if (isDialog(as)) { + containerProps.onEscapeKeyDown = handleEscapeKeyDown + } + return ( {children({ diff --git a/packages/react/src/components/Form/FormStep.tsx b/packages/react/src/components/Form/FormStep.tsx index 666e128e..1a4fcf63 100644 --- a/packages/react/src/components/Form/FormStep.tsx +++ b/packages/react/src/components/Form/FormStep.tsx @@ -110,8 +110,6 @@ export function FormStep({ const { control, handleSubmit } = formContext - const stepProps = step.props ?? {} - function onPrimarySubmit(properties: PropertyPayload, e: SyntheticEvent) { setIsSubmitting(true) handlePrimary(e, properties, __readOnly === true).then(() => setIsSubmitting(false)) @@ -141,7 +139,7 @@ export function FormStep({ }, [step]) return ( - + <> - + ) } diff --git a/packages/react/src/components/Form/index.tsx b/packages/react/src/components/Form/index.tsx index e553d4ef..8cefcf05 100644 --- a/packages/react/src/components/Form/index.tsx +++ b/packages/react/src/components/Form/index.tsx @@ -1,6 +1,7 @@ import { FlowStep } from '@frigade/js' import type { ControllerFieldState, Message, UseFormReturn, ValidationRule } from 'react-hook-form' +import { Card } from '@/components/Card' import { Flow, type FlowPropsWithoutChildren } from '@/components/Flow' import { FormStep } from './FormStep' @@ -108,7 +109,7 @@ export function Form({ fieldTypes = {}, flowId, part, ...props }: FormProps) { const mergedFieldTypes = Object.assign({}, defaultFieldTypes, fieldTypes) return ( - + {(childProps) => } ) From cce59b61a597fadea212f7404a92a4b6d1e768a7 Mon Sep 17 00:00:00 2001 From: christianmat Date: Thu, 28 Nov 2024 10:51:12 -0800 Subject: [PATCH 073/213] changeset --- .changeset/six-shrimps-breathe.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/six-shrimps-breathe.md diff --git a/.changeset/six-shrimps-breathe.md b/.changeset/six-shrimps-breathe.md new file mode 100644 index 00000000..c60e7b9f --- /dev/null +++ b/.changeset/six-shrimps-breathe.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": patch +--- + +Fixes a series of inconsistencies in dismissible behaviors across components From 1bf42ca8a609380cbdfae823f6eff6dc98d913c9 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Thu, 28 Nov 2024 10:56:25 -0800 Subject: [PATCH 074/213] Version Packages (#399) Co-authored-by: github-actions[bot] --- .changeset/six-shrimps-breathe.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/six-shrimps-breathe.md diff --git a/.changeset/six-shrimps-breathe.md b/.changeset/six-shrimps-breathe.md deleted file mode 100644 index c60e7b9f..00000000 --- a/.changeset/six-shrimps-breathe.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": patch ---- - -Fixes a series of inconsistencies in dismissible behaviors across components diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 8b4fbf52..b86534c0 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/react +## 2.6.1 + +### Patch Changes + +- cce59b6: Fixes a series of inconsistencies in dismissible behaviors across components + ## 2.6.0 ### Minor Changes diff --git a/packages/react/package.json b/packages/react/package.json index 658051db..423dc11d 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.6.0", + "version": "2.6.1", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From ec0be317ceaf0c99121b52dbee655522d64976dc Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Thu, 28 Nov 2024 18:57:21 +0000 Subject: [PATCH 075/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index f8aba024..9310cd7e 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.6.0'; \ No newline at end of file +export const SDK_VERSION = '2.6.1'; \ No newline at end of file From c1352feda76f38d990628cd8a6bde1b67357f5ee Mon Sep 17 00:00:00 2001 From: christianmat Date: Mon, 2 Dec 2024 15:37:41 -0800 Subject: [PATCH 076/213] fix: edge case where resetting a flow prevents from reclaiming the lock --- packages/react/src/hooks/useModal.ts | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/packages/react/src/hooks/useModal.ts b/packages/react/src/hooks/useModal.ts index 002986eb..ab11d317 100644 --- a/packages/react/src/hooks/useModal.ts +++ b/packages/react/src/hooks/useModal.ts @@ -57,6 +57,10 @@ export function useCheckForModalCollision(flow: Flow, isModal = true) { } } + if (currentModal === null) { + claimLock(flow.id) + } + // If we didn't short circuit and didn't have the lock, assume that we're out of lock luck. return { hasModalCollision: true, From 32d72bc8b37c43a56c69f9b3d4a4525b9cace149 Mon Sep 17 00:00:00 2001 From: christianmat Date: Mon, 2 Dec 2024 15:49:23 -0800 Subject: [PATCH 077/213] changeset --- .changeset/itchy-carrots-occur.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/itchy-carrots-occur.md diff --git a/.changeset/itchy-carrots-occur.md b/.changeset/itchy-carrots-occur.md new file mode 100644 index 00000000..830ee98a --- /dev/null +++ b/.changeset/itchy-carrots-occur.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": patch +--- + +Fixes an issue where `flow.restart()` followed by `flow.start()` could cause Dialog flows not to show up From 5a7460765559d3c3ebb224df4b90ea2428ba7ecc Mon Sep 17 00:00:00 2001 From: christianmat Date: Mon, 2 Dec 2024 15:56:24 -0800 Subject: [PATCH 078/213] tests: fix flaky test --- .../stories/Collection/CollectionInteractionTests.stories.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/smithy/src/stories/Collection/CollectionInteractionTests.stories.tsx b/apps/smithy/src/stories/Collection/CollectionInteractionTests.stories.tsx index 0a80229c..5d9e2bef 100644 --- a/apps/smithy/src/stories/Collection/CollectionInteractionTests.stories.tsx +++ b/apps/smithy/src/stories/Collection/CollectionInteractionTests.stories.tsx @@ -112,7 +112,7 @@ export const InteractionTests: CollectionStory = { "Test that the default collection can render url-based announcement", async () => { const canvas = within(document.body); - await sleep(300); + await sleep(500); await expect(canvas.queryByRole("dialog")).not.toBeInTheDocument(); await userEvent.click( From 544f60737bd156582d8959030ae3d0924f7b6b08 Mon Sep 17 00:00:00 2001 From: christianmat Date: Mon, 2 Dec 2024 16:26:15 -0800 Subject: [PATCH 079/213] fix: remove bad useState --- packages/react/src/hooks/useModal.ts | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/packages/react/src/hooks/useModal.ts b/packages/react/src/hooks/useModal.ts index ab11d317..14eb7793 100644 --- a/packages/react/src/hooks/useModal.ts +++ b/packages/react/src/hooks/useModal.ts @@ -8,7 +8,7 @@ export function useCheckForModalCollision(flow: Flow, isModal = true) { const claimLock = useCallback( (flowId: string) => { - if (isModal && flow.isVisible) { + if (isModal && flow?.isVisible) { setCurrentModal(flowId) } }, @@ -58,7 +58,9 @@ export function useCheckForModalCollision(flow: Flow, isModal = true) { } if (currentModal === null) { - claimLock(flow.id) + return { + hasModalCollision: false, + } } // If we didn't short circuit and didn't have the lock, assume that we're out of lock luck. From fc396c3b2c4c1c8d30b61d0aef17a40debee3382 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Mon, 2 Dec 2024 16:30:42 -0800 Subject: [PATCH 080/213] Version Packages (#400) Co-authored-by: github-actions[bot] --- .changeset/itchy-carrots-occur.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/itchy-carrots-occur.md diff --git a/.changeset/itchy-carrots-occur.md b/.changeset/itchy-carrots-occur.md deleted file mode 100644 index 830ee98a..00000000 --- a/.changeset/itchy-carrots-occur.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": patch ---- - -Fixes an issue where `flow.restart()` followed by `flow.start()` could cause Dialog flows not to show up diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index b86534c0..865ddd44 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/react +## 2.6.2 + +### Patch Changes + +- 32d72bc: Fixes an issue where `flow.restart()` followed by `flow.start()` could cause Dialog flows not to show up + ## 2.6.1 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 423dc11d..2af58fc7 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.6.1", + "version": "2.6.2", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From b17ae3de50994217fafcda7aa6baf40657f3ce79 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Tue, 3 Dec 2024 00:33:13 +0000 Subject: [PATCH 081/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 9310cd7e..8d2d5ce0 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.6.1'; \ No newline at end of file +export const SDK_VERSION = '2.6.2'; \ No newline at end of file From 51c62d615f71f9cd5cea318ba60e0e8d310f1843 Mon Sep 17 00:00:00 2001 From: christianmat Date: Tue, 3 Dec 2024 14:29:41 -0800 Subject: [PATCH 082/213] feat: show error logs when useFlow is used outside the context of the provider --- .changeset/rude-bugs-boil.md | 5 +++++ apps/smithy/.storybook/preview.tsx | 2 +- packages/react/src/hooks/useFlow.ts | 7 ++++++- packages/react/src/hooks/useFrigade.ts | 8 +++++++- packages/react/src/hooks/useGroup.ts | 7 ++++++- packages/react/src/hooks/useUser.ts | 7 ++++++- packages/react/src/shared/log.ts | 13 +++++++++++++ 7 files changed, 44 insertions(+), 5 deletions(-) create mode 100644 .changeset/rude-bugs-boil.md create mode 100644 packages/react/src/shared/log.ts diff --git a/.changeset/rude-bugs-boil.md b/.changeset/rude-bugs-boil.md new file mode 100644 index 00000000..604c8614 --- /dev/null +++ b/.changeset/rude-bugs-boil.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": patch +--- + +Show error logs when hooks are used outside the context of the `Frigade.Provider` diff --git a/apps/smithy/.storybook/preview.tsx b/apps/smithy/.storybook/preview.tsx index 20b41f41..6dcbebda 100644 --- a/apps/smithy/.storybook/preview.tsx +++ b/apps/smithy/.storybook/preview.tsx @@ -1,5 +1,5 @@ import * as React from "react"; -import { FrigadeJS, Provider } from "@frigade/react"; +import { FrigadeJS, Provider, useFlow } from "@frigade/react"; import "./global.css"; diff --git a/packages/react/src/hooks/useFlow.ts b/packages/react/src/hooks/useFlow.ts index d4dcd1f6..bcb21b16 100644 --- a/packages/react/src/hooks/useFlow.ts +++ b/packages/react/src/hooks/useFlow.ts @@ -2,6 +2,7 @@ import { type Flow } from '@frigade/js' import { useCallback, useContext, useEffect, useState, useSyncExternalStore } from 'react' import { FrigadeContext } from '@/components/Provider' +import { logOnce } from '../shared/log' export interface FlowConfig { variables?: Record @@ -14,7 +15,11 @@ export function useFlow( flow: Flow | undefined isLoading: boolean } { - const { frigade, variables } = useContext(FrigadeContext) + const context = useContext(FrigadeContext) + if (!context || !context.frigade) { + logOnce(`useFlow('${flowId}') must be used in a child of the Frigade Provider`, 'error') + } + const { frigade, variables } = context ?? {} const [, setForceRender] = useState(false) const subscribe = useCallback( diff --git a/packages/react/src/hooks/useFrigade.ts b/packages/react/src/hooks/useFrigade.ts index d36a7059..8a87d2bb 100644 --- a/packages/react/src/hooks/useFrigade.ts +++ b/packages/react/src/hooks/useFrigade.ts @@ -1,9 +1,15 @@ import { useContext } from 'react' import { FrigadeContext } from '@/components/Provider' +import { logOnce } from '../shared/log' export function useFrigade() { - const { frigade } = useContext(FrigadeContext) + const context = useContext(FrigadeContext) + if (!context || !context.frigade) { + logOnce('useFrigade() must be used in a child of the Frigade Provider', 'error') + } + + const { frigade } = context return { frigade, isLoading: !frigade?.isReady() } } diff --git a/packages/react/src/hooks/useGroup.ts b/packages/react/src/hooks/useGroup.ts index 9f08556f..7a1c7f8c 100644 --- a/packages/react/src/hooks/useGroup.ts +++ b/packages/react/src/hooks/useGroup.ts @@ -1,9 +1,14 @@ import { useContext } from 'react' import { FrigadeContext } from '@/components/Provider' +import { logOnce } from '../shared/log' export function useGroup() { - const { frigade } = useContext(FrigadeContext) + const context = useContext(FrigadeContext) + if (!context || !context.frigade) { + logOnce('useGroup() must be used in a child of the Frigade Provider', 'error') + } + const { frigade } = context ?? {} /** * Sets properties for the current group diff --git a/packages/react/src/hooks/useUser.ts b/packages/react/src/hooks/useUser.ts index 7c485224..199cc5da 100644 --- a/packages/react/src/hooks/useUser.ts +++ b/packages/react/src/hooks/useUser.ts @@ -1,9 +1,14 @@ import { useContext } from 'react' import { FrigadeContext } from '@/components/Provider' +import { logOnce } from '../shared/log' export function useUser() { - const { userId, frigade } = useContext(FrigadeContext) + const context = useContext(FrigadeContext) + if (!context || !context.frigade) { + logOnce('useUser() must be used in a child of the Frigade Provider', 'error') + } + const { userId, frigade } = context ?? {} /** * Adds properties for the current user diff --git a/packages/react/src/shared/log.ts b/packages/react/src/shared/log.ts new file mode 100644 index 00000000..d02f6235 --- /dev/null +++ b/packages/react/src/shared/log.ts @@ -0,0 +1,13 @@ +const logOnce = (message: string, type: 'log' | 'warn' | 'error' = 'log') => { + const key = `__frigade_logged_${message}` + + if (globalThis[key as keyof typeof globalThis]) { + return + } + + // @ts-expect-error: globalThis is not typed + globalThis[key as keyof typeof globalThis] = true + console[type](message) +} + +export { logOnce } From 079484d5edad5d83fc7a3d16616d1fedbde3eb62 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Tue, 3 Dec 2024 14:33:05 -0800 Subject: [PATCH 083/213] Version Packages (#401) Co-authored-by: github-actions[bot] --- .changeset/rude-bugs-boil.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/rude-bugs-boil.md diff --git a/.changeset/rude-bugs-boil.md b/.changeset/rude-bugs-boil.md deleted file mode 100644 index 604c8614..00000000 --- a/.changeset/rude-bugs-boil.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": patch ---- - -Show error logs when hooks are used outside the context of the `Frigade.Provider` diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 865ddd44..c26a4caf 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/react +## 2.6.3 + +### Patch Changes + +- 51c62d6: Show error logs when hooks are used outside the context of the `Frigade.Provider` + ## 2.6.2 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 2af58fc7..236b7684 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.6.2", + "version": "2.6.3", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From f1c2a330f06d592b9aa1462f5e34a2266d4b926b Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Tue, 3 Dec 2024 22:35:36 +0000 Subject: [PATCH 084/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 8d2d5ce0..d6e5bdf3 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.6.2'; \ No newline at end of file +export const SDK_VERSION = '2.6.3'; \ No newline at end of file From 1e549bfd126e3d136a3fe266b8387189c41a3fe1 Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Fri, 6 Dec 2024 15:39:57 -0600 Subject: [PATCH 085/213] Shim useSyncExternalStore for React 17 --- packages/react/package.json | 4 +++- packages/react/src/hooks/useCollections.ts | 6 +++--- packages/react/src/hooks/useFlow.ts | 5 +++-- .../react/src/hooks/useSyncExternalStore.ts | 10 ++++++++++ yarn.lock | 18 ++++++++++++++++++ 5 files changed, 37 insertions(+), 6 deletions(-) create mode 100644 packages/react/src/hooks/useSyncExternalStore.ts diff --git a/packages/react/package.json b/packages/react/package.json index 236b7684..4a238896 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -63,7 +63,8 @@ "jsdom": "^23.0.1", "known-css-properties": "^0.29.0", "react-hook-form": "^7.49.3", - "react-remove-scroll": "^2.5.10" + "react-remove-scroll": "^2.5.10", + "use-sync-external-store": "^1.4.0" }, "peerDependencies": { "react": "17 - 18", @@ -75,6 +76,7 @@ "@types/node": "^20.10.5", "@types/react": "^18.2.34", "@types/react-dom": "^18.2.14", + "@types/use-sync-external-store": "^0.0.6", "@typescript-eslint/eslint-plugin": "^6.20.0", "@typescript-eslint/parser": "^6.20.0", "eslint": "^8.56.0", diff --git a/packages/react/src/hooks/useCollections.ts b/packages/react/src/hooks/useCollections.ts index 86b89191..29d896c0 100644 --- a/packages/react/src/hooks/useCollections.ts +++ b/packages/react/src/hooks/useCollections.ts @@ -1,8 +1,8 @@ -import { useCallback, useContext, useState, useSyncExternalStore } from 'react' +import { useCallback, useContext, useState } from 'react' +import { CollectionsList } from '@frigade/js' import { FrigadeContext } from '@/components/Provider' - -import { CollectionsList } from '@frigade/js' +import { useSyncExternalStore } from '@/hooks/useSyncExternalStore' export function useCollections() { const { frigade } = useContext(FrigadeContext) diff --git a/packages/react/src/hooks/useFlow.ts b/packages/react/src/hooks/useFlow.ts index bcb21b16..92c576c7 100644 --- a/packages/react/src/hooks/useFlow.ts +++ b/packages/react/src/hooks/useFlow.ts @@ -1,8 +1,9 @@ import { type Flow } from '@frigade/js' -import { useCallback, useContext, useEffect, useState, useSyncExternalStore } from 'react' +import { useCallback, useContext, useEffect, useState } from 'react' import { FrigadeContext } from '@/components/Provider' -import { logOnce } from '../shared/log' +import { useSyncExternalStore } from '@/hooks/useSyncExternalStore' +import { logOnce } from '@/shared/log' export interface FlowConfig { variables?: Record diff --git a/packages/react/src/hooks/useSyncExternalStore.ts b/packages/react/src/hooks/useSyncExternalStore.ts new file mode 100644 index 00000000..65464a55 --- /dev/null +++ b/packages/react/src/hooks/useSyncExternalStore.ts @@ -0,0 +1,10 @@ +import * as React from 'react' +import * as UseSyncExternalStoreShim from 'use-sync-external-store/shim' + +// useSyncExternalStore doesn't exist in React 17, so shim it if necessary +const useSyncExternalStore = + 'useSyncExternalStore' in React + ? React.useSyncExternalStore + : UseSyncExternalStoreShim.useSyncExternalStore + +export { useSyncExternalStore } diff --git a/yarn.lock b/yarn.lock index e9930191..d5953643 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3767,6 +3767,7 @@ __metadata: "@types/node": "npm:^20.10.5" "@types/react": "npm:^18.2.34" "@types/react-dom": "npm:^18.2.14" + "@types/use-sync-external-store": "npm:^0.0.6" "@typescript-eslint/eslint-plugin": "npm:^6.20.0" "@typescript-eslint/parser": "npm:^6.20.0" clsx: "npm:^2.0.0" @@ -3789,6 +3790,7 @@ __metadata: typedoc: "npm:^0.25.12" typedoc-plugin-markdown: "npm:^3.17.1" typescript: "npm:^4.9.4" + use-sync-external-store: "npm:^1.4.0" peerDependencies: react: 17 - 18 react-dom: 17 - 18 @@ -7916,6 +7918,13 @@ __metadata: languageName: node linkType: hard +"@types/use-sync-external-store@npm:^0.0.6": + version: 0.0.6 + resolution: "@types/use-sync-external-store@npm:0.0.6" + checksum: 10/a95ce330668501ad9b1c5b7f2b14872ad201e552a0e567787b8f1588b22c7040c7c3d80f142cbb9f92d13c4ea41c46af57a20f2af4edf27f224d352abcfe4049 + languageName: node + linkType: hard + "@types/uuid@npm:^9.0.1": version: 9.0.8 resolution: "@types/uuid@npm:9.0.8" @@ -20346,6 +20355,15 @@ __metadata: languageName: node linkType: hard +"use-sync-external-store@npm:^1.4.0": + version: 1.4.0 + resolution: "use-sync-external-store@npm:1.4.0" + peerDependencies: + react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 + checksum: 10/08bf581a8a2effaefc355e9d18ed025d436230f4cc973db2f593166df357cf63e47b9097b6e5089b594758bde322e1737754ad64905e030d70f8ff7ee671fd01 + languageName: node + linkType: hard + "util-deprecate@npm:^1.0.1, util-deprecate@npm:^1.0.2, util-deprecate@npm:~1.0.1": version: 1.0.2 resolution: "util-deprecate@npm:1.0.2" From 3855645e2a13763a45c3f7325dadf6991d52b165 Mon Sep 17 00:00:00 2001 From: christianmat Date: Fri, 6 Dec 2024 14:10:22 -0800 Subject: [PATCH 086/213] changeset --- .changeset/cyan-trees-grin.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/cyan-trees-grin.md diff --git a/.changeset/cyan-trees-grin.md b/.changeset/cyan-trees-grin.md new file mode 100644 index 00000000..d98d1b81 --- /dev/null +++ b/.changeset/cyan-trees-grin.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": patch +--- + +Fixes an issue with React 17 related to useSyncExternalStore From 6e5a578915beec15246b441513368e12d7d4c6bb Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Fri, 6 Dec 2024 14:17:18 -0800 Subject: [PATCH 087/213] Version Packages (#402) Co-authored-by: github-actions[bot] --- .changeset/cyan-trees-grin.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/cyan-trees-grin.md diff --git a/.changeset/cyan-trees-grin.md b/.changeset/cyan-trees-grin.md deleted file mode 100644 index d98d1b81..00000000 --- a/.changeset/cyan-trees-grin.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": patch ---- - -Fixes an issue with React 17 related to useSyncExternalStore diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index c26a4caf..98f32ceb 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/react +## 2.6.4 + +### Patch Changes + +- 3855645: Fixes an issue with React 17 related to useSyncExternalStore + ## 2.6.3 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 4a238896..0067a1cb 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.6.3", + "version": "2.6.4", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From dc8a592292548ac87857ff7d168610b970463be1 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Fri, 6 Dec 2024 22:19:49 +0000 Subject: [PATCH 088/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index d6e5bdf3..3fda3d6c 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.6.3'; \ No newline at end of file +export const SDK_VERSION = '2.6.4'; \ No newline at end of file From a1a4d3d4d9177448cf1ee3c938826b648d0965ce Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Mon, 9 Dec 2024 12:37:37 -0800 Subject: [PATCH 089/213] Fix issue with ESM import of use-sync-external-store. See: https://github.com/facebook/react/pull/25231 --- packages/react/src/hooks/useSyncExternalStore.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/hooks/useSyncExternalStore.ts b/packages/react/src/hooks/useSyncExternalStore.ts index 65464a55..7ee82e5b 100644 --- a/packages/react/src/hooks/useSyncExternalStore.ts +++ b/packages/react/src/hooks/useSyncExternalStore.ts @@ -1,5 +1,5 @@ import * as React from 'react' -import * as UseSyncExternalStoreShim from 'use-sync-external-store/shim' +import * as UseSyncExternalStoreShim from 'use-sync-external-store/shim/index.js' // useSyncExternalStore doesn't exist in React 17, so shim it if necessary const useSyncExternalStore = From 38087819faf80b3f713efa61530947b810cd2d58 Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Mon, 9 Dec 2024 12:38:39 -0800 Subject: [PATCH 090/213] Changeset --- .changeset/afraid-buttons-wait.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/afraid-buttons-wait.md diff --git a/.changeset/afraid-buttons-wait.md b/.changeset/afraid-buttons-wait.md new file mode 100644 index 00000000..b41ee6b2 --- /dev/null +++ b/.changeset/afraid-buttons-wait.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": patch +--- + +Fix issue with ESM import of use-sync-external-store. From b3b3099a1a520613756372e9d5fa77ac3be57c72 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Mon, 9 Dec 2024 14:32:53 -0800 Subject: [PATCH 091/213] Version Packages (#403) Co-authored-by: github-actions[bot] --- .changeset/afraid-buttons-wait.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/afraid-buttons-wait.md diff --git a/.changeset/afraid-buttons-wait.md b/.changeset/afraid-buttons-wait.md deleted file mode 100644 index b41ee6b2..00000000 --- a/.changeset/afraid-buttons-wait.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": patch ---- - -Fix issue with ESM import of use-sync-external-store. diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 98f32ceb..581ff0ba 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/react +## 2.6.5 + +### Patch Changes + +- 3808781: Fix issue with ESM import of use-sync-external-store. + ## 2.6.4 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 0067a1cb..adc56488 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.6.4", + "version": "2.6.5", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From 68564f1eef3af9f2703365bdbaa62c93ff3f08e8 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Mon, 9 Dec 2024 22:35:23 +0000 Subject: [PATCH 092/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 3fda3d6c..f6ea5304 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.6.4'; \ No newline at end of file +export const SDK_VERSION = '2.6.5'; \ No newline at end of file From 991ebe28f2d32245c3bfd0f7009a4d088e7429f2 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Mon, 16 Dec 2024 14:00:21 -0800 Subject: [PATCH 093/213] feat: add additional options to the nps component (#405) * feat: add additional options to the nps component * update css * add heuristic for jumpiness * changeset --- .changeset/eighty-laws-exercise.md | 5 ++ .../src/stories/Survey/Survey.stories.tsx | 12 +++- packages/react/src/components/Survey/NPS.tsx | 68 +++++++++++++++++-- .../react/src/components/Survey/NPSField.tsx | 27 +++++--- 4 files changed, 98 insertions(+), 14 deletions(-) create mode 100644 .changeset/eighty-laws-exercise.md diff --git a/.changeset/eighty-laws-exercise.md b/.changeset/eighty-laws-exercise.md new file mode 100644 index 00000000..a94cf369 --- /dev/null +++ b/.changeset/eighty-laws-exercise.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": patch +--- + +Adds the ability to override the default scoring (options) on the `Survey.NPS` component diff --git a/apps/smithy/src/stories/Survey/Survey.stories.tsx b/apps/smithy/src/stories/Survey/Survey.stories.tsx index 8a6a91b3..6b03ca28 100644 --- a/apps/smithy/src/stories/Survey/Survey.stories.tsx +++ b/apps/smithy/src/stories/Survey/Survey.stories.tsx @@ -8,13 +8,21 @@ export default { export const NPS = { args: { + flowId: "flow_SJjL59eSt9A112vJ", dismissible: true, + options: [ + { label: "😞", value: "0" }, + { label: "😕", value: "1" }, + { label: "😐", value: "2" }, + { label: "🙂", value: "3" }, + { label: "😍", value: "4" }, + ], }, decorators: [ (_: StoryFn, options: StoryContext) => { return ( - + Other elements on the page { @@ -24,7 +32,7 @@ export const NPS = { Change url ({ label: `${i}`, value: `${i}` })) + const npsOptions = options || defaultOptions + return (
( + + ), ...fieldTypes, }} modal={false} @@ -33,11 +80,21 @@ export function NPS({ as = Dialog, flowId, fieldTypes, part, ...props }: FormPro // Hides the submit button on the first page ...(!flow || flow.getCurrentStepIndex() == 0 ? { '.fr-form-step-footer': { display: 'none' } } - : {}), + : { + '.fr-card-header': { + // Heuristic to prevent width jumpiness between first and second step + minWidth: npsOptions.length * 51, + }, + }), '.fr-form': { padding: '20px', + '@media (max-width: 660px)': { + minWidth: '100%', + }, + }, + '.fr-nps-field': { '@media (min-width: 660px)': { - minWidth: '600px', + minWidth: 'fit-content', }, minWidth: '100%', }, @@ -47,6 +104,9 @@ export function NPS({ as = Dialog, flowId, fieldTypes, part, ...props }: FormPro gap: '1', }, }, + '.fr-nps': { + maxWidth: 'min-content', + }, ...((props.css as object) ?? {}), }, }} diff --git a/packages/react/src/components/Survey/NPSField.tsx b/packages/react/src/components/Survey/NPSField.tsx index cb77ef1f..e7ec0df0 100644 --- a/packages/react/src/components/Survey/NPSField.tsx +++ b/packages/react/src/components/Survey/NPSField.tsx @@ -3,18 +3,29 @@ import { Flex } from '@/components/Flex' import { FormFieldProps } from '@/components/Form' import { Text } from '@/components/Text' -export function NPSField({ field, fieldData, submit }: FormFieldProps) { - const buttons = [...Array(11)].map((_, i) => { - const Component = field.value === i ? Button.Primary : Button.Secondary +export function NPSField({ + field, + fieldData, + submit, + options, + positiveLabel, + negativeLabel, +}: FormFieldProps & { + options: { label: string; value: string }[] + positiveLabel?: string + negativeLabel?: string +}) { + const buttons = options.map((option) => { + const Component = field.value === option.value ? Button.Primary : Button.Secondary return ( { - field.onChange(i) + field.onChange(option.value) submit() }} - title={`${i}`} + title={option.label} css={{ '.fr-button-title': { fontSize: '15px', @@ -41,10 +52,10 @@ export function NPSField({ field, fieldData, submit }: FormFieldProps) { - {fieldData.negativeLabel ?? `Not likely at all`} + {fieldData.negativeLabel ?? negativeLabel} - {fieldData.positiveLabel ?? `Extremely likely`} + {fieldData.positiveLabel ?? positiveLabel} From 51c0d8192d9e859955f15a730b58bc9a2557193d Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Mon, 16 Dec 2024 14:03:59 -0800 Subject: [PATCH 094/213] Version Packages (#406) Co-authored-by: github-actions[bot] --- .changeset/eighty-laws-exercise.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/eighty-laws-exercise.md diff --git a/.changeset/eighty-laws-exercise.md b/.changeset/eighty-laws-exercise.md deleted file mode 100644 index a94cf369..00000000 --- a/.changeset/eighty-laws-exercise.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": patch ---- - -Adds the ability to override the default scoring (options) on the `Survey.NPS` component diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 581ff0ba..57b62f80 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/react +## 2.6.6 + +### Patch Changes + +- 991ebe2: Adds the ability to override the default scoring (options) on the `Survey.NPS` component + ## 2.6.5 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index adc56488..2044938a 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.6.5", + "version": "2.6.6", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From c057a19d9842b3c980e595dc297e81f16d5318a0 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Mon, 16 Dec 2024 22:06:07 +0000 Subject: [PATCH 095/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index f6ea5304..988eaf45 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.6.5'; \ No newline at end of file +export const SDK_VERSION = '2.6.6'; \ No newline at end of file From c79d0f53c4644e1ed6bf7fb427e5f51e7bad2b99 Mon Sep 17 00:00:00 2001 From: christianmat Date: Wed, 18 Dec 2024 12:56:32 -0800 Subject: [PATCH 096/213] fix: switch to warn level for hook errors --- packages/react/src/hooks/useFlow.ts | 2 +- packages/react/src/hooks/useFrigade.ts | 2 +- packages/react/src/hooks/useGroup.ts | 2 +- packages/react/src/hooks/useUser.ts | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/react/src/hooks/useFlow.ts b/packages/react/src/hooks/useFlow.ts index 92c576c7..60ee9b3b 100644 --- a/packages/react/src/hooks/useFlow.ts +++ b/packages/react/src/hooks/useFlow.ts @@ -18,7 +18,7 @@ export function useFlow( } { const context = useContext(FrigadeContext) if (!context || !context.frigade) { - logOnce(`useFlow('${flowId}') must be used in a child of the Frigade Provider`, 'error') + logOnce(`useFlow('${flowId}') must be used in a child of the Frigade Provider`, 'warn') } const { frigade, variables } = context ?? {} const [, setForceRender] = useState(false) diff --git a/packages/react/src/hooks/useFrigade.ts b/packages/react/src/hooks/useFrigade.ts index 8a87d2bb..e967f3fa 100644 --- a/packages/react/src/hooks/useFrigade.ts +++ b/packages/react/src/hooks/useFrigade.ts @@ -6,7 +6,7 @@ import { logOnce } from '../shared/log' export function useFrigade() { const context = useContext(FrigadeContext) if (!context || !context.frigade) { - logOnce('useFrigade() must be used in a child of the Frigade Provider', 'error') + logOnce('useFrigade() must be used in a child of the Frigade Provider', 'warn') } const { frigade } = context diff --git a/packages/react/src/hooks/useGroup.ts b/packages/react/src/hooks/useGroup.ts index 7a1c7f8c..bcbc3143 100644 --- a/packages/react/src/hooks/useGroup.ts +++ b/packages/react/src/hooks/useGroup.ts @@ -6,7 +6,7 @@ import { logOnce } from '../shared/log' export function useGroup() { const context = useContext(FrigadeContext) if (!context || !context.frigade) { - logOnce('useGroup() must be used in a child of the Frigade Provider', 'error') + logOnce('useGroup() must be used in a child of the Frigade Provider', 'warn') } const { frigade } = context ?? {} diff --git a/packages/react/src/hooks/useUser.ts b/packages/react/src/hooks/useUser.ts index 199cc5da..82296389 100644 --- a/packages/react/src/hooks/useUser.ts +++ b/packages/react/src/hooks/useUser.ts @@ -6,7 +6,7 @@ import { logOnce } from '../shared/log' export function useUser() { const context = useContext(FrigadeContext) if (!context || !context.frigade) { - logOnce('useUser() must be used in a child of the Frigade Provider', 'error') + logOnce('useUser() must be used in a child of the Frigade Provider', 'warn') } const { userId, frigade } = context ?? {} From 0a6c80d6ea8efd35ec92fbf70c2e1f3019b968eb Mon Sep 17 00:00:00 2001 From: christianmat Date: Wed, 18 Dec 2024 13:52:12 -0800 Subject: [PATCH 097/213] fix: generateGuestId edge case with hooks --- .changeset/weak-trees-dress.md | 6 ++++ apps/smithy/.storybook/preview.tsx | 2 +- packages/js-api/src/core/frigade.ts | 41 +++++++++++++++++++++--- packages/js-api/src/shared/fetchable.ts | 3 -- packages/js-api/src/shared/state.ts | 2 +- packages/js-api/src/shared/utils.ts | 10 +++--- packages/js-api/test/frigade.int.test.ts | 2 +- packages/react/src/hooks/useGroup.ts | 9 +++++- packages/react/src/hooks/useUser.ts | 5 +-- 9 files changed, 62 insertions(+), 18 deletions(-) create mode 100644 .changeset/weak-trees-dress.md diff --git a/.changeset/weak-trees-dress.md b/.changeset/weak-trees-dress.md new file mode 100644 index 00000000..701c60f6 --- /dev/null +++ b/.changeset/weak-trees-dress.md @@ -0,0 +1,6 @@ +--- +"@frigade/js": patch +"@frigade/react": patch +--- + +Fixes an issue where `generateGuestId` if used with the `useFrigade()` could cause components not to load diff --git a/apps/smithy/.storybook/preview.tsx b/apps/smithy/.storybook/preview.tsx index 6dcbebda..2180aa9d 100644 --- a/apps/smithy/.storybook/preview.tsx +++ b/apps/smithy/.storybook/preview.tsx @@ -35,7 +35,7 @@ const preview = { apiKey={FRIGADE_API_KEY} apiUrl={FRIGADE_API_URL} defaultCollection={true} - // generateGuestId={false} + // generateGuestId={true} userId={FRIGADE_USER_ID} // syncOnWindowUpdates={false} diff --git a/packages/js-api/src/core/frigade.ts b/packages/js-api/src/core/frigade.ts index 915b4f6c..240f42da 100644 --- a/packages/js-api/src/core/frigade.ts +++ b/packages/js-api/src/core/frigade.ts @@ -38,6 +38,10 @@ export class Frigade extends Fetchable { * @ignore */ private hasFailed = false + /** + * @ignore + */ + private lastSessionDTO?: SessionDTO /** * @ignore @@ -112,7 +116,7 @@ export class Frigade extends Fetchable { ...config, }) - if (!this.config.userId && this.config.generateGuestId === false) { + if (!this.config.userId) { return } @@ -146,13 +150,19 @@ export class Frigade extends Fetchable { * @param properties */ public async identify(userId: string, properties?: PropertyPayload): Promise { - await this.updateConfig({ ...this.config, userId }) + if (userId !== this.config.userId) { + await this.updateConfig({ ...this.config, userId }) + await this.reload() + } + await this.initIfNeeded() - await this.session({ + const isNewSession = await this.session({ userId: this.config.userId, userProperties: properties, }) - await this.resync() + if (isNewSession) { + await this.resync() + } } /** @@ -217,10 +227,20 @@ export class Frigade extends Fetchable { * @ignore */ private async session(sessionDTO: SessionDTO) { + const lastSessionDTO = this.lastSessionDTO + + if (lastSessionDTO && JSON.stringify(lastSessionDTO) === JSON.stringify(sessionDTO)) { + return false + } + await this.fetch('/v1/public/sessions', { method: 'POST', body: JSON.stringify(sessionDTO), }) + + this.lastSessionDTO = sessionDTO + + return true } /** @@ -235,6 +255,13 @@ export class Frigade extends Fetchable { * @param flowId */ public async getFlow(flowId: string) { + if ( + this.getConfig().generateGuestId === false && + this.getConfig().userId && + this.getConfig().userId.startsWith(GUEST_PREFIX) + ) { + return undefined + } await this.initIfNeeded() return this.getFlowSync(flowId) @@ -249,6 +276,12 @@ export class Frigade extends Fetchable { public async getFlows() { await this.initIfNeeded() + if ( + this.config.generateGuestId === false && + this.getConfig().userId?.startsWith(GUEST_PREFIX) + ) { + return [] + } return this.flows } diff --git a/packages/js-api/src/shared/fetchable.ts b/packages/js-api/src/shared/fetchable.ts index bbc76e3e..54d191c6 100644 --- a/packages/js-api/src/shared/fetchable.ts +++ b/packages/js-api/src/shared/fetchable.ts @@ -13,9 +13,6 @@ export class Fetchable { constructor(config: FrigadeConfig) { const filteredConfig = Object.fromEntries(Object.entries(config).filter(([_, v]) => v != null)) - if (!config.userId && config.generateGuestId === false) { - delete this.config.userId - } this.config = { ...this.config, ...filteredConfig, diff --git a/packages/js-api/src/shared/state.ts b/packages/js-api/src/shared/state.ts index 86f0409f..c224def1 100644 --- a/packages/js-api/src/shared/state.ts +++ b/packages/js-api/src/shared/state.ts @@ -1,4 +1,4 @@ -import { FlowStates, FlowStep, FrigadeConfig, StatefulFlow } from '../core/types' +import { FlowStates, FlowStep, FrigadeConfig, SessionDTO, StatefulFlow } from '../core/types' import { Flow } from '../core/flow' import type { Collections } from '../core/collections' diff --git a/packages/js-api/src/shared/utils.ts b/packages/js-api/src/shared/utils.ts index 2a2763d1..cb677889 100644 --- a/packages/js-api/src/shared/utils.ts +++ b/packages/js-api/src/shared/utils.ts @@ -118,7 +118,7 @@ class CallQueue { } } -const callQueue = new CallQueue() +globalThis.callQueue = new CallQueue() export async function gracefulFetch( url: string, @@ -137,7 +137,7 @@ export async function gracefulFetch( const isWebPostRequest = isWeb() && options && options.body && options.method === 'POST' if (isWebPostRequest && !cancelPendingRequests) { - const cachedCall = callQueue.hasIdenticalRecentCall(lastCallDataKey) + const cachedCall = globalThis.callQueue.hasIdenticalRecentCall(lastCallDataKey) if (cachedCall != null && cachedCall.response != null) { const cachedResponse = await cachedCall.response @@ -149,13 +149,13 @@ export async function gracefulFetch( if (!response) { try { if (cancelPendingRequests) { - callQueue.cancelAllPendingRequests() + globalThis.callQueue.cancelAllPendingRequests() } const pendingResponse = fetch(url, options) if (isWebPostRequest) { - callQueue.push( + globalThis.callQueue.push( lastCallDataKey, // @ts-ignore pendingResponse.then((res) => res.clone()).catch(() => getEmptyResponse()) @@ -163,7 +163,7 @@ export async function gracefulFetch( } response = await pendingResponse - if (isWebPostRequest && !callQueue.hasCall(lastCallDataKey)) { + if (isWebPostRequest && !globalThis.callQueue.hasCall(lastCallDataKey)) { response = getEmptyResponse(REDUNDANT_CALL_MESSAGE) } } catch (error) { diff --git a/packages/js-api/test/frigade.int.test.ts b/packages/js-api/test/frigade.int.test.ts index a96393ca..a9c7689b 100644 --- a/packages/js-api/test/frigade.int.test.ts +++ b/packages/js-api/test/frigade.int.test.ts @@ -24,7 +24,7 @@ describe('Basic Checklist integration test', () => { }) let flows = await frigade.getFlows() expect(flows.length).toEqual(0) - expect(frigade.isReady()).toBeFalsy() + expect(frigade.isReady()).toBeTruthy() await frigade.identify(getRandomID()) flows = await frigade.getFlows() expect(flows.length).toBeGreaterThan(0) diff --git a/packages/react/src/hooks/useGroup.ts b/packages/react/src/hooks/useGroup.ts index bcbc3143..9e2b17be 100644 --- a/packages/react/src/hooks/useGroup.ts +++ b/packages/react/src/hooks/useGroup.ts @@ -9,6 +9,7 @@ export function useGroup() { logOnce('useGroup() must be used in a child of the Frigade Provider', 'warn') } const { frigade } = context ?? {} + const groupId = frigade?.getConfig()?.groupId /** * Sets properties for the current group @@ -40,5 +41,11 @@ export function useGroup() { await frigade.group(groupId, properties) } - return { groupId: frigade?.config?.groupId, setGroupId, addProperties, track } + return { + groupId, + setGroupId, + addProperties, + track, + isLoading: !frigade?.isReady(), + } } diff --git a/packages/react/src/hooks/useUser.ts b/packages/react/src/hooks/useUser.ts index 82296389..ae19ef77 100644 --- a/packages/react/src/hooks/useUser.ts +++ b/packages/react/src/hooks/useUser.ts @@ -8,7 +8,8 @@ export function useUser() { if (!context || !context.frigade) { logOnce('useUser() must be used in a child of the Frigade Provider', 'warn') } - const { userId, frigade } = context ?? {} + const { frigade } = context ?? {} + const userId = frigade?.config.userId /** * Adds properties for the current user @@ -27,5 +28,5 @@ export function useUser() { await frigade.track(eventName, properties) } - return { userId, addProperties, track } + return { userId, addProperties, track, isLoading: !frigade?.isReady() } } From 0f8706970c8ca7b93e7b7f1ad900dd57e5d2cf60 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Wed, 18 Dec 2024 14:47:34 -0800 Subject: [PATCH 098/213] Version Packages (#407) Co-authored-by: github-actions[bot] --- .changeset/weak-trees-dress.md | 6 ------ packages/js-api/CHANGELOG.md | 6 ++++++ packages/js-api/package.json | 2 +- packages/react/CHANGELOG.md | 8 ++++++++ packages/react/package.json | 4 ++-- 5 files changed, 17 insertions(+), 9 deletions(-) delete mode 100644 .changeset/weak-trees-dress.md diff --git a/.changeset/weak-trees-dress.md b/.changeset/weak-trees-dress.md deleted file mode 100644 index 701c60f6..00000000 --- a/.changeset/weak-trees-dress.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -"@frigade/js": patch -"@frigade/react": patch ---- - -Fixes an issue where `generateGuestId` if used with the `useFrigade()` could cause components not to load diff --git a/packages/js-api/CHANGELOG.md b/packages/js-api/CHANGELOG.md index f509bf40..2976ea05 100644 --- a/packages/js-api/CHANGELOG.md +++ b/packages/js-api/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/js +## 0.7.23 + +### Patch Changes + +- 0a6c80d: Fixes an issue where `generateGuestId` if used with the `useFrigade()` could cause components not to load + ## 0.7.22 ### Patch Changes diff --git a/packages/js-api/package.json b/packages/js-api/package.json index 3157189c..fde6d640 100644 --- a/packages/js-api/package.json +++ b/packages/js-api/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/js", - "version": "0.7.22", + "version": "0.7.23", "description": "The official Javascript SDK for Frigade.", "type": "module", "main": "./dist/index.js", diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 57b62f80..28c13d43 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,13 @@ # @frigade/react +## 2.6.7 + +### Patch Changes + +- 0a6c80d: Fixes an issue where `generateGuestId` if used with the `useFrigade()` could cause components not to load +- Updated dependencies [0a6c80d] + - @frigade/js@0.7.23 + ## 2.6.6 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 2044938a..cef8ce5d 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.6.6", + "version": "2.6.7", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", @@ -50,7 +50,7 @@ "dependencies": { "@emotion/react": "^11.11.4", "@floating-ui/react": "^0.26.22", - "@frigade/js": "^0.7.22", + "@frigade/js": "^0.7.23", "@radix-ui/react-checkbox": "^1.1.1", "@radix-ui/react-collapsible": "^1.0.3", "@radix-ui/react-dialog": "^1.0.5", From 3d93bdee01afcef3d6beca0396327ea3d5889557 Mon Sep 17 00:00:00 2001 From: christianmat Date: Wed, 18 Dec 2024 14:47:45 -0800 Subject: [PATCH 099/213] fix: yarn install --- yarn.lock | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/yarn.lock b/yarn.lock index d5953643..bde97a43 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3721,7 +3721,7 @@ __metadata: languageName: node linkType: hard -"@frigade/js@npm:^0.7.22, @frigade/js@workspace:packages/js-api": +"@frigade/js@npm:^0.7.23, @frigade/js@workspace:packages/js-api": version: 0.0.0-use.local resolution: "@frigade/js@workspace:packages/js-api" dependencies: @@ -3755,7 +3755,7 @@ __metadata: dependencies: "@emotion/react": "npm:^11.11.4" "@floating-ui/react": "npm:^0.26.22" - "@frigade/js": "npm:^0.7.22" + "@frigade/js": "npm:^0.7.23" "@radix-ui/react-checkbox": "npm:^1.1.1" "@radix-ui/react-collapsible": "npm:^1.0.3" "@radix-ui/react-dialog": "npm:^1.0.5" From 20d8c41e353c3d1e94fd98df2ec113bcefc9bab0 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Wed, 18 Dec 2024 14:48:33 -0800 Subject: [PATCH 100/213] chore(deps): bump nanoid from 3.3.7 to 3.3.8 (#404) Bumps [nanoid](https://github.com/ai/nanoid) from 3.3.7 to 3.3.8. - [Release notes](https://github.com/ai/nanoid/releases) - [Changelog](https://github.com/ai/nanoid/blob/main/CHANGELOG.md) - [Commits](https://github.com/ai/nanoid/compare/3.3.7...3.3.8) --- updated-dependencies: - dependency-name: nanoid dependency-type: indirect ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- yarn.lock | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/yarn.lock b/yarn.lock index bde97a43..1b2557b2 100644 --- a/yarn.lock +++ b/yarn.lock @@ -16057,11 +16057,11 @@ __metadata: linkType: hard "nanoid@npm:^3.3.7": - version: 3.3.7 - resolution: "nanoid@npm:3.3.7" + version: 3.3.8 + resolution: "nanoid@npm:3.3.8" bin: nanoid: bin/nanoid.cjs - checksum: 10/ac1eb60f615b272bccb0e2b9cd933720dad30bf9708424f691b8113826bb91aca7e9d14ef5d9415a6ba15c266b37817256f58d8ce980c82b0ba3185352565679 + checksum: 10/2d1766606cf0d6f47b6f0fdab91761bb81609b2e3d367027aff45e6ee7006f660fb7e7781f4a34799fe6734f1268eeed2e37a5fdee809ade0c2d4eb11b0f9c40 languageName: node linkType: hard From 34e28e95db8ea6feb2b67a8c122ab27db0c80554 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Wed, 18 Dec 2024 22:50:40 +0000 Subject: [PATCH 101/213] chore: run prepublish script --- packages/js-api/src/version.ts | 2 +- packages/react/src/version.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/js-api/src/version.ts b/packages/js-api/src/version.ts index beffbcf3..3a689a11 100644 --- a/packages/js-api/src/version.ts +++ b/packages/js-api/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '0.7.22'; \ No newline at end of file +export const SDK_VERSION = '0.7.23'; \ No newline at end of file diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 988eaf45..4abfa4dc 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.6.6'; \ No newline at end of file +export const SDK_VERSION = '2.6.7'; \ No newline at end of file From c77c1184659f4d0df43c7949fbf686a7622b220c Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Mon, 6 Jan 2025 14:25:15 -0800 Subject: [PATCH 102/213] Fix stale onDismiss closure in useFlowHandlers --- packages/react/src/hooks/useFlowHandlers.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/hooks/useFlowHandlers.ts b/packages/react/src/hooks/useFlowHandlers.ts index 29aab589..c58aa797 100644 --- a/packages/react/src/hooks/useFlowHandlers.ts +++ b/packages/react/src/hooks/useFlowHandlers.ts @@ -56,7 +56,7 @@ export function useFlowHandlers(flow: Flow, { onComplete, onDismiss }: FlowHandl flow.skip() }, - [flow] + [flow, onDismiss] ), } } From 58642a7084419da507f998aac6bb60c8c81f97e9 Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Mon, 6 Jan 2025 15:00:30 -0800 Subject: [PATCH 103/213] Fix dropped props between Tour and Hint --- apps/smithy/src/stories/Tour/Tour.stories.tsx | 46 +++++++++++-------- packages/react/src/components/Tour/Tour.tsx | 6 +++ 2 files changed, 32 insertions(+), 20 deletions(-) diff --git a/apps/smithy/src/stories/Tour/Tour.stories.tsx b/apps/smithy/src/stories/Tour/Tour.stories.tsx index c6d1d6bb..94342fac 100644 --- a/apps/smithy/src/stories/Tour/Tour.stories.tsx +++ b/apps/smithy/src/stories/Tour/Tour.stories.tsx @@ -1,6 +1,6 @@ import { Box, Button, Tour, type TourProps } from "@frigade/react"; import { StoryContext, StoryFn } from "@storybook/react"; -import { useEffect, useRef } from "react"; +import { useEffect, useRef, useState } from "react"; export default { title: "Components/Tour", @@ -23,28 +23,33 @@ export const Default = { }, decorators: [ (_: StoryFn, options: StoryContext) => { - // const [open, setOpen] = useState(true); + const [, setForceRender] = useState(Math.random()); + const [open, setOpen] = useState(true); // const { flow } = useFlow("flow_U63A5pndRrvCwxNs"); const lateAnchorRef = useRef(null); useEffect(() => { - // @ts-expect-error Shush TypeScript, it's a debug ref in a story, it's fine - lateAnchorRef.current = ( - - { - // no-op - }} - /> - - ); + setTimeout(() => { + // @ts-expect-error Shush TypeScript, it's a debug ref in a story, it's fine + lateAnchorRef.current = ( + + { + // no-op + }} + /> + + ); + + setForceRender(Math.random()); + }, 333); }, []); return ( @@ -77,11 +82,12 @@ export const Default = { Second anchor setOpen(false)} {...(options.args as TourProps)} /> diff --git a/packages/react/src/components/Tour/Tour.tsx b/packages/react/src/components/Tour/Tour.tsx index 3da3cdfd..494ca7ed 100644 --- a/packages/react/src/components/Tour/Tour.tsx +++ b/packages/react/src/components/Tour/Tour.tsx @@ -83,6 +83,8 @@ export function Tour({ as, flowId, ...props }: TourProps) { container = 'body', defaultOpen, modal, + onOpenChange, + open, part, sequential = true, side = 'bottom', @@ -104,6 +106,8 @@ export function Tour({ as, flowId, ...props }: TourProps) { modal, onPrimary, onSecondary, + onOpenChange, + open, part, side, sideOffset, @@ -166,6 +170,8 @@ export function Tour({ as, flowId, ...props }: TourProps) { handleDismiss: handleDismissStep, onPrimary, onSecondary, + onOpenChange, + open, part, side, sideOffset, From 600574bdc63f9348b7fad0467eea034aa8c6a7eb Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Mon, 6 Jan 2025 17:14:23 -0800 Subject: [PATCH 104/213] Temporarily disable pending request flushing --- packages/js-api/src/shared/utils.ts | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/packages/js-api/src/shared/utils.ts b/packages/js-api/src/shared/utils.ts index cb677889..96756140 100644 --- a/packages/js-api/src/shared/utils.ts +++ b/packages/js-api/src/shared/utils.ts @@ -148,9 +148,10 @@ export async function gracefulFetch( if (!response) { try { - if (cancelPendingRequests) { - globalThis.callQueue.cancelAllPendingRequests() - } + // TEMP: Disable pending request flushing + // if (cancelPendingRequests) { + // globalThis.callQueue.cancelAllPendingRequests() + // } const pendingResponse = fetch(url, options) From 28608665ec5fd66d6bd21a87f4d791583753a031 Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Mon, 6 Jan 2025 17:16:07 -0800 Subject: [PATCH 105/213] Changeset --- .changeset/sixty-pumpkins-wash.md | 6 ++++++ 1 file changed, 6 insertions(+) create mode 100644 .changeset/sixty-pumpkins-wash.md diff --git a/.changeset/sixty-pumpkins-wash.md b/.changeset/sixty-pumpkins-wash.md new file mode 100644 index 00000000..1f07dd65 --- /dev/null +++ b/.changeset/sixty-pumpkins-wash.md @@ -0,0 +1,6 @@ +--- +"@frigade/js": patch +"@frigade/react": patch +--- + +Bug fixes for onDismiss, onOpenChange, and URL-based Collection targeting From 2a36ab0216f401d767bfec4129181022756057ac Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Mon, 6 Jan 2025 17:36:31 -0800 Subject: [PATCH 106/213] Version Packages (#410) * Version Packages * Yarn --------- Co-authored-by: github-actions[bot] Co-authored-by: Micah Snyder --- .changeset/sixty-pumpkins-wash.md | 6 ------ packages/js-api/CHANGELOG.md | 6 ++++++ packages/js-api/package.json | 2 +- packages/react/CHANGELOG.md | 8 ++++++++ packages/react/package.json | 4 ++-- yarn.lock | 4 ++-- 6 files changed, 19 insertions(+), 11 deletions(-) delete mode 100644 .changeset/sixty-pumpkins-wash.md diff --git a/.changeset/sixty-pumpkins-wash.md b/.changeset/sixty-pumpkins-wash.md deleted file mode 100644 index 1f07dd65..00000000 --- a/.changeset/sixty-pumpkins-wash.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -"@frigade/js": patch -"@frigade/react": patch ---- - -Bug fixes for onDismiss, onOpenChange, and URL-based Collection targeting diff --git a/packages/js-api/CHANGELOG.md b/packages/js-api/CHANGELOG.md index 2976ea05..ed3a0fed 100644 --- a/packages/js-api/CHANGELOG.md +++ b/packages/js-api/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/js +## 0.7.24 + +### Patch Changes + +- 2860866: Bug fixes for onDismiss, onOpenChange, and URL-based Collection targeting + ## 0.7.23 ### Patch Changes diff --git a/packages/js-api/package.json b/packages/js-api/package.json index fde6d640..d32bb61b 100644 --- a/packages/js-api/package.json +++ b/packages/js-api/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/js", - "version": "0.7.23", + "version": "0.7.24", "description": "The official Javascript SDK for Frigade.", "type": "module", "main": "./dist/index.js", diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 28c13d43..3e9b7570 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,13 @@ # @frigade/react +## 2.6.8 + +### Patch Changes + +- 2860866: Bug fixes for onDismiss, onOpenChange, and URL-based Collection targeting +- Updated dependencies [2860866] + - @frigade/js@0.7.24 + ## 2.6.7 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index cef8ce5d..61f6f9fd 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.6.7", + "version": "2.6.8", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", @@ -50,7 +50,7 @@ "dependencies": { "@emotion/react": "^11.11.4", "@floating-ui/react": "^0.26.22", - "@frigade/js": "^0.7.23", + "@frigade/js": "^0.7.24", "@radix-ui/react-checkbox": "^1.1.1", "@radix-ui/react-collapsible": "^1.0.3", "@radix-ui/react-dialog": "^1.0.5", diff --git a/yarn.lock b/yarn.lock index 1b2557b2..eb1ca3e3 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3721,7 +3721,7 @@ __metadata: languageName: node linkType: hard -"@frigade/js@npm:^0.7.23, @frigade/js@workspace:packages/js-api": +"@frigade/js@npm:^0.7.24, @frigade/js@workspace:packages/js-api": version: 0.0.0-use.local resolution: "@frigade/js@workspace:packages/js-api" dependencies: @@ -3755,7 +3755,7 @@ __metadata: dependencies: "@emotion/react": "npm:^11.11.4" "@floating-ui/react": "npm:^0.26.22" - "@frigade/js": "npm:^0.7.23" + "@frigade/js": "npm:^0.7.24" "@radix-ui/react-checkbox": "npm:^1.1.1" "@radix-ui/react-collapsible": "npm:^1.0.3" "@radix-ui/react-dialog": "npm:^1.0.5" From e88ac6acc96a291f84d2ffa2c3801acae018df23 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Tue, 7 Jan 2025 01:39:08 +0000 Subject: [PATCH 107/213] chore: run prepublish script --- packages/js-api/src/version.ts | 2 +- packages/react/src/version.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/js-api/src/version.ts b/packages/js-api/src/version.ts index 3a689a11..981481d3 100644 --- a/packages/js-api/src/version.ts +++ b/packages/js-api/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '0.7.23'; \ No newline at end of file +export const SDK_VERSION = '0.7.24'; \ No newline at end of file diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 4abfa4dc..d2c08a5d 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.6.7'; \ No newline at end of file +export const SDK_VERSION = '2.6.8'; \ No newline at end of file From 317cdb38639d0409b43d2bfac840f71b8ae8a0c8 Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Tue, 7 Jan 2025 12:05:28 -0800 Subject: [PATCH 108/213] Add eslint-plugin-react-hooks and fix lint errors --- package.json | 1 + packages/react/.eslintrc.cjs | 2 +- .../Checklist/CarouselEmblaWrapper.tsx | 4 +- .../components/ClientPortal/ClientPortal.tsx | 2 +- .../react/src/components/Form/FormStep.tsx | 6 +-- .../src/components/Form/fields/BaseField.tsx | 2 +- .../components/Form/fields/CheckboxField.tsx | 4 +- .../Form/fields/SelectMultipleField.tsx | 2 +- packages/react/src/components/Form/index.tsx | 2 +- packages/react/src/components/Hint/index.tsx | 2 +- .../src/components/Hint/useFloatingHint.ts | 2 +- .../components/Provider/ImagePreloader.tsx | 2 +- .../src/components/Provider/Provider.tsx | 17 +++++-- .../react/src/components/Spotlight/index.tsx | 2 +- .../react/src/components/Tooltip/index.tsx | 4 +- packages/react/src/hooks/useClientPortal.ts | 2 +- packages/react/src/hooks/useCollection.ts | 2 +- packages/react/src/hooks/useCollections.ts | 49 ++++++++++--------- packages/react/src/hooks/useFlow.ts | 2 +- packages/react/src/hooks/useFlowHandlers.ts | 2 +- packages/react/src/hooks/useModal.ts | 8 +-- packages/react/src/hooks/useStepHandlers.ts | 36 ++++++++------ yarn.lock | 10 ++++ 23 files changed, 98 insertions(+), 67 deletions(-) diff --git a/package.json b/package.json index bfde3df1..391e830f 100644 --- a/package.json +++ b/package.json @@ -24,6 +24,7 @@ "devDependencies": { "@changesets/cli": "^2.22.0", "eslint": "^7.32.0", + "eslint-plugin-react-hooks": "^5.1.0", "prettier": "^2.5.1", "rimraf": "^5.0.0", "turbo": "^1.10.14" diff --git a/packages/react/.eslintrc.cjs b/packages/react/.eslintrc.cjs index 8882f245..e8cc42a8 100644 --- a/packages/react/.eslintrc.cjs +++ b/packages/react/.eslintrc.cjs @@ -1,6 +1,6 @@ /* eslint-env node */ module.exports = { - extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended', 'prettier'], + extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended', 'plugin:react-hooks/recommended', 'prettier'], ignorePatterns: ['**/dist/*'], parser: '@typescript-eslint/parser', plugins: ['@typescript-eslint', 'react-refresh'], diff --git a/packages/react/src/components/Checklist/CarouselEmblaWrapper.tsx b/packages/react/src/components/Checklist/CarouselEmblaWrapper.tsx index 1cd0e4d6..25c215f1 100644 --- a/packages/react/src/components/Checklist/CarouselEmblaWrapper.tsx +++ b/packages/react/src/components/Checklist/CarouselEmblaWrapper.tsx @@ -69,7 +69,7 @@ export function CarouselEmblaWrapper({ setHasNext(emblaApi.canScrollNext()) setHasPrev(emblaApi.canScrollPrev()) }) - }, [emblaApi]) + }, [emblaApi, hasNext, hasPrev]) useEffect(() => { // check if hasCompletedInitialSort. If not then sort the steps from not completed not skipped to completed/skipped @@ -91,7 +91,7 @@ export function CarouselEmblaWrapper({ setStepOrder(steps.map((step) => step.id)) } } - }, []) + }, [flow.steps, sort, stepOrder]) const completedSteps = flow.getNumberOfCompletedSteps() const availableSteps = flow.getNumberOfAvailableSteps() diff --git a/packages/react/src/components/ClientPortal/ClientPortal.tsx b/packages/react/src/components/ClientPortal/ClientPortal.tsx index 41692f06..019a9714 100644 --- a/packages/react/src/components/ClientPortal/ClientPortal.tsx +++ b/packages/react/src/components/ClientPortal/ClientPortal.tsx @@ -6,5 +6,5 @@ export interface ClientPortalProps { } export function ClientPortal({ children, container = 'body' }: ClientPortalProps) { - return children != null ? useClientPortal(children, container) : null + return useClientPortal(children, container) } diff --git a/packages/react/src/components/Form/FormStep.tsx b/packages/react/src/components/Form/FormStep.tsx index 1a4fcf63..0a251c5f 100644 --- a/packages/react/src/components/Form/FormStep.tsx +++ b/packages/react/src/components/Form/FormStep.tsx @@ -92,7 +92,7 @@ export function FormStep({ }, {}) ) } - }, [fieldDatas]) + }, [fieldDatas, formContext]) useEffect(() => { if ( @@ -102,7 +102,7 @@ export function FormStep({ ) { formContext.trigger() } - }, [step.id]) + }, [fieldDatas, formContext, step.id]) const [isSubmitting, setIsSubmitting] = useState(false) @@ -136,7 +136,7 @@ export function FormStep({ useEffect(() => { formContext.clearErrors() - }, [step]) + }, [formContext, step]) return ( <> diff --git a/packages/react/src/components/Form/fields/BaseField.tsx b/packages/react/src/components/Form/fields/BaseField.tsx index 94238904..60f815be 100644 --- a/packages/react/src/components/Form/fields/BaseField.tsx +++ b/packages/react/src/components/Form/fields/BaseField.tsx @@ -8,7 +8,7 @@ import * as styles from './BaseField.styles' export interface FieldProps { value: string onChange: (value: string) => void - [key: string]: any + [key: string]: unknown } interface BaseFieldProps extends FormFieldProps { diff --git a/packages/react/src/components/Form/fields/CheckboxField.tsx b/packages/react/src/components/Form/fields/CheckboxField.tsx index b8460b59..0ff8c409 100644 --- a/packages/react/src/components/Form/fields/CheckboxField.tsx +++ b/packages/react/src/components/Form/fields/CheckboxField.tsx @@ -11,7 +11,7 @@ import * as baseStyles from '@/components/Form/fields/BaseField.styles' export function CheckboxField(props: FormFieldProps) { const { field: { onChange, value }, - fieldData: { options, label, id = [] }, + fieldData: { label, id = [] }, } = props return ( @@ -32,7 +32,7 @@ export function CheckboxField(props: FormFieldProps) { justifyContent="center" alignItems="center" display="flex" - // @ts-ignore + // @ts-expect-error :hover type isn't in style props yet backgroundColor:hover="neutral.900" part="field-checkbox" id={id as string} diff --git a/packages/react/src/components/Form/fields/SelectMultipleField.tsx b/packages/react/src/components/Form/fields/SelectMultipleField.tsx index a64c9cdc..85709a47 100644 --- a/packages/react/src/components/Form/fields/SelectMultipleField.tsx +++ b/packages/react/src/components/Form/fields/SelectMultipleField.tsx @@ -11,7 +11,7 @@ import * as baseStyles from '@/components/Form/fields/BaseField.styles' export function SelectMultipleField(props: FormFieldProps) { const { - field: { onChange, value }, + field: { onChange }, fieldData: { options = [] }, } = props diff --git a/packages/react/src/components/Form/index.tsx b/packages/react/src/components/Form/index.tsx index 8cefcf05..78b47f24 100644 --- a/packages/react/src/components/Form/index.tsx +++ b/packages/react/src/components/Form/index.tsx @@ -47,7 +47,7 @@ export interface FormFieldData extends ValidationRules { multiple?: boolean props?: Record // allow any other custom properties - [key: string]: any + [key: string]: unknown } // TODO: Wire UseControllerReturn into this type diff --git a/packages/react/src/components/Hint/index.tsx b/packages/react/src/components/Hint/index.tsx index fb0e1ab8..2763aef0 100644 --- a/packages/react/src/components/Hint/index.tsx +++ b/packages/react/src/components/Hint/index.tsx @@ -103,7 +103,7 @@ export function Hint({ } else if (!autoScroll) { setScrollComplete(true) } - }, [autoScroll, refs.reference.current]) + }, [autoScroll, refs.reference, scrollComplete]) if (refs.reference.current == null || !scrollComplete || !isVisible) { return null diff --git a/packages/react/src/components/Hint/useFloatingHint.ts b/packages/react/src/components/Hint/useFloatingHint.ts index d3823814..1cf0e4d1 100644 --- a/packages/react/src/components/Hint/useFloatingHint.ts +++ b/packages/react/src/components/Hint/useFloatingHint.ts @@ -109,7 +109,7 @@ export function useFloatingHint({ } else { console.debug(`[frigade] Hint: No anchor found for selector: ${anchor}`) } - }, [anchorElement]) + }, [anchor, anchorElement, refs]) // The flip() middleware might reverse the align prop const finalPlacement = computedPlacement.split('-') diff --git a/packages/react/src/components/Provider/ImagePreloader.tsx b/packages/react/src/components/Provider/ImagePreloader.tsx index c66c1ed3..7e0b1236 100644 --- a/packages/react/src/components/Provider/ImagePreloader.tsx +++ b/packages/react/src/components/Provider/ImagePreloader.tsx @@ -16,7 +16,7 @@ export function ImagePreloader() { }) }) })() - }, []) + }, [frigade]) return null } diff --git a/packages/react/src/components/Provider/Provider.tsx b/packages/react/src/components/Provider/Provider.tsx index a80da297..66ea5c7a 100644 --- a/packages/react/src/components/Provider/Provider.tsx +++ b/packages/react/src/components/Provider/Provider.tsx @@ -163,7 +163,18 @@ export function Provider({ __platformVersion: SDK_VERSION, __platformName: 'React', } as FrigadeConfig) - }, [props.userId, props.groupId, props.apiKey]) + }, [ + props.apiKey, + props.apiUrl, + props.userId, + props.groupId, + props.userProperties, + props.groupProperties, + props.generateGuestId, + props.syncOnWindowUpdates, + props.__readOnly, + props.__flowStateOverrides, + ]) useEffect(() => { if (props.__flowStateOverrides) { @@ -171,7 +182,7 @@ export function Provider({ config.__flowStateOverrides = props.__flowStateOverrides frigade.reload(config) } - }, [props.__flowStateOverrides]) + }, [frigade, props.__flowStateOverrides]) function batchRegistration() { const batchedFlowIds = [...registeredComponents.current.entries()].map(([flowId, options]) => [ @@ -236,7 +247,7 @@ export function Provider({ return () => { frigade.destroy() } - }, []) + }, [frigade]) return ( { function checkElementForAnchor(element: Element) { @@ -193,7 +193,7 @@ export function Tooltip({ observer.observe(document.querySelector('body'), { childList: true, subtree: true }) return () => observer.disconnect() - }, []) + }, [anchor, anchorRef]) useEffect(() => { const { scrollX, scrollY } = window diff --git a/packages/react/src/hooks/useClientPortal.ts b/packages/react/src/hooks/useClientPortal.ts index b8d13c71..404f53a4 100644 --- a/packages/react/src/hooks/useClientPortal.ts +++ b/packages/react/src/hooks/useClientPortal.ts @@ -13,7 +13,7 @@ export function useClientPortal( containerRef.current = typeof container === 'string' ? document.querySelector(container) : container setMounted(true) - }, []) + }, [container]) return mounted ? createPortal(children, containerRef.current, key) : null } diff --git a/packages/react/src/hooks/useCollection.ts b/packages/react/src/hooks/useCollection.ts index 9e2e7ec5..65c302b9 100644 --- a/packages/react/src/hooks/useCollection.ts +++ b/packages/react/src/hooks/useCollection.ts @@ -30,7 +30,7 @@ export function useCollection(collectionId?: string): { useEffect(() => { frigade?.registerCollection(collectionId) - }, [collectionId]) + }, [collectionId, frigade]) return { collection, diff --git a/packages/react/src/hooks/useCollections.ts b/packages/react/src/hooks/useCollections.ts index 29d896c0..d7d4c76b 100644 --- a/packages/react/src/hooks/useCollections.ts +++ b/packages/react/src/hooks/useCollections.ts @@ -1,4 +1,4 @@ -import { useCallback, useContext, useState } from 'react' +import { useCallback, useContext, useRef, useState } from 'react' import { CollectionsList } from '@frigade/js' import { FrigadeContext } from '@/components/Provider' @@ -8,34 +8,37 @@ export function useCollections() { const { frigade } = useContext(FrigadeContext) const [, setForceRender] = useState(false) - let debounceTimeout: ReturnType + const debounceTimeout = useRef>() - const subscribe = useCallback((cb: () => void) => { - // TODO: Why is there a noticeable delay when this is commented out? - frigade?.getCollections().then(() => { - cb() - }) + const subscribe = useCallback( + (cb: () => void) => { + // TODO: Why is there a noticeable delay when this is commented out? + frigade?.getCollections().then(() => { + cb() + }) - const handler = () => { - clearTimeout(debounceTimeout) + const handler = () => { + clearTimeout(debounceTimeout.current) - /* - * NOTE: Since React doesn't re-render on deep object diffs, - * we need to gently prod it here by creating a state update. - */ - debounceTimeout = setTimeout(() => { - setForceRender((forceRender) => !forceRender) + /* + * NOTE: Since React doesn't re-render on deep object diffs, + * we need to gently prod it here by creating a state update. + */ + debounceTimeout.current = setTimeout(() => { + setForceRender((forceRender) => !forceRender) - cb() - }, 0) - } + cb() + }, 0) + } - frigade?.onStateChange(handler) + frigade?.onStateChange(handler) - return () => { - frigade?.removeStateChangeHandler(handler) - } - }, []) + return () => { + frigade?.removeStateChangeHandler(handler) + } + }, + [frigade] + ) const getSnapshot = () => { let result = undefined diff --git a/packages/react/src/hooks/useFlow.ts b/packages/react/src/hooks/useFlow.ts index 60ee9b3b..02de5b73 100644 --- a/packages/react/src/hooks/useFlow.ts +++ b/packages/react/src/hooks/useFlow.ts @@ -66,7 +66,7 @@ export function useFlow( ...variables, ...config?.variables, }) - }, [config?.variables, flowId, variables]) + }, [config?.variables, flow, flowId, variables]) return { flow, diff --git a/packages/react/src/hooks/useFlowHandlers.ts b/packages/react/src/hooks/useFlowHandlers.ts index c58aa797..bde0bbe2 100644 --- a/packages/react/src/hooks/useFlowHandlers.ts +++ b/packages/react/src/hooks/useFlowHandlers.ts @@ -42,7 +42,7 @@ export function useFlowHandlers(flow: Flow, { onComplete, onDismiss }: FlowHandl return () => { callHandler() } - }, [flow?.isCompleted]) + }, [flow, onComplete]) return { handleDismiss: useCallback( diff --git a/packages/react/src/hooks/useModal.ts b/packages/react/src/hooks/useModal.ts index 14eb7793..6d3d6621 100644 --- a/packages/react/src/hooks/useModal.ts +++ b/packages/react/src/hooks/useModal.ts @@ -12,14 +12,14 @@ export function useCheckForModalCollision(flow: Flow, isModal = true) { setCurrentModal(flowId) } }, - [isModal, flow?.isVisible] + [isModal, flow?.isVisible, setCurrentModal] ) const releaseLock = useCallback(() => { if (flow != null && currentModal === flow?.id) { setCurrentModal(null) } - }, [currentModal, flow?.id]) + }, [currentModal, flow, setCurrentModal]) useEffect(() => { if (flow != null && currentModal === null && flow.isVisible) { @@ -27,14 +27,14 @@ export function useCheckForModalCollision(flow: Flow, isModal = true) { } return releaseLock - }, [currentModal, flow?.id, flow?.isVisible]) + }, [claimLock, currentModal, flow, releaseLock]) // Edge case: The current modal may become non-modal while still mounted useEffect(() => { if (flow != null && (!isModal || !flow.isVisible)) { releaseLock() } - }, [flow?.isVisible, isModal]) + }, [flow, isModal, releaseLock]) // No flow? No problem. if (flow == null) { diff --git a/packages/react/src/hooks/useStepHandlers.ts b/packages/react/src/hooks/useStepHandlers.ts index 1ae1b432..a3c6eef2 100644 --- a/packages/react/src/hooks/useStepHandlers.ts +++ b/packages/react/src/hooks/useStepHandlers.ts @@ -1,4 +1,4 @@ -import { type SyntheticEvent, useCallback, useContext } from 'react' +import { type SyntheticEvent, useCallback, useContext, useMemo } from 'react' import type { FlowStep, PropertyPayload } from '@frigade/js' @@ -35,18 +35,24 @@ export type StepHandler = ( export function useStepHandlers(step: FlowStep, { onPrimary, onSecondary }: StepHandlerProps = {}) { const { navigate } = useContext(FrigadeContext) - const stepActions = { - 'flow.back': (...args) => step.flow.back(...args), - 'flow.complete': (...args) => step.flow.complete(...args), - 'flow.forward': (...args) => step.flow.forward(...args), - 'flow.restart': () => step.flow.restart(), - 'flow.skip': (...args) => step.flow.skip(...args), - 'flow.start': (...args) => step.flow.start(...args), - 'step.complete': (...args) => step.complete(...args), - 'step.skip': (...args) => step.skip(...args), - 'step.reset': () => step.reset(), - 'step.start': (...args) => step.start(...args), - } + const stepActions = useMemo( + () => + step == null + ? {} + : { + 'flow.back': step.flow.back, + 'flow.complete': step.flow.complete, + 'flow.forward': step.flow.forward, + 'flow.restart': step.flow.restart, + 'flow.skip': step.flow.skip, + 'flow.start': step.flow.start, + 'step.complete': step.complete, + 'step.skip': step.skip, + 'step.reset': step.reset, + 'step.start': step.start, + }, + [step] + ) return { handlePrimary: useCallback( @@ -80,7 +86,7 @@ export function useStepHandlers(step: FlowStep, { onPrimary, onSecondary }: Step return true }, - [step] + [navigate, onPrimary, step, stepActions] ), handleSecondary: useCallback( @@ -116,7 +122,7 @@ export function useStepHandlers(step: FlowStep, { onPrimary, onSecondary }: Step return true }, - [step] + [navigate, onSecondary, step, stepActions] ), } } diff --git a/yarn.lock b/yarn.lock index eb1ca3e3..b9062ea2 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3855,6 +3855,7 @@ __metadata: dependencies: "@changesets/cli": "npm:^2.22.0" eslint: "npm:^7.32.0" + eslint-plugin-react-hooks: "npm:^5.1.0" prettier: "npm:^2.5.1" rimraf: "npm:^5.0.0" turbo: "npm:^1.10.14" @@ -11871,6 +11872,15 @@ __metadata: languageName: node linkType: hard +"eslint-plugin-react-hooks@npm:^5.1.0": + version: 5.1.0 + resolution: "eslint-plugin-react-hooks@npm:5.1.0" + peerDependencies: + eslint: ^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0-0 || ^9.0.0 + checksum: 10/b6778fd9e1940b06868921309e8b269426e17eda555816d4b71def4dcf0572de1199fdb627ac09ce42160b9569a93cd9b0fd81b740ab4df98205461c53997a43 + languageName: node + linkType: hard + "eslint-plugin-react-refresh@npm:^0.4.3, eslint-plugin-react-refresh@npm:^0.4.5": version: 0.4.5 resolution: "eslint-plugin-react-refresh@npm:0.4.5" From 3d7d73d12e446dd1844f60f854c63b7608f33eaf Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Tue, 7 Jan 2025 12:22:43 -0800 Subject: [PATCH 109/213] Add Husky to repo --- .husky/pre-commit | 6 ++---- package.json | 1 + packages/react/package.json | 3 ++- 3 files changed, 5 insertions(+), 5 deletions(-) diff --git a/.husky/pre-commit b/.husky/pre-commit index bfc028b7..fac4de58 100755 --- a/.husky/pre-commit +++ b/.husky/pre-commit @@ -1,4 +1,2 @@ -#!/usr/bin/env sh -. "$(dirname -- "$0")/_/husky.sh" - -yarn test +cd packages/react +yarn run lint \ No newline at end of file diff --git a/package.json b/package.json index 391e830f..4444783d 100644 --- a/package.json +++ b/package.json @@ -25,6 +25,7 @@ "@changesets/cli": "^2.22.0", "eslint": "^7.32.0", "eslint-plugin-react-hooks": "^5.1.0", + "husky": "^9.1.7", "prettier": "^2.5.1", "rimraf": "^5.0.0", "turbo": "^1.10.14" diff --git a/packages/react/package.json b/packages/react/package.json index 61f6f9fd..e4f188ac 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -45,7 +45,8 @@ "lint": "eslint --fix --ext .ts,.tsx .", "build": "yarn clean && tsup", "local-release": "tsup", - "prepublish": "node prepublish.mjs" + "prepublish": "node prepublish.mjs", + "prepare": "cd ../../ && husky" }, "dependencies": { "@emotion/react": "^11.11.4", From 9bdfcb388544a964a9983a5214a577302e1f1795 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Tue, 7 Jan 2025 17:57:52 -0800 Subject: [PATCH 110/213] Improved event handler api (#411) * feat: new and improved event handling api * add unit tests * remaining fixes * fix switch --- .changeset/proud-pets-fly.md | 6 + .../Announcement/Announcement.stories.tsx | 20 ++ packages/js-api/src/core/flow.ts | 1 + packages/js-api/src/core/frigade.ts | 156 ++++++++++++++- packages/js-api/src/core/types.ts | 31 +++ packages/js-api/src/index.ts | 2 + packages/js-api/test/frigade.int.test.ts | 183 ++++++++++++++++++ packages/react/src/hooks/useCollections.ts | 6 + packages/react/src/hooks/useFlow.ts | 8 +- 9 files changed, 407 insertions(+), 6 deletions(-) create mode 100644 .changeset/proud-pets-fly.md diff --git a/.changeset/proud-pets-fly.md b/.changeset/proud-pets-fly.md new file mode 100644 index 00000000..159073d2 --- /dev/null +++ b/.changeset/proud-pets-fly.md @@ -0,0 +1,6 @@ +--- +"@frigade/js": minor +"@frigade/react": minor +--- + +Adds a new and improved API for handling state changes which allows you to filter events based on flow and step completion for the user. The API is available through `frigade.on(...)` diff --git a/apps/smithy/src/stories/Announcement/Announcement.stories.tsx b/apps/smithy/src/stories/Announcement/Announcement.stories.tsx index af2ea2c8..1e99149e 100644 --- a/apps/smithy/src/stories/Announcement/Announcement.stories.tsx +++ b/apps/smithy/src/stories/Announcement/Announcement.stories.tsx @@ -1,4 +1,5 @@ import { Announcement, Tour, useFlow, useFrigade } from "@frigade/react"; +import { useEffect } from "react"; export default { title: "Components/Announcement", @@ -24,6 +25,25 @@ export const TestReset = { const { frigade } = useFrigade(); const { flow } = useFlow(args.flowId); + useEffect(() => { + frigade.on("step.start", (event, flow, previousFlow, step) => { + console.log("step.start", event, flow.id, step?.id); + }); + frigade.on("step.complete", (event, flow, previousFlow, step) => { + console.log("step.complete", event, flow.id, step?.id); + }); + + frigade.on("flow.start", (event, flow) => { + console.log("flow.start", event, flow.id); + }); + frigade.on("flow.complete", (event, flow) => { + console.log("flow.complete", event, flow.id); + }); + frigade.on("flow.skip", (event, flow) => { + console.log("flow.skip", event, flow.id); + }); + }, []); + return (
diff --git a/packages/js-api/src/core/flow.ts b/packages/js-api/src/core/flow.ts index bc03e3ab..99ec30d2 100644 --- a/packages/js-api/src/core/flow.ts +++ b/packages/js-api/src/core/flow.ts @@ -498,6 +498,7 @@ export class Flow extends Fetchable { /** * @ignore + * @deprecated Use `frigade.on('flow.complete' | 'flow.skip' | 'flow.restart' | 'flow.start', handler)` instead. */ public onStateChange(handler: (flow: Flow, previousFlow: Flow) => void) { const wrapperHandler = (flow: Flow, previousFlow: Flow) => { diff --git a/packages/js-api/src/core/frigade.ts b/packages/js-api/src/core/frigade.ts index 240f42da..c6661eae 100644 --- a/packages/js-api/src/core/frigade.ts +++ b/packages/js-api/src/core/frigade.ts @@ -1,6 +1,9 @@ import { + FlowChangeEvent, + FlowChangeEventHandler, FlowStateDTO, FlowStates, + FlowStep, FrigadeConfig, PropertyPayload, SessionDTO, @@ -42,6 +45,10 @@ export class Frigade extends Fetchable { * @ignore */ private lastSessionDTO?: SessionDTO + /** + * @ignore + */ + private eventHandlers: Map = new Map() /** * @ignore @@ -366,10 +373,14 @@ export class Frigade extends Fetchable { } this.initPromise = null await this.init(this.config) + this.triggerAllLegacyEventHandlers() this.triggerAllEventHandlers() } - private triggerAllEventHandlers() { + /** + * @ignore + */ + private triggerAllLegacyEventHandlers() { this.flows.forEach((flow) => { this.getGlobalState().onFlowStateChangeHandlers.forEach((handler) => { const lastFlow = this.getGlobalState().previousFlows.get(flow.id) @@ -379,12 +390,20 @@ export class Frigade extends Fetchable { }) } + private triggerAllEventHandlers() { + this.flows.forEach((flow) => { + const lastFlow = this.getGlobalState().previousFlows.get(flow.id) + this.triggerEventHandlers(flow.rawData, lastFlow?.rawData) + }) + } + private async resync() { await this.refreshStateFromAPI() } /** * Event handler that captures all changes that happen to the state of the Flows. + * @deprecated Use `frigade.on` instead. * @param handler */ public async onStateChange(handler: (flow: Flow, previousFlow?: Flow) => void) { @@ -392,6 +411,27 @@ export class Frigade extends Fetchable { this.getGlobalState().onFlowStateChangeHandlers.push(handler) } + /** + * Event handler that captures all changes that happen to the state of the Flows. Use `flow.any` to capture all events. + * @param event `flow.any` | `flow.complete` | `flow.restart` | `flow.skip` | `flow.start` | `step.complete` | `step.skip` | `step.reset` | `step.start` + * @param handler + */ + public async on(event: FlowChangeEvent, handler: FlowChangeEventHandler) { + this.eventHandlers.set(event, [...(this.eventHandlers.get(event) ?? []), handler]) + } + + /** + * Removes the given handler. + * @param event `flow.any` | `flow.complete` | `flow.restart` | `flow.skip` | `flow.start` | `step.complete` | `step.skip` | `step.reset` | `step.start` + * @param handler + */ + public async off(event: FlowChangeEvent, handler: FlowChangeEventHandler) { + this.eventHandlers.set( + event, + (this.eventHandlers.get(event) ?? []).filter((h) => h !== handler) + ) + } + /** * Returns true if the JS SDK failed to connect to the Frigade API. */ @@ -435,6 +475,7 @@ export class Frigade extends Fetchable { const previousState = target[key] as StatefulFlow const newState = value as StatefulFlow if (JSON.stringify(previousState) !== JSON.stringify(newState)) { + that.triggerDeprecatedEventHandlers(newState, previousState) that.triggerEventHandlers(newState, previousState) } } @@ -515,6 +556,7 @@ export class Frigade extends Fetchable { // Necessary check to prevent race condition between flow state and collection state !overrideFlowStateRaw ) { + this.triggerAllLegacyEventHandlers() this.triggerAllEventHandlers() } } @@ -588,7 +630,10 @@ export class Frigade extends Fetchable { /** * @ignore */ - private async triggerEventHandlers(newState: StatefulFlow, previousState?: StatefulFlow) { + private async triggerDeprecatedEventHandlers( + newState: StatefulFlow, + previousState?: StatefulFlow + ) { if (newState) { this.flows.forEach((flow) => { if (flow.id == previousState.flowSlug) { @@ -603,6 +648,113 @@ export class Frigade extends Fetchable { } } + /** + * @ignore + */ + private triggerEventHandlers(newState: StatefulFlow, previousState?: StatefulFlow) { + if (newState) { + for (const flow of this.flows) { + if (flow.id == newState.flowSlug) { + const lastFlow = this.getGlobalState().previousFlows.get(flow.id) + flow.resyncState(newState) + for (const [event, handlers] of this.eventHandlers.entries()) { + switch (event) { + case 'flow.complete': + if (newState.$state.completed && previousState?.$state.completed === false) { + handlers.forEach((handler) => handler(event, flow, lastFlow)) + } + break + case 'flow.restart': + if (!newState.$state.started && previousState?.$state.started === true) { + handlers.forEach((handler) => handler(event, flow, lastFlow)) + } + break + case 'flow.skip': + if (newState.$state.skipped && previousState?.$state.skipped === false) { + handlers.forEach((handler) => handler(event, flow, lastFlow)) + } + break + case 'flow.start': + if (newState.$state.started && previousState?.$state.started === false) { + handlers.forEach((handler) => handler(event, flow, lastFlow)) + } + break + case 'step.complete': + for (const step of newState.data.steps ?? []) { + if ( + step.$state.completed && + !previousState?.data.steps.find( + (previousStepState) => + previousStepState.id === step.id && previousStepState.$state.completed + ) + ) { + handlers.forEach((handler) => + handler(event, flow, lastFlow, flow.steps.get(step.id)) + ) + } + } + break + case 'step.reset': + for (const step of newState.data.steps ?? []) { + const previousStep = previousState?.data.steps.find( + (previousStepState) => previousStepState.id === step.id + ) + if ( + step.$state.started == false && + !step.$state.lastActionAt && + previousStep?.$state.started && + previousStep?.$state.lastActionAt + ) { + handlers.forEach((handler) => + handler(event, flow, lastFlow, flow.steps.get(step.id)) + ) + } + } + break + case 'step.skip': + for (const step of newState.data.steps ?? []) { + if ( + step.$state.skipped && + !previousState?.data.steps.find( + (previousStepState) => + previousStepState.id === step.id && previousStepState.$state.skipped + ) + ) { + handlers.forEach((handler) => + handler(event, flow, lastFlow, flow.steps.get(step.id)) + ) + } + } + break + case 'step.start': + for (const step of newState.data.steps ?? []) { + if ( + step.$state.started && + previousState?.data.steps.find( + (previousStepState) => + previousStepState.id === step.id && + previousStepState.$state.started === false + ) + ) { + handlers.forEach((handler) => + handler(event, flow, lastFlow, flow.steps.get(step.id)) + ) + } + } + break + case 'flow.any': + if (JSON.stringify(newState) !== JSON.stringify(previousState ?? {})) { + handlers.forEach((handler) => handler(event, flow, lastFlow)) + } + break + } + } + this.getGlobalState().previousFlows.set(flow.id, cloneFlow(flow)) + } + } + } + } + /** * @ignore */ diff --git a/packages/js-api/src/core/types.ts b/packages/js-api/src/core/types.ts index d75422ea..c5ef40cc 100644 --- a/packages/js-api/src/core/types.ts +++ b/packages/js-api/src/core/types.ts @@ -24,6 +24,36 @@ export type StepAction = | 'step.start' | false +export type FlowChangeEvent = + | 'flow.any' + | 'flow.complete' + | 'flow.restart' + | 'flow.skip' + | 'flow.start' + | 'step.complete' + | 'step.skip' + | 'step.reset' + | 'step.start' + +export type FlowChangeEventHandler = ( + /** + * The event that triggered the handler. + */ + event: FlowChangeEvent, + /** + * The Flow that triggered the event. + */ + flow: Flow, + /** + * The previous Flow that triggered the event. + */ + previousFlow?: Flow, + /** + * The step that triggered the event. Only applicable for `step.complete`, `step.skip`, `step.reset`, `step.start` events. + */ + step?: FlowStep +) => void + export type PropertyPayload = Record export interface FlowStep extends StatefulStep { @@ -223,6 +253,7 @@ export interface FlowStep extends StatefulStep { /** * Event handler called when this step's state changes. + * @deprecated Use `frigade.on('step.complete' | 'step.skip' | 'step.reset' | 'step.start', handler)` instead. */ onStateChange: (callback: (step: FlowStep, previousStep?: FlowStep) => void) => void diff --git a/packages/js-api/src/index.ts b/packages/js-api/src/index.ts index 5ff7b946..a246a157 100644 --- a/packages/js-api/src/index.ts +++ b/packages/js-api/src/index.ts @@ -8,6 +8,8 @@ export { type StatefulFlow, TriggerType, PropertyPayload, + FlowChangeEvent, + FlowChangeEventHandler, } from './core/types' export type { EnrichedCollection, diff --git a/packages/js-api/test/frigade.int.test.ts b/packages/js-api/test/frigade.int.test.ts index a9c7689b..f523d84e 100644 --- a/packages/js-api/test/frigade.int.test.ts +++ b/packages/js-api/test/frigade.int.test.ts @@ -8,6 +8,7 @@ const testAPIKey = 'api_public_3MPLH7NJ9L0U963XKW7BPE2IT137GC6L742JLC2XCT6NOIYSI const testFlowId = 'flow_yJfjksFrs5QEH0c8' const testFlowIdWithTargeting = 'flow_61YBPQek' const testFlowStepId = 'checklist-step-one' +const testFlowStepId2 = 'checklist-step-two' jest.retryTimes(2, { logErrorsBeforeRetry: false }) describe('Basic Checklist integration test', () => { @@ -458,6 +459,188 @@ describe('Basic Checklist integration test', () => { expect(flow.isCompleted).toBeFalsy() expect(flow.isVisible).toBeTruthy() }) + test('on() event handler for flow.complete', async () => { + const userId = getRandomID() + const frigade = new Frigade(testAPIKey, { + userId, + }) + await frigade.identify(userId) + const flow = await frigade.getFlow(testFlowId) + expect(flow).toBeDefined() + + const callback = jest.fn( + (event: string, flow: Flow, _previousFlow?: Flow, _step?: FlowStep) => { + expect(event).toBe('flow.complete') + expect(flow).toBeDefined() + expect(flow.id).toEqual(testFlowId) + } + ) + frigade.on('flow.complete', callback) + + expect(flow.isCompleted).toBeFalsy() + await flow.complete() + expect(flow.isCompleted).toBeTruthy() + expect(callback).toHaveBeenCalledTimes(1) + }) + + test('on() event handler for flow.start', async () => { + const userId = getRandomID() + const frigade = new Frigade(testAPIKey, { + userId, + }) + await frigade.identify(userId) + const flow = await frigade.getFlow(testFlowId) + expect(flow).toBeDefined() + + const callback = jest.fn( + (event: string, flow: Flow, _previousFlow?: Flow, _step?: FlowStep) => { + expect(event).toBe('flow.start') + expect(flow).toBeDefined() + expect(flow.id).toEqual(testFlowId) + } + ) + frigade.on('flow.start', callback) + + const step = flow.steps.get(testFlowStepId) + expect(step).toBeDefined() + + await step.start() + expect(callback).toHaveBeenCalledTimes(1) + }) + + test('on() event handler for step.start', async () => { + const userId = getRandomID() + const frigade = new Frigade(testAPIKey, { + userId, + }) + await frigade.identify(userId) + const flow = await frigade.getFlow(testFlowId) + expect(flow).toBeDefined() + + const callback = jest.fn((event: string, flow: Flow, _previousFlow?: Flow, step?: FlowStep) => { + expect(event).toBe('step.start') + expect(flow).toBeDefined() + expect(flow.id).toEqual(testFlowId) + expect(step).toBeDefined() + expect(step.id).toEqual(testFlowStepId) + }) + frigade.on('step.start', callback) + + const step = flow.steps.get(testFlowStepId) + expect(step).toBeDefined() + if (step) { + await step.start() + expect(callback).toHaveBeenCalledTimes(1) + } + + frigade.off('step.start', callback) + + const callback2 = jest.fn( + (event: string, flow: Flow, _previousFlow?: Flow, step?: FlowStep) => { + expect(event).toBe('step.start') + expect(flow).toBeDefined() + expect(flow.id).toEqual(testFlowId) + expect(step).toBeDefined() + expect(step.id).toEqual(testFlowStepId2) // Assuming testFlowStepId2 is the ID of step 2 + } + ) + frigade.on('step.start', callback2) + + const step1 = flow.steps.get(testFlowStepId) + expect(step1).toBeDefined() + if (step1) { + await step1.complete() + const step2 = flow.steps.get(testFlowStepId2) // Assuming testFlowStepId2 is the ID of step 2 + expect(step2).toBeDefined() + if (step2) { + await step2.start() + expect(callback2).toHaveBeenCalledTimes(1) + } + } + + frigade.off('step.start', callback2) + }) + + test('on() event handler for step.complete', async () => { + const userId = getRandomID() + const frigade = new Frigade(testAPIKey, { + userId, + }) + await frigade.identify(userId) + const flow = await frigade.getFlow(testFlowId) + expect(flow).toBeDefined() + + const callback = jest.fn((event: string, flow: Flow, _previousFlow?: Flow, step?: FlowStep) => { + expect(event).toBe('step.complete') + expect(flow).toBeDefined() + expect(flow.id).toEqual(testFlowId) + expect(step).toBeDefined() + expect(step.id).toEqual(testFlowStepId) + }) + frigade.on('step.complete', callback) + + if (flow) { + const step = flow.steps.get(testFlowStepId) + expect(step).toBeDefined() + if (step) { + await step.complete() + expect(callback).toHaveBeenCalledTimes(1) + } + } + }) + + test('on() event handler for flow.skip', async () => { + const userId = getRandomID() + const frigade = new Frigade(testAPIKey, { + userId, + }) + await frigade.identify(userId) + const flow = await frigade.getFlow(testFlowId) + expect(flow).toBeDefined() + + const callback = jest.fn( + (event: string, flow: Flow, _previousFlow?: Flow, _step?: FlowStep) => { + expect(event).toBe('flow.skip') + expect(flow).toBeDefined() + expect(flow.id).toEqual(testFlowId) + } + ) + frigade.on('flow.skip', callback) + + if (flow) { + await flow.skip() + expect(callback).toHaveBeenCalledTimes(1) + } + }) + + test('on() event handler for step.reset', async () => { + const userId = getRandomID() + const frigade = new Frigade(testAPIKey, { + userId, + }) + await frigade.identify(userId) + const flow = await frigade.getFlow(testFlowId) + expect(flow).toBeDefined() + + const callback = jest.fn((event: string, flow: Flow, _previousFlow?: Flow, step?: FlowStep) => { + expect(event).toBe('step.reset') + expect(flow).toBeDefined() + expect(flow.id).toEqual(testFlowId) + expect(step).toBeDefined() + expect(step.id).toEqual(testFlowStepId) + }) + frigade.on('step.reset', callback) + + if (flow) { + const step = flow.steps.get(testFlowStepId) + expect(step).toBeDefined() + if (step) { + await step.complete() + await step.reset() + expect(callback).toHaveBeenCalledTimes(1) + } + } + }) }) describe('Advanced Checklist integration test', () => { diff --git a/packages/react/src/hooks/useCollections.ts b/packages/react/src/hooks/useCollections.ts index d7d4c76b..be5b6ebc 100644 --- a/packages/react/src/hooks/useCollections.ts +++ b/packages/react/src/hooks/useCollections.ts @@ -30,6 +30,12 @@ export function useCollections() { cb() }, 0) } + + frigade?.on('flow.any', handler) + + return () => { + frigade?.off('flow.any', handler) + } frigade?.onStateChange(handler) diff --git a/packages/react/src/hooks/useFlow.ts b/packages/react/src/hooks/useFlow.ts index 02de5b73..0fb6530c 100644 --- a/packages/react/src/hooks/useFlow.ts +++ b/packages/react/src/hooks/useFlow.ts @@ -1,4 +1,4 @@ -import { type Flow } from '@frigade/js' +import { FlowChangeEvent, type Flow } from '@frigade/js' import { useCallback, useContext, useEffect, useState } from 'react' import { FrigadeContext } from '@/components/Provider' @@ -30,7 +30,7 @@ export function useFlow( cb() }) - const handler = (updatedFlow: Flow) => { + const handler = (_event: FlowChangeEvent, updatedFlow: Flow) => { if (updatedFlow.id !== flowId) { return } @@ -46,10 +46,10 @@ export function useFlow( }, 0) } - frigade?.onStateChange(handler) + frigade?.on('flow.any', handler) return () => { - frigade?.removeStateChangeHandler(handler) + frigade?.off('flow.any', handler) } }, [flowId, frigade] From 3306f73e3353cf2de343fa1d1c87255aff3652c6 Mon Sep 17 00:00:00 2001 From: christianmat Date: Tue, 7 Jan 2025 18:25:05 -0800 Subject: [PATCH 111/213] fix: bug where this is undefined --- packages/react/src/hooks/useStepHandlers.ts | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/packages/react/src/hooks/useStepHandlers.ts b/packages/react/src/hooks/useStepHandlers.ts index a3c6eef2..6ca45a9c 100644 --- a/packages/react/src/hooks/useStepHandlers.ts +++ b/packages/react/src/hooks/useStepHandlers.ts @@ -40,16 +40,16 @@ export function useStepHandlers(step: FlowStep, { onPrimary, onSecondary }: Step step == null ? {} : { - 'flow.back': step.flow.back, - 'flow.complete': step.flow.complete, - 'flow.forward': step.flow.forward, - 'flow.restart': step.flow.restart, - 'flow.skip': step.flow.skip, - 'flow.start': step.flow.start, - 'step.complete': step.complete, - 'step.skip': step.skip, - 'step.reset': step.reset, - 'step.start': step.start, + 'flow.back': () => step.flow.back(), + 'flow.complete': () => step.flow.complete(), + 'flow.forward': () => step.flow.forward(), + 'flow.restart': () => step.flow.restart(), + 'flow.skip': () => step.flow.skip(), + 'flow.start': () => step.flow.start(), + 'step.complete': () => step.complete(), + 'step.skip': () => step.skip(), + 'step.reset': () => step.reset(), + 'step.start': () => step.start(), }, [step] ) From e93bd5cb363a4f66f1ef9e99a93bd0f9068a787c Mon Sep 17 00:00:00 2001 From: christianmat Date: Tue, 7 Jan 2025 21:18:49 -0800 Subject: [PATCH 112/213] fix: add missing properties --- packages/react/src/hooks/useStepHandlers.ts | 18 ++++++++++-------- yarn.lock | 10 ++++++++++ 2 files changed, 20 insertions(+), 8 deletions(-) diff --git a/packages/react/src/hooks/useStepHandlers.ts b/packages/react/src/hooks/useStepHandlers.ts index 6ca45a9c..7af5828a 100644 --- a/packages/react/src/hooks/useStepHandlers.ts +++ b/packages/react/src/hooks/useStepHandlers.ts @@ -40,16 +40,18 @@ export function useStepHandlers(step: FlowStep, { onPrimary, onSecondary }: Step step == null ? {} : { - 'flow.back': () => step.flow.back(), - 'flow.complete': () => step.flow.complete(), - 'flow.forward': () => step.flow.forward(), + 'flow.back': (properties?: PropertyPayload) => step.flow.back(properties), + 'flow.complete': (properties?: PropertyPayload) => step.flow.complete(properties), + 'flow.forward': (properties?: PropertyPayload) => step.flow.forward(properties), 'flow.restart': () => step.flow.restart(), - 'flow.skip': () => step.flow.skip(), - 'flow.start': () => step.flow.start(), - 'step.complete': () => step.complete(), - 'step.skip': () => step.skip(), + 'flow.skip': (properties?: PropertyPayload) => step.flow.skip(properties), + 'flow.start': (properties?: PropertyPayload) => step.flow.start(properties), + 'step.complete': (properties?: PropertyPayload, optimistic?: boolean) => + step.complete(properties, optimistic), + 'step.skip': (properties?: PropertyPayload, optimistic?: boolean) => + step.skip(properties, optimistic), 'step.reset': () => step.reset(), - 'step.start': () => step.start(), + 'step.start': (properties?: PropertyPayload) => step.start(properties), }, [step] ) diff --git a/yarn.lock b/yarn.lock index b9062ea2..05730da9 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3856,6 +3856,7 @@ __metadata: "@changesets/cli": "npm:^2.22.0" eslint: "npm:^7.32.0" eslint-plugin-react-hooks: "npm:^5.1.0" + husky: "npm:^9.1.7" prettier: "npm:^2.5.1" rimraf: "npm:^5.0.0" turbo: "npm:^1.10.14" @@ -13609,6 +13610,15 @@ __metadata: languageName: node linkType: hard +"husky@npm:^9.1.7": + version: 9.1.7 + resolution: "husky@npm:9.1.7" + bin: + husky: bin.js + checksum: 10/c2412753f15695db369634ba70f50f5c0b7e5cb13b673d0826c411ec1bd9ddef08c1dad89ea154f57da2521d2605bd64308af748749b27d08c5f563bcd89975f + languageName: node + linkType: hard + "iconv-lite@npm:0.4.24, iconv-lite@npm:^0.4.24": version: 0.4.24 resolution: "iconv-lite@npm:0.4.24" From cb9a232e82635cde06dd97e817145fc3cb644c65 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Tue, 7 Jan 2025 21:24:54 -0800 Subject: [PATCH 113/213] Version Packages (#412) Co-authored-by: github-actions[bot] --- .changeset/proud-pets-fly.md | 6 ------ packages/js-api/CHANGELOG.md | 6 ++++++ packages/js-api/package.json | 2 +- packages/react/CHANGELOG.md | 11 +++++++++++ packages/react/package.json | 4 ++-- 5 files changed, 20 insertions(+), 9 deletions(-) delete mode 100644 .changeset/proud-pets-fly.md diff --git a/.changeset/proud-pets-fly.md b/.changeset/proud-pets-fly.md deleted file mode 100644 index 159073d2..00000000 --- a/.changeset/proud-pets-fly.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -"@frigade/js": minor -"@frigade/react": minor ---- - -Adds a new and improved API for handling state changes which allows you to filter events based on flow and step completion for the user. The API is available through `frigade.on(...)` diff --git a/packages/js-api/CHANGELOG.md b/packages/js-api/CHANGELOG.md index ed3a0fed..3055597b 100644 --- a/packages/js-api/CHANGELOG.md +++ b/packages/js-api/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/js +## 0.8.0 + +### Minor Changes + +- 9bdfcb3: Adds a new and improved API for handling state changes which allows you to filter events based on flow and step completion for the user. The API is available through `frigade.on(...)` + ## 0.7.24 ### Patch Changes diff --git a/packages/js-api/package.json b/packages/js-api/package.json index d32bb61b..f9b40d90 100644 --- a/packages/js-api/package.json +++ b/packages/js-api/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/js", - "version": "0.7.24", + "version": "0.8.0", "description": "The official Javascript SDK for Frigade.", "type": "module", "main": "./dist/index.js", diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 3e9b7570..65e317ce 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,16 @@ # @frigade/react +## 2.7.0 + +### Minor Changes + +- 9bdfcb3: Adds a new and improved API for handling state changes which allows you to filter events based on flow and step completion for the user. The API is available through `frigade.on(...)` + +### Patch Changes + +- Updated dependencies [9bdfcb3] + - @frigade/js@0.8.0 + ## 2.6.8 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index e4f188ac..e9cdafd9 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.6.8", + "version": "2.7.0", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", @@ -51,7 +51,7 @@ "dependencies": { "@emotion/react": "^11.11.4", "@floating-ui/react": "^0.26.22", - "@frigade/js": "^0.7.24", + "@frigade/js": "^0.8.0", "@radix-ui/react-checkbox": "^1.1.1", "@radix-ui/react-collapsible": "^1.0.3", "@radix-ui/react-dialog": "^1.0.5", From b8996ad788f7ce660f5681541c3982d5b0dc24b1 Mon Sep 17 00:00:00 2001 From: christianmat Date: Tue, 7 Jan 2025 21:25:14 -0800 Subject: [PATCH 114/213] chore: yarn install --- yarn.lock | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/yarn.lock b/yarn.lock index 05730da9..279582e3 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3721,7 +3721,7 @@ __metadata: languageName: node linkType: hard -"@frigade/js@npm:^0.7.24, @frigade/js@workspace:packages/js-api": +"@frigade/js@npm:^0.8.0, @frigade/js@workspace:packages/js-api": version: 0.0.0-use.local resolution: "@frigade/js@workspace:packages/js-api" dependencies: @@ -3755,7 +3755,7 @@ __metadata: dependencies: "@emotion/react": "npm:^11.11.4" "@floating-ui/react": "npm:^0.26.22" - "@frigade/js": "npm:^0.7.24" + "@frigade/js": "npm:^0.8.0" "@radix-ui/react-checkbox": "npm:^1.1.1" "@radix-ui/react-collapsible": "npm:^1.0.3" "@radix-ui/react-dialog": "npm:^1.0.5" From 414e4269daa8dd26a6af5e5ba7edaf11b9eaf34f Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Wed, 8 Jan 2025 05:27:56 +0000 Subject: [PATCH 115/213] chore: run prepublish script --- packages/js-api/src/version.ts | 2 +- packages/react/src/version.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/js-api/src/version.ts b/packages/js-api/src/version.ts index 981481d3..6229be0e 100644 --- a/packages/js-api/src/version.ts +++ b/packages/js-api/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '0.7.24'; \ No newline at end of file +export const SDK_VERSION = '0.8.0'; \ No newline at end of file diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index d2c08a5d..4de529ac 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.6.8'; \ No newline at end of file +export const SDK_VERSION = '2.7.0'; \ No newline at end of file From 9c269d9c3ca6be972d7fbd40aac8da7b8860c7d6 Mon Sep 17 00:00:00 2001 From: christianmat Date: Wed, 8 Jan 2025 09:17:15 -0800 Subject: [PATCH 116/213] fix: add missing types --- packages/react/src/components/Survey/NPS.tsx | 2 +- packages/react/src/components/Survey/index.tsx | 2 +- packages/react/src/index.ts | 1 + 3 files changed, 3 insertions(+), 2 deletions(-) diff --git a/packages/react/src/components/Survey/NPS.tsx b/packages/react/src/components/Survey/NPS.tsx index 4d4253bb..136c4a4f 100644 --- a/packages/react/src/components/Survey/NPS.tsx +++ b/packages/react/src/components/Survey/NPS.tsx @@ -6,7 +6,7 @@ import { useFlow } from '@/hooks/useFlow' type NPSOptions = { label: string; value: string }[] -interface NPSProps extends FormProps { +export interface NPSProps extends FormProps { /** * The options to display in the NPS field. * If not provided, the default NPS numbers from 0 to 10 will be used. diff --git a/packages/react/src/components/Survey/index.tsx b/packages/react/src/components/Survey/index.tsx index 51342d4c..3bebe146 100644 --- a/packages/react/src/components/Survey/index.tsx +++ b/packages/react/src/components/Survey/index.tsx @@ -1,2 +1,2 @@ // eslint-disable-next-line react-refresh/only-export-components -- NPS is a valid component name -export { NPS } from './NPS' +export { NPS, type NPSProps } from './NPS' diff --git a/packages/react/src/index.ts b/packages/react/src/index.ts index c8faea3d..2f704cc2 100644 --- a/packages/react/src/index.ts +++ b/packages/react/src/index.ts @@ -25,6 +25,7 @@ export { RadioField } from './components/Form/fields/RadioField' export { Label } from './components/Form/fields/Label' export { BaseField } from './components/Form/fields/BaseField' export { Media, Image, Video } from './components/Media' +export { type NPSProps } from './components/Survey/NPS' export * as Progress from './components/Progress' export { ProgressBadge, type ProgressBadgeProps } from './components/ProgressBadge' From 3cd8d0b23773251d129ca0ff1160b12febb8e50e Mon Sep 17 00:00:00 2001 From: christianmat Date: Thu, 9 Jan 2025 17:30:36 -0800 Subject: [PATCH 117/213] fix: add version number to the flow model --- .changeset/dull-buckets-yawn.md | 6 ++++++ packages/js-api/src/core/flow.ts | 6 +++++- packages/js-api/src/core/types.ts | 1 + packages/js-api/test/frigade.int.test.ts | 4 ++++ 4 files changed, 16 insertions(+), 1 deletion(-) create mode 100644 .changeset/dull-buckets-yawn.md diff --git a/.changeset/dull-buckets-yawn.md b/.changeset/dull-buckets-yawn.md new file mode 100644 index 00000000..a2fab5f2 --- /dev/null +++ b/.changeset/dull-buckets-yawn.md @@ -0,0 +1,6 @@ +--- +"@frigade/js": patch +"@frigade/react": patch +--- + +Adds version number to the `Flow` model diff --git a/packages/js-api/src/core/flow.ts b/packages/js-api/src/core/flow.ts index 99ec30d2..acddf883 100644 --- a/packages/js-api/src/core/flow.ts +++ b/packages/js-api/src/core/flow.ts @@ -30,6 +30,10 @@ export class Flow extends Fetchable { * The Flow's ID. */ public id: string + /** + * The version of the Flow. + */ + public version: number /** * The Flow's component ID. */ @@ -125,7 +129,7 @@ export class Flow extends Fetchable { this.subtitle = statefulFlow?.data?.subtitle this.type = statefulFlow?.data?.type this.props = statefulFlow?.data?.props ?? {} - + this.version = statefulFlow?.version this.isCompleted = statefulFlow.$state.completed this.isStarted = statefulFlow.$state.started this.isSkipped = statefulFlow.$state.skipped diff --git a/packages/js-api/src/core/types.ts b/packages/js-api/src/core/types.ts index c5ef40cc..dc65e661 100644 --- a/packages/js-api/src/core/types.ts +++ b/packages/js-api/src/core/types.ts @@ -371,6 +371,7 @@ export interface StatefulFlow { flowSlug: string flowName: string flowType: FlowType + version: number /** * Contains the raw data of the Flow as defined in the YAML config as well as the user's state of each step. */ diff --git a/packages/js-api/test/frigade.int.test.ts b/packages/js-api/test/frigade.int.test.ts index f523d84e..bdae7d67 100644 --- a/packages/js-api/test/frigade.int.test.ts +++ b/packages/js-api/test/frigade.int.test.ts @@ -44,6 +44,7 @@ describe('Basic Checklist integration test', () => { expect(step.id).toBeDefined() expect(step.title).toBeDefined() }) + expect(flow.version).toBeDefined() }) test('read and set flow state', async () => { @@ -67,6 +68,7 @@ describe('Basic Checklist integration test', () => { flowSlug: 'some-flow', flowName: 'Some flow', flowType: FlowType.CHECKLIST, + version: 1, data: { steps: [ { @@ -125,6 +127,7 @@ describe('Basic Checklist integration test', () => { [madeUpFlowId]: { flowSlug: 'some-flow', flowName: 'Some flow', + version: 1, flowType: FlowType.CHECKLIST, data: { steps: [ @@ -180,6 +183,7 @@ describe('Basic Checklist integration test', () => { [madeUpFlowId]: { flowSlug: 'some-flow', flowName: 'Some flow', + version: 1, flowType: FlowType.CHECKLIST, data: { steps: [ From 6c0b545102def1213f88b2246b784229334cf889 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Thu, 9 Jan 2025 17:49:47 -0800 Subject: [PATCH 118/213] Version Packages (#413) Co-authored-by: github-actions[bot] --- .changeset/dull-buckets-yawn.md | 6 ------ packages/js-api/CHANGELOG.md | 6 ++++++ packages/js-api/package.json | 2 +- packages/react/CHANGELOG.md | 8 ++++++++ packages/react/package.json | 4 ++-- 5 files changed, 17 insertions(+), 9 deletions(-) delete mode 100644 .changeset/dull-buckets-yawn.md diff --git a/.changeset/dull-buckets-yawn.md b/.changeset/dull-buckets-yawn.md deleted file mode 100644 index a2fab5f2..00000000 --- a/.changeset/dull-buckets-yawn.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -"@frigade/js": patch -"@frigade/react": patch ---- - -Adds version number to the `Flow` model diff --git a/packages/js-api/CHANGELOG.md b/packages/js-api/CHANGELOG.md index 3055597b..c2aece02 100644 --- a/packages/js-api/CHANGELOG.md +++ b/packages/js-api/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/js +## 0.8.1 + +### Patch Changes + +- 3cd8d0b: Adds version number to the `Flow` model + ## 0.8.0 ### Minor Changes diff --git a/packages/js-api/package.json b/packages/js-api/package.json index f9b40d90..f00488e2 100644 --- a/packages/js-api/package.json +++ b/packages/js-api/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/js", - "version": "0.8.0", + "version": "0.8.1", "description": "The official Javascript SDK for Frigade.", "type": "module", "main": "./dist/index.js", diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 65e317ce..6cbdffbd 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,13 @@ # @frigade/react +## 2.7.1 + +### Patch Changes + +- 3cd8d0b: Adds version number to the `Flow` model +- Updated dependencies [3cd8d0b] + - @frigade/js@0.8.1 + ## 2.7.0 ### Minor Changes diff --git a/packages/react/package.json b/packages/react/package.json index e9cdafd9..847a0190 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.7.0", + "version": "2.7.1", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", @@ -51,7 +51,7 @@ "dependencies": { "@emotion/react": "^11.11.4", "@floating-ui/react": "^0.26.22", - "@frigade/js": "^0.8.0", + "@frigade/js": "^0.8.1", "@radix-ui/react-checkbox": "^1.1.1", "@radix-ui/react-collapsible": "^1.0.3", "@radix-ui/react-dialog": "^1.0.5", From 449d842487aa0192bb10b537b4bbc69ed094381c Mon Sep 17 00:00:00 2001 From: christianmat Date: Thu, 9 Jan 2025 17:50:00 -0800 Subject: [PATCH 119/213] fix: yarn install --- yarn.lock | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/yarn.lock b/yarn.lock index 279582e3..eb37ad3a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3721,7 +3721,7 @@ __metadata: languageName: node linkType: hard -"@frigade/js@npm:^0.8.0, @frigade/js@workspace:packages/js-api": +"@frigade/js@npm:^0.8.1, @frigade/js@workspace:packages/js-api": version: 0.0.0-use.local resolution: "@frigade/js@workspace:packages/js-api" dependencies: @@ -3755,7 +3755,7 @@ __metadata: dependencies: "@emotion/react": "npm:^11.11.4" "@floating-ui/react": "npm:^0.26.22" - "@frigade/js": "npm:^0.8.0" + "@frigade/js": "npm:^0.8.1" "@radix-ui/react-checkbox": "npm:^1.1.1" "@radix-ui/react-collapsible": "npm:^1.0.3" "@radix-ui/react-dialog": "npm:^1.0.5" From 7e99ad90993c50eb50146c76227bd5077d940b9c Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Fri, 10 Jan 2025 01:51:00 +0000 Subject: [PATCH 120/213] chore: run prepublish script --- packages/js-api/src/version.ts | 2 +- packages/react/src/version.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/js-api/src/version.ts b/packages/js-api/src/version.ts index 6229be0e..73591c89 100644 --- a/packages/js-api/src/version.ts +++ b/packages/js-api/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '0.8.0'; \ No newline at end of file +export const SDK_VERSION = '0.8.1'; \ No newline at end of file diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 4de529ac..0ac8b769 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.7.0'; \ No newline at end of file +export const SDK_VERSION = '2.7.1'; \ No newline at end of file From 754a628f35f472ca6e83b6985f9034bfb64661af Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Tue, 21 Jan 2025 16:01:25 -0800 Subject: [PATCH 121/213] feat: do not start a tour/hint flow until the anchor is visible (#414) * feat: do not start a tour/hint flow until the anchor is visible * pr feedback * add interaction tests --- apps/smithy/src/stories/Tour/Tour.stories.tsx | 40 ++++++++++++ .../Tour/TourInteractionTests.stories.tsx | 61 +++++++++++++++++-- .../react/src/components/Flow/FlowProps.ts | 35 ++++++----- packages/react/src/components/Flow/index.tsx | 4 +- packages/react/src/components/Hint/index.tsx | 13 +++- packages/react/src/components/Tour/Tour.tsx | 2 +- .../react/src/components/Tour/TourStep.tsx | 5 ++ 7 files changed, 136 insertions(+), 24 deletions(-) diff --git a/apps/smithy/src/stories/Tour/Tour.stories.tsx b/apps/smithy/src/stories/Tour/Tour.stories.tsx index 94342fac..0af2a0a6 100644 --- a/apps/smithy/src/stories/Tour/Tour.stories.tsx +++ b/apps/smithy/src/stories/Tour/Tour.stories.tsx @@ -109,6 +109,46 @@ export const Default = { ], }; +export const AnchorNotFound = { + args: { + autoScroll: true, + flowId: "flow_U63A5pndRrvCwxNs", + defaultOpen: true, + }, + decorators: [ + (_: StoryFn, options: StoryContext) => { + return ( + <> + + + { + // no-op + }} + /> + + + + + ); + }, + ], +}; + export const WithScrollContainer = { args: { autoScroll: true, diff --git a/apps/smithy/src/stories/Tour/TourInteractionTests.stories.tsx b/apps/smithy/src/stories/Tour/TourInteractionTests.stories.tsx index 84335c2c..5503ddfb 100644 --- a/apps/smithy/src/stories/Tour/TourInteractionTests.stories.tsx +++ b/apps/smithy/src/stories/Tour/TourInteractionTests.stories.tsx @@ -16,7 +16,7 @@ const StoryMeta: Meta = { export default StoryMeta; -export const InteractionTests: TourStory = { +export const AnchorFoundInteractionTests: TourStory = { args: { flowId: "flow_U63A5pndRrvCwxNs", }, @@ -24,6 +24,7 @@ export const InteractionTests: TourStory = { decorators: [ (Story, { args }) => { const { flow } = useFlow(args.flowId); + args.flow = flow; const lateAnchorRef = useRef(null); @@ -52,7 +53,7 @@ export const InteractionTests: TourStory = { + + + ); + }, + ], + + play: async ({ step, args }) => { + console.log("args", args); + + await step("Test Anchor Not Found", async () => { + // Wait for flow to be defined + await waitFor(() => { + expect(args.flow).toBeDefined(); + }); + + // Verify the flow is started + expect(args.flow?.isStarted).toBe(false); + }); + }, +}; diff --git a/packages/react/src/components/Flow/FlowProps.ts b/packages/react/src/components/Flow/FlowProps.ts index 51585e13..e7d39059 100644 --- a/packages/react/src/components/Flow/FlowProps.ts +++ b/packages/react/src/components/Flow/FlowProps.ts @@ -10,6 +10,26 @@ import type { StepHandler, StepHandlerProp } from '@/hooks/useStepHandlers' export interface BoxPropsWithoutChildren extends Omit {} export interface FlowPropsWithoutChildren extends BoxPropsWithoutChildren { + /** + * Whether to automatically mark the Flow started (i.e. in progress) when the Flow is eligible to be shown. + * You will need to call `flow.start()` or `step.start()` from the parent component if you set this to `false`. Most components should not need to override this behavior. + * + * Defaults to `true`. + */ + autoStart?: boolean + /** + * Optional component to wrap the child components in, e.g. `as={Dialog}` will render the Flow in a modal Dialog. Defaults to `Box`. + */ + as?: React.ElementType + /** + * Emotion CSS prop to apply to the component. See [Theming documentation](https://docs.frigade.com/v2/sdk/styling/css-overrides) for more information. + * + * Example usage: + * ``` + * + * ``` + */ + css?: React.Attributes['css'] /** * Whether the Flow is dismissible or not * @@ -51,21 +71,6 @@ export interface FlowPropsWithoutChildren extends BoxPropsWithoutChildren { * For instance, you can use `title: Hello, ${name}!` in the Flow configuration and pass `variables={{name: 'John'}}` to customize the copy. */ variables?: Record - - /** - * Optional component to wrap the child components in, e.g. `as={Dialog}` will render the Flow in a modal Dialog. Defaults to `Box`. - */ - as?: React.ElementType - - /** - * Emotion CSS prop to apply to the component. See [Theming documentation](https://docs.frigade.com/v2/sdk/styling/css-overrides) for more information. - * - * Example usage: - * ``` - * - * ``` - */ - css?: React.Attributes['css'] } export interface FlowProps extends FlowPropsWithoutChildren { diff --git a/packages/react/src/components/Flow/index.tsx b/packages/react/src/components/Flow/index.tsx index 7b3dbb68..846ca815 100644 --- a/packages/react/src/components/Flow/index.tsx +++ b/packages/react/src/components/Flow/index.tsx @@ -24,6 +24,7 @@ function isDialog(component) { export function Flow({ as, + autoStart = true, children, flowId, onComplete, @@ -31,7 +32,6 @@ export function Flow({ onPrimary, onSecondary, variables, - ...props }: FlowProps) { // const [hasProcessedRules, setHasProcessedRules] = useState(false) @@ -123,7 +123,7 @@ export function Flow({ // return null // } - if (shouldForceMount || (!flow.isCompleted && !flow.isSkipped)) { + if (shouldForceMount || (!flow.isCompleted && !flow.isSkipped && autoStart)) { step?.start() } diff --git a/packages/react/src/components/Hint/index.tsx b/packages/react/src/components/Hint/index.tsx index 2763aef0..19413a0f 100644 --- a/packages/react/src/components/Hint/index.tsx +++ b/packages/react/src/components/Hint/index.tsx @@ -1,4 +1,4 @@ -import { useEffect, useState } from 'react' +import { useEffect, useRef, useState } from 'react' import { Box, type BoxProps } from '@/components/Box' import { Overlay } from '@/components/Overlay' @@ -21,6 +21,7 @@ export interface HintProps extends BoxProps { children?: React.ReactNode defaultOpen?: boolean modal?: boolean + onMount?: () => void onOpenChange?: (open: boolean) => void open?: boolean side?: SideValue @@ -37,6 +38,7 @@ export function Hint({ css = {}, defaultOpen = true, modal = false, + onMount, onOpenChange = () => {}, open, part, @@ -73,6 +75,7 @@ export function Hint({ const referenceProps = getReferenceProps() const { isVisible } = useVisibility(refs.reference.current as Element | null) + const isMounted = useRef(false) useEffect(() => { if (!scrollComplete && autoScroll && refs.reference.current instanceof Element) { @@ -105,8 +108,14 @@ export function Hint({ } }, [autoScroll, refs.reference, scrollComplete]) - if (refs.reference.current == null || !scrollComplete || !isVisible) { + const shouldMount = refs.reference.current !== null && scrollComplete && isVisible + + if (!shouldMount) { + isMounted.current = false return null + } else if (isMounted.current === false) { + isMounted.current = true + onMount?.() } return ( diff --git a/packages/react/src/components/Tour/Tour.tsx b/packages/react/src/components/Tour/Tour.tsx index 494ca7ed..8268dc47 100644 --- a/packages/react/src/components/Tour/Tour.tsx +++ b/packages/react/src/components/Tour/Tour.tsx @@ -74,7 +74,7 @@ export function Tour({ as, flowId, ...props }: TourProps) { const { onDismiss, onPrimary, onSecondary } = props return ( - + {({ flow, handleDismiss, parentProps, step }) => { const { align = 'after', diff --git a/packages/react/src/components/Tour/TourStep.tsx b/packages/react/src/components/Tour/TourStep.tsx index 94abf303..c7c2204d 100644 --- a/packages/react/src/components/Tour/TourStep.tsx +++ b/packages/react/src/components/Tour/TourStep.tsx @@ -68,6 +68,11 @@ export function TourStep({ side={side} sideOffset={sideOffset} spotlight={spotlight} + onMount={() => { + if (defaultOpen && !disabled) { + step?.start() + } + }} {...otherProps} > Date: Thu, 16 Jan 2025 17:00:43 -0800 Subject: [PATCH 122/213] Moved anchor debug messages to useMutationAwareAnchor --- apps/smithy/src/stories/Tour/Tour.stories.tsx | 2 +- packages/react/src/components/Hint/useFloatingHint.ts | 2 -- .../react/src/components/Hint/useMutationAwareAnchor.ts | 7 ++++++- 3 files changed, 7 insertions(+), 4 deletions(-) diff --git a/apps/smithy/src/stories/Tour/Tour.stories.tsx b/apps/smithy/src/stories/Tour/Tour.stories.tsx index 0af2a0a6..5311bc5c 100644 --- a/apps/smithy/src/stories/Tour/Tour.stories.tsx +++ b/apps/smithy/src/stories/Tour/Tour.stories.tsx @@ -49,7 +49,7 @@ export const Default = { ); setForceRender(Math.random()); - }, 333); + }, 1000); }, []); return ( diff --git a/packages/react/src/components/Hint/useFloatingHint.ts b/packages/react/src/components/Hint/useFloatingHint.ts index 1cf0e4d1..ee6621dc 100644 --- a/packages/react/src/components/Hint/useFloatingHint.ts +++ b/packages/react/src/components/Hint/useFloatingHint.ts @@ -106,8 +106,6 @@ export function useFloatingHint({ useEffect(() => { if (anchorElement != null) { refs.setReference(anchorElement) - } else { - console.debug(`[frigade] Hint: No anchor found for selector: ${anchor}`) } }, [anchor, anchorElement, refs]) diff --git a/packages/react/src/components/Hint/useMutationAwareAnchor.ts b/packages/react/src/components/Hint/useMutationAwareAnchor.ts index c5b4ac45..66ff4bf6 100644 --- a/packages/react/src/components/Hint/useMutationAwareAnchor.ts +++ b/packages/react/src/components/Hint/useMutationAwareAnchor.ts @@ -32,10 +32,13 @@ export function useMutationAwareAnchor(anchor: string) { const element = document.querySelector(anchor) if (element != null) { + console.debug(`[frigade] Found anchor: ${anchor}`) setAnchorElement(element) + } else { + console.debug(`[frigade] No anchor found for selector: ${anchor}`) } } catch (invalidSelector) { - /* no-op */ + console.debug(`[frigade] Invalid selector for anchor: ${anchor}`) } }, [anchor]) @@ -54,6 +57,7 @@ export function useMutationAwareAnchor(anchor: string) { const maybeAnchor = checkElementForAnchor(node as Element, anchor) if (maybeAnchor != null) { + console.debug(`[frigade] Found anchor: ${anchor}`) setAnchorElement(maybeAnchor) break } @@ -67,6 +71,7 @@ export function useMutationAwareAnchor(anchor: string) { const maybeAnchor = checkElementForAnchor(node as Element, anchor) if (maybeAnchor != null) { + console.debug(`[frigade] Removed anchor: ${anchor}`) setAnchorElement(null) break } From 4e1ed2aab5ce4d769362d85e91662e2ade50d2c7 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Tue, 21 Jan 2025 17:33:43 -0800 Subject: [PATCH 123/213] feat: allow locking/unlocking scroll when using hint overlays (#415) * feat: allow locking/unlocking scroll when using hint overlays * fix check on scroll * make lock scroll more efficient --- apps/smithy/src/stories/Tour/Tour.stories.tsx | 1 + packages/react/src/components/Hint/index.tsx | 6 ++-- .../react/src/components/Overlay/index.tsx | 32 +++++++++++++++++-- .../react/src/components/Spotlight/index.tsx | 10 +++++- packages/react/src/components/Tour/Tour.tsx | 14 +++++++- .../react/src/components/Tour/TourStep.tsx | 2 ++ 6 files changed, 58 insertions(+), 7 deletions(-) diff --git a/apps/smithy/src/stories/Tour/Tour.stories.tsx b/apps/smithy/src/stories/Tour/Tour.stories.tsx index 5311bc5c..11d11170 100644 --- a/apps/smithy/src/stories/Tour/Tour.stories.tsx +++ b/apps/smithy/src/stories/Tour/Tour.stories.tsx @@ -20,6 +20,7 @@ export const Default = { variables: { firstName: "Euronymous Bosch", }, + lockScroll: true, }, decorators: [ (_: StoryFn, options: StoryContext) => { diff --git a/packages/react/src/components/Hint/index.tsx b/packages/react/src/components/Hint/index.tsx index 19413a0f..d0897e9f 100644 --- a/packages/react/src/components/Hint/index.tsx +++ b/packages/react/src/components/Hint/index.tsx @@ -20,6 +20,7 @@ export interface HintProps extends BoxProps { autoScroll?: ScrollIntoViewOptions | boolean children?: React.ReactNode defaultOpen?: boolean + lockScroll?: boolean modal?: boolean onMount?: () => void onOpenChange?: (open: boolean) => void @@ -37,6 +38,7 @@ export function Hint({ children, css = {}, defaultOpen = true, + lockScroll = true, modal = false, onMount, onOpenChange = () => {}, @@ -120,8 +122,8 @@ export function Hint({ return ( <> - {spotlight && canonicalOpen && } - {modal && !spotlight && canonicalOpen && } + {spotlight && canonicalOpen && } + {modal && !spotlight && canonicalOpen && } ) { const fadeIn = keyframes` @@ -20,8 +23,31 @@ function OverlayWithRef( } ` + const [hasScrolled, setHasScrolled] = useState(false) + + useEffect(() => { + if (!lockScroll) { + const handleScroll = () => { + if (!hasScrolled) { + setHasScrolled(true) + window.removeEventListener('scroll', handleScroll) + } + } + + window.addEventListener('scroll', handleScroll) + + return () => { + window.removeEventListener('scroll', handleScroll) + } + } + }, [lockScroll, hasScrolled]) + + if (!lockScroll && hasScrolled) { + return <>{children} + } + return ( - + ({ maxX: 0, maxY: 0, @@ -109,6 +116,7 @@ export function Spotlight({ anchor, part, style = {}, ...props }: SpotlightProps return ( - + ) } @@ -198,6 +209,7 @@ export function Tour({ as, flowId, ...props }: TourProps) { }} defaultOpen={(defaultOpen || shouldShowSpotlight) ?? false} key={`${currentStep.id}-${shouldShowSpotlight}`} + lockScroll={lockScroll} step={currentStep} {...nonSequentialStepProps} /> diff --git a/packages/react/src/components/Tour/TourStep.tsx b/packages/react/src/components/Tour/TourStep.tsx index c7c2204d..cb050950 100644 --- a/packages/react/src/components/Tour/TourStep.tsx +++ b/packages/react/src/components/Tour/TourStep.tsx @@ -34,6 +34,7 @@ export function TourStep({ dismissible, flow, handleDismiss, + lockScroll, modal, onPrimary, onSecondary, @@ -63,6 +64,7 @@ export function TourStep({ autoScroll={autoScroll} data-step-id={step.id} defaultOpen={defaultOpen} + lockScroll={lockScroll} modal={modal} part={part} side={side} From 8225ecdfa99100a9cef55aeefaf09bc7c2db2eb8 Mon Sep 17 00:00:00 2001 From: christianmat Date: Tue, 21 Jan 2025 19:45:35 -0800 Subject: [PATCH 124/213] changeset --- .changeset/little-avocados-nail.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/little-avocados-nail.md diff --git a/.changeset/little-avocados-nail.md b/.changeset/little-avocados-nail.md new file mode 100644 index 00000000..97496d57 --- /dev/null +++ b/.changeset/little-avocados-nail.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": patch +--- + +Updates the behavior of `` such that Flows are only marked started when a valid selector is found. Also adds the ability to disable/enable scroll when using spotlight in tours. From 097315c545f235db9ac4808dfe3cb85cc0957f52 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Tue, 21 Jan 2025 19:51:36 -0800 Subject: [PATCH 125/213] Version Packages (#416) Co-authored-by: github-actions[bot] --- .changeset/little-avocados-nail.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/little-avocados-nail.md diff --git a/.changeset/little-avocados-nail.md b/.changeset/little-avocados-nail.md deleted file mode 100644 index 97496d57..00000000 --- a/.changeset/little-avocados-nail.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": patch ---- - -Updates the behavior of `` such that Flows are only marked started when a valid selector is found. Also adds the ability to disable/enable scroll when using spotlight in tours. diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 6cbdffbd..c80957e4 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/react +## 2.7.2 + +### Patch Changes + +- 8225ecd: Updates the behavior of `` such that Flows are only marked started when a valid selector is found. Also adds the ability to disable/enable scroll when using spotlight in tours. + ## 2.7.1 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 847a0190..94669b5a 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.7.1", + "version": "2.7.2", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From f20ad695d049d0de2ea0f63e9f78ef8feb3bee08 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Wed, 22 Jan 2025 03:54:08 +0000 Subject: [PATCH 126/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 0ac8b769..bceaeb2d 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.7.1'; \ No newline at end of file +export const SDK_VERSION = '2.7.2'; \ No newline at end of file From 9af9942f2cadfd40b0a1d4fd6bb677838e637d14 Mon Sep 17 00:00:00 2001 From: christianmat Date: Thu, 23 Jan 2025 13:35:26 -0800 Subject: [PATCH 127/213] fix: exhaustive steps bug --- .../react/src/components/Provider/Provider.tsx | 14 ++------------ 1 file changed, 2 insertions(+), 12 deletions(-) diff --git a/packages/react/src/components/Provider/Provider.tsx b/packages/react/src/components/Provider/Provider.tsx index 66ea5c7a..d85ea6f7 100644 --- a/packages/react/src/components/Provider/Provider.tsx +++ b/packages/react/src/components/Provider/Provider.tsx @@ -163,18 +163,8 @@ export function Provider({ __platformVersion: SDK_VERSION, __platformName: 'React', } as FrigadeConfig) - }, [ - props.apiKey, - props.apiUrl, - props.userId, - props.groupId, - props.userProperties, - props.groupProperties, - props.generateGuestId, - props.syncOnWindowUpdates, - props.__readOnly, - props.__flowStateOverrides, - ]) + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [props.userId, props.groupId, props.apiKey]) useEffect(() => { if (props.__flowStateOverrides) { From d05a92394256b27e53a6cc6dbac85e8702f3de61 Mon Sep 17 00:00:00 2001 From: christianmat Date: Thu, 23 Jan 2025 13:36:51 -0800 Subject: [PATCH 128/213] changeset --- .changeset/large-eagles-brush.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/large-eagles-brush.md diff --git a/.changeset/large-eagles-brush.md b/.changeset/large-eagles-brush.md new file mode 100644 index 00000000..2e6a6993 --- /dev/null +++ b/.changeset/large-eagles-brush.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": patch +--- + +Fixes an issue where Frigade will re-render when minor fields are changed in the provider From fcead7905d190ec95d0e30ace7a2022bab190cbd Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Thu, 23 Jan 2025 13:38:42 -0800 Subject: [PATCH 129/213] Version Packages (#420) Co-authored-by: github-actions[bot] --- .changeset/large-eagles-brush.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/large-eagles-brush.md diff --git a/.changeset/large-eagles-brush.md b/.changeset/large-eagles-brush.md deleted file mode 100644 index 2e6a6993..00000000 --- a/.changeset/large-eagles-brush.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": patch ---- - -Fixes an issue where Frigade will re-render when minor fields are changed in the provider diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index c80957e4..9b14811a 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/react +## 2.7.3 + +### Patch Changes + +- d05a923: Fixes an issue where Frigade will re-render when minor fields are changed in the provider + ## 2.7.2 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 94669b5a..aa144551 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.7.2", + "version": "2.7.3", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From 54e797e0a2743da70e6121b27cfc73f0253ca4af Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Thu, 23 Jan 2025 21:41:22 +0000 Subject: [PATCH 130/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index bceaeb2d..42ea2def 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.7.2'; \ No newline at end of file +export const SDK_VERSION = '2.7.3'; \ No newline at end of file From 50e19bad76e7bb2d5061e2db363a439ff59ea6e8 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Thu, 23 Jan 2025 15:07:17 -0800 Subject: [PATCH 131/213] fix: support react 19 (#419) * fix: support react 19 * changeset --- .changeset/lazy-ants-lick.md | 5 +++ apps/smithy/package.json | 16 +++---- packages/react/package.json | 4 +- yarn.lock | 85 +++++++++++++++++++++--------------- 4 files changed, 64 insertions(+), 46 deletions(-) create mode 100644 .changeset/lazy-ants-lick.md diff --git a/.changeset/lazy-ants-lick.md b/.changeset/lazy-ants-lick.md new file mode 100644 index 00000000..0d14dfbd --- /dev/null +++ b/.changeset/lazy-ants-lick.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": patch +--- + +Adds support for React 19 diff --git a/apps/smithy/package.json b/apps/smithy/package.json index dc09e534..314659e5 100644 --- a/apps/smithy/package.json +++ b/apps/smithy/package.json @@ -12,8 +12,8 @@ }, "dependencies": { "@frigade/react": "workspace:*", - "react": "^18.2.0", - "react-dom": "^18.2.0" + "react": "^19.0.0", + "react-dom": "^19.0.0" }, "devDependencies": { "@storybook/addon-docs": "^8.2.9", @@ -26,14 +26,14 @@ "@storybook/react-vite": "^8.2.9", "@storybook/test": "^8.2.9", "@storybook/test-runner": "^0.19.1", - "@types/react": "^18.2.34", - "@types/react-dom": "^18.2.14", - "@typescript-eslint/eslint-plugin": "^6.0.0", - "@typescript-eslint/parser": "^6.0.0", + "@types/react": "^19.0.0", + "@types/react-dom": "^19.0.0", + "@typescript-eslint/eslint-plugin": "^6.20.0", + "@typescript-eslint/parser": "^6.20.0", "@vitejs/plugin-react": "^4.0.3", - "eslint": "^8.45.0", + "eslint": "^8.56.0", "eslint-plugin-react-hooks": "^4.6.0", - "eslint-plugin-react-refresh": "^0.4.3", + "eslint-plugin-react-refresh": "^0.4.5", "eslint-plugin-storybook": "^0.8.0", "playwright": "^1.47.1", "prop-types": "^15.8.1", diff --git a/packages/react/package.json b/packages/react/package.json index aa144551..7343e069 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -68,8 +68,8 @@ "use-sync-external-store": "^1.4.0" }, "peerDependencies": { - "react": "17 - 18", - "react-dom": "17 - 18" + "react": "17 - 19", + "react-dom": "17 - 19" }, "devDependencies": { "@types/dompurify": "^3.0.5", diff --git a/yarn.lock b/yarn.lock index eb37ad3a..ebe88704 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3792,8 +3792,8 @@ __metadata: typescript: "npm:^4.9.4" use-sync-external-store: "npm:^1.4.0" peerDependencies: - react: 17 - 18 - react-dom: 17 - 18 + react: 17 - 19 + react-dom: 17 - 19 languageName: unknown linkType: soft @@ -7822,6 +7822,15 @@ __metadata: languageName: node linkType: hard +"@types/react-dom@npm:^19.0.0": + version: 19.0.3 + resolution: "@types/react-dom@npm:19.0.3" + peerDependencies: + "@types/react": ^19.0.0 + checksum: 10/815907f7adaa078acbf1d1ae7b6bf69cebe86bd301b8b9744e392bc0f16feb31bfb9fe0bfa2681d7d86678c83d52dedba5ed9bc7776736d4050cdd426b8b2d2b + languageName: node + linkType: hard + "@types/react@npm:*, @types/react@npm:>=16, @types/react@npm:^18.2.34": version: 18.2.57 resolution: "@types/react@npm:18.2.57" @@ -7843,6 +7852,15 @@ __metadata: languageName: node linkType: hard +"@types/react@npm:^19.0.0": + version: 19.0.7 + resolution: "@types/react@npm:19.0.7" + dependencies: + csstype: "npm:^3.0.2" + checksum: 10/09522132bde715888e57c61fc89a87db06699872535450296f1c975c5014a7953ff08c3bff6b37d4a4515ceeb65b09cc5f841513cc8fede65fec788790b21154 + languageName: node + linkType: hard + "@types/resolve@npm:^1.20.2": version: 1.20.6 resolution: "@types/resolve@npm:1.20.6" @@ -7990,7 +8008,7 @@ __metadata: languageName: node linkType: hard -"@typescript-eslint/eslint-plugin@npm:^6.0.0, @typescript-eslint/eslint-plugin@npm:^6.20.0": +"@typescript-eslint/eslint-plugin@npm:^6.20.0": version: 6.21.0 resolution: "@typescript-eslint/eslint-plugin@npm:6.21.0" dependencies: @@ -8048,7 +8066,7 @@ __metadata: languageName: node linkType: hard -"@typescript-eslint/parser@npm:^6.0.0, @typescript-eslint/parser@npm:^6.20.0": +"@typescript-eslint/parser@npm:^6.20.0": version: 6.21.0 resolution: "@typescript-eslint/parser@npm:6.21.0" dependencies: @@ -11882,7 +11900,7 @@ __metadata: languageName: node linkType: hard -"eslint-plugin-react-refresh@npm:^0.4.3, eslint-plugin-react-refresh@npm:^0.4.5": +"eslint-plugin-react-refresh@npm:^0.4.5": version: 0.4.5 resolution: "eslint-plugin-react-refresh@npm:0.4.5" peerDependencies: @@ -12042,7 +12060,7 @@ __metadata: languageName: node linkType: hard -"eslint@npm:^8.45.0, eslint@npm:^8.56.0": +"eslint@npm:^8.56.0": version: 8.56.0 resolution: "eslint@npm:8.56.0" dependencies: @@ -17440,15 +17458,14 @@ __metadata: languageName: node linkType: hard -"react-dom@npm:^18.2.0": - version: 18.2.0 - resolution: "react-dom@npm:18.2.0" +"react-dom@npm:^19.0.0": + version: 19.0.0 + resolution: "react-dom@npm:19.0.0" dependencies: - loose-envify: "npm:^1.1.0" - scheduler: "npm:^0.23.0" + scheduler: "npm:^0.25.0" peerDependencies: - react: ^18.2.0 - checksum: 10/ca5e7762ec8c17a472a3605b6f111895c9f87ac7d43a610ab7024f68cd833d08eda0625ce02ec7178cc1f3c957cf0b9273cdc17aa2cd02da87544331c43b1d21 + react: ^19.0.0 + checksum: 10/aa64a2f1991042f516260e8b0eca0ae777b6c8f1aa2b5ae096e80bbb6ac9b005aef2bca697969841d34f7e1819556263476bdfea36c35092e8d9aefde3de2d9a languageName: node linkType: hard @@ -17644,12 +17661,10 @@ __metadata: languageName: node linkType: hard -"react@npm:^18.2.0": - version: 18.2.0 - resolution: "react@npm:18.2.0" - dependencies: - loose-envify: "npm:^1.1.0" - checksum: 10/b9214a9bd79e99d08de55f8bef2b7fc8c39630be97c4e29d7be173d14a9a10670b5325e94485f74cd8bff4966ef3c78ee53c79a7b0b9b70cba20aa8973acc694 +"react@npm:^19.0.0": + version: 19.0.0 + resolution: "react@npm:19.0.0" + checksum: 10/2490969c503f644703c88990d20e4011fa6119ddeca451e9de48f6d7ab058d670d2852a5fcd3aa3cd90a923ab2815d532637bd4a814add402ae5c0d4f129ee71 languageName: node linkType: hard @@ -18267,15 +18282,6 @@ __metadata: languageName: node linkType: hard -"scheduler@npm:^0.23.0": - version: 0.23.0 - resolution: "scheduler@npm:0.23.0" - dependencies: - loose-envify: "npm:^1.1.0" - checksum: 10/0c4557aa37bafca44ff21dc0ea7c92e2dbcb298bc62eae92b29a39b029134f02fb23917d6ebc8b1fa536b4184934314c20d8864d156a9f6357f3398aaf7bfda8 - languageName: node - linkType: hard - "scheduler@npm:^0.23.2": version: 0.23.2 resolution: "scheduler@npm:0.23.2" @@ -18285,6 +18291,13 @@ __metadata: languageName: node linkType: hard +"scheduler@npm:^0.25.0": + version: 0.25.0 + resolution: "scheduler@npm:0.25.0" + checksum: 10/e661e38503ab29a153429a99203fefa764f28b35c079719eb5efdd2c1c1086522f6653d8ffce388209682c23891a6d1d32fa6badf53c35fb5b9cd0c55ace42de + languageName: node + linkType: hard + "schema-utils@npm:^3.0.0, schema-utils@npm:^3.1.1, schema-utils@npm:^3.2.0": version: 3.3.0 resolution: "schema-utils@npm:3.3.0" @@ -18596,19 +18609,19 @@ __metadata: "@storybook/react-vite": "npm:^8.2.9" "@storybook/test": "npm:^8.2.9" "@storybook/test-runner": "npm:^0.19.1" - "@types/react": "npm:^18.2.34" - "@types/react-dom": "npm:^18.2.14" - "@typescript-eslint/eslint-plugin": "npm:^6.0.0" - "@typescript-eslint/parser": "npm:^6.0.0" + "@types/react": "npm:^19.0.0" + "@types/react-dom": "npm:^19.0.0" + "@typescript-eslint/eslint-plugin": "npm:^6.20.0" + "@typescript-eslint/parser": "npm:^6.20.0" "@vitejs/plugin-react": "npm:^4.0.3" - eslint: "npm:^8.45.0" + eslint: "npm:^8.56.0" eslint-plugin-react-hooks: "npm:^4.6.0" - eslint-plugin-react-refresh: "npm:^0.4.3" + eslint-plugin-react-refresh: "npm:^0.4.5" eslint-plugin-storybook: "npm:^0.8.0" playwright: "npm:^1.47.1" prop-types: "npm:^15.8.1" - react: "npm:^18.2.0" - react-dom: "npm:^18.2.0" + react: "npm:^19.0.0" + react-dom: "npm:^19.0.0" storybook: "npm:^8.2.9" typescript: "npm:^4.9.4" vite: "npm:^4.5.5" From 2285853a1af67154c008800a369f6269707c0506 Mon Sep 17 00:00:00 2001 From: christianmat Date: Thu, 23 Jan 2025 19:00:13 -0800 Subject: [PATCH 132/213] fix: broken tests --- packages/js-api/test/frigade.int.test.ts | 4 +--- packages/reactv1/package.json | 1 - 2 files changed, 1 insertion(+), 4 deletions(-) diff --git a/packages/js-api/test/frigade.int.test.ts b/packages/js-api/test/frigade.int.test.ts index bdae7d67..459ec249 100644 --- a/packages/js-api/test/frigade.int.test.ts +++ b/packages/js-api/test/frigade.int.test.ts @@ -1,9 +1,7 @@ -import { FlowStep, Frigade } from '../src' +import { FlowStep, FlowType, Frigade } from '../src' import { getRandomID } from './util' import { Flow } from '../src/.' -import { FlowType } from '@frigade/reactv1' - const testAPIKey = 'api_public_3MPLH7NJ9L0U963XKW7BPE2IT137GC6L742JLC2XCT6NOIYSI4QUI9I1RA3ZOGIL' const testFlowId = 'flow_yJfjksFrs5QEH0c8' const testFlowIdWithTargeting = 'flow_61YBPQek' diff --git a/packages/reactv1/package.json b/packages/reactv1/package.json index 9a325ee1..bd55408e 100644 --- a/packages/reactv1/package.json +++ b/packages/reactv1/package.json @@ -10,7 +10,6 @@ ], "scripts": { "clean": "rimraf ./dist", - "test": "jest", "lint": "eslint --fix --ext .ts,.tsx .", "build": "yarn clean && tsup", "local-release": "tsup", From 1839a4a93fe93d546edd66cf184b32276e5b8b9d Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Thu, 23 Jan 2025 19:00:30 -0800 Subject: [PATCH 133/213] Version Packages (#421) Co-authored-by: github-actions[bot] --- .changeset/lazy-ants-lick.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/lazy-ants-lick.md diff --git a/.changeset/lazy-ants-lick.md b/.changeset/lazy-ants-lick.md deleted file mode 100644 index 0d14dfbd..00000000 --- a/.changeset/lazy-ants-lick.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": patch ---- - -Adds support for React 19 diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 9b14811a..8e1c32db 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/react +## 2.7.4 + +### Patch Changes + +- 50e19ba: Adds support for React 19 + ## 2.7.3 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 7343e069..8723aba9 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.7.3", + "version": "2.7.4", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From 28ebe22ae85938957c4456ffc584d7f85edb6269 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Fri, 24 Jan 2025 03:02:43 +0000 Subject: [PATCH 134/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 42ea2def..e14fc3c1 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.7.3'; \ No newline at end of file +export const SDK_VERSION = '2.7.4'; \ No newline at end of file From aff016e115578ec0433996dbf51b3a5d8f470c2c Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Mon, 3 Feb 2025 12:00:50 -0800 Subject: [PATCH 135/213] Update Emotion to 11.14.x --- packages/react/package.json | 2 +- yarn.lock | 138 ++++++++++++++++++++---------------- 2 files changed, 78 insertions(+), 62 deletions(-) diff --git a/packages/react/package.json b/packages/react/package.json index 8723aba9..8ff3846f 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -49,7 +49,7 @@ "prepare": "cd ../../ && husky" }, "dependencies": { - "@emotion/react": "^11.11.4", + "@emotion/react": "^11.14.0", "@floating-ui/react": "^0.26.22", "@frigade/js": "^0.8.1", "@radix-ui/react-checkbox": "^1.1.1", diff --git a/yarn.lock b/yarn.lock index ebe88704..78d0e952 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2956,42 +2956,42 @@ __metadata: languageName: node linkType: hard -"@emotion/babel-plugin@npm:^11.11.0": - version: 11.11.0 - resolution: "@emotion/babel-plugin@npm:11.11.0" +"@emotion/babel-plugin@npm:^11.13.5": + version: 11.13.5 + resolution: "@emotion/babel-plugin@npm:11.13.5" dependencies: "@babel/helper-module-imports": "npm:^7.16.7" "@babel/runtime": "npm:^7.18.3" - "@emotion/hash": "npm:^0.9.1" - "@emotion/memoize": "npm:^0.8.1" - "@emotion/serialize": "npm:^1.1.2" + "@emotion/hash": "npm:^0.9.2" + "@emotion/memoize": "npm:^0.9.0" + "@emotion/serialize": "npm:^1.3.3" babel-plugin-macros: "npm:^3.1.0" convert-source-map: "npm:^1.5.0" escape-string-regexp: "npm:^4.0.0" find-root: "npm:^1.1.0" source-map: "npm:^0.5.7" stylis: "npm:4.2.0" - checksum: 10/8de017666838fc06b1a961d7a49b4e6dc0c83dbb064ea33512bae056594f0811a87e3242ef90fa2aa49fc080fab1cc7af536e7aee9398eaca7a1fc020d2dd527 + checksum: 10/cd310568314d886ca328e504f84c4f7f9c7f092ea34a2b43fdb61f84665bf301ba2ef49e0fd1e7ded3d81363d9bbefbb32674ce88b317cfb64db2b65e5ff423f languageName: node linkType: hard -"@emotion/cache@npm:^11.11.0": - version: 11.11.0 - resolution: "@emotion/cache@npm:11.11.0" +"@emotion/cache@npm:^11.14.0": + version: 11.14.0 + resolution: "@emotion/cache@npm:11.14.0" dependencies: - "@emotion/memoize": "npm:^0.8.1" - "@emotion/sheet": "npm:^1.2.2" - "@emotion/utils": "npm:^1.2.1" - "@emotion/weak-memoize": "npm:^0.3.1" + "@emotion/memoize": "npm:^0.9.0" + "@emotion/sheet": "npm:^1.4.0" + "@emotion/utils": "npm:^1.4.2" + "@emotion/weak-memoize": "npm:^0.4.0" stylis: "npm:4.2.0" - checksum: 10/ef29756247dafb87168b4ffb76ee60feb06b8a1016323ecb1d3ba8aed3f4300ca10049bedbfe83aa11e0d81e616c328002a9d50020ebb3af6e4f5337a785c1fe + checksum: 10/52336b28a27b07dde8fcdfd80851cbd1487672bbd4db1e24cca1440c95d8a6a968c57b0453c2b7c88d9b432b717f99554dbecc05b5cdef27933299827e69fd8e languageName: node linkType: hard -"@emotion/hash@npm:^0.9.1": - version: 0.9.1 - resolution: "@emotion/hash@npm:0.9.1" - checksum: 10/716e17e48bf9047bf9383982c071de49f2615310fb4e986738931776f5a823bc1f29c84501abe0d3df91a3803c80122d24e28b57351bca9e01356ebb33d89876 +"@emotion/hash@npm:^0.9.2": + version: 0.9.2 + resolution: "@emotion/hash@npm:0.9.2" + checksum: 10/379bde2830ccb0328c2617ec009642321c0e009a46aa383dfbe75b679c6aea977ca698c832d225a893901f29d7b3eef0e38cf341f560f6b2b56f1ff23c172387 languageName: node linkType: hard @@ -3011,44 +3011,51 @@ __metadata: languageName: node linkType: hard -"@emotion/react@npm:^11.11.4": - version: 11.11.4 - resolution: "@emotion/react@npm:11.11.4" +"@emotion/memoize@npm:^0.9.0": + version: 0.9.0 + resolution: "@emotion/memoize@npm:0.9.0" + checksum: 10/038132359397348e378c593a773b1148cd0cf0a2285ffd067a0f63447b945f5278860d9de718f906a74c7c940ba1783ac2ca18f1c06a307b01cc0e3944e783b1 + languageName: node + linkType: hard + +"@emotion/react@npm:^11.14.0": + version: 11.14.0 + resolution: "@emotion/react@npm:11.14.0" dependencies: "@babel/runtime": "npm:^7.18.3" - "@emotion/babel-plugin": "npm:^11.11.0" - "@emotion/cache": "npm:^11.11.0" - "@emotion/serialize": "npm:^1.1.3" - "@emotion/use-insertion-effect-with-fallbacks": "npm:^1.0.1" - "@emotion/utils": "npm:^1.2.1" - "@emotion/weak-memoize": "npm:^0.3.1" + "@emotion/babel-plugin": "npm:^11.13.5" + "@emotion/cache": "npm:^11.14.0" + "@emotion/serialize": "npm:^1.3.3" + "@emotion/use-insertion-effect-with-fallbacks": "npm:^1.2.0" + "@emotion/utils": "npm:^1.4.2" + "@emotion/weak-memoize": "npm:^0.4.0" hoist-non-react-statics: "npm:^3.3.1" peerDependencies: react: ">=16.8.0" peerDependenciesMeta: "@types/react": optional: true - checksum: 10/e7da3a1ddc1d72a4179010bdfd17423c13b1a77bf83a8b18271e919fd382d08c62dc2313ed5347acfd1ef85bb1bae8932597647a986e8a1ea1462552716cd495 + checksum: 10/3356c1d66f37f4e7abf88a2be843f6023b794b286c9c99a0aaf1cd1b2b7c50f8d80a2ef77183da737de70150f638e698ff4a2a38ab2d922f868615f1d5761c37 languageName: node linkType: hard -"@emotion/serialize@npm:^1.1.2, @emotion/serialize@npm:^1.1.3": - version: 1.1.3 - resolution: "@emotion/serialize@npm:1.1.3" +"@emotion/serialize@npm:^1.3.3": + version: 1.3.3 + resolution: "@emotion/serialize@npm:1.3.3" dependencies: - "@emotion/hash": "npm:^0.9.1" - "@emotion/memoize": "npm:^0.8.1" - "@emotion/unitless": "npm:^0.8.1" - "@emotion/utils": "npm:^1.2.1" + "@emotion/hash": "npm:^0.9.2" + "@emotion/memoize": "npm:^0.9.0" + "@emotion/unitless": "npm:^0.10.0" + "@emotion/utils": "npm:^1.4.2" csstype: "npm:^3.0.2" - checksum: 10/48d88923663273ae70359bc1a1f30454136716cbe0ddd9664be08e257ce56acedab911f125b627627358e37c9f450bbac3ea09b534ef42f9f67325d47b1e2a7b + checksum: 10/44a2e06fc52dba177d9cf720f7b2c5d45ee4c0d9c09b78302d9a625e758d728ef3ae26f849237fec6f70e9eeb7d87e45a65028e944dc1f877df97c599f1cdaee languageName: node linkType: hard -"@emotion/sheet@npm:^1.2.2": - version: 1.2.2 - resolution: "@emotion/sheet@npm:1.2.2" - checksum: 10/cc46b20ef7273dc28de889927ae1498f854be2890905745fcc3154fbbacaa54df1e28c3d89ff3339c2022782c78933f51955bb950d105d5a219576db1eadfb7a +"@emotion/sheet@npm:^1.4.0": + version: 1.4.0 + resolution: "@emotion/sheet@npm:1.4.0" + checksum: 10/8ac6e9bf6b373a648f26ae7f1c24041038524f4c72f436f4f8c4761c665e58880c3229d8d89b1f7a4815dd8e5b49634d03e60187cb6f93097d7f7c1859e869d5 languageName: node linkType: hard @@ -3059,6 +3066,13 @@ __metadata: languageName: node linkType: hard +"@emotion/unitless@npm:^0.10.0": + version: 0.10.0 + resolution: "@emotion/unitless@npm:0.10.0" + checksum: 10/6851c16edce01c494305f43b2cad7a26b939a821131b7c354e49b8e3b012c8810024755b0f4a03ef51117750309e55339825a97bd10411fb3687e68904769106 + languageName: node + linkType: hard + "@emotion/unitless@npm:^0.7.4": version: 0.7.5 resolution: "@emotion/unitless@npm:0.7.5" @@ -3066,14 +3080,7 @@ __metadata: languageName: node linkType: hard -"@emotion/unitless@npm:^0.8.1": - version: 0.8.1 - resolution: "@emotion/unitless@npm:0.8.1" - checksum: 10/918f73c46ac0b7161e3c341cc07d651ce87e31ab1695e74b12adb7da6bb98dfbff8c69cf68a4e40d9eb3d820ca055dc1267aeb3007927ce88f98b885bf729b63 - languageName: node - linkType: hard - -"@emotion/use-insertion-effect-with-fallbacks@npm:^1.0.0, @emotion/use-insertion-effect-with-fallbacks@npm:^1.0.1": +"@emotion/use-insertion-effect-with-fallbacks@npm:^1.0.0": version: 1.0.1 resolution: "@emotion/use-insertion-effect-with-fallbacks@npm:1.0.1" peerDependencies: @@ -3082,17 +3089,26 @@ __metadata: languageName: node linkType: hard -"@emotion/utils@npm:^1.2.1": - version: 1.2.1 - resolution: "@emotion/utils@npm:1.2.1" - checksum: 10/472fa529c64a13edff80aa11698092e8841c1ffb5001c739d84eb9d0fdd6d8e1cd1848669310578ccfa6383b8601132eca54f8749fca40af85d21fdfc9b776c4 +"@emotion/use-insertion-effect-with-fallbacks@npm:^1.2.0": + version: 1.2.0 + resolution: "@emotion/use-insertion-effect-with-fallbacks@npm:1.2.0" + peerDependencies: + react: ">=16.8.0" + checksum: 10/2374999db8d53ef661d61ed1026c42a849632e4f03826f7eba0314c1d92ae342161d737f5045453aa46dd4008e13ccefeba68d3165b667dfad8e5784fcb0c643 languageName: node linkType: hard -"@emotion/weak-memoize@npm:^0.3.1": - version: 0.3.1 - resolution: "@emotion/weak-memoize@npm:0.3.1" - checksum: 10/b2be47caa24a8122622ea18cd2d650dbb4f8ad37b636dc41ed420c2e082f7f1e564ecdea68122b546df7f305b159bf5ab9ffee872abd0f052e687428459af594 +"@emotion/utils@npm:^1.4.2": + version: 1.4.2 + resolution: "@emotion/utils@npm:1.4.2" + checksum: 10/e5f3b8bca066b3361a7ad9064baeb9d01ed1bf51d98416a67359b62cb3affec6bb0249802c4ed11f4f8030f93cc4b67506909420bdb110adec6983d712897208 + languageName: node + linkType: hard + +"@emotion/weak-memoize@npm:^0.4.0": + version: 0.4.0 + resolution: "@emotion/weak-memoize@npm:0.4.0" + checksum: 10/db5da0e89bd752c78b6bd65a1e56231f0abebe2f71c0bd8fc47dff96408f7065b02e214080f99924f6a3bfe7ee15afc48dad999d76df86b39b16e513f7a94f52 languageName: node linkType: hard @@ -3753,7 +3769,7 @@ __metadata: version: 0.0.0-use.local resolution: "@frigade/react@workspace:packages/react" dependencies: - "@emotion/react": "npm:^11.11.4" + "@emotion/react": "npm:^11.14.0" "@floating-ui/react": "npm:^0.26.22" "@frigade/js": "npm:^0.8.1" "@radix-ui/react-checkbox": "npm:^1.1.1" @@ -7853,11 +7869,11 @@ __metadata: linkType: hard "@types/react@npm:^19.0.0": - version: 19.0.7 - resolution: "@types/react@npm:19.0.7" + version: 19.0.8 + resolution: "@types/react@npm:19.0.8" dependencies: csstype: "npm:^3.0.2" - checksum: 10/09522132bde715888e57c61fc89a87db06699872535450296f1c975c5014a7953ff08c3bff6b37d4a4515ceeb65b09cc5f841513cc8fede65fec788790b21154 + checksum: 10/1080d5b96ee0b4395f8f167ae6952f570088ee03bdce69f8237aab82c32d9bd2b71106f787bac17ba351acc4aba5e3454bafca51f2eb11d1562073b821e63d15 languageName: node linkType: hard From a90d5a7d4a5d9f24afcdeec9b08556adb8f3d5ae Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Mon, 3 Feb 2025 12:51:13 -0800 Subject: [PATCH 136/213] Update Emotion JSX.Element type --- packages/react/src/components/Card/index.tsx | 18 +++++++++--------- .../src/components/Checklist/Collapsible.tsx | 4 ++-- .../react/src/components/Collection/index.tsx | 4 ++-- 3 files changed, 13 insertions(+), 13 deletions(-) diff --git a/packages/react/src/components/Card/index.tsx b/packages/react/src/components/Card/index.tsx index 86b4568b..37eeaa45 100644 --- a/packages/react/src/components/Card/index.tsx +++ b/packages/react/src/components/Card/index.tsx @@ -1,6 +1,6 @@ import type { ForwardRefExoticComponent, RefAttributes } from 'react' import * as React from 'react' -import { EmotionJSX } from '@emotion/react/types/jsx-namespace' +import type { JSX } from '@emotion/react/jsx-runtime' import type { BoxProps } from '@/components/Box' import { Button, type ButtonProps } from '@/components/Button' @@ -24,14 +24,14 @@ export interface CardComponent extends ForwardRefExoticComponent< Omit & RefAttributes > { - Dismiss: (props: ButtonProps) => EmotionJSX.Element - Header: (props: CardHeaderProps) => EmotionJSX.Element - Footer: (props: BoxProps) => EmotionJSX.Element - Media: (props: MediaProps) => EmotionJSX.Element - Primary: (props: ButtonProps) => EmotionJSX.Element - Secondary: (props: ButtonProps) => EmotionJSX.Element - Subtitle: (props: TextProps) => EmotionJSX.Element - Title: (props: TextProps) => EmotionJSX.Element + Dismiss: (props: ButtonProps) => JSX.Element + Header: (props: CardHeaderProps) => JSX.Element + Footer: (props: BoxProps) => JSX.Element + Media: (props: MediaProps) => JSX.Element + Primary: (props: ButtonProps) => JSX.Element + Secondary: (props: ButtonProps) => JSX.Element + Subtitle: (props: TextProps) => JSX.Element + Title: (props: TextProps) => JSX.Element } export interface CardProps extends FlowPropsWithoutChildren { diff --git a/packages/react/src/components/Checklist/Collapsible.tsx b/packages/react/src/components/Checklist/Collapsible.tsx index a078c455..d3648ca7 100644 --- a/packages/react/src/components/Checklist/Collapsible.tsx +++ b/packages/react/src/components/Checklist/Collapsible.tsx @@ -1,4 +1,4 @@ -import { EmotionJSX } from '@emotion/react/types/jsx-namespace' +import type { JSX } from '@emotion/react/jsx-runtime' import { createContext, type Dispatch, type SetStateAction, useContext, useState } from 'react' import { Card } from '@/components/Card' @@ -17,7 +17,7 @@ export interface CollapsibleStepProps extends FlowChildrenProps { open: boolean } -export type StepTypes = Record EmotionJSX.Element> +export type StepTypes = Record JSX.Element> export interface CollapsibleContextType { onPrimary: StepHandlerProp diff --git a/packages/react/src/components/Collection/index.tsx b/packages/react/src/components/Collection/index.tsx index 565d742f..1f0d371d 100644 --- a/packages/react/src/components/Collection/index.tsx +++ b/packages/react/src/components/Collection/index.tsx @@ -1,4 +1,4 @@ -import { EmotionJSX } from '@emotion/react/types/jsx-namespace' +import type { JSX } from '@emotion/react/jsx-runtime' import { Announcement } from '@/components/Announcement' import { Banner } from '@/components/Banner' @@ -48,7 +48,7 @@ export function Collection({ collectionId, part, variables = {}, ...props }: Col const { currentFlow } = useCollection(collectionId) - const FlowComponent: EmotionJSX.ElementType = flowTypeMap[currentFlow?.rawData?.flowType] ?? null + const FlowComponent: JSX.ElementType = flowTypeMap[currentFlow?.rawData?.flowType] ?? null if (currentFlow == null || FlowComponent == null) { return null From 5fc6738aa545ada27bc540b168459d57cdcf4ee9 Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Mon, 3 Feb 2025 13:02:57 -0800 Subject: [PATCH 137/213] Fix typo in Collection props --- packages/react/src/components/Collection/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/components/Collection/index.tsx b/packages/react/src/components/Collection/index.tsx index 1f0d371d..2a487b71 100644 --- a/packages/react/src/components/Collection/index.tsx +++ b/packages/react/src/components/Collection/index.tsx @@ -21,7 +21,7 @@ export interface CollectionProps extends BoxProps { collectionId: string /** - * A map of variables to pass to Flows this Collection. + * A map of variables to pass to Flows in this Collection. * Example: * ```tsx * variables={{ From 51c7b3d51be6b1e382a777211c7b161f64ec9bd4 Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Mon, 3 Feb 2025 13:29:11 -0800 Subject: [PATCH 138/213] Changeset --- .changeset/sweet-dingos-clean.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/sweet-dingos-clean.md diff --git a/.changeset/sweet-dingos-clean.md b/.changeset/sweet-dingos-clean.md new file mode 100644 index 00000000..407b5346 --- /dev/null +++ b/.changeset/sweet-dingos-clean.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": patch +--- + +Upgrade dependencies for React 19 support From edf41846f6654174cedebcfe3c05d10369628e74 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Mon, 3 Feb 2025 13:45:24 -0800 Subject: [PATCH 139/213] Version Packages (#423) Co-authored-by: github-actions[bot] --- .changeset/sweet-dingos-clean.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/sweet-dingos-clean.md diff --git a/.changeset/sweet-dingos-clean.md b/.changeset/sweet-dingos-clean.md deleted file mode 100644 index 407b5346..00000000 --- a/.changeset/sweet-dingos-clean.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": patch ---- - -Upgrade dependencies for React 19 support diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 8e1c32db..ff815909 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/react +## 2.7.5 + +### Patch Changes + +- 51c7b3d: Upgrade dependencies for React 19 support + ## 2.7.4 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 8ff3846f..209c4ea1 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.7.4", + "version": "2.7.5", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From 9fc516f0564c83d741635abd6f88fa1fa01b85c6 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Mon, 3 Feb 2025 21:47:45 +0000 Subject: [PATCH 140/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index e14fc3c1..153da205 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.7.4'; \ No newline at end of file +export const SDK_VERSION = '2.7.5'; \ No newline at end of file From 175e0a9aa1e937aa770258ec99f3519e49d2f1a0 Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Mon, 3 Feb 2025 13:32:05 -0800 Subject: [PATCH 141/213] Upgrade to Storybook 8.5 --- apps/smithy/package.json | 24 +- yarn.lock | 1460 ++++++++++++++++---------------------- 2 files changed, 640 insertions(+), 844 deletions(-) diff --git a/apps/smithy/package.json b/apps/smithy/package.json index 314659e5..339d0bf1 100644 --- a/apps/smithy/package.json +++ b/apps/smithy/package.json @@ -16,16 +16,16 @@ "react-dom": "^19.0.0" }, "devDependencies": { - "@storybook/addon-docs": "^8.2.9", - "@storybook/addon-essentials": "^8.2.9", - "@storybook/addon-interactions": "^8.2.9", - "@storybook/addon-links": "^8.2.9", - "@storybook/blocks": "^8.2.9", - "@storybook/cli": "^8.2.9", - "@storybook/react": "^8.2.9", - "@storybook/react-vite": "^8.2.9", - "@storybook/test": "^8.2.9", - "@storybook/test-runner": "^0.19.1", + "@storybook/addon-docs": "^8.5.3", + "@storybook/addon-essentials": "^8.5.3", + "@storybook/addon-interactions": "^8.5.3", + "@storybook/addon-links": "^8.5.3", + "@storybook/blocks": "^8.5.3", + "@storybook/cli": "^8.5.3", + "@storybook/react": "^8.5.3", + "@storybook/react-vite": "^8.5.3", + "@storybook/test": "^8.5.3", + "@storybook/test-runner": "^0.21.0", "@types/react": "^19.0.0", "@types/react-dom": "^19.0.0", "@typescript-eslint/eslint-plugin": "^6.20.0", @@ -34,10 +34,10 @@ "eslint": "^8.56.0", "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-refresh": "^0.4.5", - "eslint-plugin-storybook": "^0.8.0", + "eslint-plugin-storybook": "^0.11.2", "playwright": "^1.47.1", "prop-types": "^15.8.1", - "storybook": "^8.2.9", + "storybook": "^8.5.3", "typescript": "^4.9.4", "vite": "^4.5.5" } diff --git a/yarn.lock b/yarn.lock index 78d0e952..e0cb5a08 100644 --- a/yarn.lock +++ b/yarn.lock @@ -12,10 +12,10 @@ __metadata: languageName: node linkType: hard -"@adobe/css-tools@npm:^4.3.2": - version: 4.4.0 - resolution: "@adobe/css-tools@npm:4.4.0" - checksum: 10/9c6315fe9efa5075d6ddb6ded7a1424bc9c41a01f2314b6bdcc368723985fe161008d03ddcc2b27b2da50cb9c14190fbce965d15cefe5f9a31bdd43f35b52115 +"@adobe/css-tools@npm:^4.4.0": + version: 4.4.1 + resolution: "@adobe/css-tools@npm:4.4.1" + checksum: 10/a0ea05517308593a52728936a833b1075c4cf1a6b68baaea817063f34e75faa1dba1209dd285003c4f8072804227dfa563e7e903f72ae2d39cb520aaee3f4bcc languageName: node linkType: hard @@ -2607,15 +2607,6 @@ __metadata: languageName: node linkType: hard -"@babel/runtime@npm:^7.9.2": - version: 7.25.6 - resolution: "@babel/runtime@npm:7.25.6" - dependencies: - regenerator-runtime: "npm:^0.14.0" - checksum: 10/0c4134734deb20e1005ffb9165bf342e1074576621b246d8e5e41cc7cb315a885b7d98950fbf5c63619a2990a56ae82f444d35fe8c4691a0b70c2fe5673667dc - languageName: node - linkType: hard - "@babel/template@npm:^7.22.15, @babel/template@npm:^7.23.9, @babel/template@npm:^7.3.3": version: 7.23.9 resolution: "@babel/template@npm:7.23.9" @@ -3112,9 +3103,9 @@ __metadata: languageName: node linkType: hard -"@esbuild/aix-ppc64@npm:0.21.5": - version: 0.21.5 - resolution: "@esbuild/aix-ppc64@npm:0.21.5" +"@esbuild/aix-ppc64@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/aix-ppc64@npm:0.24.2" conditions: os=aix & cpu=ppc64 languageName: node linkType: hard @@ -3133,9 +3124,9 @@ __metadata: languageName: node linkType: hard -"@esbuild/android-arm64@npm:0.21.5": - version: 0.21.5 - resolution: "@esbuild/android-arm64@npm:0.21.5" +"@esbuild/android-arm64@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/android-arm64@npm:0.24.2" conditions: os=android & cpu=arm64 languageName: node linkType: hard @@ -3154,9 +3145,9 @@ __metadata: languageName: node linkType: hard -"@esbuild/android-arm@npm:0.21.5": - version: 0.21.5 - resolution: "@esbuild/android-arm@npm:0.21.5" +"@esbuild/android-arm@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/android-arm@npm:0.24.2" conditions: os=android & cpu=arm languageName: node linkType: hard @@ -3175,9 +3166,9 @@ __metadata: languageName: node linkType: hard -"@esbuild/android-x64@npm:0.21.5": - version: 0.21.5 - resolution: "@esbuild/android-x64@npm:0.21.5" +"@esbuild/android-x64@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/android-x64@npm:0.24.2" conditions: os=android & cpu=x64 languageName: node linkType: hard @@ -3196,9 +3187,9 @@ __metadata: languageName: node linkType: hard -"@esbuild/darwin-arm64@npm:0.21.5": - version: 0.21.5 - resolution: "@esbuild/darwin-arm64@npm:0.21.5" +"@esbuild/darwin-arm64@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/darwin-arm64@npm:0.24.2" conditions: os=darwin & cpu=arm64 languageName: node linkType: hard @@ -3217,9 +3208,9 @@ __metadata: languageName: node linkType: hard -"@esbuild/darwin-x64@npm:0.21.5": - version: 0.21.5 - resolution: "@esbuild/darwin-x64@npm:0.21.5" +"@esbuild/darwin-x64@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/darwin-x64@npm:0.24.2" conditions: os=darwin & cpu=x64 languageName: node linkType: hard @@ -3238,9 +3229,9 @@ __metadata: languageName: node linkType: hard -"@esbuild/freebsd-arm64@npm:0.21.5": - version: 0.21.5 - resolution: "@esbuild/freebsd-arm64@npm:0.21.5" +"@esbuild/freebsd-arm64@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/freebsd-arm64@npm:0.24.2" conditions: os=freebsd & cpu=arm64 languageName: node linkType: hard @@ -3259,9 +3250,9 @@ __metadata: languageName: node linkType: hard -"@esbuild/freebsd-x64@npm:0.21.5": - version: 0.21.5 - resolution: "@esbuild/freebsd-x64@npm:0.21.5" +"@esbuild/freebsd-x64@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/freebsd-x64@npm:0.24.2" conditions: os=freebsd & cpu=x64 languageName: node linkType: hard @@ -3280,9 +3271,9 @@ __metadata: languageName: node linkType: hard -"@esbuild/linux-arm64@npm:0.21.5": - version: 0.21.5 - resolution: "@esbuild/linux-arm64@npm:0.21.5" +"@esbuild/linux-arm64@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/linux-arm64@npm:0.24.2" conditions: os=linux & cpu=arm64 languageName: node linkType: hard @@ -3301,9 +3292,9 @@ __metadata: languageName: node linkType: hard -"@esbuild/linux-arm@npm:0.21.5": - version: 0.21.5 - resolution: "@esbuild/linux-arm@npm:0.21.5" +"@esbuild/linux-arm@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/linux-arm@npm:0.24.2" conditions: os=linux & cpu=arm languageName: node linkType: hard @@ -3322,9 +3313,9 @@ __metadata: languageName: node linkType: hard -"@esbuild/linux-ia32@npm:0.21.5": - version: 0.21.5 - resolution: "@esbuild/linux-ia32@npm:0.21.5" +"@esbuild/linux-ia32@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/linux-ia32@npm:0.24.2" conditions: os=linux & cpu=ia32 languageName: node linkType: hard @@ -3343,9 +3334,9 @@ __metadata: languageName: node linkType: hard -"@esbuild/linux-loong64@npm:0.21.5": - version: 0.21.5 - resolution: "@esbuild/linux-loong64@npm:0.21.5" +"@esbuild/linux-loong64@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/linux-loong64@npm:0.24.2" conditions: os=linux & cpu=loong64 languageName: node linkType: hard @@ -3364,9 +3355,9 @@ __metadata: languageName: node linkType: hard -"@esbuild/linux-mips64el@npm:0.21.5": - version: 0.21.5 - resolution: "@esbuild/linux-mips64el@npm:0.21.5" +"@esbuild/linux-mips64el@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/linux-mips64el@npm:0.24.2" conditions: os=linux & cpu=mips64el languageName: node linkType: hard @@ -3385,9 +3376,9 @@ __metadata: languageName: node linkType: hard -"@esbuild/linux-ppc64@npm:0.21.5": - version: 0.21.5 - resolution: "@esbuild/linux-ppc64@npm:0.21.5" +"@esbuild/linux-ppc64@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/linux-ppc64@npm:0.24.2" conditions: os=linux & cpu=ppc64 languageName: node linkType: hard @@ -3406,9 +3397,9 @@ __metadata: languageName: node linkType: hard -"@esbuild/linux-riscv64@npm:0.21.5": - version: 0.21.5 - resolution: "@esbuild/linux-riscv64@npm:0.21.5" +"@esbuild/linux-riscv64@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/linux-riscv64@npm:0.24.2" conditions: os=linux & cpu=riscv64 languageName: node linkType: hard @@ -3427,9 +3418,9 @@ __metadata: languageName: node linkType: hard -"@esbuild/linux-s390x@npm:0.21.5": - version: 0.21.5 - resolution: "@esbuild/linux-s390x@npm:0.21.5" +"@esbuild/linux-s390x@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/linux-s390x@npm:0.24.2" conditions: os=linux & cpu=s390x languageName: node linkType: hard @@ -3448,13 +3439,20 @@ __metadata: languageName: node linkType: hard -"@esbuild/linux-x64@npm:0.21.5": - version: 0.21.5 - resolution: "@esbuild/linux-x64@npm:0.21.5" +"@esbuild/linux-x64@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/linux-x64@npm:0.24.2" conditions: os=linux & cpu=x64 languageName: node linkType: hard +"@esbuild/netbsd-arm64@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/netbsd-arm64@npm:0.24.2" + conditions: os=netbsd & cpu=arm64 + languageName: node + linkType: hard + "@esbuild/netbsd-x64@npm:0.17.19": version: 0.17.19 resolution: "@esbuild/netbsd-x64@npm:0.17.19" @@ -3469,13 +3467,20 @@ __metadata: languageName: node linkType: hard -"@esbuild/netbsd-x64@npm:0.21.5": - version: 0.21.5 - resolution: "@esbuild/netbsd-x64@npm:0.21.5" +"@esbuild/netbsd-x64@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/netbsd-x64@npm:0.24.2" conditions: os=netbsd & cpu=x64 languageName: node linkType: hard +"@esbuild/openbsd-arm64@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/openbsd-arm64@npm:0.24.2" + conditions: os=openbsd & cpu=arm64 + languageName: node + linkType: hard + "@esbuild/openbsd-x64@npm:0.17.19": version: 0.17.19 resolution: "@esbuild/openbsd-x64@npm:0.17.19" @@ -3490,9 +3495,9 @@ __metadata: languageName: node linkType: hard -"@esbuild/openbsd-x64@npm:0.21.5": - version: 0.21.5 - resolution: "@esbuild/openbsd-x64@npm:0.21.5" +"@esbuild/openbsd-x64@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/openbsd-x64@npm:0.24.2" conditions: os=openbsd & cpu=x64 languageName: node linkType: hard @@ -3511,9 +3516,9 @@ __metadata: languageName: node linkType: hard -"@esbuild/sunos-x64@npm:0.21.5": - version: 0.21.5 - resolution: "@esbuild/sunos-x64@npm:0.21.5" +"@esbuild/sunos-x64@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/sunos-x64@npm:0.24.2" conditions: os=sunos & cpu=x64 languageName: node linkType: hard @@ -3532,9 +3537,9 @@ __metadata: languageName: node linkType: hard -"@esbuild/win32-arm64@npm:0.21.5": - version: 0.21.5 - resolution: "@esbuild/win32-arm64@npm:0.21.5" +"@esbuild/win32-arm64@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/win32-arm64@npm:0.24.2" conditions: os=win32 & cpu=arm64 languageName: node linkType: hard @@ -3553,9 +3558,9 @@ __metadata: languageName: node linkType: hard -"@esbuild/win32-ia32@npm:0.21.5": - version: 0.21.5 - resolution: "@esbuild/win32-ia32@npm:0.21.5" +"@esbuild/win32-ia32@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/win32-ia32@npm:0.24.2" conditions: os=win32 & cpu=ia32 languageName: node linkType: hard @@ -3574,9 +3579,9 @@ __metadata: languageName: node linkType: hard -"@esbuild/win32-x64@npm:0.21.5": - version: 0.21.5 - resolution: "@esbuild/win32-x64@npm:0.21.5" +"@esbuild/win32-x64@npm:0.24.2": + version: 0.24.2 + resolution: "@esbuild/win32-x64@npm:0.24.2" conditions: os=win32 & cpu=x64 languageName: node linkType: hard @@ -4224,21 +4229,19 @@ __metadata: languageName: node linkType: hard -"@joshwooding/vite-plugin-react-docgen-typescript@npm:0.3.1": - version: 0.3.1 - resolution: "@joshwooding/vite-plugin-react-docgen-typescript@npm:0.3.1" +"@joshwooding/vite-plugin-react-docgen-typescript@npm:0.4.2": + version: 0.4.2 + resolution: "@joshwooding/vite-plugin-react-docgen-typescript@npm:0.4.2" dependencies: - glob: "npm:^7.2.0" - glob-promise: "npm:^4.2.0" magic-string: "npm:^0.27.0" react-docgen-typescript: "npm:^2.2.2" peerDependencies: typescript: ">= 4.3.x" - vite: ^3.0.0 || ^4.0.0 || ^5.0.0 + vite: ^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 peerDependenciesMeta: typescript: optional: true - checksum: 10/ec5052f9cb50e7388ebd2f49f974fd0d67dcd429571047bfeb75304bc6b128b5779d05be5f2143d3d22cd1ee3d4f0e9a4c66168999d861e2e60a2ba6787d11a4 + checksum: 10/0878171c598ee85997a2b9ea452715ea3df4c0faa3c646ffc0be62a772c3f4919986a9045864fe7cf2208b3f577bbe1e029f8ea3f3bf83f509be8d7a064f0396 languageName: node linkType: hard @@ -5608,9 +5611,9 @@ __metadata: languageName: node linkType: hard -"@storybook/addon-actions@npm:8.2.9": - version: 8.2.9 - resolution: "@storybook/addon-actions@npm:8.2.9" +"@storybook/addon-actions@npm:8.5.3": + version: 8.5.3 + resolution: "@storybook/addon-actions@npm:8.5.3" dependencies: "@storybook/global": "npm:^5.0.0" "@types/uuid": "npm:^9.0.1" @@ -5618,8 +5621,8 @@ __metadata: polished: "npm:^4.2.2" uuid: "npm:^9.0.0" peerDependencies: - storybook: ^8.2.9 - checksum: 10/afde25d35194911daaa6aee025cd9da51397100ab78602b5969767bd6d26e12d86f1148b1daf5bb97b2e1836565e492cc4458a7494bedeea2e4601a8b03a2175 + storybook: ^8.5.3 + checksum: 10/4e0f73e1469f17452533ba5af56729bb1bd5426b9325e091e814d85764465d7a8a17889a0bba8280c3ef8b80461f6183c3bd7b23b8e394865ea182d928d7e31a languageName: node linkType: hard @@ -5634,16 +5637,16 @@ __metadata: languageName: node linkType: hard -"@storybook/addon-backgrounds@npm:8.2.9": - version: 8.2.9 - resolution: "@storybook/addon-backgrounds@npm:8.2.9" +"@storybook/addon-backgrounds@npm:8.5.3": + version: 8.5.3 + resolution: "@storybook/addon-backgrounds@npm:8.5.3" dependencies: "@storybook/global": "npm:^5.0.0" memoizerific: "npm:^1.11.3" ts-dedent: "npm:^2.0.0" peerDependencies: - storybook: ^8.2.9 - checksum: 10/a93cd5a68c012de5ed4dafa4e1d1c3c06406ca8d5d19809e3dcf7c2f369d5c28b4ccf0d846a45f91665a33bef8831093376a070d61155d167494dd88f4b9b901 + storybook: ^8.5.3 + checksum: 10/b8884b3d455fe6167755609e2fc89174389aaee4e800f9385cfea8b6ab7fdc32e105669d506acb213750b14e8bab99fc19bd47f379e2f7e4a35cf724acf7a092 languageName: node linkType: hard @@ -5658,16 +5661,16 @@ __metadata: languageName: node linkType: hard -"@storybook/addon-controls@npm:8.2.9": - version: 8.2.9 - resolution: "@storybook/addon-controls@npm:8.2.9" +"@storybook/addon-controls@npm:8.5.3": + version: 8.5.3 + resolution: "@storybook/addon-controls@npm:8.5.3" dependencies: + "@storybook/global": "npm:^5.0.0" dequal: "npm:^2.0.2" - lodash: "npm:^4.17.21" ts-dedent: "npm:^2.0.0" peerDependencies: - storybook: ^8.2.9 - checksum: 10/0027db4387f909268d60dba205f07e57a22873634463a8c28aa24d2945610ac6a4b9d199697ffb1cf2eeba907dd76e4e84c8e6583e55443d109f4210db6210c5 + storybook: ^8.5.3 + checksum: 10/df9359d49a23d8c1d9679a9d8b9dd5b2ebf8e1a8f9246c1282ccfc05c613d849880ce259925449ee3a2b321d1d2e408bc4c9128756bcd60a4869d79d18133626 languageName: node linkType: hard @@ -5701,26 +5704,20 @@ __metadata: languageName: node linkType: hard -"@storybook/addon-docs@npm:8.2.9, @storybook/addon-docs@npm:^8.2.9": - version: 8.2.9 - resolution: "@storybook/addon-docs@npm:8.2.9" +"@storybook/addon-docs@npm:8.5.3, @storybook/addon-docs@npm:^8.5.3": + version: 8.5.3 + resolution: "@storybook/addon-docs@npm:8.5.3" dependencies: - "@babel/core": "npm:^7.24.4" "@mdx-js/react": "npm:^3.0.0" - "@storybook/blocks": "npm:8.2.9" - "@storybook/csf-plugin": "npm:8.2.9" - "@storybook/global": "npm:^5.0.0" - "@storybook/react-dom-shim": "npm:8.2.9" - "@types/react": "npm:^16.8.0 || ^17.0.0 || ^18.0.0" - fs-extra: "npm:^11.1.0" + "@storybook/blocks": "npm:8.5.3" + "@storybook/csf-plugin": "npm:8.5.3" + "@storybook/react-dom-shim": "npm:8.5.3" react: "npm:^16.8.0 || ^17.0.0 || ^18.0.0" react-dom: "npm:^16.8.0 || ^17.0.0 || ^18.0.0" - rehype-external-links: "npm:^3.0.0" - rehype-slug: "npm:^6.0.0" ts-dedent: "npm:^2.0.0" peerDependencies: - storybook: ^8.2.9 - checksum: 10/7e940327b84cc257da72498e6295d8124044b7e3ae00453f9302a86c19642915743b567237f47989bdc5d3fbeb7d7cf8e9035a91d6b34c08c795838e8d00a82a + storybook: ^8.5.3 + checksum: 10/916e01189387103081695b5c36a5405f8859186a6f69f291b1a0788c0de45824d92f65143ad9d7aafcb879059e29b2f90650239a59ecae427edae9e308e330a3 languageName: node linkType: hard @@ -5749,23 +5746,23 @@ __metadata: languageName: node linkType: hard -"@storybook/addon-essentials@npm:^8.2.9": - version: 8.2.9 - resolution: "@storybook/addon-essentials@npm:8.2.9" +"@storybook/addon-essentials@npm:^8.5.3": + version: 8.5.3 + resolution: "@storybook/addon-essentials@npm:8.5.3" dependencies: - "@storybook/addon-actions": "npm:8.2.9" - "@storybook/addon-backgrounds": "npm:8.2.9" - "@storybook/addon-controls": "npm:8.2.9" - "@storybook/addon-docs": "npm:8.2.9" - "@storybook/addon-highlight": "npm:8.2.9" - "@storybook/addon-measure": "npm:8.2.9" - "@storybook/addon-outline": "npm:8.2.9" - "@storybook/addon-toolbars": "npm:8.2.9" - "@storybook/addon-viewport": "npm:8.2.9" + "@storybook/addon-actions": "npm:8.5.3" + "@storybook/addon-backgrounds": "npm:8.5.3" + "@storybook/addon-controls": "npm:8.5.3" + "@storybook/addon-docs": "npm:8.5.3" + "@storybook/addon-highlight": "npm:8.5.3" + "@storybook/addon-measure": "npm:8.5.3" + "@storybook/addon-outline": "npm:8.5.3" + "@storybook/addon-toolbars": "npm:8.5.3" + "@storybook/addon-viewport": "npm:8.5.3" ts-dedent: "npm:^2.0.0" peerDependencies: - storybook: ^8.2.9 - checksum: 10/70cc46b9188cf61a30af578fa79d15135e6c51e9406f9d044668fd395c4c93b9a408481039da6dc824100016dd76da711daef79897252e982382d2262292103d + storybook: ^8.5.3 + checksum: 10/200e04a7e6795102c75c7c4eac7cbc14e8767732b69e98a6a3c52c9813887ef9076357b7cfbaa1b8b43bc8745b25aeb8a482c174e2feab0e64a499d37cb8d2a9 languageName: node linkType: hard @@ -5778,14 +5775,14 @@ __metadata: languageName: node linkType: hard -"@storybook/addon-highlight@npm:8.2.9": - version: 8.2.9 - resolution: "@storybook/addon-highlight@npm:8.2.9" +"@storybook/addon-highlight@npm:8.5.3": + version: 8.5.3 + resolution: "@storybook/addon-highlight@npm:8.5.3" dependencies: "@storybook/global": "npm:^5.0.0" peerDependencies: - storybook: ^8.2.9 - checksum: 10/273a10768ec0abcc4f816972ec581c0be3963a6c85cb99dda7be0c605bf47fb92538c9a1b3339f2c38c38f9ad9ca3f784ec0b2c8b3bb55e153407351faff8f1b + storybook: ^8.5.3 + checksum: 10/276e8e74a5eded2b43a4cdc11ec79a479931ea66b85a75bba7409ebfa898a99a2101e2bf300312eb8b206e76dfa6de734befcdfd39ef63b349a94d3bbecd850a languageName: node linkType: hard @@ -5802,18 +5799,18 @@ __metadata: languageName: node linkType: hard -"@storybook/addon-interactions@npm:^8.2.9": - version: 8.2.9 - resolution: "@storybook/addon-interactions@npm:8.2.9" +"@storybook/addon-interactions@npm:^8.5.3": + version: 8.5.3 + resolution: "@storybook/addon-interactions@npm:8.5.3" dependencies: "@storybook/global": "npm:^5.0.0" - "@storybook/instrumenter": "npm:8.2.9" - "@storybook/test": "npm:8.2.9" + "@storybook/instrumenter": "npm:8.5.3" + "@storybook/test": "npm:8.5.3" polished: "npm:^4.2.2" ts-dedent: "npm:^2.2.0" peerDependencies: - storybook: ^8.2.9 - checksum: 10/6ed572a281b7b295e858324b961b02c32a18d0f7a1870cde5f00d111a8fade57dd7f975f32ffcfdf3a6565b03943e98c8fcc1875be866fa6bbc17d26b67f412d + storybook: ^8.5.3 + checksum: 10/8c691dfcededf33abd184fce9e0e83a87694d7860ee4d07c91d5b6df38a76b9c7c2b225a49bd71a35acd0bd75ba2ffd2c7340512a6f7ac5c8ef69975c19c1f92 languageName: node linkType: hard @@ -5833,20 +5830,20 @@ __metadata: languageName: node linkType: hard -"@storybook/addon-links@npm:^8.2.9": - version: 8.2.9 - resolution: "@storybook/addon-links@npm:8.2.9" +"@storybook/addon-links@npm:^8.5.3": + version: 8.5.3 + resolution: "@storybook/addon-links@npm:8.5.3" dependencies: - "@storybook/csf": "npm:0.1.11" + "@storybook/csf": "npm:0.1.12" "@storybook/global": "npm:^5.0.0" ts-dedent: "npm:^2.0.0" peerDependencies: react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta - storybook: ^8.2.9 + storybook: ^8.5.3 peerDependenciesMeta: react: optional: true - checksum: 10/e6b14e2cb6763f25027965c90404afb2572b27298e3d1fafa136176113ad4296b1ce48eaa8caf4f521fb6d3404921f17eb3cbe62061ebdc5f2324e0c85333742 + checksum: 10/5fd459e79add6391f4feac1cb822776b8ef8764368bf0ee6714423df6fbb82749588221a4d93a1d8021659c5d85b10aba09fcd92b5f9d916af759df22b2845ea languageName: node linkType: hard @@ -5860,15 +5857,15 @@ __metadata: languageName: node linkType: hard -"@storybook/addon-measure@npm:8.2.9": - version: 8.2.9 - resolution: "@storybook/addon-measure@npm:8.2.9" +"@storybook/addon-measure@npm:8.5.3": + version: 8.5.3 + resolution: "@storybook/addon-measure@npm:8.5.3" dependencies: "@storybook/global": "npm:^5.0.0" tiny-invariant: "npm:^1.3.1" peerDependencies: - storybook: ^8.2.9 - checksum: 10/5a0c31b617bfdcd024c5325ab48771b8cf7b726336e24b9b0c7d4a4e8bda2093a8c2c264272b7fb36bf010f1bd54896df45b6f9092d020e696226b34e23ce208 + storybook: ^8.5.3 + checksum: 10/4aae4500456f770427047c76a9b423cfbf5e9c748738099d1eabae4a036ec89e4ce7e5be7b1578a99cfb224719ef7d99ca4b3c80d56a53aa570097c28c3fbd9b languageName: node linkType: hard @@ -5882,15 +5879,15 @@ __metadata: languageName: node linkType: hard -"@storybook/addon-outline@npm:8.2.9": - version: 8.2.9 - resolution: "@storybook/addon-outline@npm:8.2.9" +"@storybook/addon-outline@npm:8.5.3": + version: 8.5.3 + resolution: "@storybook/addon-outline@npm:8.5.3" dependencies: "@storybook/global": "npm:^5.0.0" ts-dedent: "npm:^2.0.0" peerDependencies: - storybook: ^8.2.9 - checksum: 10/ad88e5d501270e7e47e955ff9e9c2aa3c5a3d9b38fe592cc7e4b5890d5c905a5ab9b644bdf7d566cdd9f66ae9ca9b9ac481f95f759a41cdfff5a3dd43103602d + storybook: ^8.5.3 + checksum: 10/8daa69b3c2cea9a32b650e4602979050b2eafa53bc979f5008c00ddb015dd4b1777aec46d6bd3ccd83da0e3a2ce4f772b86e56bb716161943822d462ca34e32b languageName: node linkType: hard @@ -5901,12 +5898,12 @@ __metadata: languageName: node linkType: hard -"@storybook/addon-toolbars@npm:8.2.9": - version: 8.2.9 - resolution: "@storybook/addon-toolbars@npm:8.2.9" +"@storybook/addon-toolbars@npm:8.5.3": + version: 8.5.3 + resolution: "@storybook/addon-toolbars@npm:8.5.3" peerDependencies: - storybook: ^8.2.9 - checksum: 10/77811c752d74f4fb0f5ab6d4a836a5c940a00a7ed9c4779327e1531ea704b4950ea542d5b3bd88380414d13218a3acd93fa7b67f923830cc2aef70e70881d43f + storybook: ^8.5.3 + checksum: 10/e2085b64aa1587c1f2c7bf9c4078be3b0297b0e8bb879795b9eef403c5f2775dd6acce888878c416b6b0f5e6e694d3ff48f189141eb2b0f4d1072de85d16874f languageName: node linkType: hard @@ -5919,14 +5916,14 @@ __metadata: languageName: node linkType: hard -"@storybook/addon-viewport@npm:8.2.9": - version: 8.2.9 - resolution: "@storybook/addon-viewport@npm:8.2.9" +"@storybook/addon-viewport@npm:8.5.3": + version: 8.5.3 + resolution: "@storybook/addon-viewport@npm:8.5.3" dependencies: memoizerific: "npm:^1.11.3" peerDependencies: - storybook: ^8.2.9 - checksum: 10/1e634e8bdae61d5d89b4a04ccfc0ddbde3c480e9bf8655772be27ff88edc0d6556305eb48dd3e47b105446e02856511f9f4988399de633663f5f08dcf2610dca + storybook: ^8.5.3 + checksum: 10/3aa52bc69da64619d5c7b95b0046ca629cffd5200e48ae11a48c6643f49989c1e5dd81223c4106438e6f6681654cabca213ad5b36e953a77095319f1e3026766 languageName: node linkType: hard @@ -5964,34 +5961,23 @@ __metadata: languageName: node linkType: hard -"@storybook/blocks@npm:8.2.9, @storybook/blocks@npm:^8.2.9": - version: 8.2.9 - resolution: "@storybook/blocks@npm:8.2.9" +"@storybook/blocks@npm:8.5.3, @storybook/blocks@npm:^8.5.3": + version: 8.5.3 + resolution: "@storybook/blocks@npm:8.5.3" dependencies: - "@storybook/csf": "npm:0.1.11" - "@storybook/global": "npm:^5.0.0" - "@storybook/icons": "npm:^1.2.5" - "@types/lodash": "npm:^4.14.167" - color-convert: "npm:^2.0.1" - dequal: "npm:^2.0.2" - lodash: "npm:^4.17.21" - markdown-to-jsx: "npm:^7.4.5" - memoizerific: "npm:^1.11.3" - polished: "npm:^4.2.2" - react-colorful: "npm:^5.1.2" - telejson: "npm:^7.2.0" + "@storybook/csf": "npm:0.1.12" + "@storybook/icons": "npm:^1.2.12" ts-dedent: "npm:^2.0.0" - util-deprecate: "npm:^1.0.2" peerDependencies: react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta - storybook: ^8.2.9 + storybook: ^8.5.3 peerDependenciesMeta: react: optional: true react-dom: optional: true - checksum: 10/a9d4bf1f4a19806c3ebcd6677fb7c8bdffa67562f7e0c10b9f15b1450dab641e2282a9197a6b5d3361c788688d958795620a9bb5f4737a20cd802f91041ad011 + checksum: 10/c43afed29ffef6aa53c71953285b32436841e8a5e26d503d51857c7ff29541c2034406a7aadb187fd30793277397e74d35b3448f36f88d0c0cdfcc661c93c86f languageName: node linkType: hard @@ -6019,33 +6005,17 @@ __metadata: languageName: node linkType: hard -"@storybook/builder-vite@npm:8.2.9": - version: 8.2.9 - resolution: "@storybook/builder-vite@npm:8.2.9" +"@storybook/builder-vite@npm:8.5.3": + version: 8.5.3 + resolution: "@storybook/builder-vite@npm:8.5.3" dependencies: - "@storybook/csf-plugin": "npm:8.2.9" - "@types/find-cache-dir": "npm:^3.2.1" + "@storybook/csf-plugin": "npm:8.5.3" browser-assert: "npm:^1.2.1" - es-module-lexer: "npm:^1.5.0" - express: "npm:^4.19.2" - find-cache-dir: "npm:^3.0.0" - fs-extra: "npm:^11.1.0" - magic-string: "npm:^0.30.0" ts-dedent: "npm:^2.0.0" peerDependencies: - "@preact/preset-vite": "*" - storybook: ^8.2.9 - typescript: ">= 4.3.x" - vite: ^4.0.0 || ^5.0.0 - vite-plugin-glimmerx: "*" - peerDependenciesMeta: - "@preact/preset-vite": - optional: true - typescript: - optional: true - vite-plugin-glimmerx: - optional: true - checksum: 10/ed8e28b6949089939611ed25530be019c8bc80d79a232a022862c9052e3a683ca2122e9ec1fd3a349a476a14fabede98fb24d4cc88c5fc518de66afef026f771 + storybook: ^8.5.3 + vite: ^4.0.0 || ^5.0.0 || ^6.0.0 + checksum: 10/b3816ee8baeb947b28522a17819498224fe5ee4caf21988a8c879b2a71b565725ba0f9f7cb25bf9ede3cf90a72067aade71fbf21ff807fb068eb8f9f4e34fd75 languageName: node linkType: hard @@ -6163,15 +6133,33 @@ __metadata: languageName: node linkType: hard -"@storybook/cli@npm:^8.2.9": - version: 8.2.9 - resolution: "@storybook/cli@npm:8.2.9" +"@storybook/cli@npm:^8.5.3": + version: 8.5.3 + resolution: "@storybook/cli@npm:8.5.3" dependencies: - storybook: "npm:8.2.9" + "@babel/core": "npm:^7.24.4" + "@babel/types": "npm:^7.24.0" + "@storybook/codemod": "npm:8.5.3" + "@types/semver": "npm:^7.3.4" + commander: "npm:^12.1.0" + create-storybook: "npm:8.5.3" + cross-spawn: "npm:^7.0.3" + envinfo: "npm:^7.7.3" + fd-package-json: "npm:^1.2.0" + find-up: "npm:^5.0.0" + giget: "npm:^1.0.0" + glob: "npm:^10.0.0" + globby: "npm:^14.0.1" + jscodeshift: "npm:^0.15.1" + leven: "npm:^3.1.0" + prompts: "npm:^2.4.0" + semver: "npm:^7.3.7" + storybook: "npm:8.5.3" + tiny-invariant: "npm:^1.3.1" + ts-dedent: "npm:^2.0.0" bin: - sb: ./index.js - storybook: ./index.js - checksum: 10/32f995b5767628633ec8808df5ba043be189e7880b1516ecab56d2fef5408012fcaefc266a3ed68eb76009428fd005ef3cdae7424e92f3c9d0b6fbecf1b3cc54 + cli: ./bin/index.cjs + checksum: 10/61b196f1bd9ecaa005fa0c64e6efffd75db41a2282d9437cc27b32e3f56d4269c1a15bae5d8a73d08a6c64ff5f4cdbaccebc47ed7d752845dfa38cc04a1ecaf3 languageName: node linkType: hard @@ -6206,24 +6194,24 @@ __metadata: languageName: node linkType: hard -"@storybook/codemod@npm:8.2.9": - version: 8.2.9 - resolution: "@storybook/codemod@npm:8.2.9" +"@storybook/codemod@npm:8.5.3": + version: 8.5.3 + resolution: "@storybook/codemod@npm:8.5.3" dependencies: "@babel/core": "npm:^7.24.4" "@babel/preset-env": "npm:^7.24.4" "@babel/types": "npm:^7.24.0" - "@storybook/core": "npm:8.2.9" - "@storybook/csf": "npm:0.1.11" + "@storybook/core": "npm:8.5.3" + "@storybook/csf": "npm:0.1.12" "@types/cross-spawn": "npm:^6.0.2" cross-spawn: "npm:^7.0.3" + es-toolkit: "npm:^1.22.0" globby: "npm:^14.0.1" jscodeshift: "npm:^0.15.1" - lodash: "npm:^4.17.21" prettier: "npm:^3.1.1" recast: "npm:^0.23.5" tiny-invariant: "npm:^1.3.1" - checksum: 10/a0760f6612038f1a771c89c0d9054439af5b29865b44bdebb26ea6bbbf4ed768db92d349f44deb72297085e5c6c43a029b9b7d29ac531f8d998752d9c2273bf4 + checksum: 10/5d78b8ffacee8c60ef619da8c1dd6230aa8a9d533f3861459dacccc2c4031b57e6023ad5bd2fcc9c4acbb65d2aa9d02d70ec2538f783989e59cfacd5a05a123b languageName: node linkType: hard @@ -6248,12 +6236,12 @@ __metadata: languageName: node linkType: hard -"@storybook/components@npm:^8.2.9": - version: 8.2.9 - resolution: "@storybook/components@npm:8.2.9" +"@storybook/components@npm:8.5.3": + version: 8.5.3 + resolution: "@storybook/components@npm:8.5.3" peerDependencies: - storybook: ^8.2.9 - checksum: 10/32153df19777ea751d1adb33da6e92b5647d19fd924753b2ca1c80bcc102ee0489eac7b02914a2e56406233940f6eca7f1aa3ba0c441a164cabc954679a67869 + storybook: ^8.2.0 || ^8.3.0-0 || ^8.4.0-0 || ^8.5.0-0 || ^8.6.0-0 + checksum: 10/8c39ef2733a6d12a92f807608ee18f9f1f11236be8e954e743addc92c9f0ba6344d139975789f74ee89cd6bb80d476701d4f2a33aefd5a8e0eeeba3ceb84658b languageName: node linkType: hard @@ -6298,15 +6286,6 @@ __metadata: languageName: node linkType: hard -"@storybook/core-common@npm:^8.0.0": - version: 8.3.1 - resolution: "@storybook/core-common@npm:8.3.1" - peerDependencies: - storybook: ^8.3.1 - checksum: 10/e1078e0dc8cb5027b948ff9762a509d7aca35f95c1d76d53ba9a7f70b991d8d76a735f377672738b8da40e7dfde1c71e0d42cedbefd0e842fc5a21f545d7c77f - languageName: node - linkType: hard - "@storybook/core-events@npm:7.6.16": version: 7.6.16 resolution: "@storybook/core-events@npm:7.6.16" @@ -6378,22 +6357,27 @@ __metadata: languageName: node linkType: hard -"@storybook/core@npm:8.2.9": - version: 8.2.9 - resolution: "@storybook/core@npm:8.2.9" +"@storybook/core@npm:8.5.3": + version: 8.5.3 + resolution: "@storybook/core@npm:8.5.3" dependencies: - "@storybook/csf": "npm:0.1.11" - "@types/express": "npm:^4.17.21" - "@types/node": "npm:^18.0.0" + "@storybook/csf": "npm:0.1.12" + better-opn: "npm:^3.0.2" browser-assert: "npm:^1.2.1" - esbuild: "npm:^0.18.0 || ^0.19.0 || ^0.20.0 || ^0.21.0" + esbuild: "npm:^0.18.0 || ^0.19.0 || ^0.20.0 || ^0.21.0 || ^0.22.0 || ^0.23.0 || ^0.24.0" esbuild-register: "npm:^3.5.0" - express: "npm:^4.19.2" + jsdoc-type-pratt-parser: "npm:^4.0.0" process: "npm:^0.11.10" recast: "npm:^0.23.5" - util: "npm:^0.12.4" + semver: "npm:^7.6.2" + util: "npm:^0.12.5" ws: "npm:^8.2.3" - checksum: 10/38602bae881a9824520b9369fdb37c4178bbdcc158934905af6d11963df289e9b958bdc05ef61773c70274a41188c473040e7d9113cc3043475f48005ec8f479 + peerDependencies: + prettier: ^2 || ^3 + peerDependenciesMeta: + prettier: + optional: true + checksum: 10/af0d4a74c1e8cca1acf0b601ffaad47c4ff8cfa43075d3c1a6de28053c61494b2c1a7d3ee1c500efe3af3ee22de64a9ca2f647b8a6e75037d99fc113dff41556 languageName: node linkType: hard @@ -6407,14 +6391,14 @@ __metadata: languageName: node linkType: hard -"@storybook/csf-plugin@npm:8.2.9": - version: 8.2.9 - resolution: "@storybook/csf-plugin@npm:8.2.9" +"@storybook/csf-plugin@npm:8.5.3": + version: 8.5.3 + resolution: "@storybook/csf-plugin@npm:8.5.3" dependencies: unplugin: "npm:^1.3.1" peerDependencies: - storybook: ^8.2.9 - checksum: 10/514171f66a4e71849ee7a4efacc3051de0714fda56dfdb7581f5d08a268d5a9d0bee6264404bd766f631f2ab8a0358b4c226ecfcee8965d8560d1afc5d17c1b9 + storybook: ^8.5.3 + checksum: 10/2981e153040a06da0889e55050fd23b0980745b2d6ca78f04f011646f681b5db36fda76fabc4d6338ad65cc6fb5570d693725a053ada2b7ba6386be50e7b54f1 languageName: node linkType: hard @@ -6435,16 +6419,16 @@ __metadata: languageName: node linkType: hard -"@storybook/csf-tools@npm:^8.0.0": - version: 8.3.1 - resolution: "@storybook/csf-tools@npm:8.3.1" - peerDependencies: - storybook: ^8.3.1 - checksum: 10/8df82a30de61bea9abc57a501addf077a507b3f763e379cba620e227e4f60a41820264c725ba078005181f0ed215ec062348df2e975726873fb12636638cf863 +"@storybook/csf@npm:0.1.12": + version: 0.1.12 + resolution: "@storybook/csf@npm:0.1.12" + dependencies: + type-fest: "npm:^2.19.0" + checksum: 10/f661709de5bd68bfd4ced67df31ef26341168d6679bc13564cb024cfdbc8fdfa94d384267c20b3c858a3058b1ee8dbd71cea169245fcf7b28298890d6c3e1da4 languageName: node linkType: hard -"@storybook/csf@npm:0.1.11, @storybook/csf@npm:^0.1.11": +"@storybook/csf@npm:^0.1.11": version: 0.1.11 resolution: "@storybook/csf@npm:0.1.11" dependencies: @@ -6453,15 +6437,6 @@ __metadata: languageName: node linkType: hard -"@storybook/csf@npm:^0.0.1": - version: 0.0.1 - resolution: "@storybook/csf@npm:0.0.1" - dependencies: - lodash: "npm:^4.17.15" - checksum: 10/f6bb019bccd8abc14e45a85258158b7bd8cc525887ac8dc9151ed8c4908be3b5f5523da8a7a9b96ff11b13b6c1744e1a0e070560d63d836b950f595f9a5719d4 - languageName: node - linkType: hard - "@storybook/csf@npm:^0.1.2": version: 0.1.2 resolution: "@storybook/csf@npm:0.1.2" @@ -6500,26 +6475,25 @@ __metadata: languageName: node linkType: hard -"@storybook/icons@npm:^1.2.5": - version: 1.2.10 - resolution: "@storybook/icons@npm:1.2.10" +"@storybook/icons@npm:^1.2.12": + version: 1.3.2 + resolution: "@storybook/icons@npm:1.3.2" peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 - checksum: 10/fad929a7e3c7a1a0fbf6b924b0be73f557b1bba9519faa15422482f89513ceb4b649444c224ee3d1dfbdce3616e684063cff23da08f6b1dd96f1aff4381388a6 + react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta + react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta + checksum: 10/40dc378e3e42a0f37985df538920b5b032d19c3166155f0000d2f7cc317ff20dc83a28b4e2f2d291d5e2b3e4875401b1896e8a95da3c18f3e6ea417b574092b4 languageName: node linkType: hard -"@storybook/instrumenter@npm:8.2.9": - version: 8.2.9 - resolution: "@storybook/instrumenter@npm:8.2.9" +"@storybook/instrumenter@npm:8.5.3": + version: 8.5.3 + resolution: "@storybook/instrumenter@npm:8.5.3" dependencies: "@storybook/global": "npm:^5.0.0" - "@vitest/utils": "npm:^1.3.1" - util: "npm:^0.12.4" + "@vitest/utils": "npm:^2.1.1" peerDependencies: - storybook: ^8.2.9 - checksum: 10/c31a3ec70e252975f56d141942db1e8187b976fbb69e718f6ec83fe1b693457a1ca9173341ae17a8bff294ff02dfe734449c7120098442f01d3e14dd3b20f667 + storybook: ^8.5.3 + checksum: 10/c3b7ddfa2efe7e5a49500b906f7026193e555645c83b865137b24a838260c172f73300f7311df296f3b8b0eb2b0d1d12fe687656d2e9464d1161857554f60a6b languageName: node linkType: hard @@ -6545,12 +6519,12 @@ __metadata: languageName: node linkType: hard -"@storybook/manager-api@npm:^8.2.9": - version: 8.2.9 - resolution: "@storybook/manager-api@npm:8.2.9" +"@storybook/manager-api@npm:8.5.3": + version: 8.5.3 + resolution: "@storybook/manager-api@npm:8.5.3" peerDependencies: - storybook: ^8.2.9 - checksum: 10/5ee66ebdc88f886c05425acff2c362681a6f778e2f27023a43c6c36767ef265175c58b8f23f74684dba64477b26b310fad7cf1761e6643325325a8724f53d93c + storybook: ^8.2.0 || ^8.3.0-0 || ^8.4.0-0 || ^8.5.0-0 || ^8.6.0-0 + checksum: 10/39987da92eca3adc04d27533371280c0df5581a9524a44a858ae6cf859bac9a33407e7ebcd953086718d6335abd70f71a3b49b7c019dc108ad90b374a944818f languageName: node linkType: hard @@ -6638,21 +6612,12 @@ __metadata: languageName: node linkType: hard -"@storybook/preview-api@npm:^8.0.0": - version: 8.3.1 - resolution: "@storybook/preview-api@npm:8.3.1" +"@storybook/preview-api@npm:8.5.3": + version: 8.5.3 + resolution: "@storybook/preview-api@npm:8.5.3" peerDependencies: - storybook: ^8.3.1 - checksum: 10/b6268888373f0f306e9dd9c875183919ddd76fcbeb393509e562c671a8f091463db3701747c5606baa9d5cd643f97014399b03b5a5bcde349a48618236e5cdb1 - languageName: node - linkType: hard - -"@storybook/preview-api@npm:^8.2.9": - version: 8.2.9 - resolution: "@storybook/preview-api@npm:8.2.9" - peerDependencies: - storybook: ^8.2.9 - checksum: 10/4973ca3ede45e363a54071a200ee1aeeea9c735ee1e6ba93d46c756bae905057a0e6c30882964aee14fb1631029c5f86b2a4cb8deaee4a80aa5770bf63a00eb3 + storybook: ^8.2.0 || ^8.3.0-0 || ^8.4.0-0 || ^8.5.0-0 || ^8.6.0-0 + checksum: 10/aa046078377904253afed9f6450f4ef8fbae9ab7429720954672ad5f217a4cc94d1ccbaedd1277b03a98a03ed6544493f046d06192e83d74dec078c03b52b146 languageName: node linkType: hard @@ -6691,36 +6656,40 @@ __metadata: languageName: node linkType: hard -"@storybook/react-dom-shim@npm:8.2.9": - version: 8.2.9 - resolution: "@storybook/react-dom-shim@npm:8.2.9" +"@storybook/react-dom-shim@npm:8.5.3": + version: 8.5.3 + resolution: "@storybook/react-dom-shim@npm:8.5.3" peerDependencies: react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta - storybook: ^8.2.9 - checksum: 10/a8ede3f14a3e877c07425baa59bbe505a5011bbec7f70a5440d1af49c1d3cafd03adba471905ed4dd3815b8272fd4f9aff65b65940bff85e81b4b30b8b4e37b5 + storybook: ^8.5.3 + checksum: 10/78e411706b9d8b0ff9267c42c970cb2f00e1c4d84127daa20fc9167d89a063a339a23a69487375b1bafbf36cc999f067e0b717933f9265a7c7abb787782221c3 languageName: node linkType: hard -"@storybook/react-vite@npm:^8.2.9": - version: 8.2.9 - resolution: "@storybook/react-vite@npm:8.2.9" +"@storybook/react-vite@npm:^8.5.3": + version: 8.5.3 + resolution: "@storybook/react-vite@npm:8.5.3" dependencies: - "@joshwooding/vite-plugin-react-docgen-typescript": "npm:0.3.1" + "@joshwooding/vite-plugin-react-docgen-typescript": "npm:0.4.2" "@rollup/pluginutils": "npm:^5.0.2" - "@storybook/builder-vite": "npm:8.2.9" - "@storybook/react": "npm:8.2.9" + "@storybook/builder-vite": "npm:8.5.3" + "@storybook/react": "npm:8.5.3" find-up: "npm:^5.0.0" magic-string: "npm:^0.30.0" react-docgen: "npm:^7.0.0" resolve: "npm:^1.22.8" tsconfig-paths: "npm:^4.2.0" peerDependencies: + "@storybook/test": 8.5.3 react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta - storybook: ^8.2.9 - vite: ^4.0.0 || ^5.0.0 - checksum: 10/1acae6bae3c5f4cb0067a23235f2e5030f28b35b74e279b7a74795b49a230e331cf3dec498645ccfe24726bb04dbb1d56b696b03a51c281ccb26e6000416e2c2 + storybook: ^8.5.3 + vite: ^4.0.0 || ^5.0.0 || ^6.0.0 + peerDependenciesMeta: + "@storybook/test": + optional: true + checksum: 10/9e62c846dcaa1d06af4fb36bd82fe00e8eca0d8ffc2ffe60725f57ff7468113915be2d486b8b7daf887bd43cbc6987fba74d4513c67e23e814c2ffc672f7e567 languageName: node linkType: hard @@ -6782,40 +6751,28 @@ __metadata: languageName: node linkType: hard -"@storybook/react@npm:8.2.9, @storybook/react@npm:^8.2.9": - version: 8.2.9 - resolution: "@storybook/react@npm:8.2.9" +"@storybook/react@npm:8.5.3, @storybook/react@npm:^8.5.3": + version: 8.5.3 + resolution: "@storybook/react@npm:8.5.3" dependencies: - "@storybook/components": "npm:^8.2.9" + "@storybook/components": "npm:8.5.3" "@storybook/global": "npm:^5.0.0" - "@storybook/manager-api": "npm:^8.2.9" - "@storybook/preview-api": "npm:^8.2.9" - "@storybook/react-dom-shim": "npm:8.2.9" - "@storybook/theming": "npm:^8.2.9" - "@types/escodegen": "npm:^0.0.6" - "@types/estree": "npm:^0.0.51" - "@types/node": "npm:^18.0.0" - acorn: "npm:^7.4.1" - acorn-jsx: "npm:^5.3.1" - acorn-walk: "npm:^7.2.0" - escodegen: "npm:^2.1.0" - html-tags: "npm:^3.1.0" - lodash: "npm:^4.17.21" - prop-types: "npm:^15.7.2" - react-element-to-jsx-string: "npm:^15.0.0" - semver: "npm:^7.3.7" - ts-dedent: "npm:^2.0.0" - type-fest: "npm:~2.19" - util-deprecate: "npm:^1.0.2" + "@storybook/manager-api": "npm:8.5.3" + "@storybook/preview-api": "npm:8.5.3" + "@storybook/react-dom-shim": "npm:8.5.3" + "@storybook/theming": "npm:8.5.3" peerDependencies: + "@storybook/test": 8.5.3 react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta - storybook: ^8.2.9 + storybook: ^8.5.3 typescript: ">= 4.2.x" peerDependenciesMeta: + "@storybook/test": + optional: true typescript: optional: true - checksum: 10/8687e323f8345d0c1350b05879df09ce8ea303f247307e192f0d8789908e87383631f669754fb1482ae71346456e91c2f9bd3310e09cf7b7b89ec97332c5a27e + checksum: 10/e72533456c222360def9d79fcfd2c3321dd55e8b7f1dca3af7988e6c48477333d90f309df3128d86fedfb2a615b03ad06bdc871a65b3bb26bebdbbf1a7e80a63 languageName: node linkType: hard @@ -6846,19 +6803,16 @@ __metadata: languageName: node linkType: hard -"@storybook/test-runner@npm:^0.19.1": - version: 0.19.1 - resolution: "@storybook/test-runner@npm:0.19.1" +"@storybook/test-runner@npm:^0.21.0": + version: 0.21.0 + resolution: "@storybook/test-runner@npm:0.21.0" dependencies: "@babel/core": "npm:^7.22.5" "@babel/generator": "npm:^7.22.5" "@babel/template": "npm:^7.22.5" "@babel/types": "npm:^7.22.5" "@jest/types": "npm:^29.6.3" - "@storybook/core-common": "npm:^8.0.0" "@storybook/csf": "npm:^0.1.11" - "@storybook/csf-tools": "npm:^8.0.0" - "@storybook/preview-api": "npm:^8.0.0" "@swc/core": "npm:^1.5.22" "@swc/jest": "npm:^0.2.23" expect-playwright: "npm:^0.8.0" @@ -6872,27 +6826,29 @@ __metadata: jest-watch-typeahead: "npm:^2.0.0" nyc: "npm:^15.1.0" playwright: "npm:^1.14.0" + peerDependencies: + storybook: ^8.2.0 || ^8.3.0-0 || ^8.4.0-0 || ^8.5.0-0 || ^8.6.0-0 bin: test-storybook: dist/test-storybook.js - checksum: 10/cb0a68e6fc9472b4cf82c969fb58a74404f7865ab2ecbffe42f78f3ec3da0c21797c62a19e1a77a02d3c0559a6a03bae2e28104f10dd239b5ded7bcbaa232b98 + checksum: 10/45c008b7c3bbd687c674e5c1fd3f90dd4efec5c6627beeb836030c9454f22de995da358200bc0271c5ddc5d561478f3f0fe8cf0564b7febbdfda1eda76b3a3de languageName: node linkType: hard -"@storybook/test@npm:8.2.9, @storybook/test@npm:^8.2.9": - version: 8.2.9 - resolution: "@storybook/test@npm:8.2.9" +"@storybook/test@npm:8.5.3, @storybook/test@npm:^8.5.3": + version: 8.5.3 + resolution: "@storybook/test@npm:8.5.3" dependencies: - "@storybook/csf": "npm:0.1.11" - "@storybook/instrumenter": "npm:8.2.9" - "@testing-library/dom": "npm:10.1.0" - "@testing-library/jest-dom": "npm:6.4.5" + "@storybook/csf": "npm:0.1.12" + "@storybook/global": "npm:^5.0.0" + "@storybook/instrumenter": "npm:8.5.3" + "@testing-library/dom": "npm:10.4.0" + "@testing-library/jest-dom": "npm:6.5.0" "@testing-library/user-event": "npm:14.5.2" - "@vitest/expect": "npm:1.6.0" - "@vitest/spy": "npm:1.6.0" - util: "npm:^0.12.4" + "@vitest/expect": "npm:2.0.5" + "@vitest/spy": "npm:2.0.5" peerDependencies: - storybook: ^8.2.9 - checksum: 10/2440fac3b9f2205f5ef9762dccbfcb72bbe4f5db881c57c5ceb06fecfd072e039643ed2456d2b3260af6a4419f6fecafa77d247f9570afd553e4b0e8a19175a3 + storybook: ^8.5.3 + checksum: 10/e6a079a161e1da7fde27c526bf8f09d7c3d8214a33db1dcd6e0ed44bc22ece246c52d2d344f91ca507b81960bdf16855131a1979a6e7960fd827c878cf9bba5e languageName: node linkType: hard @@ -6922,12 +6878,12 @@ __metadata: languageName: node linkType: hard -"@storybook/theming@npm:^8.2.9": - version: 8.2.9 - resolution: "@storybook/theming@npm:8.2.9" +"@storybook/theming@npm:8.5.3": + version: 8.5.3 + resolution: "@storybook/theming@npm:8.5.3" peerDependencies: - storybook: ^8.2.9 - checksum: 10/13d71e1b69fb254d5de6349c60c7ac0518cbaec0c26a591c820752dd5b25fe66d8a32e4b081bd9470c0b07648e478eb88ab628d10196918ee2806c9640c2ee2f + storybook: ^8.2.0 || ^8.3.0-0 || ^8.4.0-0 || ^8.5.0-0 || ^8.6.0-0 + checksum: 10/9ed121f6a5c0a013decb3d973664d07cf412a607c787537ab56fc339334c42cad6494cf67865e03be9406c9dd6cc0c1ae7fa78102a11fe5e198d398c073f461e languageName: node linkType: hard @@ -7327,9 +7283,9 @@ __metadata: languageName: node linkType: hard -"@testing-library/dom@npm:10.1.0": - version: 10.1.0 - resolution: "@testing-library/dom@npm:10.1.0" +"@testing-library/dom@npm:10.4.0": + version: 10.4.0 + resolution: "@testing-library/dom@npm:10.4.0" dependencies: "@babel/code-frame": "npm:^7.10.4" "@babel/runtime": "npm:^7.12.5" @@ -7339,7 +7295,7 @@ __metadata: dom-accessibility-api: "npm:^0.5.9" lz-string: "npm:^1.5.0" pretty-format: "npm:^27.0.2" - checksum: 10/6d6ef942deedf547180c76d4cc2c43fe8e52a98ef68be6ba7382a43d3b1e1e5696d9c32ae0b2df12c92ea50023187d132ad2542fc118ba4b900f149e97d019e0 + checksum: 10/05825ee9a15b88cbdae12c137db7111c34069ed3c7a1bd03b6696cb1b37b29f6f2d2de581ebf03033e7df1ab7ebf08399310293f440a4845d95c02c0a9ecc899 languageName: node linkType: hard @@ -7359,36 +7315,18 @@ __metadata: languageName: node linkType: hard -"@testing-library/jest-dom@npm:6.4.5": - version: 6.4.5 - resolution: "@testing-library/jest-dom@npm:6.4.5" +"@testing-library/jest-dom@npm:6.5.0": + version: 6.5.0 + resolution: "@testing-library/jest-dom@npm:6.5.0" dependencies: - "@adobe/css-tools": "npm:^4.3.2" - "@babel/runtime": "npm:^7.9.2" + "@adobe/css-tools": "npm:^4.4.0" aria-query: "npm:^5.0.0" chalk: "npm:^3.0.0" css.escape: "npm:^1.5.1" dom-accessibility-api: "npm:^0.6.3" lodash: "npm:^4.17.21" redent: "npm:^3.0.0" - peerDependencies: - "@jest/globals": ">= 28" - "@types/bun": "*" - "@types/jest": ">= 28" - jest: ">= 28" - vitest: ">= 0.32" - peerDependenciesMeta: - "@jest/globals": - optional: true - "@types/bun": - optional: true - "@types/jest": - optional: true - jest: - optional: true - vitest: - optional: true - checksum: 10/6d9e6cc01ec9111ea631657d93596fa9505d294fdfc4172fbd750b8df6268f02d55900626423b195dac5b067a302557453894a5814bdf4e770dee37cdb1c0f2d + checksum: 10/3d2080888af5fd7306f57448beb5a23f55d965e265b5e53394fffc112dfb0678d616a5274ff0200c46c7618f293520f86fc8562eecd8bdbc0dbb3294d63ec431 languageName: node linkType: hard @@ -7575,7 +7513,7 @@ __metadata: languageName: node linkType: hard -"@types/express@npm:^4.17.21, @types/express@npm:^4.7.0": +"@types/express@npm:^4.7.0": version: 4.17.21 resolution: "@types/express@npm:4.17.21" dependencies: @@ -7594,16 +7532,6 @@ __metadata: languageName: node linkType: hard -"@types/glob@npm:^7.1.3": - version: 7.2.0 - resolution: "@types/glob@npm:7.2.0" - dependencies: - "@types/minimatch": "npm:*" - "@types/node": "npm:*" - checksum: 10/6ae717fedfdfdad25f3d5a568323926c64f52ef35897bcac8aca8e19bc50c0bd84630bbd063e5d52078b2137d8e7d3c26eabebd1a2f03ff350fff8a91e79fc19 - languageName: node - linkType: hard - "@types/graceful-fs@npm:^4.1.3": version: 4.1.9 resolution: "@types/graceful-fs@npm:4.1.9" @@ -7613,15 +7541,6 @@ __metadata: languageName: node linkType: hard -"@types/hast@npm:^3.0.0": - version: 3.0.4 - resolution: "@types/hast@npm:3.0.4" - dependencies: - "@types/unist": "npm:*" - checksum: 10/732920d81bb7605895776841b7658b4d8cc74a43a8fa176017cc0fb0ecc1a4c82a2b75a4fe6b71aa262b649d3fb62858c6789efa3793ea1d40269953af96ecb5 - languageName: node - linkType: hard - "@types/html-minifier-terser@npm:^6.0.0": version: 6.1.0 resolution: "@types/html-minifier-terser@npm:6.1.0" @@ -7738,13 +7657,6 @@ __metadata: languageName: node linkType: hard -"@types/minimatch@npm:*": - version: 5.1.2 - resolution: "@types/minimatch@npm:5.1.2" - checksum: 10/94db5060d20df2b80d77b74dd384df3115f01889b5b6c40fa2dfa27cfc03a68fb0ff7c1f2a0366070263eb2e9d6bfd8c87111d4bc3ae93c3f291297c1bf56c85 - languageName: node - linkType: hard - "@types/minimist@npm:^1.2.0": version: 1.2.5 resolution: "@types/minimist@npm:1.2.5" @@ -7858,16 +7770,6 @@ __metadata: languageName: node linkType: hard -"@types/react@npm:^16.8.0 || ^17.0.0 || ^18.0.0": - version: 18.3.5 - resolution: "@types/react@npm:18.3.5" - dependencies: - "@types/prop-types": "npm:*" - csstype: "npm:^3.0.2" - checksum: 10/ba0477c5ad4a762157c6262a199af6ccf9e24576877a26a7f516d5a9ba35374a6ac7f8686a10e5e8030513214f02bcb66e8363e43905afb7cd313deaf673de05 - languageName: node - linkType: hard - "@types/react@npm:^19.0.0": version: 19.0.8 resolution: "@types/react@npm:19.0.8" @@ -7891,7 +7793,7 @@ __metadata: languageName: node linkType: hard -"@types/semver@npm:^7.3.12, @types/semver@npm:^7.3.4, @types/semver@npm:^7.5.0": +"@types/semver@npm:^7.3.4, @types/semver@npm:^7.5.0": version: 7.5.7 resolution: "@types/semver@npm:7.5.7" checksum: 10/535d88ec577fe59e38211881f79a1e2ba391e9e1516f8fff74e7196a5ba54315bace9c67a4616c334c830c89027d70a9f473a4ceb634526086a9da39180f2f9a @@ -7940,13 +7842,6 @@ __metadata: languageName: node linkType: hard -"@types/unist@npm:*, @types/unist@npm:^3.0.0": - version: 3.0.3 - resolution: "@types/unist@npm:3.0.3" - checksum: 10/96e6453da9e075aaef1dc22482463898198acdc1eeb99b465e65e34303e2ec1e3b1ed4469a9118275ec284dc98019f63c3f5d49422f0e4ac707e5ab90fb3b71a - languageName: node - linkType: hard - "@types/unist@npm:^2.0.0": version: 2.0.10 resolution: "@types/unist@npm:2.0.10" @@ -8110,16 +8005,6 @@ __metadata: languageName: node linkType: hard -"@typescript-eslint/scope-manager@npm:5.62.0": - version: 5.62.0 - resolution: "@typescript-eslint/scope-manager@npm:5.62.0" - dependencies: - "@typescript-eslint/types": "npm:5.62.0" - "@typescript-eslint/visitor-keys": "npm:5.62.0" - checksum: 10/e827770baa202223bc0387e2fd24f630690809e460435b7dc9af336c77322290a770d62bd5284260fa881c86074d6a9fd6c97b07382520b115f6786b8ed499da - languageName: node - linkType: hard - "@typescript-eslint/scope-manager@npm:6.21.0": version: 6.21.0 resolution: "@typescript-eslint/scope-manager@npm:6.21.0" @@ -8130,6 +8015,16 @@ __metadata: languageName: node linkType: hard +"@typescript-eslint/scope-manager@npm:8.23.0": + version: 8.23.0 + resolution: "@typescript-eslint/scope-manager@npm:8.23.0" + dependencies: + "@typescript-eslint/types": "npm:8.23.0" + "@typescript-eslint/visitor-keys": "npm:8.23.0" + checksum: 10/eb4624ccd907c21ca49c4600dec0c447349d7e987cda21181c008dc5ce855590e311efabe73b79b15da0948ce5f63ce0c33613ab4a39ea95578b099b724392e3 + languageName: node + linkType: hard + "@typescript-eslint/type-utils@npm:6.21.0": version: 6.21.0 resolution: "@typescript-eslint/type-utils@npm:6.21.0" @@ -8154,13 +8049,6 @@ __metadata: languageName: node linkType: hard -"@typescript-eslint/types@npm:5.62.0": - version: 5.62.0 - resolution: "@typescript-eslint/types@npm:5.62.0" - checksum: 10/24e8443177be84823242d6729d56af2c4b47bfc664dd411a1d730506abf2150d6c31bdefbbc6d97c8f91043e3a50e0c698239dcb145b79bb6b0c34469aaf6c45 - languageName: node - linkType: hard - "@typescript-eslint/types@npm:6.21.0": version: 6.21.0 resolution: "@typescript-eslint/types@npm:6.21.0" @@ -8168,6 +8056,13 @@ __metadata: languageName: node linkType: hard +"@typescript-eslint/types@npm:8.23.0": + version: 8.23.0 + resolution: "@typescript-eslint/types@npm:8.23.0" + checksum: 10/e2a68bc6e89226e47e495a91e0614aa5c3c4580b11f7fd99ac6728c1fce92f10755b0d7ade3cf6d3eb1209cd9cd0f29bd742f8dddc394b28bcead7025394eaa2 + languageName: node + linkType: hard + "@typescript-eslint/typescript-estree@npm:4.33.0": version: 4.33.0 resolution: "@typescript-eslint/typescript-estree@npm:4.33.0" @@ -8186,24 +8081,6 @@ __metadata: languageName: node linkType: hard -"@typescript-eslint/typescript-estree@npm:5.62.0": - version: 5.62.0 - resolution: "@typescript-eslint/typescript-estree@npm:5.62.0" - dependencies: - "@typescript-eslint/types": "npm:5.62.0" - "@typescript-eslint/visitor-keys": "npm:5.62.0" - debug: "npm:^4.3.4" - globby: "npm:^11.1.0" - is-glob: "npm:^4.0.3" - semver: "npm:^7.3.7" - tsutils: "npm:^3.21.0" - peerDependenciesMeta: - typescript: - optional: true - checksum: 10/06c975eb5f44b43bd19fadc2e1023c50cf87038fe4c0dd989d4331c67b3ff509b17fa60a3251896668ab4d7322bdc56162a9926971218d2e1a1874d2bef9a52e - languageName: node - linkType: hard - "@typescript-eslint/typescript-estree@npm:6.21.0": version: 6.21.0 resolution: "@typescript-eslint/typescript-estree@npm:6.21.0" @@ -8223,6 +8100,24 @@ __metadata: languageName: node linkType: hard +"@typescript-eslint/typescript-estree@npm:8.23.0": + version: 8.23.0 + resolution: "@typescript-eslint/typescript-estree@npm:8.23.0" + dependencies: + "@typescript-eslint/types": "npm:8.23.0" + "@typescript-eslint/visitor-keys": "npm:8.23.0" + debug: "npm:^4.3.4" + fast-glob: "npm:^3.3.2" + is-glob: "npm:^4.0.3" + minimatch: "npm:^9.0.4" + semver: "npm:^7.6.0" + ts-api-utils: "npm:^2.0.1" + peerDependencies: + typescript: ">=4.8.4 <5.8.0" + checksum: 10/ddc9790d460bea065eeed3760759c034aef307e72c51b5ec7d869fdc77f18c28354c9e35841b44eebbdc54241bab4154809ae8213d33593a9bff20dc3b247fc3 + languageName: node + linkType: hard + "@typescript-eslint/utils@npm:6.21.0": version: 6.21.0 resolution: "@typescript-eslint/utils@npm:6.21.0" @@ -8240,21 +8135,18 @@ __metadata: languageName: node linkType: hard -"@typescript-eslint/utils@npm:^5.62.0": - version: 5.62.0 - resolution: "@typescript-eslint/utils@npm:5.62.0" +"@typescript-eslint/utils@npm:^8.8.1": + version: 8.23.0 + resolution: "@typescript-eslint/utils@npm:8.23.0" dependencies: - "@eslint-community/eslint-utils": "npm:^4.2.0" - "@types/json-schema": "npm:^7.0.9" - "@types/semver": "npm:^7.3.12" - "@typescript-eslint/scope-manager": "npm:5.62.0" - "@typescript-eslint/types": "npm:5.62.0" - "@typescript-eslint/typescript-estree": "npm:5.62.0" - eslint-scope: "npm:^5.1.1" - semver: "npm:^7.3.7" + "@eslint-community/eslint-utils": "npm:^4.4.0" + "@typescript-eslint/scope-manager": "npm:8.23.0" + "@typescript-eslint/types": "npm:8.23.0" + "@typescript-eslint/typescript-estree": "npm:8.23.0" peerDependencies: - eslint: ^6.0.0 || ^7.0.0 || ^8.0.0 - checksum: 10/15ef13e43998a082b15f85db979f8d3ceb1f9ce4467b8016c267b1738d5e7cdb12aa90faf4b4e6dd6486c236cf9d33c463200465cf25ff997dbc0f12358550a1 + eslint: ^8.57.0 || ^9.0.0 + typescript: ">=4.8.4 <5.8.0" + checksum: 10/72588d617ee5b1fa1020d008a7ff714a4a1e0fc1167aa9ff4b8ae71a37b25f43b2d40bca3380c56bb84d4092b6cac8d5d14d74e290e80217175ccf8237faf22a languageName: node linkType: hard @@ -8268,16 +8160,6 @@ __metadata: languageName: node linkType: hard -"@typescript-eslint/visitor-keys@npm:5.62.0": - version: 5.62.0 - resolution: "@typescript-eslint/visitor-keys@npm:5.62.0" - dependencies: - "@typescript-eslint/types": "npm:5.62.0" - eslint-visitor-keys: "npm:^3.3.0" - checksum: 10/dc613ab7569df9bbe0b2ca677635eb91839dfb2ca2c6fa47870a5da4f160db0b436f7ec0764362e756d4164e9445d49d5eb1ff0b87f4c058946ae9d8c92eb388 - languageName: node - linkType: hard - "@typescript-eslint/visitor-keys@npm:6.21.0": version: 6.21.0 resolution: "@typescript-eslint/visitor-keys@npm:6.21.0" @@ -8288,7 +8170,17 @@ __metadata: languageName: node linkType: hard -"@ungap/structured-clone@npm:^1.0.0, @ungap/structured-clone@npm:^1.2.0": +"@typescript-eslint/visitor-keys@npm:8.23.0": + version: 8.23.0 + resolution: "@typescript-eslint/visitor-keys@npm:8.23.0" + dependencies: + "@typescript-eslint/types": "npm:8.23.0" + eslint-visitor-keys: "npm:^4.2.0" + checksum: 10/fd473849b85e564e31aec64feb3417a4e16e48bf21f1959fbab56258e19c21ef47bbdb523c64a8921cdc82a5083735418890b6f74b564fd1ece305c977a0f7a6 + languageName: node + linkType: hard + +"@ungap/structured-clone@npm:^1.2.0": version: 1.2.0 resolution: "@ungap/structured-clone@npm:1.2.0" checksum: 10/c6fe89a505e513a7592e1438280db1c075764793a2397877ff1351721fe8792a966a5359769e30242b3cd023f2efb9e63ca2ca88019d73b564488cc20e3eab12 @@ -8310,35 +8202,65 @@ __metadata: languageName: node linkType: hard -"@vitest/expect@npm:1.6.0": - version: 1.6.0 - resolution: "@vitest/expect@npm:1.6.0" +"@vitest/expect@npm:2.0.5": + version: 2.0.5 + resolution: "@vitest/expect@npm:2.0.5" dependencies: - "@vitest/spy": "npm:1.6.0" - "@vitest/utils": "npm:1.6.0" - chai: "npm:^4.3.10" - checksum: 10/e82304a12e22b98c1ccea81e8f33c838561deb878588eac463164cc4f8fc0c401ace3a9e6758d9e3a6bcc01313e845e8478aaefb7548eaded04b8de12c1928f6 + "@vitest/spy": "npm:2.0.5" + "@vitest/utils": "npm:2.0.5" + chai: "npm:^5.1.1" + tinyrainbow: "npm:^1.2.0" + checksum: 10/ca9a218f50254b2259fd16166b2d8c9ccc8ee2cc068905e6b3d6281da10967b1590cc7d34b5fa9d429297f97e740450233745583b4cc12272ff11705faf70a37 languageName: node linkType: hard -"@vitest/spy@npm:1.6.0": - version: 1.6.0 - resolution: "@vitest/spy@npm:1.6.0" +"@vitest/pretty-format@npm:2.0.5": + version: 2.0.5 + resolution: "@vitest/pretty-format@npm:2.0.5" dependencies: - tinyspy: "npm:^2.2.0" - checksum: 10/1c9698272a58aa47708bb8a1672d655fcec3285b02067cc3f70bfe76f4eda7a756eb379f8c945ccbe61677f5189aeb5ba93c2737a9d7db2de8c4e7bbdffcd372 + tinyrainbow: "npm:^1.2.0" + checksum: 10/70bf452dd0b8525e658795125b3f11110bd6baadfaa38c5bb91ca763bded35ec6dc80e27964ad4e91b91be6544d35e18ea7748c1997693988f975a7283c3e9a0 languageName: node linkType: hard -"@vitest/utils@npm:1.6.0, @vitest/utils@npm:^1.3.1": - version: 1.6.0 - resolution: "@vitest/utils@npm:1.6.0" +"@vitest/pretty-format@npm:2.1.9": + version: 2.1.9 + resolution: "@vitest/pretty-format@npm:2.1.9" dependencies: - diff-sequences: "npm:^29.6.3" + tinyrainbow: "npm:^1.2.0" + checksum: 10/557dc637c5825abd62ccb15080e59e04d22121e746d8020a0815d7c0c45132fed81b1ff36b26f5991e57a9f1d36e52aa19712abbfe1d0cbcd14252b449a919dc + languageName: node + linkType: hard + +"@vitest/spy@npm:2.0.5": + version: 2.0.5 + resolution: "@vitest/spy@npm:2.0.5" + dependencies: + tinyspy: "npm:^3.0.0" + checksum: 10/ed19f4c3bb4d3853241e8070979615138e24403ce4c137fa48c903b3af2c8b3ada2cc26aca9c1aa323bb314a457a8130a29acbb18dafd4e42737deefb2abf1ca + languageName: node + linkType: hard + +"@vitest/utils@npm:2.0.5": + version: 2.0.5 + resolution: "@vitest/utils@npm:2.0.5" + dependencies: + "@vitest/pretty-format": "npm:2.0.5" estree-walker: "npm:^3.0.3" - loupe: "npm:^2.3.7" - pretty-format: "npm:^29.7.0" - checksum: 10/5c5d7295ac13fcea1da039232bcc7c3fc6f070070fe12ba2ad152456af6e216e48a3ae169016cfcd5055706a00dc567b8f62e4a9b1914f069f52b8f0a3c25e60 + loupe: "npm:^3.1.1" + tinyrainbow: "npm:^1.2.0" + checksum: 10/d631d56d29c33bc8de631166b2b6691c470187a345469dfef7048befe6027e1c6ff9552f2ee11c8a247522c325c4a64bfcc73f8f0f0c525da39cb9f190f119f8 + languageName: node + linkType: hard + +"@vitest/utils@npm:^2.1.1": + version: 2.1.9 + resolution: "@vitest/utils@npm:2.1.9" + dependencies: + "@vitest/pretty-format": "npm:2.1.9" + loupe: "npm:^3.1.2" + tinyrainbow: "npm:^1.2.0" + checksum: 10/83d62d5703a3210a2f137c25dc4e797a7a1d74d5d2e14ecc33b274c7710304fa8b5099101c98bc8d66cc2bf18a14f88ebf21f0996a99d0ee1439ae23b49f3961 languageName: node linkType: hard @@ -9035,10 +8957,10 @@ __metadata: languageName: node linkType: hard -"assertion-error@npm:^1.1.0": - version: 1.1.0 - resolution: "assertion-error@npm:1.1.0" - checksum: 10/fd9429d3a3d4fd61782eb3962ae76b6d08aa7383123fca0596020013b3ebd6647891a85b05ce821c47d1471ed1271f00b0545cf6a4326cf2fc91efcc3b0fbecf +"assertion-error@npm:^2.0.1": + version: 2.0.1 + resolution: "assertion-error@npm:2.0.1" + checksum: 10/a0789dd882211b87116e81e2648ccb7f60340b34f19877dd020b39ebb4714e475eb943e14ba3e22201c221ef6645b7bfe10297e76b6ac95b48a9898c1211ce66 languageName: node linkType: hard @@ -9713,18 +9635,16 @@ __metadata: languageName: node linkType: hard -"chai@npm:^4.3.10": - version: 4.5.0 - resolution: "chai@npm:4.5.0" +"chai@npm:^5.1.1": + version: 5.1.2 + resolution: "chai@npm:5.1.2" dependencies: - assertion-error: "npm:^1.1.0" - check-error: "npm:^1.0.3" - deep-eql: "npm:^4.1.3" - get-func-name: "npm:^2.0.2" - loupe: "npm:^2.3.6" - pathval: "npm:^1.1.1" - type-detect: "npm:^4.1.0" - checksum: 10/cde341aee15b0a51559c7cfc20788dcfb4d586a498cfb93b937bb568fd45c777b73b1461274be6092b6bf868adb4e3a63f3fec13c89f7d8fb194f84c6fa42d5f + assertion-error: "npm:^2.0.1" + check-error: "npm:^2.1.1" + deep-eql: "npm:^5.0.1" + loupe: "npm:^3.1.0" + pathval: "npm:^2.0.0" + checksum: 10/e8c2bbc83cb5a2f87130d93056d4cfbbe04106e12aa798b504816dbe3fa538a9f68541b472e56cbf0f54558b501d7e31867d74b8218abcd5a8cc8ba536fba46c languageName: node linkType: hard @@ -9787,12 +9707,10 @@ __metadata: languageName: node linkType: hard -"check-error@npm:^1.0.3": - version: 1.0.3 - resolution: "check-error@npm:1.0.3" - dependencies: - get-func-name: "npm:^2.0.2" - checksum: 10/e2131025cf059b21080f4813e55b3c480419256914601750b0fee3bd9b2b8315b531e551ef12560419b8b6d92a3636511322752b1ce905703239e7cc451b6399 +"check-error@npm:^2.1.1": + version: 2.1.1 + resolution: "check-error@npm:2.1.1" + checksum: 10/d785ed17b1d4a4796b6e75c765a9a290098cf52ff9728ce0756e8ffd4293d2e419dd30c67200aee34202463b474306913f2fcfaf1890641026d9fc6966fea27a languageName: node linkType: hard @@ -10057,6 +9975,13 @@ __metadata: languageName: node linkType: hard +"commander@npm:^12.1.0": + version: 12.1.0 + resolution: "commander@npm:12.1.0" + checksum: 10/cdaeb672d979816853a4eed7f1310a9319e8b976172485c2a6b437ed0db0a389a44cfb222bfbde772781efa9f215bdd1b936f80d6b249485b465c6cb906e1f93 + languageName: node + linkType: hard + "commander@npm:^2.20.0": version: 2.20.3 resolution: "commander@npm:2.20.3" @@ -10301,6 +10226,28 @@ __metadata: languageName: node linkType: hard +"create-storybook@npm:8.5.3": + version: 8.5.3 + resolution: "create-storybook@npm:8.5.3" + dependencies: + "@types/semver": "npm:^7.3.4" + commander: "npm:^12.1.0" + execa: "npm:^5.0.0" + fd-package-json: "npm:^1.2.0" + find-up: "npm:^5.0.0" + ora: "npm:^5.4.1" + prettier: "npm:^3.1.1" + prompts: "npm:^2.4.0" + semver: "npm:^7.3.7" + storybook: "npm:8.5.3" + tiny-invariant: "npm:^1.3.1" + ts-dedent: "npm:^2.0.0" + bin: + create-storybook: ./bin/index.cjs + checksum: 10/9688206b8d77d1f9ca4ca012b2dd801569e03176123318b4e239dfa2fa1367157b0a3d4e4065af56a7416a4e1b68dd35ab617b79298d9373e6e2ef9bf197c4b4 + languageName: node + linkType: hard + "cross-fetch@npm:^4.0.0": version: 4.0.0 resolution: "cross-fetch@npm:4.0.0" @@ -10339,15 +10286,6 @@ __metadata: languageName: node linkType: hard -"crypto-random-string@npm:^4.0.0": - version: 4.0.0 - resolution: "crypto-random-string@npm:4.0.0" - dependencies: - type-fest: "npm:^1.0.1" - checksum: 10/cd5d7ae13803de53680aaed4c732f67209af5988cbeec5f6b29082020347c2d8849ca921b2008be7d6bd1d9d198c3c3697e7441d6d0d3da1bf51e9e4d2032149 - languageName: node - linkType: hard - "css-color-keywords@npm:^1.0.0": version: 1.0.0 resolution: "css-color-keywords@npm:1.0.0" @@ -10619,12 +10557,10 @@ __metadata: languageName: node linkType: hard -"deep-eql@npm:^4.1.3": - version: 4.1.4 - resolution: "deep-eql@npm:4.1.4" - dependencies: - type-detect: "npm:^4.0.0" - checksum: 10/f04f4d581f044a824a6322fe4f68fbee4d6780e93fc710cd9852cbc82bfc7010df00f0e05894b848abbe14dc3a25acac44f424e181ae64d12f2ab9d0a875a5ef +"deep-eql@npm:^5.0.1": + version: 5.0.2 + resolution: "deep-eql@npm:5.0.2" + checksum: 10/a529b81e2ef8821621d20a36959a0328873a3e49d393ad11f8efe8559f31239494c2eb889b80342808674c475802ba95b9d6c4c27641b9a029405104c1b59fcf languageName: node linkType: hard @@ -11350,13 +11286,6 @@ __metadata: languageName: node linkType: hard -"es-module-lexer@npm:^1.5.0": - version: 1.5.4 - resolution: "es-module-lexer@npm:1.5.4" - checksum: 10/f29c7c97a58eb17640dcbd71bd6ef754ad4f58f95c3073894573d29dae2cad43ecd2060d97ed5b866dfb7804d5590fb7de1d2c5339a5fceae8bd60b580387fc5 - languageName: node - linkType: hard - "es-set-tostringtag@npm:^2.0.2": version: 2.0.2 resolution: "es-set-tostringtag@npm:2.0.2" @@ -11388,6 +11317,18 @@ __metadata: languageName: node linkType: hard +"es-toolkit@npm:^1.22.0": + version: 1.32.0 + resolution: "es-toolkit@npm:1.32.0" + dependenciesMeta: + "@trivago/prettier-plugin-sort-imports@4.3.0": + unplugged: true + prettier-plugin-sort-re-exports@0.0.1: + unplugged: true + checksum: 10/98eaf802d5d2fbb2bd7ab69073034b7571b56abfa8e7cb046f22a501718b288c901b4f61a53f36b000549ab57c4265b2f8b86ba255e1a7d6e841ff86822e01be + languageName: node + linkType: hard + "es6-error@npm:^4.0.1": version: 4.1.1 resolution: "es6-error@npm:4.1.1" @@ -11490,33 +11431,35 @@ __metadata: languageName: node linkType: hard -"esbuild@npm:^0.18.0 || ^0.19.0 || ^0.20.0 || ^0.21.0": - version: 0.21.5 - resolution: "esbuild@npm:0.21.5" - dependencies: - "@esbuild/aix-ppc64": "npm:0.21.5" - "@esbuild/android-arm": "npm:0.21.5" - "@esbuild/android-arm64": "npm:0.21.5" - "@esbuild/android-x64": "npm:0.21.5" - "@esbuild/darwin-arm64": "npm:0.21.5" - "@esbuild/darwin-x64": "npm:0.21.5" - "@esbuild/freebsd-arm64": "npm:0.21.5" - "@esbuild/freebsd-x64": "npm:0.21.5" - "@esbuild/linux-arm": "npm:0.21.5" - "@esbuild/linux-arm64": "npm:0.21.5" - "@esbuild/linux-ia32": "npm:0.21.5" - "@esbuild/linux-loong64": "npm:0.21.5" - "@esbuild/linux-mips64el": "npm:0.21.5" - "@esbuild/linux-ppc64": "npm:0.21.5" - "@esbuild/linux-riscv64": "npm:0.21.5" - "@esbuild/linux-s390x": "npm:0.21.5" - "@esbuild/linux-x64": "npm:0.21.5" - "@esbuild/netbsd-x64": "npm:0.21.5" - "@esbuild/openbsd-x64": "npm:0.21.5" - "@esbuild/sunos-x64": "npm:0.21.5" - "@esbuild/win32-arm64": "npm:0.21.5" - "@esbuild/win32-ia32": "npm:0.21.5" - "@esbuild/win32-x64": "npm:0.21.5" +"esbuild@npm:^0.18.0 || ^0.19.0 || ^0.20.0 || ^0.21.0 || ^0.22.0 || ^0.23.0 || ^0.24.0": + version: 0.24.2 + resolution: "esbuild@npm:0.24.2" + dependencies: + "@esbuild/aix-ppc64": "npm:0.24.2" + "@esbuild/android-arm": "npm:0.24.2" + "@esbuild/android-arm64": "npm:0.24.2" + "@esbuild/android-x64": "npm:0.24.2" + "@esbuild/darwin-arm64": "npm:0.24.2" + "@esbuild/darwin-x64": "npm:0.24.2" + "@esbuild/freebsd-arm64": "npm:0.24.2" + "@esbuild/freebsd-x64": "npm:0.24.2" + "@esbuild/linux-arm": "npm:0.24.2" + "@esbuild/linux-arm64": "npm:0.24.2" + "@esbuild/linux-ia32": "npm:0.24.2" + "@esbuild/linux-loong64": "npm:0.24.2" + "@esbuild/linux-mips64el": "npm:0.24.2" + "@esbuild/linux-ppc64": "npm:0.24.2" + "@esbuild/linux-riscv64": "npm:0.24.2" + "@esbuild/linux-s390x": "npm:0.24.2" + "@esbuild/linux-x64": "npm:0.24.2" + "@esbuild/netbsd-arm64": "npm:0.24.2" + "@esbuild/netbsd-x64": "npm:0.24.2" + "@esbuild/openbsd-arm64": "npm:0.24.2" + "@esbuild/openbsd-x64": "npm:0.24.2" + "@esbuild/sunos-x64": "npm:0.24.2" + "@esbuild/win32-arm64": "npm:0.24.2" + "@esbuild/win32-ia32": "npm:0.24.2" + "@esbuild/win32-x64": "npm:0.24.2" dependenciesMeta: "@esbuild/aix-ppc64": optional: true @@ -11552,8 +11495,12 @@ __metadata: optional: true "@esbuild/linux-x64": optional: true + "@esbuild/netbsd-arm64": + optional: true "@esbuild/netbsd-x64": optional: true + "@esbuild/openbsd-arm64": + optional: true "@esbuild/openbsd-x64": optional: true "@esbuild/sunos-x64": @@ -11566,7 +11513,7 @@ __metadata: optional: true bin: esbuild: bin/esbuild - checksum: 10/d2ff2ca84d30cce8e871517374d6c2290835380dc7cd413b2d49189ed170d45e407be14de2cb4794cf76f75cf89955c4714726ebd3de7444b3046f5cab23ab6b + checksum: 10/95425071c9f24ff88bf61e0710b636ec0eb24ddf8bd1f7e1edef3044e1221104bbfa7bbb31c18018c8c36fa7902c5c0b843f829b981ebc89160cf5eebdaa58f4 languageName: node linkType: hard @@ -11951,17 +11898,16 @@ __metadata: languageName: node linkType: hard -"eslint-plugin-storybook@npm:^0.8.0": - version: 0.8.0 - resolution: "eslint-plugin-storybook@npm:0.8.0" +"eslint-plugin-storybook@npm:^0.11.2": + version: 0.11.2 + resolution: "eslint-plugin-storybook@npm:0.11.2" dependencies: - "@storybook/csf": "npm:^0.0.1" - "@typescript-eslint/utils": "npm:^5.62.0" - requireindex: "npm:^1.2.0" + "@storybook/csf": "npm:^0.1.11" + "@typescript-eslint/utils": "npm:^8.8.1" ts-dedent: "npm:^2.2.0" peerDependencies: - eslint: ">=6" - checksum: 10/a66e6737298af9bb830e3b14cdbd204e589a38adb810f02d843849936ef9175a80a49c8b8fa9263f8c2b9a8f36fdd3a2d429382d8051568c58d6272c65c2f5d3 + eslint: ">=8" + checksum: 10/104c2d329f2c2bf1819015adc8d0e67c0216ed5b284b4524f968412424106c97c4056720e3c26a6fc50016f872acb80c156a68009409898fe5ae40909eeafe47 languageName: node linkType: hard @@ -12026,6 +11972,13 @@ __metadata: languageName: node linkType: hard +"eslint-visitor-keys@npm:^4.2.0": + version: 4.2.0 + resolution: "eslint-visitor-keys@npm:4.2.0" + checksum: 10/9651b3356b01760e586b4c631c5268c0e1a85236e3292bf754f0472f465bf9a856c0ddc261fceace155334118c0151778effafbab981413dbf9288349343fa25 + languageName: node + linkType: hard + "eslint@npm:^7.25.0, eslint@npm:^7.32.0": version: 7.32.0 resolution: "eslint@npm:7.32.0" @@ -12326,7 +12279,7 @@ __metadata: languageName: node linkType: hard -"express@npm:^4.17.3, express@npm:^4.19.2": +"express@npm:^4.17.3": version: 4.21.0 resolution: "express@npm:4.21.0" dependencies: @@ -12972,13 +12925,6 @@ __metadata: languageName: node linkType: hard -"get-func-name@npm:^2.0.1, get-func-name@npm:^2.0.2": - version: 2.0.2 - resolution: "get-func-name@npm:2.0.2" - checksum: 10/3f62f4c23647de9d46e6f76d2b3eafe58933a9b3830c60669e4180d6c601ce1b4aa310ba8366143f55e52b139f992087a9f0647274e8745621fa2af7e0acf13b - languageName: node - linkType: hard - "get-intrinsic@npm:^1.1.1, get-intrinsic@npm:^1.1.3, get-intrinsic@npm:^1.2.1, get-intrinsic@npm:^1.2.2, get-intrinsic@npm:^1.2.3, get-intrinsic@npm:^1.2.4": version: 1.2.4 resolution: "get-intrinsic@npm:1.2.4" @@ -13070,13 +13016,6 @@ __metadata: languageName: node linkType: hard -"github-slugger@npm:^2.0.0": - version: 2.0.0 - resolution: "github-slugger@npm:2.0.0" - checksum: 10/2fb15d78262eeba1e68671f048c62d05ed21e51281cccc7b1c9e8e089e8510b3037fb648b8ba27290e60534df2cb251312a1e7e813204495df621220192fd600 - languageName: node - linkType: hard - "glob-parent@npm:^5.1.2, glob-parent@npm:~5.1.2": version: 5.1.2 resolution: "glob-parent@npm:5.1.2" @@ -13095,17 +13034,6 @@ __metadata: languageName: node linkType: hard -"glob-promise@npm:^4.2.0": - version: 4.2.2 - resolution: "glob-promise@npm:4.2.2" - dependencies: - "@types/glob": "npm:^7.1.3" - peerDependencies: - glob: ^7.1.6 - checksum: 10/c1a3d95f7c8393e4151d4899ec4e42bb2e8237160f840ad1eccbe9247407da8b6c13e28f463022e011708bc40862db87b9b77236d35afa3feb8aa86d518f2dfe - languageName: node - linkType: hard - "glob-to-regexp@npm:^0.4.1": version: 0.4.1 resolution: "glob-to-regexp@npm:0.4.1" @@ -13128,7 +13056,7 @@ __metadata: languageName: node linkType: hard -"glob@npm:^7.0.5, glob@npm:^7.1.3, glob@npm:^7.1.4, glob@npm:^7.1.6, glob@npm:^7.2.0": +"glob@npm:^7.0.5, glob@npm:^7.1.3, glob@npm:^7.1.4, glob@npm:^7.1.6": version: 7.2.3 resolution: "glob@npm:7.2.3" dependencies: @@ -13372,33 +13300,6 @@ __metadata: languageName: node linkType: hard -"hast-util-heading-rank@npm:^3.0.0": - version: 3.0.0 - resolution: "hast-util-heading-rank@npm:3.0.0" - dependencies: - "@types/hast": "npm:^3.0.0" - checksum: 10/e5ce4ec9e8017b24ab72702fa0dd401ec6eaf32574120d71c2aa4e8e0f43829dba2e291f49d305a47e8d65b82a9c5adad7985385dc5bc8370f8cec7c8f9313d3 - languageName: node - linkType: hard - -"hast-util-is-element@npm:^3.0.0": - version: 3.0.0 - resolution: "hast-util-is-element@npm:3.0.0" - dependencies: - "@types/hast": "npm:^3.0.0" - checksum: 10/b4e6d84c763ffdc44198ba0c4a5a7430794a7b2c1eec699d37776ea9832eef79f129726c175982103eb3b21f531a6bfd2fa43ce26e1ed6d8f6a87c102ba212c8 - languageName: node - linkType: hard - -"hast-util-to-string@npm:^3.0.0": - version: 3.0.0 - resolution: "hast-util-to-string@npm:3.0.0" - dependencies: - "@types/hast": "npm:^3.0.0" - checksum: 10/b0d51e2cf228edcbed0494755a7f095c5c2b7a0e7564f3ad7b83b89abbabf098b62b3c884e1bb4d3394c0c84486ba39800d78f2ccdbdaa38122be62330dd2357 - languageName: node - linkType: hard - "he@npm:^1.2.0": version: 1.2.0 resolution: "he@npm:1.2.0" @@ -13812,13 +13713,6 @@ __metadata: languageName: node linkType: hard -"is-absolute-url@npm:^4.0.0": - version: 4.0.1 - resolution: "is-absolute-url@npm:4.0.1" - checksum: 10/de172a718439982a54477fdae55f21be69ec0e6a4b205db5484975d2f4ee749851fd46c28f3790dfc51a274c2ed1d0f8457b6d1fff02ab829069fd9cc761e48c - languageName: node - linkType: hard - "is-arguments@npm:^1.0.4, is-arguments@npm:^1.1.1": version: 1.1.1 resolution: "is-arguments@npm:1.1.1" @@ -15053,6 +14947,13 @@ __metadata: languageName: node linkType: hard +"jsdoc-type-pratt-parser@npm:^4.0.0": + version: 4.1.0 + resolution: "jsdoc-type-pratt-parser@npm:4.1.0" + checksum: 10/30d88f95f6cbb4a1aa6d4b0d0ae46eb1096e606235ecaf9bab7a3ed5da860516b5d1cd967182765002f292c627526db918f3e56d34637bcf810e6ef84d403f3f + languageName: node + linkType: hard + "jsdom@npm:^20.0.0": version: 20.0.3 resolution: "jsdom@npm:20.0.3" @@ -15500,7 +15401,7 @@ __metadata: languageName: node linkType: hard -"lodash@npm:^4.17.15, lodash@npm:^4.17.20, lodash@npm:^4.17.21": +"lodash@npm:^4.17.20, lodash@npm:^4.17.21": version: 4.17.21 resolution: "lodash@npm:4.17.21" checksum: 10/c08619c038846ea6ac754abd6dd29d2568aa705feb69339e836dfa8d8b09abbb2f859371e86863eda41848221f9af43714491467b5b0299122431e202bb0c532 @@ -15541,12 +15442,10 @@ __metadata: languageName: node linkType: hard -"loupe@npm:^2.3.6, loupe@npm:^2.3.7": - version: 2.3.7 - resolution: "loupe@npm:2.3.7" - dependencies: - get-func-name: "npm:^2.0.1" - checksum: 10/635c8f0914c2ce7ecfe4e239fbaf0ce1d2c00e4246fafcc4ed000bfdb1b8f89d05db1a220054175cca631ebf3894872a26fffba0124477fcb562f78762848fb1 +"loupe@npm:^3.1.0, loupe@npm:^3.1.1, loupe@npm:^3.1.2": + version: 3.1.3 + resolution: "loupe@npm:3.1.3" + checksum: 10/9e98c34daf0eba48ccc603595e51f2ae002110982d84879cf78c51de2c632f0c571dfe82ce4210af60c32203d06b443465c269bda925076fe6d9b612cc65c321 languageName: node linkType: hard @@ -15721,15 +15620,6 @@ __metadata: languageName: node linkType: hard -"markdown-to-jsx@npm:^7.4.5": - version: 7.5.0 - resolution: "markdown-to-jsx@npm:7.5.0" - peerDependencies: - react: ">= 0.14.0" - checksum: 10/b1fbe4429b968aefe02d4549eebb8d7456ccd7a8417805bb7f4bde1b466bdd0c81df3b14c5a1d9dcc49c6451ae50cf23cd04228fb6a0e1f8579ad0b76adae044 - languageName: node - linkType: hard - "marked@npm:^4.3.0": version: 4.3.0 resolution: "marked@npm:4.3.0" @@ -15935,6 +15825,15 @@ __metadata: languageName: node linkType: hard +"minimatch@npm:^9.0.4": + version: 9.0.5 + resolution: "minimatch@npm:9.0.5" + dependencies: + brace-expansion: "npm:^2.0.1" + checksum: 10/dd6a8927b063aca6d910b119e1f2df6d2ce7d36eab91de83167dd136bb85e1ebff97b0d3de1cb08bd1f7e018ca170b4962479fefab5b2a69e2ae12cb2edc8348 + languageName: node + linkType: hard + "minimist-options@npm:^4.0.2": version: 4.1.0 resolution: "minimist-options@npm:4.1.0" @@ -16862,10 +16761,10 @@ __metadata: languageName: node linkType: hard -"pathval@npm:^1.1.1": - version: 1.1.1 - resolution: "pathval@npm:1.1.1" - checksum: 10/b50a4751068aa3a5428f5a0b480deecedc6f537666a3630a0c2ae2d5e7c0f4bf0ee77b48404441ec1220bef0c91625e6030b3d3cf5a32ab0d9764018d1d9dbb6 +"pathval@npm:^2.0.0": + version: 2.0.0 + resolution: "pathval@npm:2.0.0" + checksum: 10/b91575bf9cdf01757afd7b5e521eb8a0b874a49bc972d08e0047cfea0cd3c019f5614521d4bc83d2855e3fcc331db6817dfd533dd8f3d90b16bc76fad2450fc1 languageName: node linkType: hard @@ -17893,33 +17792,6 @@ __metadata: languageName: node linkType: hard -"rehype-external-links@npm:^3.0.0": - version: 3.0.0 - resolution: "rehype-external-links@npm:3.0.0" - dependencies: - "@types/hast": "npm:^3.0.0" - "@ungap/structured-clone": "npm:^1.0.0" - hast-util-is-element: "npm:^3.0.0" - is-absolute-url: "npm:^4.0.0" - space-separated-tokens: "npm:^2.0.0" - unist-util-visit: "npm:^5.0.0" - checksum: 10/b9b2e4e5974a7d1e4030dc42bfad980d4700af35b6b20b36fc7ff0521897a8f20d3fe5e170255c428148fdd5a0653a73683da783124038d17b24f26dd59d20e8 - languageName: node - linkType: hard - -"rehype-slug@npm:^6.0.0": - version: 6.0.0 - resolution: "rehype-slug@npm:6.0.0" - dependencies: - "@types/hast": "npm:^3.0.0" - github-slugger: "npm:^2.0.0" - hast-util-heading-rank: "npm:^3.0.0" - hast-util-to-string: "npm:^3.0.0" - unist-util-visit: "npm:^5.0.0" - checksum: 10/292074643f8462c70f498bc8bf18a8c959073b96efc249f61e69fa9e36eb81d9b91d62199a90217c604e1c3904e8ff0a75df70d67e41bead56de93afb725c2d0 - languageName: node - linkType: hard - "relateurl@npm:^0.2.7": version: 0.2.7 resolution: "relateurl@npm:0.2.7" @@ -17994,13 +17866,6 @@ __metadata: languageName: node linkType: hard -"requireindex@npm:^1.2.0": - version: 1.2.0 - resolution: "requireindex@npm:1.2.0" - checksum: 10/266d1cb31f6cbc4b6cf2e898f5bbc45581f7919bcf61bba5c45d0adb69b722b9ff5a13727be3350cde4520d7cd37f39df45d58a29854baaa4552cd6b05ae4a1a - languageName: node - linkType: hard - "requires-port@npm:^1.0.0": version: 1.0.0 resolution: "requires-port@npm:1.0.0" @@ -18366,6 +18231,15 @@ __metadata: languageName: node linkType: hard +"semver@npm:^7.6.0, semver@npm:^7.6.2": + version: 7.7.0 + resolution: "semver@npm:7.7.0" + bin: + semver: bin/semver.js + checksum: 10/5d615860a54ff563955c451e467bff3aaf74c8d060489f936f25551d5ca05f5ac683eb46c9ed7ade082e1e53b313f205ed9c5df0b25ebb3517ec25c79e1f0d9c + languageName: node + linkType: hard + "send@npm:0.19.0": version: 0.19.0 resolution: "send@npm:0.19.0" @@ -18615,16 +18489,16 @@ __metadata: resolution: "smithy@workspace:apps/smithy" dependencies: "@frigade/react": "workspace:*" - "@storybook/addon-docs": "npm:^8.2.9" - "@storybook/addon-essentials": "npm:^8.2.9" - "@storybook/addon-interactions": "npm:^8.2.9" - "@storybook/addon-links": "npm:^8.2.9" - "@storybook/blocks": "npm:^8.2.9" - "@storybook/cli": "npm:^8.2.9" - "@storybook/react": "npm:^8.2.9" - "@storybook/react-vite": "npm:^8.2.9" - "@storybook/test": "npm:^8.2.9" - "@storybook/test-runner": "npm:^0.19.1" + "@storybook/addon-docs": "npm:^8.5.3" + "@storybook/addon-essentials": "npm:^8.5.3" + "@storybook/addon-interactions": "npm:^8.5.3" + "@storybook/addon-links": "npm:^8.5.3" + "@storybook/blocks": "npm:^8.5.3" + "@storybook/cli": "npm:^8.5.3" + "@storybook/react": "npm:^8.5.3" + "@storybook/react-vite": "npm:^8.5.3" + "@storybook/test": "npm:^8.5.3" + "@storybook/test-runner": "npm:^0.21.0" "@types/react": "npm:^19.0.0" "@types/react-dom": "npm:^19.0.0" "@typescript-eslint/eslint-plugin": "npm:^6.20.0" @@ -18633,12 +18507,12 @@ __metadata: eslint: "npm:^8.56.0" eslint-plugin-react-hooks: "npm:^4.6.0" eslint-plugin-react-refresh: "npm:^0.4.5" - eslint-plugin-storybook: "npm:^0.8.0" + eslint-plugin-storybook: "npm:^0.11.2" playwright: "npm:^1.47.1" prop-types: "npm:^15.8.1" react: "npm:^19.0.0" react-dom: "npm:^19.0.0" - storybook: "npm:^8.2.9" + storybook: "npm:^8.5.3" typescript: "npm:^4.9.4" vite: "npm:^4.5.5" languageName: unknown @@ -18729,13 +18603,6 @@ __metadata: languageName: node linkType: hard -"space-separated-tokens@npm:^2.0.0": - version: 2.0.2 - resolution: "space-separated-tokens@npm:2.0.2" - checksum: 10/202e97d7ca1ba0758a0aa4fe226ff98142073bcceeff2da3aad037968878552c3bbce3b3231970025375bbba5aee00c5b8206eda408da837ab2dc9c0f26be990 - languageName: node - linkType: hard - "spawn-wrap@npm:^2.0.0": version: 2.0.0 resolution: "spawn-wrap@npm:2.0.0" @@ -18868,43 +18735,21 @@ __metadata: languageName: node linkType: hard -"storybook@npm:8.2.9, storybook@npm:^8.2.9": - version: 8.2.9 - resolution: "storybook@npm:8.2.9" +"storybook@npm:8.5.3, storybook@npm:^8.5.3": + version: 8.5.3 + resolution: "storybook@npm:8.5.3" dependencies: - "@babel/core": "npm:^7.24.4" - "@babel/types": "npm:^7.24.0" - "@storybook/codemod": "npm:8.2.9" - "@storybook/core": "npm:8.2.9" - "@types/semver": "npm:^7.3.4" - "@yarnpkg/fslib": "npm:2.10.3" - "@yarnpkg/libzip": "npm:2.3.0" - chalk: "npm:^4.1.0" - commander: "npm:^6.2.1" - cross-spawn: "npm:^7.0.3" - detect-indent: "npm:^6.1.0" - envinfo: "npm:^7.7.3" - execa: "npm:^5.0.0" - fd-package-json: "npm:^1.2.0" - find-up: "npm:^5.0.0" - fs-extra: "npm:^11.1.0" - giget: "npm:^1.0.0" - globby: "npm:^14.0.1" - jscodeshift: "npm:^0.15.1" - leven: "npm:^3.1.0" - ora: "npm:^5.4.1" - prettier: "npm:^3.1.1" - prompts: "npm:^2.4.0" - semver: "npm:^7.3.7" - strip-json-comments: "npm:^3.0.1" - tempy: "npm:^3.1.0" - tiny-invariant: "npm:^1.3.1" - ts-dedent: "npm:^2.0.0" + "@storybook/core": "npm:8.5.3" + peerDependencies: + prettier: ^2 || ^3 + peerDependenciesMeta: + prettier: + optional: true bin: getstorybook: ./bin/index.cjs sb: ./bin/index.cjs storybook: ./bin/index.cjs - checksum: 10/2d5473ba1ab31067d07c63d79799db05cf81927f517945999d124a337f209d685b2e1e4ff37d13924410ec5582d28f474fee6dee98be08f079869ec831c10df8 + checksum: 10/776bef6f61faa4ccfdf5a8044c853099c3af300b268dc127cbf17ba7a6485d7a275f027170f8ef41e32e59b1d6da15b72a6f033266873f25325d7028291fee36 languageName: node linkType: hard @@ -19362,13 +19207,6 @@ __metadata: languageName: node linkType: hard -"temp-dir@npm:^3.0.0": - version: 3.0.0 - resolution: "temp-dir@npm:3.0.0" - checksum: 10/577211e995d1d584dd60f1469351d45e8a5b4524e4a9e42d3bdd12cfde1d0bb8f5898311bef24e02aaafb69514c1feb58c7b4c33dcec7129da3b0861a4ca935b - languageName: node - linkType: hard - "temp@npm:^0.8.4": version: 0.8.4 resolution: "temp@npm:0.8.4" @@ -19391,18 +19229,6 @@ __metadata: languageName: node linkType: hard -"tempy@npm:^3.1.0": - version: 3.1.0 - resolution: "tempy@npm:3.1.0" - dependencies: - is-stream: "npm:^3.0.0" - temp-dir: "npm:^3.0.0" - type-fest: "npm:^2.12.2" - unique-string: "npm:^3.0.0" - checksum: 10/f5540bc24dcd9d41ab0b31e9eed73c3ef825080f1c8b1e854e4b73059155c889f72f5f7c15e8cd462d59aa10c9726e423c81d6a365d614b538c6cc78a1209cc6 - languageName: node - linkType: hard - "term-size@npm:^2.1.0": version: 2.2.1 resolution: "term-size@npm:2.2.1" @@ -19506,10 +19332,17 @@ __metadata: languageName: node linkType: hard -"tinyspy@npm:^2.2.0": - version: 2.2.1 - resolution: "tinyspy@npm:2.2.1" - checksum: 10/170d6232e87f9044f537b50b406a38fbfd6f79a261cd12b92879947bd340939a833a678632ce4f5c4a6feab4477e9c21cd43faac3b90b68b77dd0536c4149736 +"tinyrainbow@npm:^1.2.0": + version: 1.2.0 + resolution: "tinyrainbow@npm:1.2.0" + checksum: 10/2924444db6804355e5ba2b6e586c7f77329d93abdd7257a069a0f4530dff9f16de484e80479094e3f39273462541b003a65ee3a6afc2d12555aa745132deba5d + languageName: node + linkType: hard + +"tinyspy@npm:^3.0.0": + version: 3.0.2 + resolution: "tinyspy@npm:3.0.2" + checksum: 10/5db671b2ff5cd309de650c8c4761ca945459d7204afb1776db9a04fb4efa28a75f08517a8620c01ee32a577748802231ad92f7d5b194dc003ee7f987a2a06337 languageName: node linkType: hard @@ -19630,6 +19463,15 @@ __metadata: languageName: node linkType: hard +"ts-api-utils@npm:^2.0.1": + version: 2.0.1 + resolution: "ts-api-utils@npm:2.0.1" + peerDependencies: + typescript: ">=4.8.4" + checksum: 10/2e68938cd5acad6b5157744215ce10cd097f9f667fd36b5fdd5efdd4b0c51063e855459d835f94f6777bb8a0f334916b6eb5c1eedab8c325feb34baa39238898 + languageName: node + linkType: hard + "ts-dedent@npm:^2.0.0, ts-dedent@npm:^2.2.0": version: 2.2.0 resolution: "ts-dedent@npm:2.2.0" @@ -19865,13 +19707,6 @@ __metadata: languageName: node linkType: hard -"type-detect@npm:^4.0.0, type-detect@npm:^4.1.0": - version: 4.1.0 - resolution: "type-detect@npm:4.1.0" - checksum: 10/e363bf0352427a79301f26a7795a27718624c49c576965076624eb5495d87515030b207217845f7018093adcbe169b2d119bb9b7f1a31a92bfbb1ab9639ca8dd - languageName: node - linkType: hard - "type-fest@npm:^0.13.1": version: 0.13.1 resolution: "type-fest@npm:0.13.1" @@ -19914,14 +19749,14 @@ __metadata: languageName: node linkType: hard -"type-fest@npm:^1.0.1, type-fest@npm:^1.0.2": +"type-fest@npm:^1.0.2": version: 1.4.0 resolution: "type-fest@npm:1.4.0" checksum: 10/89875c247564601c2650bacad5ff80b859007fbdb6c9e43713ae3ffa3f584552eea60f33711dd762e16496a1ab4debd409822627be14097d9a17e39c49db591a languageName: node linkType: hard -"type-fest@npm:^2.12.2, type-fest@npm:^2.19.0, type-fest@npm:~2.19": +"type-fest@npm:^2.19.0, type-fest@npm:~2.19": version: 2.19.0 resolution: "type-fest@npm:2.19.0" checksum: 10/7bf9e8fdf34f92c8bb364c0af14ca875fac7e0183f2985498b77be129dc1b3b1ad0a6b3281580f19e48c6105c037fb966ad9934520c69c6434d17fd0af4eed78 @@ -20181,15 +20016,6 @@ __metadata: languageName: node linkType: hard -"unique-string@npm:^3.0.0": - version: 3.0.0 - resolution: "unique-string@npm:3.0.0" - dependencies: - crypto-random-string: "npm:^4.0.0" - checksum: 10/1a1e2e7d02eab1bb10f720475da735e1990c8a5ff34edd1a3b6bc31590cb4210b7a1233d779360cc622ce11c211e43afa1628dd658f35d3e6a89964b622940df - languageName: node - linkType: hard - "unist-util-is@npm:^4.0.0": version: 4.1.0 resolution: "unist-util-is@npm:4.1.0" @@ -20197,15 +20023,6 @@ __metadata: languageName: node linkType: hard -"unist-util-is@npm:^6.0.0": - version: 6.0.0 - resolution: "unist-util-is@npm:6.0.0" - dependencies: - "@types/unist": "npm:^3.0.0" - checksum: 10/edd6a93fb2255addf4b9eeb304c1da63c62179aef793169dd64ab955cf2f6814885fe25f95f8105893e3562dead348af535718d7a84333826e0491c04bf42511 - languageName: node - linkType: hard - "unist-util-visit-parents@npm:^3.0.0": version: 3.1.1 resolution: "unist-util-visit-parents@npm:3.1.1" @@ -20216,16 +20033,6 @@ __metadata: languageName: node linkType: hard -"unist-util-visit-parents@npm:^6.0.0": - version: 6.0.1 - resolution: "unist-util-visit-parents@npm:6.0.1" - dependencies: - "@types/unist": "npm:^3.0.0" - unist-util-is: "npm:^6.0.0" - checksum: 10/645b3cbc5e923bc692b1eb1a9ca17bffc5aabc25e6090ff3f1489bff8effd1890b28f7a09dc853cb6a7fa0da8581bfebc9b670a68b53c4c086cb9610dfd37701 - languageName: node - linkType: hard - "unist-util-visit@npm:^2.0.0": version: 2.0.3 resolution: "unist-util-visit@npm:2.0.3" @@ -20237,17 +20044,6 @@ __metadata: languageName: node linkType: hard -"unist-util-visit@npm:^5.0.0": - version: 5.0.0 - resolution: "unist-util-visit@npm:5.0.0" - dependencies: - "@types/unist": "npm:^3.0.0" - unist-util-is: "npm:^6.0.0" - unist-util-visit-parents: "npm:^6.0.0" - checksum: 10/f2bbde23641e9ade7640358c06ddeec0f38342322eb8e7819d9ee380b0f859d25d084dde22bf63db0280b3b2f36575f15aa1d6c23acf276c91c2493cf799e3b0 - languageName: node - linkType: hard - "universalify@npm:^0.1.0": version: 0.1.2 resolution: "universalify@npm:0.1.2" From c0c460f196801a8fbc7e185b23db326da8703ff2 Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Tue, 4 Feb 2025 17:03:37 -0800 Subject: [PATCH 142/213] Export ClientPortal --- packages/react/src/components/ClientPortal/index.tsx | 1 + packages/react/src/index.ts | 1 + 2 files changed, 2 insertions(+) create mode 100644 packages/react/src/components/ClientPortal/index.tsx diff --git a/packages/react/src/components/ClientPortal/index.tsx b/packages/react/src/components/ClientPortal/index.tsx new file mode 100644 index 00000000..7e2ca2f9 --- /dev/null +++ b/packages/react/src/components/ClientPortal/index.tsx @@ -0,0 +1 @@ +export { ClientPortal, type ClientPortalProps } from './ClientPortal' diff --git a/packages/react/src/index.ts b/packages/react/src/index.ts index 2f704cc2..ce88e6d8 100644 --- a/packages/react/src/index.ts +++ b/packages/react/src/index.ts @@ -6,6 +6,7 @@ export { Box, type BoxProps } from './components/Box' export { Button, type ButtonProps } from './components/Button' export { Card, type CardProps, type CardHeaderProps } from './components/Card' export * as Checklist from './components/Checklist' +export * from './components/ClientPortal/ClientPortal' export type { CollapsibleProps, CollapsibleStepProps } from './components/Checklist' export { Collection } from './components/Collection' export { Dialog, type DialogProps } from './components/Dialog' From b9bc059335d6f2d4f01d8baf866c0d4be477dc0a Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Tue, 4 Feb 2025 17:24:23 -0800 Subject: [PATCH 143/213] Changeset --- .changeset/ninety-bears-whisper.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/ninety-bears-whisper.md diff --git a/.changeset/ninety-bears-whisper.md b/.changeset/ninety-bears-whisper.md new file mode 100644 index 00000000..88e64645 --- /dev/null +++ b/.changeset/ninety-bears-whisper.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": patch +--- + +Export ClientPortal From 3680227895a46436cc79741bb9a73821e9251c91 Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Tue, 4 Feb 2025 17:31:20 -0800 Subject: [PATCH 144/213] Fix export --- packages/react/src/index.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/index.ts b/packages/react/src/index.ts index ce88e6d8..69e6f3fd 100644 --- a/packages/react/src/index.ts +++ b/packages/react/src/index.ts @@ -6,7 +6,7 @@ export { Box, type BoxProps } from './components/Box' export { Button, type ButtonProps } from './components/Button' export { Card, type CardProps, type CardHeaderProps } from './components/Card' export * as Checklist from './components/Checklist' -export * from './components/ClientPortal/ClientPortal' +export * from './components/ClientPortal' export type { CollapsibleProps, CollapsibleStepProps } from './components/Checklist' export { Collection } from './components/Collection' export { Dialog, type DialogProps } from './components/Dialog' From 028e3732156a5cc747c62f064f234134094895a4 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Tue, 4 Feb 2025 17:34:56 -0800 Subject: [PATCH 145/213] Version Packages (#425) Co-authored-by: github-actions[bot] --- .changeset/ninety-bears-whisper.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/ninety-bears-whisper.md diff --git a/.changeset/ninety-bears-whisper.md b/.changeset/ninety-bears-whisper.md deleted file mode 100644 index 88e64645..00000000 --- a/.changeset/ninety-bears-whisper.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": patch ---- - -Export ClientPortal diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index ff815909..bf1bbab5 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/react +## 2.7.6 + +### Patch Changes + +- b9bc059: Export ClientPortal + ## 2.7.5 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 209c4ea1..ffeb7765 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.7.5", + "version": "2.7.6", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From fc19d7980d9b753815da602d07ad7a7e983b1a11 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Wed, 5 Feb 2025 01:37:01 +0000 Subject: [PATCH 146/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 153da205..92e70e7e 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.7.5'; \ No newline at end of file +export const SDK_VERSION = '2.7.6'; \ No newline at end of file From 3c7396d72e602361637046eb0786e194589e63db Mon Sep 17 00:00:00 2001 From: Micah Snyder <28678+dfltr@users.noreply.github.com> Date: Thu, 6 Feb 2025 14:44:11 -0800 Subject: [PATCH 147/213] Floating checklist (#424) Added Checklist.Floating, Progress.Ring, Popover, useFloating, useAutoScroll. --- .../stories/Checklist/Floating.stories.tsx | 21 +++ .../src/stories/Popover/Popover.stories.tsx | 75 ++++++++++ .../src/stories/Progress/Progress.stories.tsx | 29 +++- apps/smithy/src/stories/Tour/Tour.stories.tsx | 1 + .../stories/hooks/useAutoScroll.stories.tsx | 26 ++++ .../src/components/CheckIndicator/index.tsx | 7 +- .../components/Checklist/Floating.styles.ts | 33 ++++ .../src/components/Checklist/Floating.tsx | 141 ++++++++++++++++++ .../src/components/Checklist/FloatingStep.tsx | 110 ++++++++++++++ .../react/src/components/Checklist/index.tsx | 1 + packages/react/src/components/Hint/index.tsx | 45 ++---- .../components/Hint/useMutationAwareAnchor.ts | 8 + .../react/src/components/Popover/Content.tsx | 51 +++++++ .../react/src/components/Popover/Root.tsx | 87 +++++++++++ .../react/src/components/Popover/Trigger.tsx | 24 +++ .../react/src/components/Popover/index.tsx | 6 + .../react/src/components/Progress/Ring.tsx | 88 +++++++++++ .../react/src/components/Progress/index.tsx | 1 + packages/react/src/hooks/useAutoScroll.ts | 38 +++++ .../useFloating.ts} | 59 +++++--- packages/react/src/index.ts | 6 +- 21 files changed, 793 insertions(+), 64 deletions(-) create mode 100644 apps/smithy/src/stories/Checklist/Floating.stories.tsx create mode 100644 apps/smithy/src/stories/Popover/Popover.stories.tsx create mode 100644 apps/smithy/src/stories/hooks/useAutoScroll.stories.tsx create mode 100644 packages/react/src/components/Checklist/Floating.styles.ts create mode 100644 packages/react/src/components/Checklist/Floating.tsx create mode 100644 packages/react/src/components/Checklist/FloatingStep.tsx create mode 100644 packages/react/src/components/Popover/Content.tsx create mode 100644 packages/react/src/components/Popover/Root.tsx create mode 100644 packages/react/src/components/Popover/Trigger.tsx create mode 100644 packages/react/src/components/Popover/index.tsx create mode 100644 packages/react/src/components/Progress/Ring.tsx create mode 100644 packages/react/src/hooks/useAutoScroll.ts rename packages/react/src/{components/Hint/useFloatingHint.ts => hooks/useFloating.ts} (67%) diff --git a/apps/smithy/src/stories/Checklist/Floating.stories.tsx b/apps/smithy/src/stories/Checklist/Floating.stories.tsx new file mode 100644 index 00000000..fc42d3fe --- /dev/null +++ b/apps/smithy/src/stories/Checklist/Floating.stories.tsx @@ -0,0 +1,21 @@ +import { Box, Checklist } from "@frigade/react"; +import { type Meta } from "@storybook/react"; + +export default { + title: "Components/Checklist/Floating", + component: Checklist.Floating, + decorators: [ + (Story) => ( + + + + ), + ], +} as Meta; + +export const Default = { + args: { + //children: , + flowId: "flow_K2dmIlteW8eGbGoo", + }, +}; diff --git a/apps/smithy/src/stories/Popover/Popover.stories.tsx b/apps/smithy/src/stories/Popover/Popover.stories.tsx new file mode 100644 index 00000000..055f5f38 --- /dev/null +++ b/apps/smithy/src/stories/Popover/Popover.stories.tsx @@ -0,0 +1,75 @@ +import { Meta, StoryObj } from "@storybook/react"; +import { Box, Button, Card, FloatingUI, Popover } from "@frigade/react"; + +const meta: Meta = { + title: "Design System/Popover", + parameters: { + layout: "centered", + }, +}; +export default meta; + +type Story = StoryObj; + +export const Default: Story = { + render: () => ( + + + + Popover.Trigger + + + + Popover.Content + + + + + ), +}; + +export const Nested: Story = { + render: () => ( + + + + + Popover.Trigger + + + + Popover.Content + + + Nested Popover.Trigger + + + + Nested Popover.Content + + + + + + + + + ), +}; + +export const AutoScroll: Story = { + render: () => ( + + + + Popover.Trigger + + + + Popover.Content + + + + + ), +}; diff --git a/apps/smithy/src/stories/Progress/Progress.stories.tsx b/apps/smithy/src/stories/Progress/Progress.stories.tsx index ff75c678..a269ba6f 100644 --- a/apps/smithy/src/stories/Progress/Progress.stories.tsx +++ b/apps/smithy/src/stories/Progress/Progress.stories.tsx @@ -1,4 +1,4 @@ -import { Flex, Progress } from "@frigade/react"; +import { Flex, Progress, Text } from "@frigade/react"; export default { title: "Design System/Progress", @@ -13,9 +13,30 @@ export const Default = { decorators: [ (_, { args }) => ( - - - + + Progress.Bar + + + + Progress.Dots + + + + Progress.Segments + + + + Progress.Ring + + + + + ), ], diff --git a/apps/smithy/src/stories/Tour/Tour.stories.tsx b/apps/smithy/src/stories/Tour/Tour.stories.tsx index 11d11170..a1c1ed00 100644 --- a/apps/smithy/src/stories/Tour/Tour.stories.tsx +++ b/apps/smithy/src/stories/Tour/Tour.stories.tsx @@ -10,6 +10,7 @@ export default { export const Default = { args: { align: "after", + autoScroll: false, dismissible: true, defaultOpen: true, flowId: "flow_U63A5pndRrvCwxNs", diff --git a/apps/smithy/src/stories/hooks/useAutoScroll.stories.tsx b/apps/smithy/src/stories/hooks/useAutoScroll.stories.tsx new file mode 100644 index 00000000..3d3b55c4 --- /dev/null +++ b/apps/smithy/src/stories/hooks/useAutoScroll.stories.tsx @@ -0,0 +1,26 @@ +import { useState } from "react"; +import { Box, Button, Flex, useAutoScroll } from "@frigade/react"; + +export default { + title: "Hooks/useAutoScroll", +}; + +export const Default = { + args: { + scrollOptions: true, + }, + + decorators: [ + () => { + const [scrollRef, setScrollRef] = useState(); + + useAutoScroll(scrollRef); + + return ( + + Scroll to this element + + ); + }, + ], +}; diff --git a/packages/react/src/components/CheckIndicator/index.tsx b/packages/react/src/components/CheckIndicator/index.tsx index a30145da..b6e8b0d4 100644 --- a/packages/react/src/components/CheckIndicator/index.tsx +++ b/packages/react/src/components/CheckIndicator/index.tsx @@ -24,9 +24,10 @@ function CheckIcon() { interface CheckIndicatorProps extends BoxProps { checked?: boolean + size?: string } -export function CheckIndicator({ checked = false, ...props }: CheckIndicatorProps) { +export function CheckIndicator({ checked = false, size = '22px', ...props }: CheckIndicatorProps) { return ( {checked && ( diff --git a/packages/react/src/components/Checklist/Floating.styles.ts b/packages/react/src/components/Checklist/Floating.styles.ts new file mode 100644 index 00000000..677a310b --- /dev/null +++ b/packages/react/src/components/Checklist/Floating.styles.ts @@ -0,0 +1,33 @@ +export const floatingTransitionCSS = { + '&[data-status="open"]': { + opacity: 1, + zIndex: 1, + }, + '&[data-status="close"]': { + opacity: 0, + zIndex: 0, + + '& [data-status="close"]': { + display: 'none', + }, + }, + '&[data-status="initial"]': { + opacity: 0.8, + }, + '&[data-status="open"], &[data-status="close"]': { + transition: 'transform 0.2s ease-out, opacity 0.2s ease-out', + }, + '&[data-status="initial"] .fr-popover-transition-container': { + transform: 'scale(0.8)', + }, + '&[data-status="close"] .fr-popover-transition-container': { + transform: 'scale(0.3)', + }, + '&[data-status="open"] .fr-popover-transition-container': { + transform: 'scale(1)', + }, + '& .fr-popover-transition-container': { + transformOrigin: 'left', + transition: 'transform 0.2s ease-out', + }, +} diff --git a/packages/react/src/components/Checklist/Floating.tsx b/packages/react/src/components/Checklist/Floating.tsx new file mode 100644 index 00000000..6372e08e --- /dev/null +++ b/packages/react/src/components/Checklist/Floating.tsx @@ -0,0 +1,141 @@ +import { useRef, useState } from 'react' +import { FloatingTree } from '@floating-ui/react' + +import { Card } from '@/components/Card' +import { Flex } from '@/components/Flex' +import { Flow, type FlowPropsWithoutChildren } from '@/components/Flow' +import * as Popover from '@/components/Popover' +import * as Progress from '@/components/Progress' +import { Text } from '@/components/Text' + +import { FloatingStep } from '@/components/Checklist/FloatingStep' +import { floatingTransitionCSS } from '@/components/Checklist/Floating.styles' + +export interface FloatingChecklistProps + extends Popover.PopoverRootProps, + FlowPropsWithoutChildren {} + +// TODO: Fix props here (split popover and flow props and pass them to Flow / Popover.Root) +export function Floating({ + children, + flowId, + onPrimary, + onSecondary, + part, + ...props +}: FloatingChecklistProps) { + const [openStepId, setOpenStepId] = useState(null) + const pointerLeaveTimeout = useRef>() + + function handlePointerEnter() { + clearTimeout(pointerLeaveTimeout.current) + } + + function handlePointerLeave() { + clearTimeout(pointerLeaveTimeout.current) + + if (openStepId != null) { + pointerLeaveTimeout.current = setTimeout(() => setOpenStepId(null), 300) + } + } + + function resetOpenStep(isOpen: boolean) { + if (!isOpen && openStepId != null) { + setOpenStepId(null) + } + } + + return ( + + {({ flow }) => { + const currentSteps = flow.getNumberOfCompletedSteps() + const availableSteps = flow.getNumberOfAvailableSteps() + + const anchorContent = children ?? ( + + + {flow.title} + + + + ) + + return ( + + + {anchorContent} + + + + + {Array.from(flow.steps.values()).map((step) => ( + + ))} + + + + + ) + }} + + ) +} diff --git a/packages/react/src/components/Checklist/FloatingStep.tsx b/packages/react/src/components/Checklist/FloatingStep.tsx new file mode 100644 index 00000000..1c9b4879 --- /dev/null +++ b/packages/react/src/components/Checklist/FloatingStep.tsx @@ -0,0 +1,110 @@ +import { useRef } from 'react' +import * as Popover from '@/components/Popover' + +import { Card } from '@/components/Card' +import { CheckIndicator } from '@/components/CheckIndicator' +import { Flex } from '@/components/Flex' +import { getVideoProps } from '@/components/Media/videoProps' +import { Text } from '@/components/Text' + +import { useStepHandlers } from '@/hooks/useStepHandlers' + +import { floatingTransitionCSS } from '@/components/Checklist/Floating.styles' + +// TODO: Type props +export function FloatingStep({ onPrimary, onSecondary, openStepId, setOpenStepId, step }) { + const anchorPointerEnterTimeout = useRef>() + const { handlePrimary, handleSecondary } = useStepHandlers(step, { onPrimary, onSecondary }) + + const isStepOpen = openStepId === step.id + + async function wrappedHandlePrimary(...args: Parameters) { + const primaryReturnValue = await handlePrimary(...args) + + if (primaryReturnValue) { + setOpenStepId(null) + } + } + + async function wrappedHandleSecondary(...args: Parameters) { + const secondaryReturnValue = await handleSecondary(...args) + + if (secondaryReturnValue) { + setOpenStepId(null) + } + } + + // TODO: Handle tap while open on mobile to close step + function handlePointerEnter() { + clearTimeout(anchorPointerEnterTimeout.current) + + if (!isStepOpen) { + anchorPointerEnterTimeout.current = setTimeout(() => setOpenStepId(step.id), 300) + } + } + + function handlePointerLeave() { + clearTimeout(anchorPointerEnterTimeout.current) + } + + const primaryButtonTitle = step.primaryButton?.title ?? step.primaryButtonTitle + const secondaryButtonTitle = step.secondaryButton?.title ?? step.secondaryButtonTitle + + const { videoProps } = getVideoProps(step.props ?? {}) + + return ( + + + {step.title} + + + + + + + + + + + + + + + ) +} diff --git a/packages/react/src/components/Checklist/index.tsx b/packages/react/src/components/Checklist/index.tsx index 31f4fd3f..bdb192a4 100644 --- a/packages/react/src/components/Checklist/index.tsx +++ b/packages/react/src/components/Checklist/index.tsx @@ -2,3 +2,4 @@ export { Carousel } from './Carousel' export { Collapsible, type CollapsibleProps, type CollapsibleStepProps } from './Collapsible' // eslint-disable-next-line react-refresh/only-export-components export * as CollapsibleStep from './CollapsibleStep' +export { Floating } from './Floating' diff --git a/packages/react/src/components/Hint/index.tsx b/packages/react/src/components/Hint/index.tsx index d0897e9f..4f9c557a 100644 --- a/packages/react/src/components/Hint/index.tsx +++ b/packages/react/src/components/Hint/index.tsx @@ -1,4 +1,4 @@ -import { useEffect, useRef, useState } from 'react' +import { useRef, useState } from 'react' import { Box, type BoxProps } from '@/components/Box' import { Overlay } from '@/components/Overlay' @@ -6,7 +6,8 @@ import { Ping } from '@/components/Ping' import { Spotlight } from '@/components/Spotlight' import { getPingPosition } from '@/components/Hint/getPingPosition' -import { useFloatingHint } from '@/components/Hint/useFloatingHint' +import { useAutoScroll } from '@/hooks/useAutoScroll' +import { useFloating } from '@/hooks/useFloating' import { useVisibility } from '@/hooks/useVisibility' export type AlignValue = 'after' | 'before' | 'center' | 'end' | 'start' @@ -51,13 +52,12 @@ export function Hint({ ...props }: HintProps) { const [internalOpen, setInteralOpen] = useState(defaultOpen) - const [scrollComplete, setScrollComplete] = useState(false) // Defer to controlled open prop, otherwise manage open state internally const canonicalOpen = open ?? internalOpen const { getFloatingProps, getReferenceProps, floatingStyles, placement, refs, status } = - useFloatingHint({ + useFloating({ align, alignOffset, anchor, @@ -79,43 +79,16 @@ export function Hint({ const { isVisible } = useVisibility(refs.reference.current as Element | null) const isMounted = useRef(false) - useEffect(() => { - if (!scrollComplete && autoScroll && refs.reference.current instanceof Element) { - const scrollOptions: ScrollIntoViewOptions = - typeof autoScroll !== 'boolean' ? autoScroll : { behavior: 'smooth', block: 'center' } - - /* - * NOTE: "scrollend" event isn't supported widely enough yet :( - * - * We'll listen to a capture-phase "scroll" instead, and when it stops - * bouncing, we can infer that the scroll we initiated is over. - */ - let scrollTimeout: ReturnType - window.addEventListener( - 'scroll', - function scrollHandler() { - clearTimeout(scrollTimeout) - - scrollTimeout = setTimeout(() => { - window.removeEventListener('scroll', scrollHandler) - setScrollComplete(true) - }, 100) - }, - true - ) - - refs.reference.current.scrollIntoView(scrollOptions) - } else if (!autoScroll) { - setScrollComplete(true) - } - }, [autoScroll, refs.reference, scrollComplete]) - - const shouldMount = refs.reference.current !== null && scrollComplete && isVisible + useAutoScroll(refs.reference.current as Element, autoScroll) + + const shouldMount = refs.reference.current !== null && isVisible if (!shouldMount) { + console.log('HINT: !shouldMount') isMounted.current = false return null } else if (isMounted.current === false) { + console.log('HINT: shouldMount') isMounted.current = true onMount?.() } diff --git a/packages/react/src/components/Hint/useMutationAwareAnchor.ts b/packages/react/src/components/Hint/useMutationAwareAnchor.ts index 66ff4bf6..02a2e036 100644 --- a/packages/react/src/components/Hint/useMutationAwareAnchor.ts +++ b/packages/react/src/components/Hint/useMutationAwareAnchor.ts @@ -28,6 +28,10 @@ export function useMutationAwareAnchor(anchor: string) { const [anchorElement, setAnchorElement] = useState(null) useEffect(() => { + if (typeof anchor !== 'string') { + return + } + try { const element = document.querySelector(anchor) @@ -43,6 +47,10 @@ export function useMutationAwareAnchor(anchor: string) { }, [anchor]) useEffect(() => { + if (typeof anchor !== 'string') { + return + } + const observer = new MutationObserver((mutations) => { for (const mutation of mutations) { if (mutation.type !== 'childList') { diff --git a/packages/react/src/components/Popover/Content.tsx b/packages/react/src/components/Popover/Content.tsx new file mode 100644 index 00000000..010e4a9d --- /dev/null +++ b/packages/react/src/components/Popover/Content.tsx @@ -0,0 +1,51 @@ +import { useContext } from 'react' +import { FloatingNode } from '@floating-ui/react' +import { Box, type BoxProps } from '@/components/Box' +import { PopoverContext } from './Root' +import { useVisibility } from '@/hooks/useVisibility' + +export interface PopoverContentProps extends BoxProps {} + +export function Content({ children, css, part, style, ...props }: BoxProps) { + const { floating, floatingNodeId } = useContext(PopoverContext) + + const { isVisible: isAnchorVisible } = useVisibility( + floating?.refs.reference.current as Element | null + ) + + if (floating == null) { + return null + } + + const { floatingStyles, getFloatingProps, placement, refs, status } = floating + + if (refs.reference.current == null || !isAnchorVisible || status?.isMounted === false) { + return null + } + + return ( + + + {children} + + + ) +} diff --git a/packages/react/src/components/Popover/Root.tsx b/packages/react/src/components/Popover/Root.tsx new file mode 100644 index 00000000..0067c65b --- /dev/null +++ b/packages/react/src/components/Popover/Root.tsx @@ -0,0 +1,87 @@ +import { createContext, type Dispatch, type SetStateAction, useState } from 'react' +import { useFloatingNodeId } from '@floating-ui/react' + +import { Spotlight } from '@/components/Spotlight' +import { Overlay } from '@/components/Overlay' + +import { useAutoScroll } from '@/hooks/useAutoScroll' +import { type FloatingProps, type FloatingReturn, useFloating } from '@/hooks/useFloating' + +export interface PopoverContextValue { + floating?: FloatingReturn + floatingNodeId: string | null + isOpen: boolean + setIsOpen: Dispatch> +} + +export const PopoverContext = createContext({ + floatingNodeId: null, + isOpen: false, + setIsOpen: () => {}, +}) + +export interface PopoverRootProps extends FloatingProps { + autoScroll?: ScrollIntoViewOptions | boolean + children?: React.ReactNode + defaultOpen?: boolean + modal?: boolean + spotlight?: boolean +} + +export function Root({ + align = 'center', + alignOffset = 0, + anchor, + autoScroll = false, + children, + defaultOpen = false, + modal = false, + onOpenChange = () => {}, + open, + side = 'bottom', + sideOffset = 0, + spotlight = false, + ...floatingProps +}: PopoverRootProps) { + const [internalOpen, setInternalOpen] = useState(defaultOpen) + + // Defer to controlled open prop, otherwise manage open state internally + const canonicalOpen = open ?? internalOpen + const floatingNodeId = useFloatingNodeId() + + const floating = useFloating({ + align, + alignOffset, + anchor, + nodeId: floatingNodeId, + onOpenChange: (newOpen) => { + onOpenChange(newOpen) + if (open == null) { + setInternalOpen(newOpen) + } + }, + open: canonicalOpen, + side, + sideOffset, + ...floatingProps, + }) + + const { refs } = floating + + useAutoScroll(refs.reference.current as Element, autoScroll) + + return ( + + {spotlight && canonicalOpen && } + {modal && !spotlight && canonicalOpen && } + {children} + + ) +} diff --git a/packages/react/src/components/Popover/Trigger.tsx b/packages/react/src/components/Popover/Trigger.tsx new file mode 100644 index 00000000..bd7e9500 --- /dev/null +++ b/packages/react/src/components/Popover/Trigger.tsx @@ -0,0 +1,24 @@ +import { useContext } from 'react' +import { Box, type BoxProps } from '@/components/Box' +import { PopoverContext } from './Root' + +export interface PopoverTriggerProps extends BoxProps {} + +export function Trigger({ children, part, ...props }: BoxProps) { + const { + floating: { getReferenceProps, refs }, + setIsOpen, + } = useContext(PopoverContext) + + return ( + setIsOpen((prev) => !prev)} + part={['popover-trigger', part]} + {...props} + {...(getReferenceProps?.() ?? {})} + > + {children} + + ) +} diff --git a/packages/react/src/components/Popover/index.tsx b/packages/react/src/components/Popover/index.tsx new file mode 100644 index 00000000..1c7efc85 --- /dev/null +++ b/packages/react/src/components/Popover/index.tsx @@ -0,0 +1,6 @@ +export { Root } from './Root' +export { Content } from './Content' +export { Trigger } from './Trigger' +export type { PopoverRootProps } from './Root' +export type { PopoverContentProps } from './Content' +export type { PopoverTriggerProps } from './Trigger' diff --git a/packages/react/src/components/Progress/Ring.tsx b/packages/react/src/components/Progress/Ring.tsx new file mode 100644 index 00000000..fb88a319 --- /dev/null +++ b/packages/react/src/components/Progress/Ring.tsx @@ -0,0 +1,88 @@ +import { Box } from '@/components/Box' +import { Text } from '@/components/Text' + +import { theme } from '@/shared/theme' + +import type { ProgressProps } from './ProgressProps' + +export function Ring({ + css, + current, + height = '48px', + showLabel = false, + strokeWidth = '8px', + total, + width = '48px', + ...props +}: ProgressProps) { + if (total == 1) { + return null + } + + const progressPercent = total > 0 ? Math.min(Math.round((current / total) * 100) / 100, 1) : 0 + + // TODO: Configurable size + return ( + + + + {showLabel && ( + + {progressPercent * 100} + + )} + + ) +} diff --git a/packages/react/src/components/Progress/index.tsx b/packages/react/src/components/Progress/index.tsx index 57d3722a..1805da16 100644 --- a/packages/react/src/components/Progress/index.tsx +++ b/packages/react/src/components/Progress/index.tsx @@ -1,5 +1,6 @@ export { Bar } from './Bar' export { Dots } from './Dots' export { Fraction } from './Fraction' +export { Ring } from './Ring' export { Segments } from './Segments' export type { ProgressProps } from './ProgressProps' diff --git a/packages/react/src/hooks/useAutoScroll.ts b/packages/react/src/hooks/useAutoScroll.ts new file mode 100644 index 00000000..60bf664c --- /dev/null +++ b/packages/react/src/hooks/useAutoScroll.ts @@ -0,0 +1,38 @@ +import { useEffect, useState } from 'react' + +export function useAutoScroll( + element: Element | null | undefined, + enabled: boolean | ScrollIntoViewOptions = true +) { + const [scrollComplete, setScrollComplete] = useState(false) + + useEffect(() => { + if (!scrollComplete && enabled && element instanceof Element) { + const scrollOptions: ScrollIntoViewOptions = + typeof enabled !== 'boolean' ? enabled : { behavior: 'smooth', block: 'center' } + + /* + * NOTE: "scrollend" event isn't supported widely enough yet :( + * + * We'll listen to a capture-phase "scroll" instead, and when it stops + * bouncing, we can infer that the scroll we initiated is over. + */ + let scrollTimeout: ReturnType + window.addEventListener( + 'scroll', + function scrollHandler() { + clearTimeout(scrollTimeout) + scrollTimeout = setTimeout(() => { + window.removeEventListener('scroll', scrollHandler) + setScrollComplete(true) + }, 100) + }, + true + ) + + element.scrollIntoView(scrollOptions) + } else if (!enabled) { + setScrollComplete(true) + } + }, [enabled, element, scrollComplete]) +} diff --git a/packages/react/src/components/Hint/useFloatingHint.ts b/packages/react/src/hooks/useFloating.ts similarity index 67% rename from packages/react/src/components/Hint/useFloatingHint.ts rename to packages/react/src/hooks/useFloating.ts index ee6621dc..77a49746 100644 --- a/packages/react/src/components/Hint/useFloatingHint.ts +++ b/packages/react/src/hooks/useFloating.ts @@ -8,25 +8,31 @@ import { shift, useClick, useDismiss, - useFloating, + useFloating as useFloatingUI, type UseFloatingOptions, type UseFloatingReturn, + useFocus, useInteractions, type UseInteractionsReturn, useRole, useTransitionStatus, } from '@floating-ui/react' -import type { AlignValue, ExtendedPlacement, HintProps } from '@/components/Hint' - import { useMutationAwareAnchor } from '@/components/Hint/useMutationAwareAnchor' -export interface FloatingHintProps extends HintProps { - onOpenChange?: UseFloatingOptions['onOpenChange'] - open: boolean +export type AlignValue = 'after' | 'before' | 'center' | 'end' | 'start' +export type SideValue = 'bottom' | 'left' | 'right' | 'top' +export type ExtendedPlacement = `${SideValue}-${AlignValue}` + +export interface FloatingProps extends UseFloatingOptions { + align?: AlignValue + alignOffset?: number + anchor?: string + side?: SideValue + sideOffset?: number } -export interface FloatingHintReturn extends Partial> { +export interface FloatingReturn extends Omit { placement: ExtendedPlacement getFloatingProps: UseInteractionsReturn['getFloatingProps'] getReferenceProps: UseInteractionsReturn['getReferenceProps'] @@ -46,31 +52,31 @@ function getOriginalAlign(align: AlignValue) { } } -export function useFloatingHint({ +export function useFloating({ align, alignOffset, anchor, + nodeId, onOpenChange = () => {}, open, side, sideOffset, -}: FloatingHintProps): FloatingHintReturn { +}: FloatingProps): FloatingReturn { const placement = `${side}-${getOriginalAlign(align)}` as Placement + // Handle our added "after" and "before" alignments function offsetMiddleware({ rects }) { const offsets = { alignmentAxis: alignOffset, mainAxis: sideOffset, } - // if align is before or after if (['after', 'before'].includes(align)) { - // if side is bottom or top if (['bottom', 'top'].includes(side)) { - // hOffset + // Offset horizontally offsets.alignmentAxis = alignOffset - rects.floating.width } else { - // vOffset + // Offset vertically offsets.alignmentAxis = alignOffset - rects.floating.height } } @@ -83,24 +89,36 @@ export function useFloatingHint({ floatingStyles, placement: computedPlacement, refs, - } = useFloating({ + ...floatingReturn + } = useFloatingUI({ middleware: [offset(offsetMiddleware, [align, alignOffset, side, sideOffset]), flip(), shift()], + nodeId, onOpenChange, open, placement, whileElementsMounted: autoUpdate, }) - const click = useClick(context) - const dismiss = useDismiss(context, { + const clickHandler = useClick(context) + const dismissHandler = useDismiss(context, { outsidePress: false, }) - const role = useRole(context) + const focusProps = useFocus(context) + const roleProps = useRole(context) const status = useTransitionStatus(context) - // Merge all the interactions into prop getters - const { getFloatingProps, getReferenceProps } = useInteractions([click, dismiss, role]) - + const { getFloatingProps, getReferenceProps } = useInteractions([ + clickHandler, + dismissHandler, + focusProps, + roleProps, + ]) + + /* + * Note: If anchor is passed in as a selector, we'll automatically pass it + * through to refs.setReference If not, we assume that the floating reference + * element is being set manually elsewhere (e.g. Popover.Trigger) + */ const { anchorElement } = useMutationAwareAnchor(anchor) useEffect(() => { @@ -127,5 +145,6 @@ export function useFloatingHint({ placement: finalPlacement.join('-') as ExtendedPlacement, refs, status, + ...floatingReturn, } } diff --git a/packages/react/src/index.ts b/packages/react/src/index.ts index 69e6f3fd..c169bf38 100644 --- a/packages/react/src/index.ts +++ b/packages/react/src/index.ts @@ -27,7 +27,7 @@ export { Label } from './components/Form/fields/Label' export { BaseField } from './components/Form/fields/BaseField' export { Media, Image, Video } from './components/Media' export { type NPSProps } from './components/Survey/NPS' - +export * as Popover from './components/Popover' export * as Progress from './components/Progress' export { ProgressBadge, type ProgressBadgeProps } from './components/ProgressBadge' export { Provider, type ProviderProps } from './components/Provider' @@ -46,6 +46,7 @@ export * as FrigadeJS from '@frigade/js' export { themeVariables, type Theme } from './shared/theme' export { tokens, type Tokens } from './shared/tokens' +export { useAutoScroll } from './hooks/useAutoScroll' export { useBoundingClientRect } from './hooks/useBoundingClientRect' export { useFlow, type FlowConfig } from './hooks/useFlow' export { @@ -63,3 +64,6 @@ export { export { useFrigade } from './hooks/useFrigade' export { useUser } from './hooks/useUser' export { useGroup } from './hooks/useGroup' + +// TEMP: Remove this, used for testing Storybook +export * as FloatingUI from '@floating-ui/react' From 8e6f67b083d62af6a37cfbb9127cf219fc2049af Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Fri, 7 Feb 2025 15:18:01 -0800 Subject: [PATCH 148/213] Changeset --- .changeset/three-seals-dance.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/three-seals-dance.md diff --git a/.changeset/three-seals-dance.md b/.changeset/three-seals-dance.md new file mode 100644 index 00000000..a2e7b024 --- /dev/null +++ b/.changeset/three-seals-dance.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": minor +--- + +Add Checklist.Floating component, Popover and Progress.Ring primitives, and useFloating and useAutoScroll hooks From dcbb9d8805fac31428178211fd0e897dde39dca9 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Fri, 7 Feb 2025 15:34:46 -0800 Subject: [PATCH 149/213] Version Packages (#426) Co-authored-by: github-actions[bot] --- .changeset/three-seals-dance.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/three-seals-dance.md diff --git a/.changeset/three-seals-dance.md b/.changeset/three-seals-dance.md deleted file mode 100644 index a2e7b024..00000000 --- a/.changeset/three-seals-dance.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": minor ---- - -Add Checklist.Floating component, Popover and Progress.Ring primitives, and useFloating and useAutoScroll hooks diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index bf1bbab5..24898dad 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/react +## 2.8.0 + +### Minor Changes + +- 8e6f67b: Add Checklist.Floating component, Popover and Progress.Ring primitives, and useFloating and useAutoScroll hooks + ## 2.7.6 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index ffeb7765..cc09d159 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.7.6", + "version": "2.8.0", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From a0bcf8aaad7c8eaa66075c7cbeed2a5762784541 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Fri, 7 Feb 2025 23:37:08 +0000 Subject: [PATCH 150/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 92e70e7e..a4e005b0 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.7.6'; \ No newline at end of file +export const SDK_VERSION = '2.8.0'; \ No newline at end of file From 38ed44001791dc3012f622d3ee9441d7e3a6582d Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Tue, 11 Feb 2025 11:40:11 -0800 Subject: [PATCH 151/213] Export Ping component --- packages/react/src/index.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/react/src/index.ts b/packages/react/src/index.ts index c169bf38..822c32f7 100644 --- a/packages/react/src/index.ts +++ b/packages/react/src/index.ts @@ -27,6 +27,7 @@ export { Label } from './components/Form/fields/Label' export { BaseField } from './components/Form/fields/BaseField' export { Media, Image, Video } from './components/Media' export { type NPSProps } from './components/Survey/NPS' +export { Ping } from './components/Ping' export * as Popover from './components/Popover' export * as Progress from './components/Progress' export { ProgressBadge, type ProgressBadgeProps } from './components/ProgressBadge' From 16af36cf7d4542913474113dc94e5a773b4dc5bd Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Tue, 11 Feb 2025 14:23:22 -0800 Subject: [PATCH 152/213] Fix missing data-step-id across SDK. Fix missing part props in Checklist.Collapsible --- .../src/components/Announcement/index.tsx | 27 ++++++------ .../react/src/components/Banner/index.tsx | 41 +++++++++++-------- .../src/components/Checklist/CarouselStep.tsx | 1 + .../src/components/Checklist/Collapsible.tsx | 14 ++++--- .../components/Checklist/CollapsibleStep.tsx | 16 ++++---- .../src/components/Checklist/FloatingStep.tsx | 2 - .../react/src/components/Flow/FlowProps.ts | 1 + packages/react/src/components/Flow/index.tsx | 1 + 8 files changed, 56 insertions(+), 47 deletions(-) diff --git a/packages/react/src/components/Announcement/index.tsx b/packages/react/src/components/Announcement/index.tsx index e739aec0..1222aba6 100644 --- a/packages/react/src/components/Announcement/index.tsx +++ b/packages/react/src/components/Announcement/index.tsx @@ -19,24 +19,15 @@ export interface AnnouncementProps extends FlowPropsWithoutChildren, DialogProps defaultOpen?: boolean } -export function Announcement({ flowId, part, ...props }: AnnouncementProps) { +export function Announcement({ flowId, ...props }: AnnouncementProps) { return ( - + {({ flow, handleDismiss, handlePrimary, handleSecondary, - parentProps: { dismissible }, + parentProps: { containerProps, dismissible }, step, }) => { const primaryButtonTitle = step.primaryButton?.title ?? step.primaryButtonTitle @@ -47,7 +38,15 @@ export function Announcement({ flowId, part, ...props }: AnnouncementProps) { const { videoProps } = getVideoProps(step.props ?? {}) return ( - <> + {dismissible && } {step.title} @@ -95,7 +94,7 @@ export function Announcement({ flowId, part, ...props }: AnnouncementProps) { /> )} - + ) }} diff --git a/packages/react/src/components/Banner/index.tsx b/packages/react/src/components/Banner/index.tsx index 3268d45d..25a17f19 100644 --- a/packages/react/src/components/Banner/index.tsx +++ b/packages/react/src/components/Banner/index.tsx @@ -5,30 +5,35 @@ import { Box } from '@/components/Box' export interface BannerProps extends FlowPropsWithoutChildren {} -export function Banner({ flowId, part, ...props }: BannerProps) { +export function Banner({ flowId, ...props }: BannerProps) { return ( - - {({ handleDismiss, handlePrimary, handleSecondary, parentProps: { dismissible }, step }) => { + + {({ + handleDismiss, + handlePrimary, + handleSecondary, + parentProps: { containerProps, dismissible }, + step, + }) => { const primaryButtonTitle = step.primaryButton?.title ?? step.primaryButtonTitle const secondaryButtonTitle = step.secondaryButton?.title ?? step.secondaryButtonTitle const disabled = step.$state.blocked return ( - <> + {step.imageUri && ( {dismissible && } - + ) }} diff --git a/packages/react/src/components/Checklist/CarouselStep.tsx b/packages/react/src/components/Checklist/CarouselStep.tsx index 2ebff38a..04da823d 100644 --- a/packages/react/src/components/Checklist/CarouselStep.tsx +++ b/packages/react/src/components/Checklist/CarouselStep.tsx @@ -42,6 +42,7 @@ export function CarouselStep({ onPrimary, onSecondary, step }: CarouselStepProps flexBasis: '25%', }, }} + data-step-id={step.id} flex="0 0 30%" gap="2" p="4" diff --git a/packages/react/src/components/Checklist/Collapsible.tsx b/packages/react/src/components/Checklist/Collapsible.tsx index d3648ca7..b93f23bd 100644 --- a/packages/react/src/components/Checklist/Collapsible.tsx +++ b/packages/react/src/components/Checklist/Collapsible.tsx @@ -76,7 +76,12 @@ function DefaultCollapsibleStep({ const { videoProps } = getVideoProps(stepProps) return ( - + - + - - + + {currentSteps}/{availableSteps} diff --git a/packages/react/src/components/Checklist/CollapsibleStep.tsx b/packages/react/src/components/Checklist/CollapsibleStep.tsx index 25525fca..4796fab5 100644 --- a/packages/react/src/components/Checklist/CollapsibleStep.tsx +++ b/packages/react/src/components/Checklist/CollapsibleStep.tsx @@ -49,6 +49,7 @@ function CheckIndicator({ checked = false }) { borderStyle="solid" borderColor="neutral.border" borderRadius="100%" + marginRight="2" padding="0" part="field-radio-value" position="relative" @@ -100,7 +101,7 @@ export function Content({ children }) { It creates a flex gap at the top of this column, which animates smoothly. Other forms of whitespace like margin or padding? Not so smooth! */} - + {children} @@ -139,7 +140,7 @@ export function Trigger({ isCompleted, isBlocked, title }) { - - - - {title} - - + + + {title} + >() const { handlePrimary, handleSecondary } = useStepHandlers(step, { onPrimary, onSecondary }) @@ -34,7 +33,6 @@ export function FloatingStep({ onPrimary, onSecondary, openStepId, setOpenStepId } } - // TODO: Handle tap while open on mobile to close step function handlePointerEnter() { clearTimeout(anchorPointerEnterTimeout.current) diff --git a/packages/react/src/components/Flow/FlowProps.ts b/packages/react/src/components/Flow/FlowProps.ts index e7d39059..2365e734 100644 --- a/packages/react/src/components/Flow/FlowProps.ts +++ b/packages/react/src/components/Flow/FlowProps.ts @@ -81,6 +81,7 @@ export interface FlowProps extends FlowPropsWithoutChildren { } type ParentProps = { + as: FlowPropsWithoutChildren['as'] containerProps: Record dismissible: boolean flowId: string diff --git a/packages/react/src/components/Flow/index.tsx b/packages/react/src/components/Flow/index.tsx index 846ca815..e8f589bc 100644 --- a/packages/react/src/components/Flow/index.tsx +++ b/packages/react/src/components/Flow/index.tsx @@ -146,6 +146,7 @@ export function Flow({ handlePrimary, handleSecondary, parentProps: { + as, dismissible, flowId, variables, From 187f0c8c1633463cf3dd2b46684f4f0735dc2eed Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Tue, 11 Feb 2025 14:40:11 -0800 Subject: [PATCH 153/213] Changeset --- .changeset/spotty-bees-arrive.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/spotty-bees-arrive.md diff --git a/.changeset/spotty-bees-arrive.md b/.changeset/spotty-bees-arrive.md new file mode 100644 index 00000000..2dfbea38 --- /dev/null +++ b/.changeset/spotty-bees-arrive.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": patch +--- + +Misc fixes for data-step-id and part props From 8c71b1bb5461969113be891e600102ab14a665c1 Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Tue, 11 Feb 2025 14:54:47 -0800 Subject: [PATCH 154/213] Remove console.log --- packages/react/src/components/Hint/index.tsx | 2 -- 1 file changed, 2 deletions(-) diff --git a/packages/react/src/components/Hint/index.tsx b/packages/react/src/components/Hint/index.tsx index 4f9c557a..b3ae1491 100644 --- a/packages/react/src/components/Hint/index.tsx +++ b/packages/react/src/components/Hint/index.tsx @@ -84,11 +84,9 @@ export function Hint({ const shouldMount = refs.reference.current !== null && isVisible if (!shouldMount) { - console.log('HINT: !shouldMount') isMounted.current = false return null } else if (isMounted.current === false) { - console.log('HINT: shouldMount') isMounted.current = true onMount?.() } From ff1e2e5ee88550ec76c0f674e7e3cd57134c4437 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Tue, 11 Feb 2025 15:14:41 -0800 Subject: [PATCH 155/213] Version Packages (#427) Co-authored-by: github-actions[bot] --- .changeset/spotty-bees-arrive.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/spotty-bees-arrive.md diff --git a/.changeset/spotty-bees-arrive.md b/.changeset/spotty-bees-arrive.md deleted file mode 100644 index 2dfbea38..00000000 --- a/.changeset/spotty-bees-arrive.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": patch ---- - -Misc fixes for data-step-id and part props diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 24898dad..7145d972 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/react +## 2.8.1 + +### Patch Changes + +- 187f0c8: Misc fixes for data-step-id and part props + ## 2.8.0 ### Minor Changes diff --git a/packages/react/package.json b/packages/react/package.json index cc09d159..fe6f348e 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.8.0", + "version": "2.8.1", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From a4c993ed922f61dd56f03645e26370e33ca77527 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Tue, 11 Feb 2025 23:17:01 +0000 Subject: [PATCH 156/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index a4e005b0..4d8657a3 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.8.0'; \ No newline at end of file +export const SDK_VERSION = '2.8.1'; \ No newline at end of file From 517372be66f7d9e25dfde430644dd063d269a24e Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Thu, 13 Feb 2025 18:20:35 -0800 Subject: [PATCH 157/213] Add themeSelector prop to Provider --- apps/smithy/.storybook/preview.tsx | 3 +++ packages/react/src/components/Provider/Provider.tsx | 8 +++++++- 2 files changed, 10 insertions(+), 1 deletion(-) diff --git a/apps/smithy/.storybook/preview.tsx b/apps/smithy/.storybook/preview.tsx index 2180aa9d..f839e164 100644 --- a/apps/smithy/.storybook/preview.tsx +++ b/apps/smithy/.storybook/preview.tsx @@ -52,6 +52,9 @@ const preview = { // }, // }, // }} + + // themeSelector="#storybook-root" + userProperties={{ firstName: "Jonathan", lastName: "Livingston", diff --git a/packages/react/src/components/Provider/Provider.tsx b/packages/react/src/components/Provider/Provider.tsx index d85ea6f7..64bce88a 100644 --- a/packages/react/src/components/Provider/Provider.tsx +++ b/packages/react/src/components/Provider/Provider.tsx @@ -89,6 +89,11 @@ export interface ProviderProps { */ theme?: Theme + /** + * CSS selector to scope Frigade CSS variables into. Defaults to `:root`. + */ + themeSelector?: string + /** * The user ID of the user who is interacting with Frigade. If not provided, Frigade will generate a random guest ID and persist it in local storage. */ @@ -137,6 +142,7 @@ export function Provider({ defaultCollection = true, navigate, theme, + themeSelector = ':root', ...props }: ProviderProps) { const themeOverrides = theme ? createThemeVariables(theme) : {} @@ -253,7 +259,7 @@ export function Provider({ variables: props.variables || {}, }} > - + {defaultCollection && } {children} From 6ac68159e541899664f32f3e54bec7ee609a6345 Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Thu, 13 Feb 2025 18:21:29 -0800 Subject: [PATCH 158/213] Changeset --- .changeset/rare-files-judge.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/rare-files-judge.md diff --git a/.changeset/rare-files-judge.md b/.changeset/rare-files-judge.md new file mode 100644 index 00000000..c8164206 --- /dev/null +++ b/.changeset/rare-files-judge.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": patch +--- + +Add themeSelector prop to Provider From d1629f39817994c9069c5e5207ae32559c7fc865 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Fri, 14 Feb 2025 09:54:56 -0800 Subject: [PATCH 159/213] Version Packages (#428) Co-authored-by: github-actions[bot] --- .changeset/rare-files-judge.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/rare-files-judge.md diff --git a/.changeset/rare-files-judge.md b/.changeset/rare-files-judge.md deleted file mode 100644 index c8164206..00000000 --- a/.changeset/rare-files-judge.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": patch ---- - -Add themeSelector prop to Provider diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 7145d972..ee9257f2 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/react +## 2.8.2 + +### Patch Changes + +- 6ac6815: Add themeSelector prop to Provider + ## 2.8.1 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index fe6f348e..c879fa97 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.8.1", + "version": "2.8.2", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From 51f0e5330be739b8b8a0f40cbba1aa71af6ed5c0 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Fri, 14 Feb 2025 17:57:38 +0000 Subject: [PATCH 160/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 4d8657a3..140079c4 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.8.1'; \ No newline at end of file +export const SDK_VERSION = '2.8.2'; \ No newline at end of file From 3c89a6753a4c9556a33b78d25b76b4a9a6bb9678 Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Thu, 20 Feb 2025 15:53:39 -0800 Subject: [PATCH 161/213] Fix dependencies for Flow onComplete --- packages/react/src/hooks/useFlowHandlers.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/hooks/useFlowHandlers.ts b/packages/react/src/hooks/useFlowHandlers.ts index bde0bbe2..458a0da3 100644 --- a/packages/react/src/hooks/useFlowHandlers.ts +++ b/packages/react/src/hooks/useFlowHandlers.ts @@ -42,7 +42,7 @@ export function useFlowHandlers(flow: Flow, { onComplete, onDismiss }: FlowHandl return () => { callHandler() } - }, [flow, onComplete]) + }, [flow, flow?.isCompleted, onComplete]) return { handleDismiss: useCallback( From 4063bb56df2a1d9cc28cf899dc26ad53a6b1aa1a Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Thu, 20 Feb 2025 15:54:10 -0800 Subject: [PATCH 162/213] Changeset --- .changeset/quick-pens-design.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/quick-pens-design.md diff --git a/.changeset/quick-pens-design.md b/.changeset/quick-pens-design.md new file mode 100644 index 00000000..b549d8d9 --- /dev/null +++ b/.changeset/quick-pens-design.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": patch +--- + +Fix dependencies for Flow onComplete From f07137639c50256175e7792b66541d2d70928d97 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Thu, 20 Feb 2025 16:07:25 -0800 Subject: [PATCH 163/213] Version Packages (#429) Co-authored-by: github-actions[bot] --- .changeset/quick-pens-design.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/quick-pens-design.md diff --git a/.changeset/quick-pens-design.md b/.changeset/quick-pens-design.md deleted file mode 100644 index b549d8d9..00000000 --- a/.changeset/quick-pens-design.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": patch ---- - -Fix dependencies for Flow onComplete diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index ee9257f2..34c12221 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/react +## 2.8.3 + +### Patch Changes + +- 4063bb5: Fix dependencies for Flow onComplete + ## 2.8.2 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index c879fa97..5cd4ded6 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.8.2", + "version": "2.8.3", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From ae2b6ecaf4213bd81160f8d9b65e03b765078e36 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Fri, 21 Feb 2025 00:09:47 +0000 Subject: [PATCH 164/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 140079c4..29dd0056 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.8.2'; \ No newline at end of file +export const SDK_VERSION = '2.8.3'; \ No newline at end of file From 32e838432337bccb1553af74d0d4b1374e3d8348 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Mon, 24 Feb 2025 17:27:11 -0800 Subject: [PATCH 165/213] feat: debounce url change calls (#431) * feat: debounce url change calls * changset --- .changeset/old-years-ring.md | 6 +++ packages/js-api/src/core/frigade.ts | 62 ++++++++++++++++--------- packages/js-api/src/core/types.ts | 5 ++ packages/js-api/src/shared/fetchable.ts | 21 +++------ packages/js-api/src/shared/utils.ts | 13 +----- 5 files changed, 61 insertions(+), 46 deletions(-) create mode 100644 .changeset/old-years-ring.md diff --git a/.changeset/old-years-ring.md b/.changeset/old-years-ring.md new file mode 100644 index 00000000..8aef2063 --- /dev/null +++ b/.changeset/old-years-ring.md @@ -0,0 +1,6 @@ +--- +"@frigade/js": minor +"@frigade/react": minor +--- + +Performance improvement that updates the behavior of `syncOnWindowUpdates` to debounce identical calls more aggressively diff --git a/packages/js-api/src/core/frigade.ts b/packages/js-api/src/core/frigade.ts index c6661eae..809d1582 100644 --- a/packages/js-api/src/core/frigade.ts +++ b/packages/js-api/src/core/frigade.ts @@ -49,14 +49,41 @@ export class Frigade extends Fetchable { * @ignore */ private eventHandlers: Map = new Map() + /** + * @ignore + */ + private refreshTimeout: ReturnType | null = null + /** + * @ignore + */ + private queuedRefresh: boolean = false /** * @ignore */ - private visibilityChangeHandler = async () => { + private visibilityChangeHandler = () => { if (document.visibilityState === 'visible') { - await this.refreshStateFromAPI() + this.queueRefreshStateFromAPI() + } + } + + /** + * @ignore + */ + private queueRefreshStateFromAPI() { + this.queuedRefresh = true + if (this.refreshTimeout) { + return } + + this.refreshTimeout = setTimeout(async () => { + if (this.queuedRefresh) { + this.getGlobalState().currentUrl = window.location.href + await this.refreshStateFromAPI() + this.queuedRefresh = false + } + this.refreshTimeout = null + }, this.getGlobalState().config.__refreshIntervalInMS) } constructor(apiKey: string, config?: FrigadeConfig) { @@ -83,9 +110,7 @@ export class Frigade extends Fetchable { ) { return } - - this.getGlobalState().currentUrl = event.destination.url - this.refreshStateFromAPI(true) + this.queueRefreshStateFromAPI() } catch (e) {} }) } @@ -463,7 +488,7 @@ export class Frigade extends Fetchable { /** * @ignore */ - private async refreshStateFromAPI(cancelPendingRequests: boolean = false): Promise { + private async refreshStateFromAPI(): Promise { const globalStateKey = getGlobalStateKey(this.config) if (!frigadeGlobalState[globalStateKey]) { @@ -508,8 +533,7 @@ export class Frigade extends Fetchable { } frigadeGlobalState[globalStateKey].refreshStateFromAPI = async ( - overrideFlowStateRaw?: FlowStates, - cancelPendingRequests?: boolean + overrideFlowStateRaw?: FlowStates ) => { if (this.config.__readOnly) { return @@ -517,18 +541,14 @@ export class Frigade extends Fetchable { const flowStateRaw: FlowStates = overrideFlowStateRaw ? overrideFlowStateRaw - : await this.fetch( - '/v1/public/flowStates', - { - method: 'POST', - body: JSON.stringify({ - userId: this.getGlobalState().config.userId, - groupId: this.getGlobalState().config.groupId, - context: getContext(this.getGlobalState()), - } as FlowStateDTO), - }, - cancelPendingRequests - ) + : await this.fetch('/v1/public/flowStates', { + method: 'POST', + body: JSON.stringify({ + userId: this.getGlobalState().config.userId, + groupId: this.getGlobalState().config.groupId, + context: getContext(this.getGlobalState()), + } as FlowStateDTO), + }) const collectionsData: CollectionsList = new Map() @@ -586,7 +606,7 @@ export class Frigade extends Fetchable { } } - await frigadeGlobalState[globalStateKey].refreshStateFromAPI(undefined, cancelPendingRequests) + await frigadeGlobalState[globalStateKey].refreshStateFromAPI(undefined) } /** diff --git a/packages/js-api/src/core/types.ts b/packages/js-api/src/core/types.ts index dc65e661..146d0026 100644 --- a/packages/js-api/src/core/types.ts +++ b/packages/js-api/src/core/types.ts @@ -337,6 +337,11 @@ export interface FrigadeConfig { * @ignore Internal use only. */ __platformName?: string + + /** + * @ignore Internal use only. + */ + __refreshIntervalInMS: number } export interface StatefulStep { diff --git a/packages/js-api/src/shared/fetchable.ts b/packages/js-api/src/shared/fetchable.ts index 54d191c6..924fe12b 100644 --- a/packages/js-api/src/shared/fetchable.ts +++ b/packages/js-api/src/shared/fetchable.ts @@ -9,6 +9,7 @@ export class Fetchable { userId: generateGuestId(), __instanceId: Math.random().toString(12).substring(4), generateGuestId: true, + __refreshIntervalInMS: 100, } constructor(config: FrigadeConfig) { @@ -22,24 +23,16 @@ export class Fetchable { /** * @ignore */ - public async fetch( - path: string, - options?: Record, - cancelPendingRequests: boolean = false - ) { + public async fetch(path: string, options?: Record) { if (this.config.__readOnly) { return getEmptyResponse() } - return gracefulFetch( - this.getAPIUrl(path), - { - keepalive: true, - ...(options ?? {}), - ...getHeaders(this.config), - }, - cancelPendingRequests - ) + return gracefulFetch(this.getAPIUrl(path), { + keepalive: true, + ...(options ?? {}), + ...getHeaders(this.config), + }) } private getAPIUrl(path: string) { diff --git a/packages/js-api/src/shared/utils.ts b/packages/js-api/src/shared/utils.ts index 96756140..f2d90b98 100644 --- a/packages/js-api/src/shared/utils.ts +++ b/packages/js-api/src/shared/utils.ts @@ -120,11 +120,7 @@ class CallQueue { globalThis.callQueue = new CallQueue() -export async function gracefulFetch( - url: string, - options: any, - cancelPendingRequests: boolean = false -) { +export async function gracefulFetch(url: string, options: any) { if (typeof globalThis.fetch !== 'function') { return getEmptyResponse( "- Attempted to call fetch() in an environment that doesn't support it." @@ -136,7 +132,7 @@ export async function gracefulFetch( const isWebPostRequest = isWeb() && options && options.body && options.method === 'POST' - if (isWebPostRequest && !cancelPendingRequests) { + if (isWebPostRequest) { const cachedCall = globalThis.callQueue.hasIdenticalRecentCall(lastCallDataKey) if (cachedCall != null && cachedCall.response != null) { @@ -148,11 +144,6 @@ export async function gracefulFetch( if (!response) { try { - // TEMP: Disable pending request flushing - // if (cancelPendingRequests) { - // globalThis.callQueue.cancelAllPendingRequests() - // } - const pendingResponse = fetch(url, options) if (isWebPostRequest) { From b0a606735dfdea0c672040f5d4a9e0361f7af688 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Mon, 24 Feb 2025 17:43:16 -0800 Subject: [PATCH 166/213] Version Packages (#432) Co-authored-by: github-actions[bot] --- .changeset/old-years-ring.md | 6 ------ packages/js-api/CHANGELOG.md | 6 ++++++ packages/js-api/package.json | 2 +- packages/react/CHANGELOG.md | 11 +++++++++++ packages/react/package.json | 4 ++-- 5 files changed, 20 insertions(+), 9 deletions(-) delete mode 100644 .changeset/old-years-ring.md diff --git a/.changeset/old-years-ring.md b/.changeset/old-years-ring.md deleted file mode 100644 index 8aef2063..00000000 --- a/.changeset/old-years-ring.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -"@frigade/js": minor -"@frigade/react": minor ---- - -Performance improvement that updates the behavior of `syncOnWindowUpdates` to debounce identical calls more aggressively diff --git a/packages/js-api/CHANGELOG.md b/packages/js-api/CHANGELOG.md index c2aece02..f175c02b 100644 --- a/packages/js-api/CHANGELOG.md +++ b/packages/js-api/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/js +## 0.9.0 + +### Minor Changes + +- 32e8384: Performance improvement that updates the behavior of `syncOnWindowUpdates` to debounce identical calls more aggressively + ## 0.8.1 ### Patch Changes diff --git a/packages/js-api/package.json b/packages/js-api/package.json index f00488e2..28ba43ac 100644 --- a/packages/js-api/package.json +++ b/packages/js-api/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/js", - "version": "0.8.1", + "version": "0.9.0", "description": "The official Javascript SDK for Frigade.", "type": "module", "main": "./dist/index.js", diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 34c12221..4ccd4708 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,16 @@ # @frigade/react +## 2.9.0 + +### Minor Changes + +- 32e8384: Performance improvement that updates the behavior of `syncOnWindowUpdates` to debounce identical calls more aggressively + +### Patch Changes + +- Updated dependencies [32e8384] + - @frigade/js@0.9.0 + ## 2.8.3 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 5cd4ded6..6614906c 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.8.3", + "version": "2.9.0", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", @@ -51,7 +51,7 @@ "dependencies": { "@emotion/react": "^11.14.0", "@floating-ui/react": "^0.26.22", - "@frigade/js": "^0.8.1", + "@frigade/js": "^0.9.0", "@radix-ui/react-checkbox": "^1.1.1", "@radix-ui/react-collapsible": "^1.0.3", "@radix-ui/react-dialog": "^1.0.5", From 9e95ed5d909e0ab5529adf487c7d21b6589d5771 Mon Sep 17 00:00:00 2001 From: christianmat Date: Mon, 24 Feb 2025 17:43:35 -0800 Subject: [PATCH 167/213] fix: yarn install --- yarn.lock | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/yarn.lock b/yarn.lock index e0cb5a08..10f3f9fc 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3742,7 +3742,7 @@ __metadata: languageName: node linkType: hard -"@frigade/js@npm:^0.8.1, @frigade/js@workspace:packages/js-api": +"@frigade/js@npm:^0.9.0, @frigade/js@workspace:packages/js-api": version: 0.0.0-use.local resolution: "@frigade/js@workspace:packages/js-api" dependencies: @@ -3776,7 +3776,7 @@ __metadata: dependencies: "@emotion/react": "npm:^11.14.0" "@floating-ui/react": "npm:^0.26.22" - "@frigade/js": "npm:^0.8.1" + "@frigade/js": "npm:^0.9.0" "@radix-ui/react-checkbox": "npm:^1.1.1" "@radix-ui/react-collapsible": "npm:^1.0.3" "@radix-ui/react-dialog": "npm:^1.0.5" From d05a8b4b53768389ea67779fa1b671486628eb3a Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Tue, 25 Feb 2025 01:45:45 +0000 Subject: [PATCH 168/213] chore: run prepublish script --- packages/js-api/src/version.ts | 2 +- packages/react/src/version.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/js-api/src/version.ts b/packages/js-api/src/version.ts index 73591c89..75a02e78 100644 --- a/packages/js-api/src/version.ts +++ b/packages/js-api/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '0.8.1'; \ No newline at end of file +export const SDK_VERSION = '0.9.0'; \ No newline at end of file diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 29dd0056..96e48a56 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.8.3'; \ No newline at end of file +export const SDK_VERSION = '2.9.0'; \ No newline at end of file From 2113e9d0c7c928b9970bf13857532c71c2586bed Mon Sep 17 00:00:00 2001 From: christianmat Date: Wed, 26 Feb 2025 11:19:36 -0800 Subject: [PATCH 169/213] fix: typescript requirement on __refreshIntervalInMS --- .changeset/rich-emus-visit.md | 6 ++++++ packages/js-api/src/core/frigade.ts | 3 ++- packages/js-api/src/core/types.ts | 4 +++- packages/js-api/src/shared/fetchable.ts | 4 ++-- 4 files changed, 13 insertions(+), 4 deletions(-) create mode 100644 .changeset/rich-emus-visit.md diff --git a/.changeset/rich-emus-visit.md b/.changeset/rich-emus-visit.md new file mode 100644 index 00000000..78589b10 --- /dev/null +++ b/.changeset/rich-emus-visit.md @@ -0,0 +1,6 @@ +--- +"@frigade/js": patch +"@frigade/react": patch +--- + +Fixes a typescript issue with a required field for `__refreshIntervalInMS` diff --git a/packages/js-api/src/core/frigade.ts b/packages/js-api/src/core/frigade.ts index 809d1582..d5d81c78 100644 --- a/packages/js-api/src/core/frigade.ts +++ b/packages/js-api/src/core/frigade.ts @@ -1,4 +1,5 @@ import { + DEFAULT_REFRESH_INTERVAL_IN_MS, FlowChangeEvent, FlowChangeEventHandler, FlowStateDTO, @@ -83,7 +84,7 @@ export class Frigade extends Fetchable { this.queuedRefresh = false } this.refreshTimeout = null - }, this.getGlobalState().config.__refreshIntervalInMS) + }, this.getGlobalState().config.__refreshIntervalInMS ?? DEFAULT_REFRESH_INTERVAL_IN_MS) } constructor(apiKey: string, config?: FrigadeConfig) { diff --git a/packages/js-api/src/core/types.ts b/packages/js-api/src/core/types.ts index 146d0026..96fb48cc 100644 --- a/packages/js-api/src/core/types.ts +++ b/packages/js-api/src/core/types.ts @@ -1,5 +1,7 @@ import type { Flow } from './flow' +export const DEFAULT_REFRESH_INTERVAL_IN_MS = 100 + export enum TriggerType { MANUAL = 'MANUAL', AUTOMATIC = 'AUTOMATIC', @@ -341,7 +343,7 @@ export interface FrigadeConfig { /** * @ignore Internal use only. */ - __refreshIntervalInMS: number + __refreshIntervalInMS?: number } export interface StatefulStep { diff --git a/packages/js-api/src/shared/fetchable.ts b/packages/js-api/src/shared/fetchable.ts index 924fe12b..8d79f2ba 100644 --- a/packages/js-api/src/shared/fetchable.ts +++ b/packages/js-api/src/shared/fetchable.ts @@ -1,5 +1,5 @@ import { generateGuestId, getEmptyResponse, getHeaders, gracefulFetch } from './utils' -import { FrigadeConfig } from '../core/types' +import { DEFAULT_REFRESH_INTERVAL_IN_MS, FrigadeConfig } from '../core/types' import { frigadeGlobalState, FrigadeGlobalState, getGlobalStateKey } from './state' export class Fetchable { @@ -9,7 +9,7 @@ export class Fetchable { userId: generateGuestId(), __instanceId: Math.random().toString(12).substring(4), generateGuestId: true, - __refreshIntervalInMS: 100, + __refreshIntervalInMS: DEFAULT_REFRESH_INTERVAL_IN_MS, } constructor(config: FrigadeConfig) { From 496bee303282fa9630ee74f5a4f63dd735525396 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Wed, 26 Feb 2025 11:31:24 -0800 Subject: [PATCH 170/213] Version Packages (#433) Co-authored-by: github-actions[bot] --- .changeset/rich-emus-visit.md | 6 ------ packages/js-api/CHANGELOG.md | 6 ++++++ packages/js-api/package.json | 2 +- packages/react/CHANGELOG.md | 8 ++++++++ packages/react/package.json | 4 ++-- 5 files changed, 17 insertions(+), 9 deletions(-) delete mode 100644 .changeset/rich-emus-visit.md diff --git a/.changeset/rich-emus-visit.md b/.changeset/rich-emus-visit.md deleted file mode 100644 index 78589b10..00000000 --- a/.changeset/rich-emus-visit.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -"@frigade/js": patch -"@frigade/react": patch ---- - -Fixes a typescript issue with a required field for `__refreshIntervalInMS` diff --git a/packages/js-api/CHANGELOG.md b/packages/js-api/CHANGELOG.md index f175c02b..29667a6f 100644 --- a/packages/js-api/CHANGELOG.md +++ b/packages/js-api/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/js +## 0.9.1 + +### Patch Changes + +- 2113e9d: Fixes a typescript issue with a required field for `__refreshIntervalInMS` + ## 0.9.0 ### Minor Changes diff --git a/packages/js-api/package.json b/packages/js-api/package.json index 28ba43ac..f5be8270 100644 --- a/packages/js-api/package.json +++ b/packages/js-api/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/js", - "version": "0.9.0", + "version": "0.9.1", "description": "The official Javascript SDK for Frigade.", "type": "module", "main": "./dist/index.js", diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 4ccd4708..e4791f00 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,13 @@ # @frigade/react +## 2.9.1 + +### Patch Changes + +- 2113e9d: Fixes a typescript issue with a required field for `__refreshIntervalInMS` +- Updated dependencies [2113e9d] + - @frigade/js@0.9.1 + ## 2.9.0 ### Minor Changes diff --git a/packages/react/package.json b/packages/react/package.json index 6614906c..069f9d85 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.9.0", + "version": "2.9.1", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", @@ -51,7 +51,7 @@ "dependencies": { "@emotion/react": "^11.14.0", "@floating-ui/react": "^0.26.22", - "@frigade/js": "^0.9.0", + "@frigade/js": "^0.9.1", "@radix-ui/react-checkbox": "^1.1.1", "@radix-ui/react-collapsible": "^1.0.3", "@radix-ui/react-dialog": "^1.0.5", From ae79817596df04c0761046dae861d7c4bed5a362 Mon Sep 17 00:00:00 2001 From: christianmat Date: Wed, 26 Feb 2025 11:32:48 -0800 Subject: [PATCH 171/213] fix: yarn install --- yarn.lock | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/yarn.lock b/yarn.lock index 10f3f9fc..3b2cb5ae 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3742,7 +3742,7 @@ __metadata: languageName: node linkType: hard -"@frigade/js@npm:^0.9.0, @frigade/js@workspace:packages/js-api": +"@frigade/js@npm:^0.9.1, @frigade/js@workspace:packages/js-api": version: 0.0.0-use.local resolution: "@frigade/js@workspace:packages/js-api" dependencies: @@ -3776,7 +3776,7 @@ __metadata: dependencies: "@emotion/react": "npm:^11.14.0" "@floating-ui/react": "npm:^0.26.22" - "@frigade/js": "npm:^0.9.0" + "@frigade/js": "npm:^0.9.1" "@radix-ui/react-checkbox": "npm:^1.1.1" "@radix-ui/react-collapsible": "npm:^1.0.3" "@radix-ui/react-dialog": "npm:^1.0.5" From b317c9a610f672a794181b3c2775674b976b7217 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Wed, 26 Feb 2025 19:35:30 +0000 Subject: [PATCH 172/213] chore: run prepublish script --- packages/js-api/src/version.ts | 2 +- packages/react/src/version.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/js-api/src/version.ts b/packages/js-api/src/version.ts index 75a02e78..06af1310 100644 --- a/packages/js-api/src/version.ts +++ b/packages/js-api/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '0.9.0'; \ No newline at end of file +export const SDK_VERSION = '0.9.1'; \ No newline at end of file diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 96e48a56..f6b54cf8 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.9.0'; \ No newline at end of file +export const SDK_VERSION = '2.9.1'; \ No newline at end of file From 2429631c663f3877febd0f9494b0b925bf1d12db Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Wed, 26 Feb 2025 17:14:10 -0800 Subject: [PATCH 173/213] chore(deps): bump store2 from 2.14.3 to 2.14.4 (#422) Bumps [store2](https://github.com/nbubna/store) from 2.14.3 to 2.14.4. - [Commits](https://github.com/nbubna/store/compare/2.14.3...2.14.4) --- updated-dependencies: - dependency-name: store2 dependency-type: indirect ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- yarn.lock | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/yarn.lock b/yarn.lock index 3b2cb5ae..056c194c 100644 --- a/yarn.lock +++ b/yarn.lock @@ -18729,9 +18729,9 @@ __metadata: linkType: hard "store2@npm:^2.14.2": - version: 2.14.3 - resolution: "store2@npm:2.14.3" - checksum: 10/f95f6fbacff14cc3bb9e5e16ced2f29e2d706e30b248c16cf19abed8b2bb31d8f3907c8ccf1a5284d806fdcaf06e96710e4f4f52195e51522a452536beaf7af9 + version: 2.14.4 + resolution: "store2@npm:2.14.4" + checksum: 10/c92713e75544693b47053531b6e98d7b538512061017e06b8c7e99937da67866856227862f7bf1a818ecc36673b8d343c7b67c9cce03bd4ba0f68eff7cccaa8c languageName: node linkType: hard From 89341056fd110ec6b1506d14d7da76b44c2a16ba Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Wed, 26 Feb 2025 17:14:48 -0800 Subject: [PATCH 174/213] chore(deps): bump dompurify from 3.1.6 to 3.2.4 (#430) Bumps [dompurify](https://github.com/cure53/DOMPurify) from 3.1.6 to 3.2.4. - [Release notes](https://github.com/cure53/DOMPurify/releases) - [Commits](https://github.com/cure53/DOMPurify/compare/3.1.6...3.2.4) --- updated-dependencies: - dependency-name: dompurify dependency-type: direct:production ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- packages/react/package.json | 2 +- packages/reactv1/package.json | 2 +- yarn.lock | 19 ++++++++++++------- 3 files changed, 14 insertions(+), 9 deletions(-) diff --git a/packages/react/package.json b/packages/react/package.json index 069f9d85..fe9e2e94 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -59,7 +59,7 @@ "@radix-ui/react-radio-group": "^1.1.3", "@radix-ui/react-select": "^2.0.0", "clsx": "^2.0.0", - "dompurify": "^3.1.3", + "dompurify": "^3.2.4", "embla-carousel-react": "^8.1.3", "jsdom": "^23.0.1", "known-css-properties": "^0.29.0", diff --git a/packages/reactv1/package.json b/packages/reactv1/package.json index bd55408e..56d80216 100644 --- a/packages/reactv1/package.json +++ b/packages/reactv1/package.json @@ -89,7 +89,7 @@ "homepage": "https://github.com/FrigadeHQ/javascript/tree/main/packages/react#readme", "dependencies": { "core-js-pure": "^3.32.0", - "dompurify": "^3.1.3", + "dompurify": "^3.2.4", "react-portal": "^4.2.2", "styled-components": "5.3.6", "styled-system": "^5.1.5", diff --git a/yarn.lock b/yarn.lock index 056c194c..a046ba7a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3792,7 +3792,7 @@ __metadata: "@typescript-eslint/eslint-plugin": "npm:^6.20.0" "@typescript-eslint/parser": "npm:^6.20.0" clsx: "npm:^2.0.0" - dompurify: "npm:^3.1.3" + dompurify: "npm:^3.2.4" embla-carousel-react: "npm:^8.1.3" eslint: "npm:^8.56.0" eslint-config-prettier: "npm:^9.1.0" @@ -3841,7 +3841,7 @@ __metadata: babel-jest: "npm:^29.4.1" copyfiles: "npm:^2.4.1" core-js-pure: "npm:^3.32.0" - dompurify: "npm:^3.1.3" + dompurify: "npm:^3.2.4" eslint-config-backpacker-react-ts: "npm:^0.3.0" husky: "npm:^8.0.3" jest: "npm:^29.6.2" @@ -7835,7 +7835,7 @@ __metadata: languageName: node linkType: hard -"@types/trusted-types@npm:*": +"@types/trusted-types@npm:*, @types/trusted-types@npm:^2.0.7": version: 2.0.7 resolution: "@types/trusted-types@npm:2.0.7" checksum: 10/8e4202766a65877efcf5d5a41b7dd458480b36195e580a3b1085ad21e948bc417d55d6f8af1fd2a7ad008015d4117d5fdfe432731157da3c68678487174e4ba3 @@ -10883,10 +10883,15 @@ __metadata: languageName: node linkType: hard -"dompurify@npm:^3.1.3": - version: 3.1.6 - resolution: "dompurify@npm:3.1.6" - checksum: 10/036844bc9b717b172ba27f5863b56f950289a05d8eebfb702d6953bbf80bd021e480ce4217bd084567186f2d0ada13358ce5556963492cfe402d774e8667f120 +"dompurify@npm:^3.2.4": + version: 3.2.4 + resolution: "dompurify@npm:3.2.4" + dependencies: + "@types/trusted-types": "npm:^2.0.7" + dependenciesMeta: + "@types/trusted-types": + optional: true + checksum: 10/98570c53385518a2f9b617f796926338856acfdd3369c88b5905bddf96bd7d391bf8a5433127155e0046e6faa2bfb767185fcd571b865dfabe624c099e2537f5 languageName: node linkType: hard From a011af334626bd4edaa45700ec0ff09c01a4c443 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Wed, 26 Feb 2025 17:14:58 -0800 Subject: [PATCH 175/213] chore(deps-dev): bump vite from 4.5.5 to 4.5.6 (#417) Bumps [vite](https://github.com/vitejs/vite/tree/HEAD/packages/vite) from 4.5.5 to 4.5.6. - [Release notes](https://github.com/vitejs/vite/releases) - [Changelog](https://github.com/vitejs/vite/blob/v4.5.6/packages/vite/CHANGELOG.md) - [Commits](https://github.com/vitejs/vite/commits/v4.5.6/packages/vite) --- updated-dependencies: - dependency-name: vite dependency-type: direct:development ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- apps/smithy/package.json | 2 +- yarn.lock | 10 +++++----- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/apps/smithy/package.json b/apps/smithy/package.json index 339d0bf1..e29c9f2a 100644 --- a/apps/smithy/package.json +++ b/apps/smithy/package.json @@ -39,6 +39,6 @@ "prop-types": "^15.8.1", "storybook": "^8.5.3", "typescript": "^4.9.4", - "vite": "^4.5.5" + "vite": "^4.5.6" } } diff --git a/yarn.lock b/yarn.lock index a046ba7a..be318fb2 100644 --- a/yarn.lock +++ b/yarn.lock @@ -18519,7 +18519,7 @@ __metadata: react-dom: "npm:^19.0.0" storybook: "npm:^8.5.3" typescript: "npm:^4.9.4" - vite: "npm:^4.5.5" + vite: "npm:^4.5.6" languageName: unknown linkType: soft @@ -20301,9 +20301,9 @@ __metadata: languageName: node linkType: hard -"vite@npm:^4.5.5": - version: 4.5.5 - resolution: "vite@npm:4.5.5" +"vite@npm:^4.5.6": + version: 4.5.9 + resolution: "vite@npm:4.5.9" dependencies: esbuild: "npm:^0.18.10" fsevents: "npm:~2.3.2" @@ -20337,7 +20337,7 @@ __metadata: optional: true bin: vite: bin/vite.js - checksum: 10/2e8b39e004f2b2e72506b816700b3aafaf3f85bdcb9dd9392075bb234ce7333f859a0d2078a85ce5d0039f0f659ca564a7366af587848e5166f14b136cb0ad37 + checksum: 10/9b1984c89f5d6e57e26b767ba6bb8791a9a9b1329f72cd2c4f6079bb4ad74fb4e0b43ae13cbb31812a00c706dfa70d894bfc7dd6b5b3db82e18b7997f23e5072 languageName: node linkType: hard From 06a4da045dbd9976a55db52626792695fc2e7ad1 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Thu, 27 Feb 2025 10:55:56 -0800 Subject: [PATCH 176/213] fix: remove optimistic writes from collections (#434) --- .../src/stories/Collection/Collection.stories.tsx | 2 +- packages/js-api/src/core/collections.ts | 6 +++--- packages/js-api/src/core/flow.ts | 6 ++++++ packages/react/src/hooks/useCollections.ts | 10 ++-------- 4 files changed, 12 insertions(+), 12 deletions(-) diff --git a/apps/smithy/src/stories/Collection/Collection.stories.tsx b/apps/smithy/src/stories/Collection/Collection.stories.tsx index 45ef5ff4..11d1248e 100644 --- a/apps/smithy/src/stories/Collection/Collection.stories.tsx +++ b/apps/smithy/src/stories/Collection/Collection.stories.tsx @@ -176,7 +176,7 @@ export const MultipleAnnouncements = { {/* Storybook X & Y Announcements */} - + {/* */} ), ], diff --git a/packages/js-api/src/core/collections.ts b/packages/js-api/src/core/collections.ts index 55ee5868..cd77e0e7 100644 --- a/packages/js-api/src/core/collections.ts +++ b/packages/js-api/src/core/collections.ts @@ -90,15 +90,15 @@ export class Collections { for (const [collectionId, collection] of previousCollections) { const newCollection = newCollections.get(collectionId) - if (collection.flows.length !== newCollection.flows.length) { + if (collection?.flows?.length !== newCollection?.flows?.length) { this.hasChanges = true break } for (let i = 0; i < collection.flows.length; i++) { if ( - collection.flows[i].flowId !== newCollection.flows[i].flowId || - collection.flows[i].visible !== newCollection.flows[i].visible + collection?.flows[i]?.flowId !== newCollection?.flows[i]?.flowId || + collection?.flows[i]?.visible !== newCollection?.flows[i]?.visible ) { this.hasChanges = true break diff --git a/packages/js-api/src/core/flow.ts b/packages/js-api/src/core/flow.ts index acddf883..66df41a2 100644 --- a/packages/js-api/src/core/flow.ts +++ b/packages/js-api/src/core/flow.ts @@ -621,6 +621,8 @@ export class Flow extends Fetchable { copy.$state.started = true copy.$state.visible = false this.getGlobalState().flowStates[this.id] = copy + // Temporarily disable collections until server round trip has finished + this.getGlobalState().collections.ingestCollectionsData(new Map()) this.resyncState() } @@ -631,6 +633,8 @@ export class Flow extends Fetchable { const copy = clone(this.getGlobalState().flowStates[this.id]) copy.$state.started = true this.getGlobalState().flowStates[this.id] = copy + // Temporarily disable collections until server round trip has finished + this.getGlobalState().collections.ingestCollectionsData(new Map()) this.resyncState() } @@ -676,6 +680,8 @@ export class Flow extends Fetchable { copy.$state.skipped = true copy.$state.visible = false this.getGlobalState().flowStates[this.id] = copy + // Temporarily disable collections until server round trip has finished + this.getGlobalState().collections.ingestCollectionsData(new Map()) this.resyncState() } diff --git a/packages/react/src/hooks/useCollections.ts b/packages/react/src/hooks/useCollections.ts index be5b6ebc..75035b22 100644 --- a/packages/react/src/hooks/useCollections.ts +++ b/packages/react/src/hooks/useCollections.ts @@ -30,17 +30,11 @@ export function useCollections() { cb() }, 0) } - - frigade?.on('flow.any', handler) - return () => { - frigade?.off('flow.any', handler) - } - - frigade?.onStateChange(handler) + frigade?.on('flow.any', handler) return () => { - frigade?.removeStateChangeHandler(handler) + frigade?.off('flow.any', handler) } }, [frigade] From 78b067215cea6e1132a20c4682aa346d01424a26 Mon Sep 17 00:00:00 2001 From: christianmat Date: Thu, 27 Feb 2025 10:57:16 -0800 Subject: [PATCH 177/213] fix: possible race condition for cooloffs --- .changeset/dull-falcons-shop.md | 6 ++++++ 1 file changed, 6 insertions(+) create mode 100644 .changeset/dull-falcons-shop.md diff --git a/.changeset/dull-falcons-shop.md b/.changeset/dull-falcons-shop.md new file mode 100644 index 00000000..3b152291 --- /dev/null +++ b/.changeset/dull-falcons-shop.md @@ -0,0 +1,6 @@ +--- +"@frigade/js": patch +"@frigade/react": patch +--- + +Fixes an issue where collections in some cases would not respect cool offs From 1b1457b9cdaead2ed377317c66ae17907df58e75 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Thu, 27 Feb 2025 11:36:36 -0800 Subject: [PATCH 178/213] Version Packages (#435) Co-authored-by: github-actions[bot] --- .changeset/dull-falcons-shop.md | 6 ------ packages/js-api/CHANGELOG.md | 6 ++++++ packages/js-api/package.json | 2 +- packages/react/CHANGELOG.md | 8 ++++++++ packages/react/package.json | 4 ++-- 5 files changed, 17 insertions(+), 9 deletions(-) delete mode 100644 .changeset/dull-falcons-shop.md diff --git a/.changeset/dull-falcons-shop.md b/.changeset/dull-falcons-shop.md deleted file mode 100644 index 3b152291..00000000 --- a/.changeset/dull-falcons-shop.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -"@frigade/js": patch -"@frigade/react": patch ---- - -Fixes an issue where collections in some cases would not respect cool offs diff --git a/packages/js-api/CHANGELOG.md b/packages/js-api/CHANGELOG.md index 29667a6f..3fc29051 100644 --- a/packages/js-api/CHANGELOG.md +++ b/packages/js-api/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/js +## 0.9.2 + +### Patch Changes + +- 78b0672: Fixes an issue where collections in some cases would not respect cool offs + ## 0.9.1 ### Patch Changes diff --git a/packages/js-api/package.json b/packages/js-api/package.json index f5be8270..887ab6ce 100644 --- a/packages/js-api/package.json +++ b/packages/js-api/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/js", - "version": "0.9.1", + "version": "0.9.2", "description": "The official Javascript SDK for Frigade.", "type": "module", "main": "./dist/index.js", diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index e4791f00..75601cb2 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,13 @@ # @frigade/react +## 2.9.2 + +### Patch Changes + +- 78b0672: Fixes an issue where collections in some cases would not respect cool offs +- Updated dependencies [78b0672] + - @frigade/js@0.9.2 + ## 2.9.1 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index fe9e2e94..99f8e36e 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.9.1", + "version": "2.9.2", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", @@ -51,7 +51,7 @@ "dependencies": { "@emotion/react": "^11.14.0", "@floating-ui/react": "^0.26.22", - "@frigade/js": "^0.9.1", + "@frigade/js": "^0.9.2", "@radix-ui/react-checkbox": "^1.1.1", "@radix-ui/react-collapsible": "^1.0.3", "@radix-ui/react-dialog": "^1.0.5", From b0e48a55b590adfc957716cbeed7681d4969ca6c Mon Sep 17 00:00:00 2001 From: christianmat Date: Thu, 27 Feb 2025 11:36:47 -0800 Subject: [PATCH 179/213] fix: yarn install --- yarn.lock | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/yarn.lock b/yarn.lock index be318fb2..e6cf5866 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3742,7 +3742,7 @@ __metadata: languageName: node linkType: hard -"@frigade/js@npm:^0.9.1, @frigade/js@workspace:packages/js-api": +"@frigade/js@npm:^0.9.2, @frigade/js@workspace:packages/js-api": version: 0.0.0-use.local resolution: "@frigade/js@workspace:packages/js-api" dependencies: @@ -3776,7 +3776,7 @@ __metadata: dependencies: "@emotion/react": "npm:^11.14.0" "@floating-ui/react": "npm:^0.26.22" - "@frigade/js": "npm:^0.9.1" + "@frigade/js": "npm:^0.9.2" "@radix-ui/react-checkbox": "npm:^1.1.1" "@radix-ui/react-collapsible": "npm:^1.0.3" "@radix-ui/react-dialog": "npm:^1.0.5" From 2396de005d23362298d4ded3d8dc4ad5ef7bf930 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Thu, 27 Feb 2025 19:37:45 +0000 Subject: [PATCH 180/213] chore: run prepublish script --- packages/js-api/src/version.ts | 2 +- packages/react/src/version.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/js-api/src/version.ts b/packages/js-api/src/version.ts index 06af1310..693b81e8 100644 --- a/packages/js-api/src/version.ts +++ b/packages/js-api/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '0.9.1'; \ No newline at end of file +export const SDK_VERSION = '0.9.2'; \ No newline at end of file diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index f6b54cf8..6b3ac4ad 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.9.1'; \ No newline at end of file +export const SDK_VERSION = '2.9.2'; \ No newline at end of file From b3d3cc6118e00a941777e750ce063d9afc6bfee2 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Fri, 14 Mar 2025 11:26:47 -0700 Subject: [PATCH 181/213] fix: frigade has not been initialized error (#437) * fix: frigade has not been initialized error * simplify fix --- .changeset/itchy-plums-destroy.md | 6 ++++ packages/js-api/src/core/frigade.ts | 53 ++++++++++++++++------------- 2 files changed, 36 insertions(+), 23 deletions(-) create mode 100644 .changeset/itchy-plums-destroy.md diff --git a/.changeset/itchy-plums-destroy.md b/.changeset/itchy-plums-destroy.md new file mode 100644 index 00000000..86bbddc4 --- /dev/null +++ b/.changeset/itchy-plums-destroy.md @@ -0,0 +1,6 @@ +--- +"@frigade/js": patch +"@frigade/react": patch +--- + +Fixes an edge case where in some cases, the error `Frigade has not yet been initialized` can occur. diff --git a/packages/js-api/src/core/frigade.ts b/packages/js-api/src/core/frigade.ts index d5d81c78..2e34bc40 100644 --- a/packages/js-api/src/core/frigade.ts +++ b/packages/js-api/src/core/frigade.ts @@ -92,30 +92,32 @@ export class Frigade extends Fetchable { apiKey, ...config, }) - this.init(this.config) - if (isWeb() && this.config.syncOnWindowUpdates !== false) { - document.addEventListener('visibilitychange', this.visibilityChangeHandler) - // @ts-ignore - if (window.navigation) { + this.init(this.config).then(() => { + if (isWeb() && this.config.syncOnWindowUpdates !== false) { + document.addEventListener('visibilitychange', this.visibilityChangeHandler) // @ts-ignore - window.navigation.addEventListener('navigate', async (event) => { - try { - if (this.getGlobalState().currentUrl === event.destination.url) { - return - } - // if the new base url is the same but with a hashtag, don't refresh the state as the page has not changed. - if ( - event.destination.url && - this.getGlobalState().currentUrl && - event.destination.url.split('#')[0] === this.getGlobalState().currentUrl.split('#')[0] - ) { - return - } - this.queueRefreshStateFromAPI() - } catch (e) {} - }) + if (window.navigation) { + // @ts-ignore + window.navigation.addEventListener('navigate', async (event) => { + try { + if (this.getGlobalState().currentUrl === event.destination.url) { + return + } + // if the new base url is the same but with a hashtag, don't refresh the state as the page has not changed. + if ( + event.destination.url && + this.getGlobalState().currentUrl && + event.destination.url.split('#')[0] === + this.getGlobalState().currentUrl.split('#')[0] + ) { + return + } + this.queueRefreshStateFromAPI() + } catch (e) {} + }) + } } - } + }) } /** @@ -280,7 +282,12 @@ export class Frigade extends Fetchable { * @ignore */ public isReady(): boolean { - return Boolean(this.config.__instanceId && this.config.apiKey && this.initPromise) + return Boolean( + this.config.__instanceId && + this.config.apiKey && + this.initPromise && + frigadeGlobalState[getGlobalStateKey(this.config)] + ) } /** From e2e295ec59eba9f35823ba518a7082e646085f72 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Fri, 14 Mar 2025 11:46:26 -0700 Subject: [PATCH 182/213] Version Packages (#438) Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> --- .changeset/itchy-plums-destroy.md | 6 ------ packages/js-api/CHANGELOG.md | 6 ++++++ packages/js-api/package.json | 2 +- packages/react/CHANGELOG.md | 8 ++++++++ packages/react/package.json | 4 ++-- 5 files changed, 17 insertions(+), 9 deletions(-) delete mode 100644 .changeset/itchy-plums-destroy.md diff --git a/.changeset/itchy-plums-destroy.md b/.changeset/itchy-plums-destroy.md deleted file mode 100644 index 86bbddc4..00000000 --- a/.changeset/itchy-plums-destroy.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -"@frigade/js": patch -"@frigade/react": patch ---- - -Fixes an edge case where in some cases, the error `Frigade has not yet been initialized` can occur. diff --git a/packages/js-api/CHANGELOG.md b/packages/js-api/CHANGELOG.md index 3fc29051..279f0a56 100644 --- a/packages/js-api/CHANGELOG.md +++ b/packages/js-api/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/js +## 0.9.3 + +### Patch Changes + +- b3d3cc6: Fixes an edge case where in some cases, the error `Frigade has not yet been initialized` can occur. + ## 0.9.2 ### Patch Changes diff --git a/packages/js-api/package.json b/packages/js-api/package.json index 887ab6ce..3f296577 100644 --- a/packages/js-api/package.json +++ b/packages/js-api/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/js", - "version": "0.9.2", + "version": "0.9.3", "description": "The official Javascript SDK for Frigade.", "type": "module", "main": "./dist/index.js", diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 75601cb2..8a257de9 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,13 @@ # @frigade/react +## 2.9.3 + +### Patch Changes + +- b3d3cc6: Fixes an edge case where in some cases, the error `Frigade has not yet been initialized` can occur. +- Updated dependencies [b3d3cc6] + - @frigade/js@0.9.3 + ## 2.9.2 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 99f8e36e..fa46d996 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.9.2", + "version": "2.9.3", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", @@ -51,7 +51,7 @@ "dependencies": { "@emotion/react": "^11.14.0", "@floating-ui/react": "^0.26.22", - "@frigade/js": "^0.9.2", + "@frigade/js": "^0.9.3", "@radix-ui/react-checkbox": "^1.1.1", "@radix-ui/react-collapsible": "^1.0.3", "@radix-ui/react-dialog": "^1.0.5", From 40407a488764bf655d8b75c5e44a3a753aa772a9 Mon Sep 17 00:00:00 2001 From: christianmat Date: Fri, 14 Mar 2025 11:46:36 -0700 Subject: [PATCH 183/213] fix: yarn install --- yarn.lock | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/yarn.lock b/yarn.lock index e6cf5866..385fc4a7 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3742,7 +3742,7 @@ __metadata: languageName: node linkType: hard -"@frigade/js@npm:^0.9.2, @frigade/js@workspace:packages/js-api": +"@frigade/js@npm:^0.9.3, @frigade/js@workspace:packages/js-api": version: 0.0.0-use.local resolution: "@frigade/js@workspace:packages/js-api" dependencies: @@ -3776,7 +3776,7 @@ __metadata: dependencies: "@emotion/react": "npm:^11.14.0" "@floating-ui/react": "npm:^0.26.22" - "@frigade/js": "npm:^0.9.2" + "@frigade/js": "npm:^0.9.3" "@radix-ui/react-checkbox": "npm:^1.1.1" "@radix-ui/react-collapsible": "npm:^1.0.3" "@radix-ui/react-dialog": "npm:^1.0.5" From bf30c01bb7e6c0274d8738468913f591be59213e Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Fri, 14 Mar 2025 18:47:39 +0000 Subject: [PATCH 184/213] chore: run prepublish script --- packages/js-api/src/version.ts | 2 +- packages/react/src/version.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/js-api/src/version.ts b/packages/js-api/src/version.ts index 693b81e8..9f9962dc 100644 --- a/packages/js-api/src/version.ts +++ b/packages/js-api/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '0.9.2'; \ No newline at end of file +export const SDK_VERSION = '0.9.3'; \ No newline at end of file diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 6b3ac4ad..fec047ba 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.9.2'; \ No newline at end of file +export const SDK_VERSION = '2.9.3'; \ No newline at end of file From 1f2c785e25436cd0ad7c215a766e6a5bf1194f04 Mon Sep 17 00:00:00 2001 From: Micah Snyder Date: Fri, 14 Mar 2025 17:27:39 -0700 Subject: [PATCH 185/213] Change storybook conditional import to smithy --- apps/smithy/vite.config.ts | 2 +- packages/react/package.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/apps/smithy/vite.config.ts b/apps/smithy/vite.config.ts index 4bc92dd1..d3d4a811 100644 --- a/apps/smithy/vite.config.ts +++ b/apps/smithy/vite.config.ts @@ -9,6 +9,6 @@ export default defineConfig({ alias: { "@": path.resolve(__dirname, "../../packages/react/src"), }, - conditions: ["storybook"], + conditions: ["smithy"], }, }); diff --git a/packages/react/package.json b/packages/react/package.json index fa46d996..c27049ed 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -29,7 +29,7 @@ ], "exports": { ".": { - "storybook": "./src/index.ts", + "smithy": "./src/index.ts", "types": "./dist/index.d.ts", "import": "./dist/index.js", "require": "./dist/index.cjs" From e1688af229c0f80d498a140ee49e9082c0656ab4 Mon Sep 17 00:00:00 2001 From: christianmat Date: Mon, 17 Mar 2025 12:04:53 -0700 Subject: [PATCH 186/213] fix: frigade.on() redundant calls --- .changeset/few-cameras-draw.md | 7 +++ packages/js-api/src/core/frigade.ts | 29 ++++++------ packages/js-api/test/frigade.int.test.ts | 59 ++++++++++++++++++++++++ 3 files changed, 82 insertions(+), 13 deletions(-) create mode 100644 .changeset/few-cameras-draw.md diff --git a/.changeset/few-cameras-draw.md b/.changeset/few-cameras-draw.md new file mode 100644 index 00000000..2243a089 --- /dev/null +++ b/.changeset/few-cameras-draw.md @@ -0,0 +1,7 @@ +--- +"@frigade/js": patch +"@frigade/react": patch +--- + +- Fixes a bug where `frigade.on('step.compelte')` could sometimes be called for already completed steps in flows. +- Fixes an issue with using Storybook with Frigade components diff --git a/packages/js-api/src/core/frigade.ts b/packages/js-api/src/core/frigade.ts index 2e34bc40..f4294b07 100644 --- a/packages/js-api/src/core/frigade.ts +++ b/packages/js-api/src/core/frigade.ts @@ -709,12 +709,13 @@ export class Frigade extends Fetchable { break case 'step.complete': for (const step of newState.data.steps ?? []) { + const previousStep = previousState?.data.steps.find( + (previousStepState) => previousStepState.id === step.id + ) if ( step.$state.completed && - !previousState?.data.steps.find( - (previousStepState) => - previousStepState.id === step.id && previousStepState.$state.completed - ) + previousStep && + previousStep.$state.completed !== step.$state.completed ) { handlers.forEach((handler) => handler(event, flow, lastFlow, flow.steps.get(step.id)) @@ -730,6 +731,7 @@ export class Frigade extends Fetchable { if ( step.$state.started == false && !step.$state.lastActionAt && + previousStep && previousStep?.$state.started && previousStep?.$state.lastActionAt ) { @@ -741,12 +743,13 @@ export class Frigade extends Fetchable { break case 'step.skip': for (const step of newState.data.steps ?? []) { + const previousStep = previousState?.data.steps.find( + (previousStepState) => previousStepState.id === step.id + ) if ( step.$state.skipped && - !previousState?.data.steps.find( - (previousStepState) => - previousStepState.id === step.id && previousStepState.$state.skipped - ) + previousStep && + previousStep.$state.skipped !== step.$state.skipped ) { handlers.forEach((handler) => handler(event, flow, lastFlow, flow.steps.get(step.id)) @@ -756,13 +759,13 @@ export class Frigade extends Fetchable { break case 'step.start': for (const step of newState.data.steps ?? []) { + const previousStep = previousState?.data.steps.find( + (previousStepState) => previousStepState.id === step.id + ) if ( step.$state.started && - previousState?.data.steps.find( - (previousStepState) => - previousStepState.id === step.id && - previousStepState.$state.started === false - ) + previousStep && + previousStep.$state.started === false ) { handlers.forEach((handler) => handler(event, flow, lastFlow, flow.steps.get(step.id)) diff --git a/packages/js-api/test/frigade.int.test.ts b/packages/js-api/test/frigade.int.test.ts index 459ec249..ea1985da 100644 --- a/packages/js-api/test/frigade.int.test.ts +++ b/packages/js-api/test/frigade.int.test.ts @@ -643,6 +643,65 @@ describe('Basic Checklist integration test', () => { } } }) + + test('on() event handler for steps completion should fire expected number of times', async () => { + const userId = getRandomID() + // First instance to complete the flow + const frigade = new Frigade(testAPIKey, { + userId, + }) + const callback = jest.fn( + (event: string, flow: Flow, _previousFlow?: Flow, _step?: FlowStep) => { + expect(event).toBe('step.complete') + expect(flow).toBeDefined() + expect(flow.id).toEqual(testFlowId) + } + ) + frigade.on('step.complete', callback) + await frigade.identify(userId) + const flow = await frigade.getFlow(testFlowId) + expect(flow).toBeDefined() + expect(callback).toHaveBeenCalledTimes(0) + + // Complete the flow first + expect(flow.steps.get(testFlowStepId).$state.completed).toBeFalsy() + await flow.steps.get(testFlowStepId).complete() + expect(flow.steps.get(testFlowStepId).$state.completed).toBeTruthy() + await flow.complete() + expect(callback).toHaveBeenCalledTimes(1) + + // Create a new Frigade instance with the same userId + const newFrigade = new Frigade(testAPIKey, { + userId, + }) + await newFrigade.identify(userId) + + // Register event handler after flow is already completed + const newCallback = jest.fn( + (event: string, flow: Flow, _previousFlow?: Flow, _step?: FlowStep) => { + expect(event).toBe('step.complete') + expect(flow).toBeDefined() + expect(flow.id).toEqual(testFlowId) + } + ) + + // Register the handler on the new instance - it should not fire for the already completed flow + newFrigade.on('step.complete', newCallback) + + // Verify the callback wasn't called + expect(newCallback).toHaveBeenCalledTimes(0) + + // Get the flow from the new instance and verify it's still completed + const newFlow = await newFrigade.getFlow(testFlowId) + expect(newFlow.isCompleted).toBeTruthy() + + // Reset and complete the flow step again to verify the handler works for new completions + await newFlow.restart() + expect(newFlow.steps.get(testFlowStepId).$state.completed).toBeFalsy() + await newFlow.steps.get(testFlowStepId).complete() + expect(newFlow.steps.get(testFlowStepId).$state.completed).toBeTruthy() + expect(newCallback).toHaveBeenCalledTimes(1) + }) }) describe('Advanced Checklist integration test', () => { From eaae7361e68246a6b2bcabc8a28862f5857331d0 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Mon, 17 Mar 2025 12:08:18 -0700 Subject: [PATCH 187/213] Version Packages (#441) Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> --- .changeset/few-cameras-draw.md | 7 ------- packages/js-api/CHANGELOG.md | 7 +++++++ packages/js-api/package.json | 2 +- packages/react/CHANGELOG.md | 9 +++++++++ packages/react/package.json | 4 ++-- 5 files changed, 19 insertions(+), 10 deletions(-) delete mode 100644 .changeset/few-cameras-draw.md diff --git a/.changeset/few-cameras-draw.md b/.changeset/few-cameras-draw.md deleted file mode 100644 index 2243a089..00000000 --- a/.changeset/few-cameras-draw.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -"@frigade/js": patch -"@frigade/react": patch ---- - -- Fixes a bug where `frigade.on('step.compelte')` could sometimes be called for already completed steps in flows. -- Fixes an issue with using Storybook with Frigade components diff --git a/packages/js-api/CHANGELOG.md b/packages/js-api/CHANGELOG.md index 279f0a56..9f022281 100644 --- a/packages/js-api/CHANGELOG.md +++ b/packages/js-api/CHANGELOG.md @@ -1,5 +1,12 @@ # @frigade/js +## 0.9.4 + +### Patch Changes + +- e1688af: - Fixes a bug where `frigade.on('step.compelte')` could sometimes be called for already completed steps in flows. + - Fixes an issue with using Storybook with Frigade components + ## 0.9.3 ### Patch Changes diff --git a/packages/js-api/package.json b/packages/js-api/package.json index 3f296577..7ff404ab 100644 --- a/packages/js-api/package.json +++ b/packages/js-api/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/js", - "version": "0.9.3", + "version": "0.9.4", "description": "The official Javascript SDK for Frigade.", "type": "module", "main": "./dist/index.js", diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 8a257de9..a3bfa6cb 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,14 @@ # @frigade/react +## 2.9.4 + +### Patch Changes + +- e1688af: - Fixes a bug where `frigade.on('step.compelte')` could sometimes be called for already completed steps in flows. + - Fixes an issue with using Storybook with Frigade components +- Updated dependencies [e1688af] + - @frigade/js@0.9.4 + ## 2.9.3 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index c27049ed..a4c0fca3 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.9.3", + "version": "2.9.4", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", @@ -51,7 +51,7 @@ "dependencies": { "@emotion/react": "^11.14.0", "@floating-ui/react": "^0.26.22", - "@frigade/js": "^0.9.3", + "@frigade/js": "^0.9.4", "@radix-ui/react-checkbox": "^1.1.1", "@radix-ui/react-collapsible": "^1.0.3", "@radix-ui/react-dialog": "^1.0.5", From 5cebe99c865781486db3060830ac62d2a4d2c590 Mon Sep 17 00:00:00 2001 From: christianmat Date: Mon, 17 Mar 2025 12:08:39 -0700 Subject: [PATCH 188/213] fix: yarn install --- yarn.lock | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/yarn.lock b/yarn.lock index 385fc4a7..086255df 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3742,7 +3742,7 @@ __metadata: languageName: node linkType: hard -"@frigade/js@npm:^0.9.3, @frigade/js@workspace:packages/js-api": +"@frigade/js@npm:^0.9.4, @frigade/js@workspace:packages/js-api": version: 0.0.0-use.local resolution: "@frigade/js@workspace:packages/js-api" dependencies: @@ -3776,7 +3776,7 @@ __metadata: dependencies: "@emotion/react": "npm:^11.14.0" "@floating-ui/react": "npm:^0.26.22" - "@frigade/js": "npm:^0.9.3" + "@frigade/js": "npm:^0.9.4" "@radix-ui/react-checkbox": "npm:^1.1.1" "@radix-ui/react-collapsible": "npm:^1.0.3" "@radix-ui/react-dialog": "npm:^1.0.5" From d774367c003f8c311822bdae61856bf2a690dd3e Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 17 Mar 2025 12:10:45 -0700 Subject: [PATCH 189/213] chore(deps): bump axios from 1.7.7 to 1.8.3 (#439) Bumps [axios](https://github.com/axios/axios) from 1.7.7 to 1.8.3. - [Release notes](https://github.com/axios/axios/releases) - [Changelog](https://github.com/axios/axios/blob/v1.x/CHANGELOG.md) - [Commits](https://github.com/axios/axios/compare/v1.7.7...v1.8.3) --- updated-dependencies: - dependency-name: axios dependency-type: indirect ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- yarn.lock | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/yarn.lock b/yarn.lock index 086255df..c612da4f 100644 --- a/yarn.lock +++ b/yarn.lock @@ -9034,13 +9034,13 @@ __metadata: linkType: hard "axios@npm:^1.6.1": - version: 1.7.7 - resolution: "axios@npm:1.7.7" + version: 1.8.3 + resolution: "axios@npm:1.8.3" dependencies: follow-redirects: "npm:^1.15.6" form-data: "npm:^4.0.0" proxy-from-env: "npm:^1.1.0" - checksum: 10/7f875ea13b9298cd7b40fd09985209f7a38d38321f1118c701520939de2f113c4ba137832fe8e3f811f99a38e12c8225481011023209a77b0c0641270e20cde1 + checksum: 10/050f911cadd6d47a38ddbf91d2f8da2c34661dda8077e7ad6546e8178701125366fddbba07211a648b6815cf6c2c3c91c0a65d8b968e3d1a6054a21141ff9c01 languageName: node linkType: hard From 659d29bce40c0ca5d968dddf69d6697959ff1e14 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 17 Mar 2025 12:10:55 -0700 Subject: [PATCH 190/213] chore(deps): bump @babel/helpers from 7.23.9 to 7.26.10 (#440) Bumps [@babel/helpers](https://github.com/babel/babel/tree/HEAD/packages/babel-helpers) from 7.23.9 to 7.26.10. - [Release notes](https://github.com/babel/babel/releases) - [Changelog](https://github.com/babel/babel/blob/main/CHANGELOG.md) - [Commits](https://github.com/babel/babel/commits/v7.26.10/packages/babel-helpers) --- updated-dependencies: - dependency-name: "@babel/helpers" dependency-type: indirect ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- yarn.lock | 80 +++++++++++++++++++++++++++++++++++++++++++------------ 1 file changed, 63 insertions(+), 17 deletions(-) diff --git a/yarn.lock b/yarn.lock index c612da4f..c693dafb 100644 --- a/yarn.lock +++ b/yarn.lock @@ -80,6 +80,17 @@ __metadata: languageName: node linkType: hard +"@babel/code-frame@npm:^7.26.2": + version: 7.26.2 + resolution: "@babel/code-frame@npm:7.26.2" + dependencies: + "@babel/helper-validator-identifier": "npm:^7.25.9" + js-tokens: "npm:^4.0.0" + picocolors: "npm:^1.0.0" + checksum: 10/db2c2122af79d31ca916755331bb4bac96feb2b334cdaca5097a6b467fdd41963b89b14b6836a14f083de7ff887fc78fa1b3c10b14e743d33e12dbfe5ee3d223 + languageName: node + linkType: hard + "@babel/compat-data@npm:^7.22.6, @babel/compat-data@npm:^7.23.3, @babel/compat-data@npm:^7.23.5": version: 7.23.5 resolution: "@babel/compat-data@npm:7.23.5" @@ -571,6 +582,13 @@ __metadata: languageName: node linkType: hard +"@babel/helper-string-parser@npm:^7.25.9": + version: 7.25.9 + resolution: "@babel/helper-string-parser@npm:7.25.9" + checksum: 10/c28656c52bd48e8c1d9f3e8e68ecafd09d949c57755b0d353739eb4eae7ba4f7e67e92e4036f1cd43378cc1397a2c943ed7bcaf5949b04ab48607def0258b775 + languageName: node + linkType: hard + "@babel/helper-validator-identifier@npm:^7.22.20": version: 7.22.20 resolution: "@babel/helper-validator-identifier@npm:7.22.20" @@ -585,6 +603,13 @@ __metadata: languageName: node linkType: hard +"@babel/helper-validator-identifier@npm:^7.25.9": + version: 7.25.9 + resolution: "@babel/helper-validator-identifier@npm:7.25.9" + checksum: 10/3f9b649be0c2fd457fa1957b694b4e69532a668866b8a0d81eabfa34ba16dbf3107b39e0e7144c55c3c652bf773ec816af8df4a61273a2bb4eb3145ca9cf478e + languageName: node + linkType: hard + "@babel/helper-validator-option@npm:^7.22.15, @babel/helper-validator-option@npm:^7.23.5": version: 7.23.5 resolution: "@babel/helper-validator-option@npm:7.23.5" @@ -621,24 +646,13 @@ __metadata: languageName: node linkType: hard -"@babel/helpers@npm:^7.23.9": - version: 7.23.9 - resolution: "@babel/helpers@npm:7.23.9" +"@babel/helpers@npm:^7.23.9, @babel/helpers@npm:^7.25.0": + version: 7.26.10 + resolution: "@babel/helpers@npm:7.26.10" dependencies: - "@babel/template": "npm:^7.23.9" - "@babel/traverse": "npm:^7.23.9" - "@babel/types": "npm:^7.23.9" - checksum: 10/dd56daac8bbd7ed174bb00fd185926fd449e591d9a00edaceb7ac6edbdd7a8db57e2cb365b4fafda382201752789ced2f7ae010f667eab0f198a4571cda4d2c5 - languageName: node - linkType: hard - -"@babel/helpers@npm:^7.25.0": - version: 7.25.6 - resolution: "@babel/helpers@npm:7.25.6" - dependencies: - "@babel/template": "npm:^7.25.0" - "@babel/types": "npm:^7.25.6" - checksum: 10/43abc8d017b754619aa189d05e2bdb54aaf44f03ec0439e89b3e7c180d538adb01ce9014a1689f632a7e8b17655c72bfac0a92268476eec708b41d3ba0a65296 + "@babel/template": "npm:^7.26.9" + "@babel/types": "npm:^7.26.10" + checksum: 10/664146257974ccf064b42bd99b1b85717cce2bcebc5068273e13b230ee8bd98d87187c3783706758d76b678ebe0d2f48150eaa6cffc4f77af1342a78ec1cf57a languageName: node linkType: hard @@ -685,6 +699,17 @@ __metadata: languageName: node linkType: hard +"@babel/parser@npm:^7.26.9": + version: 7.26.10 + resolution: "@babel/parser@npm:7.26.10" + dependencies: + "@babel/types": "npm:^7.26.10" + bin: + parser: ./bin/babel-parser.js + checksum: 10/3f87781f46795ba72448168061d9e99c394fdf9cd4aa3ddf053a06334247da4d25d0923ccc89195937d3360d384cee181e99711763c1e8fe81d4f17ee22541fc + languageName: node + linkType: hard + "@babel/plugin-bugfix-firefox-class-in-computed-class-key@npm:^7.25.3": version: 7.25.3 resolution: "@babel/plugin-bugfix-firefox-class-in-computed-class-key@npm:7.25.3" @@ -2629,6 +2654,17 @@ __metadata: languageName: node linkType: hard +"@babel/template@npm:^7.26.9": + version: 7.26.9 + resolution: "@babel/template@npm:7.26.9" + dependencies: + "@babel/code-frame": "npm:^7.26.2" + "@babel/parser": "npm:^7.26.9" + "@babel/types": "npm:^7.26.9" + checksum: 10/240288cebac95b1cc1cb045ad143365643da0470e905e11731e63280e43480785bd259924f4aea83898ef68e9fa7c176f5f2d1e8b0a059b27966e8ca0b41a1b6 + languageName: node + linkType: hard + "@babel/traverse@npm:^7.18.9, @babel/traverse@npm:^7.23.2, @babel/traverse@npm:^7.23.9, @babel/traverse@npm:^7.4.5": version: 7.23.9 resolution: "@babel/traverse@npm:7.23.9" @@ -2684,6 +2720,16 @@ __metadata: languageName: node linkType: hard +"@babel/types@npm:^7.26.10, @babel/types@npm:^7.26.9": + version: 7.26.10 + resolution: "@babel/types@npm:7.26.10" + dependencies: + "@babel/helper-string-parser": "npm:^7.25.9" + "@babel/helper-validator-identifier": "npm:^7.25.9" + checksum: 10/6b4f24ee77af853c2126eaabb65328cd44a7d6f439685131cf929c30567e01b6ea2e5d5653b2c304a09c63a5a6199968f0e27228a007acf35032036d79a9dee6 + languageName: node + linkType: hard + "@base2/pretty-print-object@npm:1.0.1": version: 1.0.1 resolution: "@base2/pretty-print-object@npm:1.0.1" From 17bf15ef34b6b4d41f6255756d29fb6c6795565d Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Mon, 17 Mar 2025 19:13:10 +0000 Subject: [PATCH 191/213] chore: run prepublish script --- packages/js-api/src/version.ts | 2 +- packages/react/src/version.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/js-api/src/version.ts b/packages/js-api/src/version.ts index 9f9962dc..89d8ef60 100644 --- a/packages/js-api/src/version.ts +++ b/packages/js-api/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '0.9.3'; \ No newline at end of file +export const SDK_VERSION = '0.9.4'; \ No newline at end of file diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index fec047ba..9a2b5172 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.9.3'; \ No newline at end of file +export const SDK_VERSION = '2.9.4'; \ No newline at end of file From 75a5475cf8dd8f7907c2a4932b0872608600bd54 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Mon, 31 Mar 2025 15:25:02 -0700 Subject: [PATCH 192/213] fix: add additional null check to collection hook (#443) --- .changeset/ninety-turtles-explode.md | 5 +++++ packages/react/src/hooks/useCollection.ts | 2 +- 2 files changed, 6 insertions(+), 1 deletion(-) create mode 100644 .changeset/ninety-turtles-explode.md diff --git a/.changeset/ninety-turtles-explode.md b/.changeset/ninety-turtles-explode.md new file mode 100644 index 00000000..56fe186b --- /dev/null +++ b/.changeset/ninety-turtles-explode.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": patch +--- + +Adds an additional null check to Flows served through collections diff --git a/packages/react/src/hooks/useCollection.ts b/packages/react/src/hooks/useCollection.ts index 65c302b9..022b644b 100644 --- a/packages/react/src/hooks/useCollection.ts +++ b/packages/react/src/hooks/useCollection.ts @@ -24,7 +24,7 @@ export function useCollection(collectionId?: string): { flow: frigade?.getFlowSync(item.flowId), })) ?? [] - const flowId = enrichedFlows.find(({ flow }) => flow.isVisible)?.flowId + const flowId = enrichedFlows.find(({ flow }) => flow?.isVisible)?.flowId const { flow } = useFlow(flowId) From 260a5d851f3eec7c0f65cd6d1ef640fcd7dc856e Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 31 Mar 2025 15:25:27 -0700 Subject: [PATCH 193/213] chore(deps): bump tar-fs from 2.1.1 to 2.1.2 (#442) Bumps [tar-fs](https://github.com/mafintosh/tar-fs) from 2.1.1 to 2.1.2. - [Commits](https://github.com/mafintosh/tar-fs/compare/v2.1.1...v2.1.2) --- updated-dependencies: - dependency-name: tar-fs dependency-type: indirect ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- yarn.lock | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/yarn.lock b/yarn.lock index c693dafb..92c7594e 100644 --- a/yarn.lock +++ b/yarn.lock @@ -19204,14 +19204,14 @@ __metadata: linkType: hard "tar-fs@npm:^2.1.1": - version: 2.1.1 - resolution: "tar-fs@npm:2.1.1" + version: 2.1.2 + resolution: "tar-fs@npm:2.1.2" dependencies: chownr: "npm:^1.1.1" mkdirp-classic: "npm:^0.5.2" pump: "npm:^3.0.0" tar-stream: "npm:^2.1.4" - checksum: 10/526deae025453e825f87650808969662fbb12eb0461d033e9b447de60ec951c6c4607d0afe7ce057defe9d4e45cf80399dd74bc15f9d9e0773d5e990a78ce4ac + checksum: 10/623f7e8e58a43578ba7368002c3cc7e321f6d170053ac0691d95172dbc7daf5dcf4347eb061277627340870ce6cfda89f5a5d633cc274c41ae6d69f54a2374e7 languageName: node linkType: hard From caee892eab93d13e4989c788c678535167d50bfd Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Mon, 31 Mar 2025 15:33:47 -0700 Subject: [PATCH 194/213] Version Packages (#444) Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> --- .changeset/ninety-turtles-explode.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/ninety-turtles-explode.md diff --git a/.changeset/ninety-turtles-explode.md b/.changeset/ninety-turtles-explode.md deleted file mode 100644 index 56fe186b..00000000 --- a/.changeset/ninety-turtles-explode.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": patch ---- - -Adds an additional null check to Flows served through collections diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index a3bfa6cb..3b742f1f 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/react +## 2.9.5 + +### Patch Changes + +- 75a5475: Adds an additional null check to Flows served through collections + ## 2.9.4 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index a4c0fca3..9e538c9b 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.9.4", + "version": "2.9.5", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From c3b43c2fc70a37d87a6faa61c67627a4646fabb6 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Mon, 31 Mar 2025 22:36:06 +0000 Subject: [PATCH 195/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 9a2b5172..129b8ef7 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.9.4'; \ No newline at end of file +export const SDK_VERSION = '2.9.5'; \ No newline at end of file From 8496a7f7d20a385085906a6ff546536544ffc894 Mon Sep 17 00:00:00 2001 From: christianmat Date: Thu, 10 Apr 2025 12:08:55 -0700 Subject: [PATCH 196/213] fix: window.navigation not working in firefox --- .changeset/sixty-cooks-tan.md | 6 ++++++ packages/js-api/src/core/frigade.ts | 19 +++++++++++++++++++ 2 files changed, 25 insertions(+) create mode 100644 .changeset/sixty-cooks-tan.md diff --git a/.changeset/sixty-cooks-tan.md b/.changeset/sixty-cooks-tan.md new file mode 100644 index 00000000..065ffce2 --- /dev/null +++ b/.changeset/sixty-cooks-tan.md @@ -0,0 +1,6 @@ +--- +"@frigade/js": patch +"@frigade/react": patch +--- + +Fixes an issue where navigation change events were not firing in Firefox diff --git a/packages/js-api/src/core/frigade.ts b/packages/js-api/src/core/frigade.ts index f4294b07..c3dd8a9e 100644 --- a/packages/js-api/src/core/frigade.ts +++ b/packages/js-api/src/core/frigade.ts @@ -115,6 +115,25 @@ export class Frigade extends Fetchable { this.queueRefreshStateFromAPI() } catch (e) {} }) + } else { + // For browsers like Safari and Firefox, window.navigation is not supported. + // Instead we use a mutation observer to detect changes to the URL. + new MutationObserver(() => { + try { + if (this.getGlobalState().currentUrl === location.href) { + return + } + // if the new base url is the same but with a hashtag, don't refresh the state as the page has not changed. + if ( + location.href && + this.getGlobalState().currentUrl && + location.href.split('#')[0] === this.getGlobalState().currentUrl.split('#')[0] + ) { + return + } + this.queueRefreshStateFromAPI() + } catch (e) {} + }).observe(document, { subtree: true, childList: true }) } } }) From d17bc5409a3835a76c348b34d0a27f6594618137 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Thu, 10 Apr 2025 12:12:08 -0700 Subject: [PATCH 197/213] chore(deps-dev): bump vite from 4.5.9 to 4.5.11 (#445) Bumps [vite](https://github.com/vitejs/vite/tree/HEAD/packages/vite) from 4.5.9 to 4.5.11. - [Release notes](https://github.com/vitejs/vite/releases) - [Changelog](https://github.com/vitejs/vite/blob/v4.5.11/packages/vite/CHANGELOG.md) - [Commits](https://github.com/vitejs/vite/commits/v4.5.11/packages/vite) --- updated-dependencies: - dependency-name: vite dependency-version: 4.5.11 dependency-type: direct:development ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- apps/smithy/package.json | 2 +- yarn.lock | 10 +++++----- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/apps/smithy/package.json b/apps/smithy/package.json index e29c9f2a..f6090c69 100644 --- a/apps/smithy/package.json +++ b/apps/smithy/package.json @@ -39,6 +39,6 @@ "prop-types": "^15.8.1", "storybook": "^8.5.3", "typescript": "^4.9.4", - "vite": "^4.5.6" + "vite": "^4.5.11" } } diff --git a/yarn.lock b/yarn.lock index 92c7594e..18523c2a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -18565,7 +18565,7 @@ __metadata: react-dom: "npm:^19.0.0" storybook: "npm:^8.5.3" typescript: "npm:^4.9.4" - vite: "npm:^4.5.6" + vite: "npm:^4.5.11" languageName: unknown linkType: soft @@ -20347,9 +20347,9 @@ __metadata: languageName: node linkType: hard -"vite@npm:^4.5.6": - version: 4.5.9 - resolution: "vite@npm:4.5.9" +"vite@npm:^4.5.11": + version: 4.5.11 + resolution: "vite@npm:4.5.11" dependencies: esbuild: "npm:^0.18.10" fsevents: "npm:~2.3.2" @@ -20383,7 +20383,7 @@ __metadata: optional: true bin: vite: bin/vite.js - checksum: 10/9b1984c89f5d6e57e26b767ba6bb8791a9a9b1329f72cd2c4f6079bb4ad74fb4e0b43ae13cbb31812a00c706dfa70d894bfc7dd6b5b3db82e18b7997f23e5072 + checksum: 10/51028ad040e0fd68ba76824c61e306b0716f40fa682d8a5b386d3c3b4562997ff17ff113d9dd0e5971f34754fce5c55ed4402e742a4725a25bee80cc74c531f3 languageName: node linkType: hard From cbb3ad36e8713b2e3a9bb3563339493caea0d804 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Thu, 10 Apr 2025 12:13:54 -0700 Subject: [PATCH 198/213] Version Packages (#447) Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> --- .changeset/sixty-cooks-tan.md | 6 ------ packages/js-api/CHANGELOG.md | 6 ++++++ packages/js-api/package.json | 2 +- packages/react/CHANGELOG.md | 8 ++++++++ packages/react/package.json | 4 ++-- 5 files changed, 17 insertions(+), 9 deletions(-) delete mode 100644 .changeset/sixty-cooks-tan.md diff --git a/.changeset/sixty-cooks-tan.md b/.changeset/sixty-cooks-tan.md deleted file mode 100644 index 065ffce2..00000000 --- a/.changeset/sixty-cooks-tan.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -"@frigade/js": patch -"@frigade/react": patch ---- - -Fixes an issue where navigation change events were not firing in Firefox diff --git a/packages/js-api/CHANGELOG.md b/packages/js-api/CHANGELOG.md index 9f022281..f853612d 100644 --- a/packages/js-api/CHANGELOG.md +++ b/packages/js-api/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/js +## 0.9.5 + +### Patch Changes + +- 8496a7f: Fixes an issue where navigation change events were not firing in Firefox + ## 0.9.4 ### Patch Changes diff --git a/packages/js-api/package.json b/packages/js-api/package.json index 7ff404ab..2ee00d3f 100644 --- a/packages/js-api/package.json +++ b/packages/js-api/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/js", - "version": "0.9.4", + "version": "0.9.5", "description": "The official Javascript SDK for Frigade.", "type": "module", "main": "./dist/index.js", diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 3b742f1f..fc285beb 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,13 @@ # @frigade/react +## 2.9.6 + +### Patch Changes + +- 8496a7f: Fixes an issue where navigation change events were not firing in Firefox +- Updated dependencies [8496a7f] + - @frigade/js@0.9.5 + ## 2.9.5 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 9e538c9b..7a767a38 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.9.5", + "version": "2.9.6", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", @@ -51,7 +51,7 @@ "dependencies": { "@emotion/react": "^11.14.0", "@floating-ui/react": "^0.26.22", - "@frigade/js": "^0.9.4", + "@frigade/js": "^0.9.5", "@radix-ui/react-checkbox": "^1.1.1", "@radix-ui/react-collapsible": "^1.0.3", "@radix-ui/react-dialog": "^1.0.5", From 42e5ced7a5599c1d56939ce66287aa0c104f42bd Mon Sep 17 00:00:00 2001 From: christianmat Date: Thu, 10 Apr 2025 12:19:48 -0700 Subject: [PATCH 199/213] fix: yarn install --- yarn.lock | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/yarn.lock b/yarn.lock index 18523c2a..dd92f5f4 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3788,7 +3788,7 @@ __metadata: languageName: node linkType: hard -"@frigade/js@npm:^0.9.4, @frigade/js@workspace:packages/js-api": +"@frigade/js@npm:^0.9.5, @frigade/js@workspace:packages/js-api": version: 0.0.0-use.local resolution: "@frigade/js@workspace:packages/js-api" dependencies: @@ -3822,7 +3822,7 @@ __metadata: dependencies: "@emotion/react": "npm:^11.14.0" "@floating-ui/react": "npm:^0.26.22" - "@frigade/js": "npm:^0.9.4" + "@frigade/js": "npm:^0.9.5" "@radix-ui/react-checkbox": "npm:^1.1.1" "@radix-ui/react-collapsible": "npm:^1.0.3" "@radix-ui/react-dialog": "npm:^1.0.5" From e0f3e5e10cf19eadacb642005022eeeecdb068b4 Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Thu, 10 Apr 2025 19:23:38 +0000 Subject: [PATCH 200/213] chore: run prepublish script --- packages/js-api/src/version.ts | 2 +- packages/react/src/version.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/js-api/src/version.ts b/packages/js-api/src/version.ts index 89d8ef60..4e1ec270 100644 --- a/packages/js-api/src/version.ts +++ b/packages/js-api/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '0.9.4'; \ No newline at end of file +export const SDK_VERSION = '0.9.5'; \ No newline at end of file diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index 129b8ef7..ad9067cd 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.9.5'; \ No newline at end of file +export const SDK_VERSION = '2.9.6'; \ No newline at end of file From 9edda416461b6c13ce5de6c5865213d364ad5474 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Wed, 16 Apr 2025 10:04:54 -0700 Subject: [PATCH 201/213] chore(deps-dev): bump vite from 4.5.11 to 4.5.12 (#448) Bumps [vite](https://github.com/vitejs/vite/tree/HEAD/packages/vite) from 4.5.11 to 4.5.12. - [Release notes](https://github.com/vitejs/vite/releases) - [Changelog](https://github.com/vitejs/vite/blob/v4.5.12/packages/vite/CHANGELOG.md) - [Commits](https://github.com/vitejs/vite/commits/v4.5.12/packages/vite) --- updated-dependencies: - dependency-name: vite dependency-version: 4.5.12 dependency-type: direct:development ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- apps/smithy/package.json | 2 +- yarn.lock | 10 +++++----- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/apps/smithy/package.json b/apps/smithy/package.json index f6090c69..7acc64c0 100644 --- a/apps/smithy/package.json +++ b/apps/smithy/package.json @@ -39,6 +39,6 @@ "prop-types": "^15.8.1", "storybook": "^8.5.3", "typescript": "^4.9.4", - "vite": "^4.5.11" + "vite": "^4.5.12" } } diff --git a/yarn.lock b/yarn.lock index dd92f5f4..30f3346f 100644 --- a/yarn.lock +++ b/yarn.lock @@ -18565,7 +18565,7 @@ __metadata: react-dom: "npm:^19.0.0" storybook: "npm:^8.5.3" typescript: "npm:^4.9.4" - vite: "npm:^4.5.11" + vite: "npm:^4.5.12" languageName: unknown linkType: soft @@ -20347,9 +20347,9 @@ __metadata: languageName: node linkType: hard -"vite@npm:^4.5.11": - version: 4.5.11 - resolution: "vite@npm:4.5.11" +"vite@npm:^4.5.12": + version: 4.5.13 + resolution: "vite@npm:4.5.13" dependencies: esbuild: "npm:^0.18.10" fsevents: "npm:~2.3.2" @@ -20383,7 +20383,7 @@ __metadata: optional: true bin: vite: bin/vite.js - checksum: 10/51028ad040e0fd68ba76824c61e306b0716f40fa682d8a5b386d3c3b4562997ff17ff113d9dd0e5971f34754fce5c55ed4402e742a4725a25bee80cc74c531f3 + checksum: 10/eddfc619d69272ed3abfd0f59de3d52656d3aafbfe474db2bcccbc0520e6f52678469c7c7977ea952b5e3d99492c5b93d5b15ddfa3159cce70fa37a7c92c290a languageName: node linkType: hard From 11f71d96b06e5d80409dab5b5ecef5b581549b44 Mon Sep 17 00:00:00 2001 From: christianmat Date: Tue, 22 Jul 2025 17:23:17 -0700 Subject: [PATCH 202/213] fix: emotion issue with @frigade/react and vite --- .changeset/twenty-cheetahs-guess.md | 5 +++++ packages/react/package.json | 1 + yarn.lock | 1 + 3 files changed, 7 insertions(+) create mode 100644 .changeset/twenty-cheetahs-guess.md diff --git a/.changeset/twenty-cheetahs-guess.md b/.changeset/twenty-cheetahs-guess.md new file mode 100644 index 00000000..70e58764 --- /dev/null +++ b/.changeset/twenty-cheetahs-guess.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": minor +--- + +Fixes an issue with Frigade and Vite diff --git a/packages/react/package.json b/packages/react/package.json index 7a767a38..fb2877ca 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -68,6 +68,7 @@ "use-sync-external-store": "^1.4.0" }, "peerDependencies": { + "@emotion/react": "^11.14.0", "react": "17 - 19", "react-dom": "17 - 19" }, diff --git a/yarn.lock b/yarn.lock index 30f3346f..3f8995f6 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3859,6 +3859,7 @@ __metadata: typescript: "npm:^4.9.4" use-sync-external-store: "npm:^1.4.0" peerDependencies: + "@emotion/react": ^11.14.0 react: 17 - 19 react-dom: 17 - 19 languageName: unknown From cf97ee0ffac25a7b5da354e52d86b13a115211c2 Mon Sep 17 00:00:00 2001 From: Christian Mathiesen Date: Tue, 22 Jul 2025 17:43:45 -0700 Subject: [PATCH 203/213] Version Packages (#452) Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> --- .changeset/twenty-cheetahs-guess.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/twenty-cheetahs-guess.md diff --git a/.changeset/twenty-cheetahs-guess.md b/.changeset/twenty-cheetahs-guess.md deleted file mode 100644 index 70e58764..00000000 --- a/.changeset/twenty-cheetahs-guess.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": minor ---- - -Fixes an issue with Frigade and Vite diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index fc285beb..41e980bb 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/react +## 2.10.0 + +### Minor Changes + +- 11f71d9: Fixes an issue with Frigade and Vite + ## 2.9.6 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index fb2877ca..8fcf4f1b 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.9.6", + "version": "2.10.0", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From f2bb891d74e21daa1ccf7b8432424d9e00d3f5fb Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Wed, 23 Jul 2025 00:46:06 +0000 Subject: [PATCH 204/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index ad9067cd..d881fe92 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.9.6'; \ No newline at end of file +export const SDK_VERSION = '2.10.0'; \ No newline at end of file From 41c6fb177ab63bba90a5ff68f86b1a54b4e07299 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Tue, 29 Jul 2025 13:17:33 -0700 Subject: [PATCH 205/213] chore(deps-dev): bump vite from 4.5.13 to 4.5.14 (#451) Bumps [vite](https://github.com/vitejs/vite/tree/HEAD/packages/vite) from 4.5.13 to 4.5.14. - [Release notes](https://github.com/vitejs/vite/releases) - [Changelog](https://github.com/vitejs/vite/blob/v4.5.14/packages/vite/CHANGELOG.md) - [Commits](https://github.com/vitejs/vite/commits/v4.5.14/packages/vite) --- updated-dependencies: - dependency-name: vite dependency-version: 4.5.14 dependency-type: direct:development ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- apps/smithy/package.json | 2 +- yarn.lock | 10 +++++----- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/apps/smithy/package.json b/apps/smithy/package.json index 7acc64c0..7bfd7e80 100644 --- a/apps/smithy/package.json +++ b/apps/smithy/package.json @@ -39,6 +39,6 @@ "prop-types": "^15.8.1", "storybook": "^8.5.3", "typescript": "^4.9.4", - "vite": "^4.5.12" + "vite": "^4.5.14" } } diff --git a/yarn.lock b/yarn.lock index 3f8995f6..1a7dfcce 100644 --- a/yarn.lock +++ b/yarn.lock @@ -18566,7 +18566,7 @@ __metadata: react-dom: "npm:^19.0.0" storybook: "npm:^8.5.3" typescript: "npm:^4.9.4" - vite: "npm:^4.5.12" + vite: "npm:^4.5.14" languageName: unknown linkType: soft @@ -20348,9 +20348,9 @@ __metadata: languageName: node linkType: hard -"vite@npm:^4.5.12": - version: 4.5.13 - resolution: "vite@npm:4.5.13" +"vite@npm:^4.5.14": + version: 4.5.14 + resolution: "vite@npm:4.5.14" dependencies: esbuild: "npm:^0.18.10" fsevents: "npm:~2.3.2" @@ -20384,7 +20384,7 @@ __metadata: optional: true bin: vite: bin/vite.js - checksum: 10/eddfc619d69272ed3abfd0f59de3d52656d3aafbfe474db2bcccbc0520e6f52678469c7c7977ea952b5e3d99492c5b93d5b15ddfa3159cce70fa37a7c92c290a + checksum: 10/316a02f0d310511241fae15e6085c9f7285e87b7a75b7b04216925e72ec17107ae6f666181c79c711f6008fdaa8a0b4510280c68ce0bfab436ebea2470783d0a languageName: node linkType: hard From d600eeea1f9ec7f8437480f5c72f8ff13eceeada Mon Sep 17 00:00:00 2001 From: christianmat Date: Mon, 4 Aug 2025 14:45:10 -0700 Subject: [PATCH 206/213] fix: fix select multiple data bug --- .changeset/spicy-walls-behave.md | 5 ++++ apps/smithy/.storybook/main.ts | 9 +++++- .../Form/fields/SelectMultipleField.tsx | 29 +++++++++---------- 3 files changed, 27 insertions(+), 16 deletions(-) create mode 100644 .changeset/spicy-walls-behave.md diff --git a/.changeset/spicy-walls-behave.md b/.changeset/spicy-walls-behave.md new file mode 100644 index 00000000..0e46114c --- /dev/null +++ b/.changeset/spicy-walls-behave.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": patch +--- + +Fixes an issue related to form type select/multiple diff --git a/apps/smithy/.storybook/main.ts b/apps/smithy/.storybook/main.ts index 030eb214..092e540e 100644 --- a/apps/smithy/.storybook/main.ts +++ b/apps/smithy/.storybook/main.ts @@ -1,7 +1,14 @@ import path from "path"; // SEE: https://storybook.js.org/docs/react/faq#how-do-i-fix-module-resolution-in-special-environments -const getAbsolutePath = (packageName) => +import { createRequire } from 'module'; +const require = createRequire(import.meta.url); + +// Utility to resolve the absolute path of a given package. Storybook requires absolute +// addon paths when the config file is executed in an ESM context (Node ≥ 18 / SB 8). +// We can still rely on Node's `require.resolve` by creating a CommonJS `require` +// function that is bound to this ESM module. +const getAbsolutePath = (packageName: string) => path.dirname(require.resolve(path.join(packageName, "package.json"))); /** @type { import('@storybook/react-vite').StorybookConfig } */ diff --git a/packages/react/src/components/Form/fields/SelectMultipleField.tsx b/packages/react/src/components/Form/fields/SelectMultipleField.tsx index 85709a47..b9915bd2 100644 --- a/packages/react/src/components/Form/fields/SelectMultipleField.tsx +++ b/packages/react/src/components/Form/fields/SelectMultipleField.tsx @@ -11,20 +11,19 @@ import * as baseStyles from '@/components/Form/fields/BaseField.styles' export function SelectMultipleField(props: FormFieldProps) { const { - field: { onChange }, + field: { onChange, value }, fieldData: { options = [] }, } = props - const [valueArray, setValueArray] = React.useState([]) + // Ensure we always work with an array of strings coming from RHF + const valueArray: string[] = Array.isArray(value) ? value : [] - function setValueInArray(value: string) { - let updatedValueArray = [] - if (valueArray.includes(value)) { - updatedValueArray = [...valueArray.filter((v) => v !== value)] - } else { - updatedValueArray = [...valueArray, value] - } - setValueArray(updatedValueArray) + function toggleValue(optionValue: string) { + const updatedValueArray = valueArray.includes(optionValue) + ? valueArray.filter((v) => v !== optionValue) + : [...valueArray, optionValue] + + // Let react-hook-form handle the new value onChange(updatedValueArray) } @@ -32,11 +31,11 @@ export function SelectMultipleField(props: FormFieldProps) { {() => ( - {options.map(({ label, value }) => ( + {options.map(({ label, value: optionValue }) => ( setValueInArray(value)} - key={value} + key={optionValue} + checked={valueArray.includes(optionValue)} + onCheckedChange={() => toggleValue(optionValue)} asChild > Date: Mon, 4 Aug 2025 15:36:54 -0700 Subject: [PATCH 207/213] Version Packages (#453) Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> --- .changeset/spicy-walls-behave.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/spicy-walls-behave.md diff --git a/.changeset/spicy-walls-behave.md b/.changeset/spicy-walls-behave.md deleted file mode 100644 index 0e46114c..00000000 --- a/.changeset/spicy-walls-behave.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@frigade/react": patch ---- - -Fixes an issue related to form type select/multiple diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 41e980bb..345c9433 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @frigade/react +## 2.10.1 + +### Patch Changes + +- d600eee: Fixes an issue related to form type select/multiple + ## 2.10.0 ### Minor Changes diff --git a/packages/react/package.json b/packages/react/package.json index 8fcf4f1b..66b996dd 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@frigade/react", - "version": "2.10.0", + "version": "2.10.1", "description": "Build better product onboarding, faster.", "type": "module", "main": "./dist/index.js", From 3a033f4b1110256737edcd57bb5db77adca7adce Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Mon, 4 Aug 2025 22:39:21 +0000 Subject: [PATCH 208/213] chore: run prepublish script --- packages/react/src/version.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/version.ts b/packages/react/src/version.ts index d881fe92..030afd49 100644 --- a/packages/react/src/version.ts +++ b/packages/react/src/version.ts @@ -1 +1 @@ -export const SDK_VERSION = '2.10.0'; \ No newline at end of file +export const SDK_VERSION = '2.10.1'; \ No newline at end of file From a63811124a6230abb3fff9d51db8126947da1d47 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 17 Nov 2025 15:54:33 -0800 Subject: [PATCH 209/213] chore(deps-dev): bump playwright from 1.47.1 to 1.55.1 (#458) Bumps [playwright](https://github.com/microsoft/playwright) from 1.47.1 to 1.55.1. - [Release notes](https://github.com/microsoft/playwright/releases) - [Commits](https://github.com/microsoft/playwright/compare/v1.47.1...v1.55.1) --- updated-dependencies: - dependency-name: playwright dependency-version: 1.55.1 dependency-type: direct:development ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- apps/smithy/package.json | 2 +- yarn.lock | 28 ++++++++++++++++++++++++++-- 2 files changed, 27 insertions(+), 3 deletions(-) diff --git a/apps/smithy/package.json b/apps/smithy/package.json index 7bfd7e80..10651e20 100644 --- a/apps/smithy/package.json +++ b/apps/smithy/package.json @@ -35,7 +35,7 @@ "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-refresh": "^0.4.5", "eslint-plugin-storybook": "^0.11.2", - "playwright": "^1.47.1", + "playwright": "^1.55.1", "prop-types": "^15.8.1", "storybook": "^8.5.3", "typescript": "^4.9.4", diff --git a/yarn.lock b/yarn.lock index 1a7dfcce..d9eaae20 100644 --- a/yarn.lock +++ b/yarn.lock @@ -16927,7 +16927,16 @@ __metadata: languageName: node linkType: hard -"playwright@npm:^1.14.0, playwright@npm:^1.47.1": +"playwright-core@npm:1.56.1": + version: 1.56.1 + resolution: "playwright-core@npm:1.56.1" + bin: + playwright-core: cli.js + checksum: 10/df785eb3b3a8392b10dcde5f768e09b7fe459a7b06ed81180da69e048f2154b761f86d79572c2b62037a1f18a44e4ace72f5b6547f4f473b4ab13ab1d94007d2 + languageName: node + linkType: hard + +"playwright@npm:^1.14.0": version: 1.47.1 resolution: "playwright@npm:1.47.1" dependencies: @@ -16942,6 +16951,21 @@ __metadata: languageName: node linkType: hard +"playwright@npm:^1.55.1": + version: 1.56.1 + resolution: "playwright@npm:1.56.1" + dependencies: + fsevents: "npm:2.3.2" + playwright-core: "npm:1.56.1" + dependenciesMeta: + fsevents: + optional: true + bin: + playwright: cli.js + checksum: 10/f1743f93b26f1d497257771428d93f3c9ed2d75b00d935f0cd1556ff2dc61d47f2df8b381d752fbd2c47082b685f0ffe4cc4b7ba440d7b4ba3a08572aec58fba + languageName: node + linkType: hard + "polished@npm:^4.2.2": version: 4.3.1 resolution: "polished@npm:4.3.1" @@ -18560,7 +18584,7 @@ __metadata: eslint-plugin-react-hooks: "npm:^4.6.0" eslint-plugin-react-refresh: "npm:^0.4.5" eslint-plugin-storybook: "npm:^0.11.2" - playwright: "npm:^1.47.1" + playwright: "npm:^1.55.1" prop-types: "npm:^15.8.1" react: "npm:^19.0.0" react-dom: "npm:^19.0.0" From 7acf78a8fa82a424e066ab1b10a1618167b9711b Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 17 Nov 2025 15:57:35 -0800 Subject: [PATCH 210/213] chore(deps): bump form-data from 4.0.0 to 4.0.4 (#450) Bumps [form-data](https://github.com/form-data/form-data) from 4.0.0 to 4.0.4. - [Release notes](https://github.com/form-data/form-data/releases) - [Changelog](https://github.com/form-data/form-data/blob/master/CHANGELOG.md) - [Commits](https://github.com/form-data/form-data/compare/v4.0.0...v4.0.4) --- updated-dependencies: - dependency-name: form-data dependency-version: 4.0.4 dependency-type: indirect ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- yarn.lock | 117 ++++++++++++++++++++++++++++++++++++++++++++++++++++-- 1 file changed, 113 insertions(+), 4 deletions(-) diff --git a/yarn.lock b/yarn.lock index d9eaae20..824d1185 100644 --- a/yarn.lock +++ b/yarn.lock @@ -9599,6 +9599,16 @@ __metadata: languageName: node linkType: hard +"call-bind-apply-helpers@npm:^1.0.1, call-bind-apply-helpers@npm:^1.0.2": + version: 1.0.2 + resolution: "call-bind-apply-helpers@npm:1.0.2" + dependencies: + es-errors: "npm:^1.3.0" + function-bind: "npm:^1.1.2" + checksum: 10/00482c1f6aa7cfb30fb1dbeb13873edf81cfac7c29ed67a5957d60635a56b2a4a480f1016ddbdb3395cc37900d46037fb965043a51c5c789ffeab4fc535d18b5 + languageName: node + linkType: hard + "call-bind@npm:^1.0.0, call-bind@npm:^1.0.2, call-bind@npm:^1.0.5, call-bind@npm:^1.0.6, call-bind@npm:^1.0.7": version: 1.0.7 resolution: "call-bind@npm:1.0.7" @@ -10987,6 +10997,17 @@ __metadata: languageName: node linkType: hard +"dunder-proto@npm:^1.0.1": + version: 1.0.1 + resolution: "dunder-proto@npm:1.0.1" + dependencies: + call-bind-apply-helpers: "npm:^1.0.1" + es-errors: "npm:^1.3.0" + gopd: "npm:^1.2.0" + checksum: 10/5add88a3d68d42d6e6130a0cac450b7c2edbe73364bbd2fc334564418569bea97c6943a8fcd70e27130bf32afc236f30982fc4905039b703f23e9e0433c29934 + languageName: node + linkType: hard + "duplexify@npm:^3.5.0, duplexify@npm:^3.6.0": version: 3.7.1 resolution: "duplexify@npm:3.7.1" @@ -11284,6 +11305,13 @@ __metadata: languageName: node linkType: hard +"es-define-property@npm:^1.0.1": + version: 1.0.1 + resolution: "es-define-property@npm:1.0.1" + checksum: 10/f8dc9e660d90919f11084db0a893128f3592b781ce967e4fccfb8f3106cb83e400a4032c559184ec52ee1dbd4b01e7776c7cd0b3327b1961b1a4a7008920fe78 + languageName: node + linkType: hard + "es-errors@npm:^1.0.0, es-errors@npm:^1.1.0, es-errors@npm:^1.2.1, es-errors@npm:^1.3.0": version: 1.3.0 resolution: "es-errors@npm:1.3.0" @@ -11338,6 +11366,15 @@ __metadata: languageName: node linkType: hard +"es-object-atoms@npm:^1.0.0, es-object-atoms@npm:^1.1.1": + version: 1.1.1 + resolution: "es-object-atoms@npm:1.1.1" + dependencies: + es-errors: "npm:^1.3.0" + checksum: 10/54fe77de288451dae51c37bfbfe3ec86732dc3778f98f3eb3bdb4bf48063b2c0b8f9c93542656986149d08aa5be3204286e2276053d19582b76753f1a2728867 + languageName: node + linkType: hard + "es-set-tostringtag@npm:^2.0.2": version: 2.0.2 resolution: "es-set-tostringtag@npm:2.0.2" @@ -11349,6 +11386,18 @@ __metadata: languageName: node linkType: hard +"es-set-tostringtag@npm:^2.1.0": + version: 2.1.0 + resolution: "es-set-tostringtag@npm:2.1.0" + dependencies: + es-errors: "npm:^1.3.0" + get-intrinsic: "npm:^1.2.6" + has-tostringtag: "npm:^1.0.2" + hasown: "npm:^2.0.2" + checksum: 10/86814bf8afbcd8966653f731415888019d4bc4aca6b6c354132a7a75bb87566751e320369654a101d23a91c87a85c79b178bcf40332839bd347aff437c4fb65f + languageName: node + linkType: hard + "es-shim-unscopables@npm:^1.0.0, es-shim-unscopables@npm:^1.0.2": version: 1.0.2 resolution: "es-shim-unscopables@npm:1.0.2" @@ -12760,13 +12809,15 @@ __metadata: linkType: hard "form-data@npm:^4.0.0": - version: 4.0.0 - resolution: "form-data@npm:4.0.0" + version: 4.0.4 + resolution: "form-data@npm:4.0.4" dependencies: asynckit: "npm:^0.4.0" combined-stream: "npm:^1.0.8" + es-set-tostringtag: "npm:^2.1.0" + hasown: "npm:^2.0.2" mime-types: "npm:^2.1.12" - checksum: 10/7264aa760a8cf09482816d8300f1b6e2423de1b02bba612a136857413fdc96d7178298ced106817655facc6b89036c6e12ae31c9eb5bdc16aabf502ae8a5d805 + checksum: 10/a4b62e21932f48702bc468cc26fb276d186e6b07b557e3dd7cc455872bdbb82db7db066844a64ad3cf40eaf3a753c830538183570462d3649fdfd705601cbcfb languageName: node linkType: hard @@ -12990,6 +13041,24 @@ __metadata: languageName: node linkType: hard +"get-intrinsic@npm:^1.2.6": + version: 1.3.0 + resolution: "get-intrinsic@npm:1.3.0" + dependencies: + call-bind-apply-helpers: "npm:^1.0.2" + es-define-property: "npm:^1.0.1" + es-errors: "npm:^1.3.0" + es-object-atoms: "npm:^1.1.1" + function-bind: "npm:^1.1.2" + get-proto: "npm:^1.0.1" + gopd: "npm:^1.2.0" + has-symbols: "npm:^1.1.0" + hasown: "npm:^2.0.2" + math-intrinsics: "npm:^1.1.0" + checksum: 10/6e9dd920ff054147b6f44cb98104330e87caafae051b6d37b13384a45ba15e71af33c3baeac7cb630a0aaa23142718dcf25b45cfdd86c184c5dcb4e56d953a10 + languageName: node + linkType: hard + "get-nonce@npm:^1.0.0": version: 1.0.1 resolution: "get-nonce@npm:1.0.1" @@ -13018,6 +13087,16 @@ __metadata: languageName: node linkType: hard +"get-proto@npm:^1.0.1": + version: 1.0.1 + resolution: "get-proto@npm:1.0.1" + dependencies: + dunder-proto: "npm:^1.0.1" + es-object-atoms: "npm:^1.0.0" + checksum: 10/4fc96afdb58ced9a67558698b91433e6b037aaa6f1493af77498d7c85b141382cf223c0e5946f334fb328ee85dfe6edd06d218eaf09556f4bc4ec6005d7f5f7b + languageName: node + linkType: hard + "get-stream@npm:^6.0.0, get-stream@npm:^6.0.1": version: 6.0.1 resolution: "get-stream@npm:6.0.1" @@ -13218,6 +13297,13 @@ __metadata: languageName: node linkType: hard +"gopd@npm:^1.2.0": + version: 1.2.0 + resolution: "gopd@npm:1.2.0" + checksum: 10/94e296d69f92dc1c0768fcfeecfb3855582ab59a7c75e969d5f96ce50c3d201fd86d5a2857c22565764d5bb8a816c7b1e58f133ec318cd56274da36c5e3fb1a1 + languageName: node + linkType: hard + "graceful-fs@npm:^4.1.11, graceful-fs@npm:^4.1.15, graceful-fs@npm:^4.1.2, graceful-fs@npm:^4.1.5, graceful-fs@npm:^4.1.6, graceful-fs@npm:^4.2.0, graceful-fs@npm:^4.2.11, graceful-fs@npm:^4.2.4, graceful-fs@npm:^4.2.6, graceful-fs@npm:^4.2.9": version: 4.2.11 resolution: "graceful-fs@npm:4.2.11" @@ -13324,7 +13410,14 @@ __metadata: languageName: node linkType: hard -"has-tostringtag@npm:^1.0.0, has-tostringtag@npm:^1.0.1": +"has-symbols@npm:^1.1.0": + version: 1.1.0 + resolution: "has-symbols@npm:1.1.0" + checksum: 10/959385c98696ebbca51e7534e0dc723ada325efa3475350951363cce216d27373e0259b63edb599f72eb94d6cde8577b4b2375f080b303947e560f85692834fa + languageName: node + linkType: hard + +"has-tostringtag@npm:^1.0.0, has-tostringtag@npm:^1.0.1, has-tostringtag@npm:^1.0.2": version: 1.0.2 resolution: "has-tostringtag@npm:1.0.2" dependencies: @@ -13352,6 +13445,15 @@ __metadata: languageName: node linkType: hard +"hasown@npm:^2.0.2": + version: 2.0.2 + resolution: "hasown@npm:2.0.2" + dependencies: + function-bind: "npm:^1.1.2" + checksum: 10/7898a9c1788b2862cf0f9c345a6bec77ba4a0c0983c7f19d610c382343d4f98fa260686b225dfb1f88393a66679d2ec58ee310c1d6868c081eda7918f32cc70a + languageName: node + linkType: hard + "he@npm:^1.2.0": version: 1.2.0 resolution: "he@npm:1.2.0" @@ -15681,6 +15783,13 @@ __metadata: languageName: node linkType: hard +"math-intrinsics@npm:^1.1.0": + version: 1.1.0 + resolution: "math-intrinsics@npm:1.1.0" + checksum: 10/11df2eda46d092a6035479632e1ec865b8134bdfc4bd9e571a656f4191525404f13a283a515938c3a8de934dbfd9c09674d9da9fa831e6eb7e22b50b197d2edd + languageName: node + linkType: hard + "mdast-util-definitions@npm:^4.0.0": version: 4.0.0 resolution: "mdast-util-definitions@npm:4.0.0" From 9f1be53c047358d37e6cc6a7d0642a436066f1bd Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 17 Nov 2025 15:57:52 -0800 Subject: [PATCH 211/213] chore(deps): bump js-yaml from 3.14.1 to 3.14.2 (#460) Bumps [js-yaml](https://github.com/nodeca/js-yaml) from 3.14.1 to 3.14.2. - [Changelog](https://github.com/nodeca/js-yaml/blob/master/CHANGELOG.md) - [Commits](https://github.com/nodeca/js-yaml/compare/3.14.1...3.14.2) --- updated-dependencies: - dependency-name: js-yaml dependency-version: 3.14.2 dependency-type: indirect ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- yarn.lock | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/yarn.lock b/yarn.lock index 824d1185..bb574ac8 100644 --- a/yarn.lock +++ b/yarn.lock @@ -15037,14 +15037,14 @@ __metadata: linkType: hard "js-yaml@npm:^3.13.0, js-yaml@npm:^3.13.1, js-yaml@npm:^3.6.1": - version: 3.14.1 - resolution: "js-yaml@npm:3.14.1" + version: 3.14.2 + resolution: "js-yaml@npm:3.14.2" dependencies: argparse: "npm:^1.0.7" esprima: "npm:^4.0.0" bin: js-yaml: bin/js-yaml.js - checksum: 10/9e22d80b4d0105b9899135365f746d47466ed53ef4223c529b3c0f7a39907743fdbd3c4379f94f1106f02755b5e90b2faaf84801a891135544e1ea475d1a1379 + checksum: 10/172e0b6007b0bf0fc8d2469c94424f7dd765c64a047d2b790831fecef2204a4054eabf4d911eb73ab8c9a3256ab8ba1ee8d655b789bf24bf059c772acc2075a1 languageName: node linkType: hard From 81d43c39693676ec13e33fdb8ff9a185c0a15958 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 17 Nov 2025 15:58:54 -0800 Subject: [PATCH 212/213] chore(deps): bump tar-fs from 2.1.2 to 2.1.4 (#456) Bumps [tar-fs](https://github.com/mafintosh/tar-fs) from 2.1.2 to 2.1.4. - [Commits](https://github.com/mafintosh/tar-fs/compare/v2.1.2...v2.1.4) --- updated-dependencies: - dependency-name: tar-fs dependency-version: 2.1.4 dependency-type: indirect ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- yarn.lock | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/yarn.lock b/yarn.lock index bb574ac8..ac4e2c94 100644 --- a/yarn.lock +++ b/yarn.lock @@ -19338,14 +19338,14 @@ __metadata: linkType: hard "tar-fs@npm:^2.1.1": - version: 2.1.2 - resolution: "tar-fs@npm:2.1.2" + version: 2.1.4 + resolution: "tar-fs@npm:2.1.4" dependencies: chownr: "npm:^1.1.1" mkdirp-classic: "npm:^0.5.2" pump: "npm:^3.0.0" tar-stream: "npm:^2.1.4" - checksum: 10/623f7e8e58a43578ba7368002c3cc7e321f6d170053ac0691d95172dbc7daf5dcf4347eb061277627340870ce6cfda89f5a5d633cc274c41ae6d69f54a2374e7 + checksum: 10/bdf7e3cb039522e39c6dae3084b1bca8d7bcc1de1906eae4a1caea6a2250d22d26dcc234118bf879b345d91ebf250a744b196e379334a4abcbb109a78db7d3be languageName: node linkType: hard From d83f21881ab5dac2023c674414723feebbb8edc5 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 17 Nov 2025 17:20:59 -0800 Subject: [PATCH 213/213] chore(deps): bump playwright from 1.47.1 to 1.56.1 (#461) Bumps [playwright](https://github.com/microsoft/playwright) from 1.47.1 to 1.56.1. - [Release notes](https://github.com/microsoft/playwright/releases) - [Commits](https://github.com/microsoft/playwright/compare/v1.47.1...v1.56.1) --- updated-dependencies: - dependency-name: playwright dependency-version: 1.56.1 dependency-type: indirect ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- yarn.lock | 25 +++++-------------------- 1 file changed, 5 insertions(+), 20 deletions(-) diff --git a/yarn.lock b/yarn.lock index ac4e2c94..354d4400 100644 --- a/yarn.lock +++ b/yarn.lock @@ -17027,15 +17027,6 @@ __metadata: languageName: node linkType: hard -"playwright-core@npm:1.47.1, playwright-core@npm:>=1.2.0": - version: 1.47.1 - resolution: "playwright-core@npm:1.47.1" - bin: - playwright-core: cli.js - checksum: 10/b5ee08e1a934237fca0f0f52a677e5d49e45578e14b48a886927428bdf453f355a120548ae2f3f97e28a9d5e23a213120f6d8f10e18ee3f9112b10716888dac4 - languageName: node - linkType: hard - "playwright-core@npm:1.56.1": version: 1.56.1 resolution: "playwright-core@npm:1.56.1" @@ -17045,22 +17036,16 @@ __metadata: languageName: node linkType: hard -"playwright@npm:^1.14.0": +"playwright-core@npm:>=1.2.0": version: 1.47.1 - resolution: "playwright@npm:1.47.1" - dependencies: - fsevents: "npm:2.3.2" - playwright-core: "npm:1.47.1" - dependenciesMeta: - fsevents: - optional: true + resolution: "playwright-core@npm:1.47.1" bin: - playwright: cli.js - checksum: 10/f4340f28485bd83a856a365a03af2013b3203c8134a075d05f1a834665e1204b98141c335d5c5c1600720c9e07db702db3dbff5ef138fc1c31d5feec3ac0057f + playwright-core: cli.js + checksum: 10/b5ee08e1a934237fca0f0f52a677e5d49e45578e14b48a886927428bdf453f355a120548ae2f3f97e28a9d5e23a213120f6d8f10e18ee3f9112b10716888dac4 languageName: node linkType: hard -"playwright@npm:^1.55.1": +"playwright@npm:^1.14.0, playwright@npm:^1.55.1": version: 1.56.1 resolution: "playwright@npm:1.56.1" dependencies: