@atom-learning/components 5.5.0-beta.1 → 5.6.0

package/dist/components/tile-interactive/TileInteractive.d.ts

@@ -2,10 +2,9 @@ import React from 'react';
 import { NavigatorActions } from '../../types';
 declare const StyledTileInteractive: import("@atom-learning/stitches-react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
-}, "border" | "borderRadius" | "css" | "diffused"> & import("@atom-learning/stitches-react/types/styled-component").TransformProps<{
+}, "border" | "borderRadius" | "css"> & import("@atom-learning/stitches-react/types/styled-component").TransformProps<{
     borderRadius?: "sm" | "md" | "lg" | undefined;
     border?: boolean | "true" | undefined;
-    diffused?: boolean | "true" | undefined;
 }, {
     sm: string;
     md: string;
@@ -240,6 +239,11 @@ declare const StyledTileInteractive: import("@atom-learning/stitches-react/types
             subjectNonVerbalReasoning: string;
             subjectCreativeWriting: string;
             subjectExamSkills: string;
+            subjectGcseEnglishLiterature: string;
+            subjectGcseMaths: string;
+            subjectGcseChemistry: string;
+            subjectGcsePhysics: string;
+            subjectGcseBiology: string;
             glBlueLight: string;
             glBluePrimary: string;
             glBlueDark: string;
@@ -606,6 +610,11 @@ declare const StyledTileInteractive: import("@atom-learning/stitches-react/types
         subjectNonVerbalReasoning: string;
         subjectCreativeWriting: string;
         subjectExamSkills: string;
+        subjectGcseEnglishLiterature: string;
+        subjectGcseMaths: string;
+        subjectGcseChemistry: string;
+        subjectGcsePhysics: string;
+        subjectGcseBiology: string;
         glBlueLight: string;
         glBluePrimary: string;
         glBlueDark: string;

package/dist/components/tile-toggle-group/TileToggleGroupItem.d.ts

@@ -2,10 +2,9 @@ import * as ToggleGroup from '@radix-ui/react-toggle-group';
 import * as React from 'react';
 declare const StyledTileToggleGroupItem: import("@atom-learning/stitches-react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
-}, "border" | "borderRadius" | "css" | "diffused"> & import("@atom-learning/stitches-react/types/styled-component").TransformProps<{
+}, "border" | "borderRadius" | "css"> & import("@atom-learning/stitches-react/types/styled-component").TransformProps<{
     borderRadius?: "sm" | "md" | "lg" | undefined;
     border?: boolean | "true" | undefined;
-    diffused?: boolean | "true" | undefined;
 }, {
     sm: string;
     md: string;
@@ -240,6 +239,11 @@ declare const StyledTileToggleGroupItem: import("@atom-learning/stitches-react/t
             subjectNonVerbalReasoning: string;
             subjectCreativeWriting: string;
             subjectExamSkills: string;
+            subjectGcseEnglishLiterature: string;
+            subjectGcseMaths: string;
+            subjectGcseChemistry: string;
+            subjectGcsePhysics: string;
+            subjectGcseBiology: string;
             glBlueLight: string;
             glBluePrimary: string;
             glBlueDark: string;
@@ -607,6 +611,11 @@ declare const StyledTileToggleGroupItem: import("@atom-learning/stitches-react/t
             subjectNonVerbalReasoning: string;
             subjectCreativeWriting: string;
             subjectExamSkills: string;
+            subjectGcseEnglishLiterature: string;
+            subjectGcseMaths: string;
+            subjectGcseChemistry: string;
+            subjectGcsePhysics: string;
+            subjectGcseBiology: string;
             glBlueLight: string;
             glBluePrimary: string;
             glBlueDark: string;
@@ -973,6 +982,11 @@ declare const StyledTileToggleGroupItem: import("@atom-learning/stitches-react/t
         subjectNonVerbalReasoning: string;
         subjectCreativeWriting: string;
         subjectExamSkills: string;
+        subjectGcseEnglishLiterature: string;
+        subjectGcseMaths: string;
+        subjectGcseChemistry: string;
+        subjectGcsePhysics: string;
+        subjectGcseBiology: string;
         glBlueLight: string;
         glBluePrimary: string;
         glBlueDark: string;

package/dist/components/toast/Toast.d.ts

@@ -252,6 +252,11 @@ export declare const StyledToast: import("@atom-learning/stitches-react/types/st
         subjectNonVerbalReasoning: string;
         subjectCreativeWriting: string;
         subjectExamSkills: string;
+        subjectGcseEnglishLiterature: string;
+        subjectGcseMaths: string;
+        subjectGcseChemistry: string;
+        subjectGcsePhysics: string;
+        subjectGcseBiology: string;
         glBlueLight: string;
         glBluePrimary: string;
         glBlueDark: string;
@@ -617,6 +622,11 @@ export declare const StyledToast: import("@atom-learning/stitches-react/types/st
         subjectNonVerbalReasoning: string;
         subjectCreativeWriting: string;
         subjectExamSkills: string;
+        subjectGcseEnglishLiterature: string;
+        subjectGcseMaths: string;
+        subjectGcseChemistry: string;
+        subjectGcsePhysics: string;
+        subjectGcseBiology: string;
         glBlueLight: string;
         glBluePrimary: string;
         glBlueDark: string;

package/dist/components/toggle-group/ToggleGroupButton.d.ts

@@ -232,6 +232,11 @@ export declare const StyledButton: import("@atom-learning/stitches-react/types/s
         subjectNonVerbalReasoning: string;
         subjectCreativeWriting: string;
         subjectExamSkills: string;
+        subjectGcseEnglishLiterature: string;
+        subjectGcseMaths: string;
+        subjectGcseChemistry: string;
+        subjectGcsePhysics: string;
+        subjectGcseBiology: string;
         glBlueLight: string;
         glBluePrimary: string;
         glBlueDark: string;
@@ -598,6 +603,11 @@ export declare const StyledButton: import("@atom-learning/stitches-react/types/s
         subjectNonVerbalReasoning: string;
         subjectCreativeWriting: string;
         subjectExamSkills: string;
+        subjectGcseEnglishLiterature: string;
+        subjectGcseMaths: string;
+        subjectGcseChemistry: string;
+        subjectGcsePhysics: string;
+        subjectGcseBiology: string;
         glBlueLight: string;
         glBluePrimary: string;
         glBlueDark: string;

package/dist/components/toggle-group/ToggleGroupItem.d.ts

@@ -232,6 +232,11 @@ export declare const StyledItem: import("@atom-learning/stitches-react/types/sty
         subjectNonVerbalReasoning: string;
         subjectCreativeWriting: string;
         subjectExamSkills: string;
+        subjectGcseEnglishLiterature: string;
+        subjectGcseMaths: string;
+        subjectGcseChemistry: string;
+        subjectGcsePhysics: string;
+        subjectGcseBiology: string;
         glBlueLight: string;
         glBluePrimary: string;
         glBlueDark: string;
@@ -596,6 +601,11 @@ export declare const ToggleGroupItem: import("@atom-learning/stitches-react/type
         subjectNonVerbalReasoning: string;
         subjectCreativeWriting: string;
         subjectExamSkills: string;
+        subjectGcseEnglishLiterature: string;
+        subjectGcseMaths: string;
+        subjectGcseChemistry: string;
+        subjectGcsePhysics: string;
+        subjectGcseBiology: string;
         glBlueLight: string;
         glBluePrimary: string;
         glBlueDark: string;

package/dist/components/toggle-group/ToggleGroupRoot.d.ts

@@ -243,6 +243,11 @@ export declare const StyledRoot: import("@atom-learning/stitches-react/types/sty
         subjectNonVerbalReasoning: string;
         subjectCreativeWriting: string;
         subjectExamSkills: string;
+        subjectGcseEnglishLiterature: string;
+        subjectGcseMaths: string;
+        subjectGcseChemistry: string;
+        subjectGcsePhysics: string;
+        subjectGcseBiology: string;
         glBlueLight: string;
         glBluePrimary: string;
         glBlueDark: string;

package/dist/components/toggle-group/index.d.ts

@@ -232,6 +232,11 @@ export declare const ToggleGroup: {
             subjectNonVerbalReasoning: string;
             subjectCreativeWriting: string;
             subjectExamSkills: string;
+            subjectGcseEnglishLiterature: string;
+            subjectGcseMaths: string;
+            subjectGcseChemistry: string;
+            subjectGcsePhysics: string;
+            subjectGcseBiology: string;
             glBlueLight: string;
             glBluePrimary: string;
             glBlueDark: string;
@@ -597,6 +602,11 @@ export declare const ToggleGroup: {
                 subjectNonVerbalReasoning: string;
                 subjectCreativeWriting: string;
                 subjectExamSkills: string;
+                subjectGcseEnglishLiterature: string;
+                subjectGcseMaths: string;
+                subjectGcseChemistry: string;
+                subjectGcsePhysics: string;
+                subjectGcseBiology: string;
                 glBlueLight: string;
                 glBluePrimary: string;
                 glBlueDark: string;
@@ -965,6 +975,11 @@ export declare const ToggleGroup: {
                 subjectNonVerbalReasoning: string;
                 subjectCreativeWriting: string;
                 subjectExamSkills: string;
+                subjectGcseEnglishLiterature: string;
+                subjectGcseMaths: string;
+                subjectGcseChemistry: string;
+                subjectGcsePhysics: string;
+                subjectGcseBiology: string;
                 glBlueLight: string;
                 glBluePrimary: string;
                 glBlueDark: string;
@@ -1339,6 +1354,11 @@ export declare const ToggleGroup: {
                 subjectNonVerbalReasoning: string;
                 subjectCreativeWriting: string;
                 subjectExamSkills: string;
+                subjectGcseEnglishLiterature: string;
+                subjectGcseMaths: string;
+                subjectGcseChemistry: string;
+                subjectGcsePhysics: string;
+                subjectGcseBiology: string;
                 glBlueLight: string;
                 glBluePrimary: string;
                 glBlueDark: string;
@@ -1470,7 +1490,7 @@ export declare const ToggleGroup: {
                 marginBottom: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
             };
         }> | undefined;
-    }, "gap" | "wrap"> & (((Omit<import("@radix-ui/react-toggle-group").ToggleGroupSingleProps & import("react").RefAttributes<HTMLDivElement> & {
+    }, "gap" | "wrap"> & ((Omit<import("@radix-ui/react-toggle-group").ToggleGroupSingleProps & import("react").RefAttributes<HTMLDivElement> & {
         disableDeselect?: boolean;
     }, "direction" | "css" | "isFullWidth" | "hasGap"> & import("@atom-learning/stitches-react/types/styled-component").TransformProps<{
         isFullWidth?: boolean | "true" | undefined;
@@ -1710,6 +1730,11 @@ export declare const ToggleGroup: {
                 subjectNonVerbalReasoning: string;
                 subjectCreativeWriting: string;
                 subjectExamSkills: string;
+                subjectGcseEnglishLiterature: string;
+                subjectGcseMaths: string;
+                subjectGcseChemistry: string;
+                subjectGcsePhysics: string;
+                subjectGcseBiology: string;
                 glBlueLight: string;
                 glBluePrimary: string;
                 glBlueDark: string;
@@ -2081,6 +2106,11 @@ export declare const ToggleGroup: {
                 subjectNonVerbalReasoning: string;
                 subjectCreativeWriting: string;
                 subjectExamSkills: string;
+                subjectGcseEnglishLiterature: string;
+                subjectGcseMaths: string;
+                subjectGcseChemistry: string;
+                subjectGcsePhysics: string;
+                subjectGcseBiology: string;
                 glBlueLight: string;
                 glBluePrimary: string;
                 glBlueDark: string;
@@ -2215,5 +2245,5 @@ export declare const ToggleGroup: {
     })) & {
         orientation?: "horizontal" | "vertical";
         isFullWidth?: boolean;
-    })>;
+    }>;
 };

package/dist/components/tooltip/Tooltip.d.ts

@@ -241,6 +241,11 @@ export declare const Tooltip: {
                 subjectNonVerbalReasoning: string;
                 subjectCreativeWriting: string;
                 subjectExamSkills: string;
+                subjectGcseEnglishLiterature: string;
+                subjectGcseMaths: string;
+                subjectGcseChemistry: string;
+                subjectGcsePhysics: string;
+                subjectGcseBiology: string;
                 glBlueLight: string;
                 glBluePrimary: string;
                 glBlueDark: string;
@@ -606,6 +611,11 @@ export declare const Tooltip: {
             subjectNonVerbalReasoning: string;
             subjectCreativeWriting: string;
             subjectExamSkills: string;
+            subjectGcseEnglishLiterature: string;
+            subjectGcseMaths: string;
+            subjectGcseChemistry: string;
+            subjectGcsePhysics: string;
+            subjectGcseBiology: string;
             glBlueLight: string;
             glBluePrimary: string;
             glBlueDark: string;

package/dist/components/tooltip/TooltipContent.d.ts

@@ -235,6 +235,11 @@ declare const StyledContent: import("@atom-learning/stitches-react/types/styled-
         subjectNonVerbalReasoning: string;
         subjectCreativeWriting: string;
         subjectExamSkills: string;
+        subjectGcseEnglishLiterature: string;
+        subjectGcseMaths: string;
+        subjectGcseChemistry: string;
+        subjectGcsePhysics: string;
+        subjectGcseBiology: string;
         glBlueLight: string;
         glBluePrimary: string;
         glBlueDark: string;

package/dist/components/top-bar/TopBar.d.ts

@@ -3,7 +3,6 @@ import { CSS } from '../../stitches';
 declare const StyledRoot: import("@atom-learning/stitches-react/types/styled-component").StyledComponent<"div", {
     hasScrolled?: boolean | "true" | undefined;
     size?: "md" | "lg" | undefined;
-    diffused?: boolean | "true" | undefined;
     appearance?: "standard" | "rounded" | undefined;
 }, {
     sm: string;
@@ -238,6 +237,11 @@ declare const StyledRoot: import("@atom-learning/stitches-react/types/styled-com
         subjectNonVerbalReasoning: string;
         subjectCreativeWriting: string;
         subjectExamSkills: string;
+        subjectGcseEnglishLiterature: string;
+        subjectGcseMaths: string;
+        subjectGcseChemistry: string;
+        subjectGcsePhysics: string;
+        subjectGcseBiology: string;
         glBlueLight: string;
         glBluePrimary: string;
         glBlueDark: string;
@@ -375,7 +379,7 @@ type TopBarProps = StyledRootProps & {
     className?: string;
 };
 export declare const TopBar: {
-    ({ size, diffused, className, appearance, ...props }: React.PropsWithChildren<TopBarProps>): React.JSX.Element;
+    ({ size, className, appearance, ...props }: React.PropsWithChildren<TopBarProps>): React.JSX.Element;
     displayName: string;
 } & {
     Brand: import("@atom-learning/stitches-react/types/styled-component").StyledComponent<"a", {}, {
@@ -611,6 +615,11 @@ export declare const TopBar: {
             subjectNonVerbalReasoning: string;
             subjectCreativeWriting: string;
             subjectExamSkills: string;
+            subjectGcseEnglishLiterature: string;
+            subjectGcseMaths: string;
+            subjectGcseChemistry: string;
+            subjectGcsePhysics: string;
+            subjectGcseBiology: string;
             glBlueLight: string;
             glBluePrimary: string;
             glBlueDark: string;
@@ -984,6 +993,11 @@ export declare const TopBar: {
                 subjectNonVerbalReasoning: string;
                 subjectCreativeWriting: string;
                 subjectExamSkills: string;
+                subjectGcseEnglishLiterature: string;
+                subjectGcseMaths: string;
+                subjectGcseChemistry: string;
+                subjectGcsePhysics: string;
+                subjectGcseBiology: string;
                 glBlueLight: string;
                 glBluePrimary: string;
                 glBlueDark: string;
@@ -1350,6 +1364,11 @@ export declare const TopBar: {
             subjectNonVerbalReasoning: string;
             subjectCreativeWriting: string;
             subjectExamSkills: string;
+            subjectGcseEnglishLiterature: string;
+            subjectGcseMaths: string;
+            subjectGcseChemistry: string;
+            subjectGcsePhysics: string;
+            subjectGcseBiology: string;
             glBlueLight: string;
             glBluePrimary: string;
             glBlueDark: string;
@@ -1484,7 +1503,7 @@ export declare const TopBar: {
     ActionIcon: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
         ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
     }, "appearance" | "size" | "css" | "theme" | "isRounded"> & import("@atom-learning/stitches-react/types/styled-component").TransformProps<{
-        theme?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
+        theme?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
         appearance?: "outline" | "solid" | "simple" | undefined;
         size?: "xs" | "sm" | "md" | "lg" | undefined;
         isRounded?: boolean | "true" | undefined;
@@ -1722,6 +1741,11 @@ export declare const TopBar: {
                 subjectNonVerbalReasoning: string;
                 subjectCreativeWriting: string;
                 subjectExamSkills: string;
+                subjectGcseEnglishLiterature: string;
+                subjectGcseMaths: string;
+                subjectGcseChemistry: string;
+                subjectGcsePhysics: string;
+                subjectGcseBiology: string;
                 glBlueLight: string;
                 glBluePrimary: string;
                 glBlueDark: string;
@@ -1853,8 +1877,8 @@ export declare const TopBar: {
                 marginBottom: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
             };
         }> | undefined;
-    }, "appearance" | "size" | "theme" | "label" | "children" | "as" | keyof import("../../types").NavigatorActions | "hasTooltip" | "tooltipSide" | "isRounded"> & import("@atom-learning/stitches-react/types/styled-component").TransformProps<{
-        theme?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
+    }, "appearance" | "size" | "theme" | "label" | "children" | "as" | "hasTooltip" | "tooltipSide" | "isRounded" | keyof import("../../types").NavigatorActions> & import("@atom-learning/stitches-react/types/styled-component").TransformProps<{
+        theme?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
         appearance?: "outline" | "solid" | "simple" | undefined;
         size?: "xs" | "sm" | "md" | "lg" | undefined;
         isRounded?: boolean | "true" | undefined;

package/dist/components/top-bar/TopBar.js

@@ -1,2 +1,2 @@
-import*as r from"react";import{styled as o}from"../../stitches.js";import{useWindowScrollPosition as p}from"../../utilities/hooks/useWindowScrollPosition.js";import{Divider as m}from"../divider/Divider.js";import{Flex as c}from"../flex/Flex.js";import{colorSchemes as l}from"./stitches.topBar.colorscheme.config.js";import{TopBarActionIcon as f}from"./TopBarActionIcon.js";import{TopBarBrand as h,TopBarBrandLogo as g,TopBarBrandName as x}from"./TopBarBrand.js";const b=()=>r.createElement(m,{orientation:"vertical",css:{height:"$2",bg:"$divider"}}),u=o("div",{bg:"$background",position:"sticky",display:"flex",alignItems:"center",zIndex:1,transition:"box-shadow .2s ease-out",variants:{hasScrolled:{true:{boxShadow:"0px 4px 4px -2px rgba(31, 31, 31, 0.1);"}},size:{md:{height:"$6"},lg:{height:"$7"}},diffused:{true:{"@supports (background-color: color-mix(in hsl, white 50%, transparent))":{bg:"color-mix(in hsl, $background 70%, transparent)",backdropFilter:"blur(8px)"}}},appearance:{standard:{width:"100vw",top:"0",borderBottom:"1px solid $borderBottom"},rounded:{width:"100%",top:"$2",p:"$2",border:"1px solid #ffffff",borderRadius:"$round"}}}}),B=o(c,{alignItems:"center",height:"$4",mx:"$4",width:"100%","@md":{mx:"$5"}}),e=({size:t="md",diffused:a,className:i=l.light,appearance:d="standard",...n})=>{const{y:s}=p();return r.createElement(u,{className:i,hasScrolled:!!s,diffused:a,appearance:d,size:t},r.createElement(B,{...n}))},$=Object.assign(e,{Brand:h,BrandLogo:g,BrandName:x,ActionIcon:f,Divider:b});e.displayName="TopBar";export{$ as TopBar};
+import*as o from"react";import{styled as r}from"../../stitches.js";import{useWindowScrollPosition as s}from"../../utilities/hooks/useWindowScrollPosition.js";import{Divider as m}from"../divider/Divider.js";import{Flex as p}from"../flex/Flex.js";import{colorSchemes as c}from"./stitches.topBar.colorscheme.config.js";import{TopBarActionIcon as l}from"./TopBarActionIcon.js";import{TopBarBrand as h,TopBarBrandLogo as g,TopBarBrandName as f}from"./TopBarBrand.js";const x=()=>o.createElement(m,{orientation:"vertical",css:{height:"$2",bg:"$divider"}}),B=r("div",{bg:"$background",position:"sticky",display:"flex",alignItems:"center",zIndex:1,transition:"box-shadow .2s ease-out",variants:{hasScrolled:{true:{boxShadow:"0px 4px 4px -2px rgba(31, 31, 31, 0.1);"}},size:{md:{height:"$6"},lg:{height:"$7"}},appearance:{standard:{width:"100vw",top:"0",borderBottom:"1px solid $borderBottom"},rounded:{width:"100%",top:"$2",p:"$2",border:"1px solid #ffffff",borderRadius:"$round"}}}}),$=r(p,{alignItems:"center",height:"$4",mx:"$4",width:"100%","@md":{mx:"$5"}}),e=({size:t="md",className:a=c.light,appearance:i="standard",...d})=>{const{y:n}=s();return o.createElement(B,{className:a,hasScrolled:!!n,appearance:i,size:t},o.createElement($,{...d}))},b=Object.assign(e,{Brand:h,BrandLogo:g,BrandName:f,ActionIcon:l,Divider:x});e.displayName="TopBar";export{b as TopBar};
 //# sourceMappingURL=TopBar.js.map

package/dist/components/top-bar/TopBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"TopBar.js","sources":["../../../src/components/top-bar/TopBar.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { CSS, styled } from '~/stitches'\nimport { useWindowScrollPosition } from '~/utilities/hooks/useWindowScrollPosition'\n\nimport { Divider } from '../divider'\nimport { Flex } from '../flex'\nimport { colorSchemes as topBarColorSchemes } from './stitches.topBar.colorscheme.config'\nimport { TopBarActionIcon } from './TopBarActionIcon'\nimport { TopBarBrand, TopBarBrandLogo, TopBarBrandName } from './TopBarBrand'\n\nconst TopBarDivider = () => (\n  <Divider orientation=\"vertical\" css={{ height: '$2', bg: '$divider' }} />\n)\n\nconst StyledRoot = styled('div', {\n  bg: '$background',\n  position: 'sticky',\n  display: 'flex',\n  alignItems: 'center',\n\n  zIndex: 1,\n  transition: 'box-shadow .2s ease-out',\n  variants: {\n    hasScrolled: {\n      true: { boxShadow: '0px 4px 4px -2px rgba(31, 31, 31, 0.1);' }\n    },\n    size: {\n      md: { height: '$6' },\n      lg: { height: '$7' }\n    },\n    diffused: {\n      true: {\n        '@supports (background-color: color-mix(in hsl, white 50%, transparent))':\n          {\n            bg: 'color-mix(in hsl, $background 70%, transparent)',\n            backdropFilter: 'blur(8px)'\n          }\n      }\n    },\n    appearance: {\n      standard: {\n        width: '100vw',\n        top: '0',\n        borderBottom: '1px solid $borderBottom'\n      },\n      rounded: {\n        width: '100%',\n        top: '$2',\n        p: '$2',\n        border: '1px solid #ffffff',\n        borderRadius: '$round'\n      }\n    }\n  }\n})\n\nconst Container = styled(Flex, {\n  alignItems: 'center',\n  height: '$4',\n  mx: '$4',\n  width: '100%',\n  '@md': {\n    mx: '$5'\n  }\n})\n\ntype StyledRootProps = React.ComponentProps<typeof StyledRoot>\n\ntype TopBarProps = StyledRootProps & {\n  css?: CSS\n  className?: string\n}\n\nconst TopBarComponent = ({\n  size = 'md',\n  diffused,\n  className = topBarColorSchemes['light'],\n  appearance = 'standard',\n  ...props\n}: React.PropsWithChildren<TopBarProps>) => {\n  const { y: scrollPositionY } = useWindowScrollPosition()\n\n  return (\n    <StyledRoot\n      className={className}\n      hasScrolled={!!scrollPositionY}\n      diffused={diffused}\n      appearance={appearance}\n      size={size}\n    >\n      <Container {...props} />\n    </StyledRoot>\n  )\n}\n\nexport const TopBar = Object.assign(TopBarComponent, {\n  Brand: TopBarBrand,\n  BrandLogo: TopBarBrandLogo,\n  BrandName: TopBarBrandName,\n  ActionIcon: TopBarActionIcon,\n  Divider: TopBarDivider\n})\n\nTopBarComponent.displayName = 'TopBar'\n"],"names":["TopBarDivider","React","Divider","StyledRoot","styled","Container","Flex","TopBarComponent","size","diffused","className","topBarColorSchemes","appearance","props","scrollPositionY","useWindowScrollPosition","TopBar","TopBarBrand","TopBarBrandLogo","TopBarBrandName","TopBarActionIcon"],"mappings":"8cAWA,MAAMA,EAAgB,IACpBC,EAAA,cAACC,EAAA,CAAQ,YAAY,WAAW,IAAK,CAAE,OAAQ,KAAM,GAAI,UAAW,CAAA,CAAG,EAGnEC,EAAaC,EAAO,MAAO,CAC/B,GAAI,cACJ,SAAU,SACV,QAAS,OACT,WAAY,SAEZ,OAAQ,EACR,WAAY,0BACZ,SAAU,CACR,YAAa,CACX,KAAM,CAAE,UAAW,yCAA0C,CAC/D,EACA,KAAM,CACJ,GAAI,CAAE,OAAQ,IAAK,EACnB,GAAI,CAAE,OAAQ,IAAK,CACrB,EACA,SAAU,CACR,KAAM,CACJ,0EACE,CACE,GAAI,kDACJ,eAAgB,WAClB,CACJ,CACF,EACA,WAAY,CACV,SAAU,CACR,MAAO,QACP,IAAK,IACL,aAAc,yBAChB,EACA,QAAS,CACP,MAAO,OACP,IAAK,KACL,EAAG,KACH,OAAQ,oBACR,aAAc,QAChB,CACF,CACF,CACF,CAAC,EAEKC,EAAYD,EAAOE,EAAM,CAC7B,WAAY,SACZ,OAAQ,KACR,GAAI,KACJ,MAAO,OACP,MAAO,CACL,GAAI,IACN,CACF,CAAC,EASKC,EAAkB,CAAC,CACvB,KAAAC,EAAO,KACP,SAAAC,EACA,UAAAC,EAAYC,EAAmB,MAC/B,WAAAC,EAAa,cACVC,CACL,IAA4C,CAC1C,KAAM,CAAE,EAAGC,CAAgB,EAAIC,IAE/B,OACEd,EAAA,cAACE,EAAA,CACC,UAAWO,EACX,YAAa,CAAC,CAACI,EACf,SAAUL,EACV,WAAYG,EACZ,KAAMJ,CAAAA,EAENP,EAAA,cAACI,EAAA,CAAW,GAAGQ,CAAO,CAAA,CACxB,CAEJ,EAEaG,EAAS,OAAO,OAAOT,EAAiB,CACnD,MAAOU,EACP,UAAWC,EACX,UAAWC,EACX,WAAYC,EACZ,QAASpB,CACX,CAAC,EAEDO,EAAgB,YAAc"}
+{"version":3,"file":"TopBar.js","sources":["../../../src/components/top-bar/TopBar.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { CSS, styled } from '~/stitches'\nimport { useWindowScrollPosition } from '~/utilities/hooks/useWindowScrollPosition'\n\nimport { Divider } from '../divider'\nimport { Flex } from '../flex'\nimport { colorSchemes as topBarColorSchemes } from './stitches.topBar.colorscheme.config'\nimport { TopBarActionIcon } from './TopBarActionIcon'\nimport { TopBarBrand, TopBarBrandLogo, TopBarBrandName } from './TopBarBrand'\n\nconst TopBarDivider = () => (\n  <Divider orientation=\"vertical\" css={{ height: '$2', bg: '$divider' }} />\n)\n\nconst StyledRoot = styled('div', {\n  bg: '$background',\n  position: 'sticky',\n  display: 'flex',\n  alignItems: 'center',\n\n  zIndex: 1,\n  transition: 'box-shadow .2s ease-out',\n  variants: {\n    hasScrolled: {\n      true: { boxShadow: '0px 4px 4px -2px rgba(31, 31, 31, 0.1);' }\n    },\n    size: {\n      md: { height: '$6' },\n      lg: { height: '$7' }\n    },\n    appearance: {\n      standard: {\n        width: '100vw',\n        top: '0',\n        borderBottom: '1px solid $borderBottom'\n      },\n      rounded: {\n        width: '100%',\n        top: '$2',\n        p: '$2',\n        border: '1px solid #ffffff',\n        borderRadius: '$round'\n      }\n    }\n  }\n})\n\nconst Container = styled(Flex, {\n  alignItems: 'center',\n  height: '$4',\n  mx: '$4',\n  width: '100%',\n  '@md': {\n    mx: '$5'\n  }\n})\n\ntype StyledRootProps = React.ComponentProps<typeof StyledRoot>\n\ntype TopBarProps = StyledRootProps & {\n  css?: CSS\n  className?: string\n}\n\nconst TopBarComponent = ({\n  size = 'md',\n  className = topBarColorSchemes['light'],\n  appearance = 'standard',\n  ...props\n}: React.PropsWithChildren<TopBarProps>) => {\n  const { y: scrollPositionY } = useWindowScrollPosition()\n\n  return (\n    <StyledRoot\n      className={className}\n      hasScrolled={!!scrollPositionY}\n      appearance={appearance}\n      size={size}\n    >\n      <Container {...props} />\n    </StyledRoot>\n  )\n}\n\nexport const TopBar = Object.assign(TopBarComponent, {\n  Brand: TopBarBrand,\n  BrandLogo: TopBarBrandLogo,\n  BrandName: TopBarBrandName,\n  ActionIcon: TopBarActionIcon,\n  Divider: TopBarDivider\n})\n\nTopBarComponent.displayName = 'TopBar'\n"],"names":["TopBarDivider","React","Divider","StyledRoot","styled","Container","Flex","TopBarComponent","size","className","topBarColorSchemes","appearance","props","scrollPositionY","useWindowScrollPosition","TopBar","TopBarBrand","TopBarBrandLogo","TopBarBrandName","TopBarActionIcon"],"mappings":"8cAWA,MAAMA,EAAgB,IACpBC,EAAA,cAACC,EAAA,CAAQ,YAAY,WAAW,IAAK,CAAE,OAAQ,KAAM,GAAI,UAAW,EAAG,EAGnEC,EAAaC,EAAO,MAAO,CAC/B,GAAI,cACJ,SAAU,SACV,QAAS,OACT,WAAY,SAEZ,OAAQ,EACR,WAAY,0BACZ,SAAU,CACR,YAAa,CACX,KAAM,CAAE,UAAW,yCAA0C,CAC/D,EACA,KAAM,CACJ,GAAI,CAAE,OAAQ,IAAK,EACnB,GAAI,CAAE,OAAQ,IAAK,CACrB,EACA,WAAY,CACV,SAAU,CACR,MAAO,QACP,IAAK,IACL,aAAc,yBAChB,EACA,QAAS,CACP,MAAO,OACP,IAAK,KACL,EAAG,KACH,OAAQ,oBACR,aAAc,QAChB,CACF,CACF,CACF,CAAC,EAEKC,EAAYD,EAAOE,EAAM,CAC7B,WAAY,SACZ,OAAQ,KACR,GAAI,KACJ,MAAO,OACP,MAAO,CACL,GAAI,IACN,CACF,CAAC,EASKC,EAAkB,CAAC,CACvB,KAAAC,EAAO,KACP,UAAAC,EAAYC,EAAmB,MAC/B,WAAAC,EAAa,cACVC,CACL,IAA4C,CAC1C,KAAM,CAAE,EAAGC,CAAgB,EAAIC,EAAAA,EAE/B,OACEb,EAAA,cAACE,EAAA,CACC,UAAWM,EACX,YAAa,CAAC,CAACI,EACf,WAAYF,EACZ,KAAMH,CAAAA,EAENP,EAAA,cAACI,EAAA,CAAW,GAAGO,CAAO,CAAA,CACxB,CAEJ,EAEaG,EAAS,OAAO,OAAOR,EAAiB,CACnD,MAAOS,EACP,UAAWC,EACX,UAAWC,EACX,WAAYC,EACZ,QAASnB,CACX,CAAC,EAEDO,EAAgB,YAAc"}

package/dist/components/top-bar/TopBarBrand.d.ts

@@ -242,6 +242,11 @@ export declare const TopBarBrandName: import("@atom-learning/stitches-react/type
             subjectNonVerbalReasoning: string;
             subjectCreativeWriting: string;
             subjectExamSkills: string;
+            subjectGcseEnglishLiterature: string;
+            subjectGcseMaths: string;
+            subjectGcseChemistry: string;
+            subjectGcsePhysics: string;
+            subjectGcseBiology: string;
             glBlueLight: string;
             glBluePrimary: string;
             glBlueDark: string;
@@ -608,6 +613,11 @@ export declare const TopBarBrandName: import("@atom-learning/stitches-react/type
         subjectNonVerbalReasoning: string;
         subjectCreativeWriting: string;
         subjectExamSkills: string;
+        subjectGcseEnglishLiterature: string;
+        subjectGcseMaths: string;
+        subjectGcseChemistry: string;
+        subjectGcsePhysics: string;
+        subjectGcseBiology: string;
         glBlueLight: string;
         glBluePrimary: string;
         glBlueDark: string;
@@ -972,6 +982,11 @@ export declare const TopBarBrand: import("@atom-learning/stitches-react/types/st
         subjectNonVerbalReasoning: string;
         subjectCreativeWriting: string;
         subjectExamSkills: string;
+        subjectGcseEnglishLiterature: string;
+        subjectGcseMaths: string;
+        subjectGcseChemistry: string;
+        subjectGcsePhysics: string;
+        subjectGcseBiology: string;
         glBlueLight: string;
         glBluePrimary: string;
         glBlueDark: string;