From 20515b921e70eb0ce7c9696bf05fc93ffb2dc9f2 Mon Sep 17 00:00:00 2001 From: Alexandre Asselin Date: Fri, 12 Jan 2024 13:13:47 -0500 Subject: [PATCH] patch: Change the breakpoint context to now throw when the provider has not been declared (#126) --- .changeset/famous-clocks-occur.md | 5 +++++ .../styled-system/src/responsive/BreakpointContext.tsx | 9 +++------ 2 files changed, 8 insertions(+), 6 deletions(-) create mode 100644 .changeset/famous-clocks-occur.md diff --git a/.changeset/famous-clocks-occur.md b/.changeset/famous-clocks-occur.md new file mode 100644 index 000000000..baaa6a4d0 --- /dev/null +++ b/.changeset/famous-clocks-occur.md @@ -0,0 +1,5 @@ +--- +"@hopper-ui/styled-system": patch +--- + +Modify the breakpoint context to not throw, so components can render even if no provider has been declared diff --git a/packages/styled-system/src/responsive/BreakpointContext.tsx b/packages/styled-system/src/responsive/BreakpointContext.tsx index cd9a89ab7..835af15ae 100644 --- a/packages/styled-system/src/responsive/BreakpointContext.tsx +++ b/packages/styled-system/src/responsive/BreakpointContext.tsx @@ -1,20 +1,17 @@ import { createContext, useContext } from "react"; -import { isNil } from "../utils/assertion.ts"; import type { Breakpoint } from "./Breakpoints.ts"; export interface BreakpointContextType { matchedBreakpoints: Breakpoint[]; } -export const BreakpointContext = createContext(undefined); +export const BreakpointContext = createContext({ + matchedBreakpoints: [] +}); export function useBreakpointContext() { const context = useContext(BreakpointContext); - if (isNil(context)) { - throw new Error("useBreakpointContext must be used within a BreakpointProvider"); - } - return context; }