From 675cf477b48dcf14589044512a0ceb4d5fef7f3c Mon Sep 17 00:00:00 2001 From: Segun Adebayo Date: Thu, 9 Jan 2025 17:57:32 +0000 Subject: [PATCH] chore: init --- bun.lockb | Bin 783996 -> 784052 bytes packages/react/package.json | 1 + .../focus-trap/examples/autofocus.tsx | 34 ++++++++++++ .../components/focus-trap/examples/basic.tsx | 20 +++++++ .../focus-trap/examples/initial-focus.tsx | 25 +++++++++ .../focus-trap/focus-trap.stories.tsx | 11 ++++ .../src/components/focus-trap/focus-trap.tsx | 51 ++++++++++++++++++ .../react/src/components/focus-trap/index.ts | 2 + packages/solid/package.json | 1 + .../focus-trap/examples/autofocus.tsx | 31 +++++++++++ .../components/focus-trap/examples/basic.tsx | 26 +++++++++ .../focus-trap/examples/initial-focus.tsx | 28 ++++++++++ .../focus-trap/focus-trap.stories.tsx | 11 ++++ .../src/components/focus-trap/focus-trap.tsx | 49 +++++++++++++++++ .../solid/src/components/focus-trap/index.tsx | 2 + packages/solid/src/components/index.tsx | 1 + 16 files changed, 293 insertions(+) create mode 100644 packages/react/src/components/focus-trap/examples/autofocus.tsx create mode 100644 packages/react/src/components/focus-trap/examples/basic.tsx create mode 100644 packages/react/src/components/focus-trap/examples/initial-focus.tsx create mode 100644 packages/react/src/components/focus-trap/focus-trap.stories.tsx create mode 100644 packages/react/src/components/focus-trap/focus-trap.tsx create mode 100644 packages/react/src/components/focus-trap/index.ts create mode 100644 packages/solid/src/components/focus-trap/examples/autofocus.tsx create mode 100644 packages/solid/src/components/focus-trap/examples/basic.tsx create mode 100644 packages/solid/src/components/focus-trap/examples/initial-focus.tsx create mode 100644 packages/solid/src/components/focus-trap/focus-trap.stories.tsx create mode 100644 packages/solid/src/components/focus-trap/focus-trap.tsx create mode 100644 packages/solid/src/components/focus-trap/index.tsx diff --git a/bun.lockb b/bun.lockb index 30526693bc71191708e405ea4bebc1cb6f19bff0..b3e6522a87f2e5320ed1e8c4e9390b729a5dc082 100755 GIT binary patch delta 26967 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 XMaADtOD%dc%9WYz6>{fqM9us!UD?P2 delta 27025 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 { + const [trapped, setTrapped] = useState(false) + const toggle = () => setTrapped((c) => !c) + + const buttonRef = useRef(null) + const getButtonNode = () => { + const node = buttonRef.current + if (!node) throw new Error('Button not found') + return node + } + + return ( +
+ + {trapped && ( + +
+ + {/* biome-ignore lint/a11y/noAutofocus: */} + + +
+
+ )} +
+ ) +} diff --git a/packages/react/src/components/focus-trap/examples/basic.tsx b/packages/react/src/components/focus-trap/examples/basic.tsx new file mode 100644 index 0000000000..1a625d4724 --- /dev/null +++ b/packages/react/src/components/focus-trap/examples/basic.tsx @@ -0,0 +1,20 @@ +import { useState } from 'react' +import { FocusTrap } from '../focus-trap' + +export const Basic = () => { + const [trapped, setTrapped] = useState(false) + return ( + <> + + +
+ +