@atlaskit/page-layout 1.3.3 → 1.3.5

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/page-layout
 
+## 1.3.5
+
+### Patch Changes
+
+- Updated dependencies
+
+## 1.3.4
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 1.3.3
 
 ### Patch Changes

package/__perf__/utils/product-integration/atlassian-navigation.tsx

@@ -71,14 +71,13 @@ const SettingsDrawer = () => {
   );
 };
 
-const buttonClick = (toLog: string) => (
-  e: MouseEvent<HTMLElement | HTMLAnchorElement>,
-) => {
-  if (e.ctrlKey || e.metaKey) {
-    return;
-  }
-  e.preventDefault();
-};
+const buttonClick =
+  (toLog: string) => (e: MouseEvent<HTMLElement | HTMLAnchorElement>) => {
+    if (e.ctrlKey || e.metaKey) {
+      return;
+    }
+    e.preventDefault();
+  };
 
 const primaryItems = [
   <PrimaryButton onClick={buttonClick('Projects')}>Projects</PrimaryButton>,

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/page-layout",
-	"version": "1.3.3",
+	"version": "1.3.5",
 	"sideEffects": false
 }

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/page-layout",
-	"version": "1.3.3",
+	"version": "1.3.5",
 	"sideEffects": false
 }

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/page-layout",
-	"version": "1.3.3",
+	"version": "1.3.5",
 	"sideEffects": false
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/page-layout",
-  "version": "1.3.3",
+  "version": "1.3.5",
   "description": "A collection of components which let you compose an application's page layout.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -12,14 +12,6 @@
   "module": "dist/esm/index.js",
   "module:es2019": "dist/es2019/index.js",
   "types": "dist/types/index.d.ts",
-  "typesVersions": {
-    ">=4.0 <4.5": {
-      "*": [
-        "dist/types-ts4.0/*",
-        "dist/types-ts4.0/index.d.ts"
-      ]
-    }
-  },
   "sideEffects": false,
   "atlaskit:src": "src/index.tsx",
   "atlassian": {
@@ -36,9 +28,9 @@
   "dependencies": {
     "@atlaskit/ds-lib": "^2.1.0",
     "@atlaskit/icon": "^21.11.0",
-    "@atlaskit/motion": "^1.2.0",
+    "@atlaskit/motion": "^1.3.0",
     "@atlaskit/theme": "^12.2.0",
-    "@atlaskit/tokens": "^0.10.0",
+    "@atlaskit/tokens": "^0.12.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1",
     "bind-event-listener": "^2.1.1",
@@ -49,20 +41,20 @@
     "react-dom": "^16.8.0"
   },
   "devDependencies": {
-    "@atlaskit/atlassian-navigation": "^2.2.0",
+    "@atlaskit/atlassian-navigation": "^2.3.0",
     "@atlaskit/atlassian-notifications": "^0.3.0",
-    "@atlaskit/button": "^16.3.0",
+    "@atlaskit/button": "^16.5.0",
     "@atlaskit/docs": "*",
-    "@atlaskit/drawer": "^7.3.0",
+    "@atlaskit/drawer": "^7.4.0",
     "@atlaskit/icon": "*",
     "@atlaskit/logo": "^13.10.0",
-    "@atlaskit/menu": "^1.3.0",
+    "@atlaskit/menu": "^1.4.0",
     "@atlaskit/notification-indicator": "^9.0.0",
     "@atlaskit/notification-log-client": "^6.0.0",
     "@atlaskit/onboarding": "^10.6.0",
     "@atlaskit/popup": "^1.5.0",
     "@atlaskit/section-message": "^6.3.0",
-    "@atlaskit/side-navigation": "^1.3.0",
+    "@atlaskit/side-navigation": "^1.4.0",
     "@atlaskit/ssr": "*",
     "@atlaskit/tooltip": "*",
     "@atlaskit/visual-regression": "*",

package/report.api.md

@@ -1,8 +1,17 @@
-## API Report File for "@atlaskit/page-layout".
+<!-- API Report Version: 2.2 -->
 
-> Do not edit this file. This report is auto-generated by [API Extractor](https://api-extractor.com/).
+## API Report File for "@atlaskit/page-layout"
 
-[Learn more about API reports](https://hello.atlassian.net/wiki/spaces/UR/pages/1825484529/Package+API+Reports)
+> Do not edit this file. This report is auto-generated using [API Extractor](https://api-extractor.com/).
+> [Learn more about API reports](https://hello.atlassian.net/wiki/spaces/UR/pages/1825484529/Package+API+Reports)
+
+### Table of contents
+
+- [Main Entry Types](#main-entry-types)
+
+### Main Entry Types
+
+<!--SECTION START: Main Entry Types-->
 
 ```ts
 import { ButtonHTMLAttributes } from 'react';
@@ -13,82 +22,55 @@ import { MouseEvent as MouseEvent_2 } from 'react';
 import { ReactElement } from 'react';
 import { ReactNode } from 'react';
 
-/**
- * __Banner__
- *
- * Provides a slot for a Banner within the PageLayout.
- *
- * - [Examples](https://atlassian.design/components/page-layout/examples)
- * - [Code](https://atlassian.design/components/page-layout/code)
- */
-export declare const Banner: (props: SlotHeightProps) => jsx.JSX.Element;
-
-export declare const BANNER_HEIGHT: string;
-
-/**
- * __Content__
- *
- * Provides a slot for your application content within the PageLayout.
- *
- * - [Examples](https://atlassian.design/components/page-layout/examples)
- * - [Code](https://atlassian.design/components/page-layout/code)
- */
-export declare const Content: (props: ContentProps) => jsx.JSX.Element;
-
-declare interface ContentProps {
-  /**
-   * React children
-   */
+// @public
+export const Banner: (props: SlotHeightProps) => jsx.JSX.Element;
+
+// @public (undocumented)
+export const BANNER_HEIGHT: string;
+
+// @public
+export const Content: (props: ContentProps) => jsx.JSX.Element;
+
+// @public (undocumented)
+interface ContentProps {
   children: ReactNode;
-  /**
-   * A `testId` prop is provided for specified elements, which is a unique string that appears as a data attribute `data-testid` in the rendered code, serving as a hook for automated tests.
-   */
   testId?: string;
 }
 
-declare type DimensionNames =
-  | 'leftPanelWidth'
+// @public (undocumented)
+type DimensionNames =
   | 'bannerHeight'
-  | 'topNavigationHeight'
-  | 'leftSidebarWidth'
+  | 'leftPanelWidth'
   | 'leftSidebarFlyoutWidth'
+  | 'leftSidebarWidth'
+  | 'rightPanelWidth'
   | 'rightSidebarWidth'
-  | 'rightPanelWidth';
-
-export declare type Dimensions = Partial<Record<DimensionNames, number>>;
-
-export declare const LEFT_PANEL_WIDTH: string;
-
-export declare const LEFT_SIDEBAR_WIDTH: string;
-
-/**
- * __Left panel__
- *
- * Provides a slot for a left panel within the PageLayout.
- *
- * - [Examples](https://atlassian.design/components/page-layout/examples)
- * - [Code](https://atlassian.design/components/page-layout/code)
- */
-export declare const LeftPanel: (props: SlotWidthProps) => jsx.JSX.Element;
-
-/**
- * __Left sidebar__
- *
- * Provides a slot for a left sidebar within the PageLayout.
- *
- * - [Examples](https://atlassian.design/components/page-layout/examples)
- * - [Code](https://atlassian.design/components/page-layout/code)
- */
-export declare const LeftSidebar: (props: LeftSidebarProps) => jsx.JSX.Element;
-
-declare interface LeftSidebarProps extends SlotWidthProps {
-  /**
-   * A `testId` prop is provided for specified elements, which is a unique string that appears as a data attribute `data-testid` in the rendered code, serving as a hook for automated tests.
-   */
-  testId?: string;
-  /**
-   * You can override prop(s) for the mentioned component(s).
-   */
+  | 'topNavigationHeight';
+
+// @public (undocumented)
+export type Dimensions = Partial<Record<DimensionNames, number>>;
+
+// @public (undocumented)
+export const LEFT_PANEL_WIDTH: string;
+
+// @public (undocumented)
+export const LEFT_SIDEBAR_WIDTH: string;
+
+// @public
+export const LeftPanel: (props: SlotWidthProps) => jsx.JSX.Element;
+
+// @public
+export const LeftSidebar: (props: LeftSidebarProps) => jsx.JSX.Element;
+
+// @public (undocumented)
+interface LeftSidebarProps extends SlotWidthProps {
+  collapsedState?: 'collapsed' | 'expanded';
+  onCollapse?: () => void;
+  onExpand?: () => void;
+  onFlyoutCollapse?: () => void;
+  onFlyoutExpand?: () => void;
+  onResizeEnd?: (leftSidebarState: LeftSidebarState) => void;
+  onResizeStart?: (leftSidebarState: LeftSidebarState) => void;
   overrides?: {
     ResizeButton?: {
       render?: (
@@ -97,49 +79,14 @@ declare interface LeftSidebarProps extends SlotWidthProps {
       ) => ReactElement;
     };
   };
-  /**
-   * Display label for grab area. This will be announced to the screenreaders when the grab area receives focus
-   */
-  resizeGrabAreaLabel?: string;
-  /**
-   * Display label for resize button.
-   */
   resizeButtonLabel?: string;
-  /**
-   * Called when left-sidebar is collapsed.
-   */
-  onCollapse?: () => void;
-  /**
-   * Called when left-sidebar is expanded.
-   */
-  onExpand?: () => void;
-  /**
-   * Called when left-sidebar resize starts using mouse or touch.
-   */
-  onResizeStart?: (leftSidebarState: LeftSidebarState) => void;
-  /**
-   * Called when left-sidebar resize ends using mouse or touch.
-   */
-  onResizeEnd?: (leftSidebarState: LeftSidebarState) => void;
-  /**
-   * Called when left-sidebar is collapsed and mouse leaves the area.
-   */
-  onFlyoutCollapse?: () => void;
-  /**
-   * Called after flyout delay when left-sidebar is collapsed and mouse enters the area.
-   */
-  onFlyoutExpand?: () => void;
-  /**
-   * Controls whether the LeftSidebar mounts in a collapsed state, this will override the setting in localStorage
-   */
-  collapsedState?: 'collapsed' | 'expanded';
-  /**
-   * Controls the width when LeftSidebar mounts, this will override the setting in localStorage
-   */
+  resizeGrabAreaLabel?: string;
+  testId?: string;
   width?: number;
 }
 
-export declare type LeftSidebarState = {
+// @public (undocumented)
+export type LeftSidebarState = {
   isFlyoutOpen: boolean;
   isResizing: boolean;
   isLeftSidebarCollapsed: boolean;
@@ -149,37 +96,16 @@ export declare type LeftSidebarState = {
   isFixed: boolean;
 };
 
-/**
- * __Left sidebar without resize__
- *
- * Provides a slot for a left sidebar without resize within the PageLayout.
- *
- * - [Examples](https://atlassian.design/components/page-layout/examples)
- * - [Code](https://atlassian.design/components/page-layout/code)
- */
-export declare const LeftSidebarWithoutResize: (
+// @public
+export const LeftSidebarWithoutResize: (
   props: SlotWidthProps,
 ) => jsx.JSX.Element;
 
-/**
- * __Main__
- *
- * Provides a slot for main content within the PageLayout.
- *
- * - [Examples](https://atlassian.design/components/page-layout/examples)
- * - [Code](https://atlassian.design/components/page-layout/code)
- */
-export declare const Main: (props: SlotWidthProps) => jsx.JSX.Element;
-
-/**
- * __Page layout__
- *
- * A collection of components which let you compose an application's page layout.
- *
- * - [Examples](https://atlassian.design/components/page-layout/examples)
- * - [Code](https://atlassian.design/components/page-layout/code)
- */
-export declare const PageLayout: ({
+// @public
+export const Main: (props: SlotWidthProps) => jsx.JSX.Element;
+
+// @public
+export const PageLayout: ({
   skipLinksLabel,
   children,
   testId,
@@ -187,162 +113,100 @@ export declare const PageLayout: ({
   onLeftSidebarCollapse,
 }: PageLayoutProps) => jsx.JSX.Element;
 
-declare interface PageLayoutProps extends SidebarResizeControllerProps {
-  /**
-   * React children!
-   */
+// @public (undocumented)
+interface PageLayoutProps extends SidebarResizeControllerProps {
   children: ReactNode;
+  // (undocumented)
   skipLinksLabel?: string;
-  /**
-   * A `testId` prop is provided for specified elements, which is a unique string that appears as a data attribute `data-testid` in the rendered code, serving as a hook for automated tests.
-   */
   testId?: string;
 }
 
-declare type ResizeButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {
+// @public (undocumented)
+type ResizeButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {
   isLeftSidebarCollapsed: boolean;
   label: string;
   testId?: string;
 };
 
-export declare const RIGHT_PANEL_WIDTH: string;
-
-export declare const RIGHT_SIDEBAR_WIDTH: string;
-
-/**
- * __Right panel__
- *
- * Provides a slot for a right panel within the PageLayout.
- *
- * - [Examples](https://atlassian.design/components/page-layout/examples)
- * - [Code](https://atlassian.design/components/page-layout/code)
- */
-export declare const RightPanel: (props: SlotWidthProps) => jsx.JSX.Element;
-
-/**
- * __Right sidebar__
- *
- * Provides a slot for a right sidebar within the PageLayout.
- *
- * - [Examples](https://atlassian.design/components/page-layout/examples)
- * - [Code](https://atlassian.design/components/page-layout/code)
- */
-export declare const RightSidebar: (props: SlotWidthProps) => jsx.JSX.Element;
-
-declare type SidebarResizeControllerProps = {
-  /**
-   * Called when left-sidebar expanded.
-   */
+// @public (undocumented)
+export const RIGHT_PANEL_WIDTH: string;
+
+// @public (undocumented)
+export const RIGHT_SIDEBAR_WIDTH: string;
+
+// @public
+export const RightPanel: (props: SlotWidthProps) => jsx.JSX.Element;
+
+// @public
+export const RightSidebar: (props: SlotWidthProps) => jsx.JSX.Element;
+
+// @public (undocumented)
+type SidebarResizeControllerProps = {
   onLeftSidebarExpand?: (leftSidebarState: LeftSidebarState) => void;
-  /**
-   * Called when left-sidebar collapsed.
-   */
   onLeftSidebarCollapse?: (leftSidebarState: LeftSidebarState) => void;
 };
 
-declare type SkipLinkData = {
-  /**
-   * id for the element that will be skipped to
-   */
+// @public (undocumented)
+type SkipLinkData = {
   id: string;
-  /**
-   * Text for the link that will appear in the skip link menu
-   */
   skipLinkTitle: string;
-  /**
-   * Desired position in the skip link menu
-   */
   listIndex?: number;
 };
 
-export declare interface SlotHeightProps extends SlotProps {
-  /**
-   * It save height in local storage.
-   */
-  shouldPersistHeight?: boolean;
-  /**
-   * Height!
-   */
+// @public (undocumented)
+export interface SlotHeightProps extends SlotProps {
   height?: number;
+  shouldPersistHeight?: boolean;
 }
 
-declare interface SlotProps {
-  /**
-   * Sets positon to fixed.
-   */
-  isFixed?: boolean;
-  /**
-   * A `testId` prop is provided for specified elements, which is a unique string that appears as a data attribute `data-testid` in the rendered code, serving as a hook for automated tests .
-   */
-  testId?: string;
-  /**
-   * React Children!
-   */
+// @public (undocumented)
+interface SlotProps {
   children: ReactNode;
+  // (undocumented)
   id?: string;
+  isFixed?: boolean;
+  // (undocumented)
   skipLinkTitle?: string;
+  testId?: string;
 }
 
-export declare interface SlotWidthProps extends SlotProps {
-  /**
-   * It save width in local storage.
-   */
+// @public (undocumented)
+export interface SlotWidthProps extends SlotProps {
   shouldPersistWidth?: boolean;
-  /**
-   * Width!
-   */
   width?: number;
 }
 
-export declare const TOP_NAVIGATION_HEIGHT: string;
+// @public (undocumented)
+export const TOP_NAVIGATION_HEIGHT: string;
 
-/**
- * __Top navigation__
- *
- * Provides a slot for top navigation within the PageLayout.
- *
- * - [Examples](https://atlassian.design/components/page-layout/examples)
- * - [Code](https://atlassian.design/components/page-layout/code)
- */
-export declare const TopNavigation: (props: SlotHeightProps) => jsx.JSX.Element;
+// @public
+export const TopNavigation: (props: SlotHeightProps) => jsx.JSX.Element;
 
-export declare const useCustomSkipLink: (
+// @public (undocumented)
+export const useCustomSkipLink: (
   id: SkipLinkData['id'],
   skipLinkTitle: SkipLinkData['skipLinkTitle'],
   listIndex?: SkipLinkData['listIndex'],
 ) => void;
 
-/**
- * _**WARNING:**_ This hook is intended as a temporary solution and
- * is likely to be removed in a future version of page-layout.
- *
- * ---
- *
- * This hook will prevent the left sidebar from automatically collapsing
- * when it is in a flyout state.
- *
- * The intended use case for this hook is to allow popup menus in the
- * left sidebar to be usable while it is in a flyout state.
- *
- * ## Usage
- * The intended usage is to use this hook within the popup component
- * you are rendering. This way the left sidebar will be locked for
- * as long as the popup is open.
- */
-export declare const useLeftSidebarFlyoutLock: () => void;
-
-export declare const usePageLayoutResize: () => {
+// @public
+export const useLeftSidebarFlyoutLock: () => void;
+
+// @public (undocumented)
+export const usePageLayoutResize: () => {
   isLeftSidebarCollapsed: boolean;
   expandLeftSidebar: () => void;
   collapseLeftSidebar: (
     event?:
-      | MouseEvent_2<Element, globalThis.MouseEvent>
       | KeyboardEvent_2<Element>
+      | MouseEvent_2<Element, globalThis.MouseEvent>
       | undefined,
     collapseWithoutTransition?: boolean | undefined,
   ) => void;
   leftSidebarState: LeftSidebarState;
 };
 
-export {};
+// (No @packageDocumentation comment for this package)
 ```
+
+<!--SECTION END: Main Entry Types-->

package/dist/types-ts4.0/common/constants.d.ts

@@ -1,47 +0,0 @@
-export declare const VAR_LEFT_PANEL_WIDTH = "leftPanelWidth";
-export declare const VAR_LEFT_SIDEBAR_WIDTH = "leftSidebarWidth";
-export declare const VAR_RIGHT_SIDEBAR_WIDTH = "rightSidebarWidth";
-export declare const VAR_RIGHT_PANEL_WIDTH = "rightPanelWidth";
-export declare const VAR_TOP_NAVIGATION_HEIGHT = "topNavigationHeight";
-export declare const VAR_BANNER_HEIGHT = "bannerHeight";
-export declare const VAR_LEFT_SIDEBAR_FLYOUT = "leftSidebarFlyoutWidth";
-export declare const DIMENSIONS: string[];
-export declare const LEFT_PANEL = "left-panel";
-export declare const RIGHT_PANEL = "right-panel";
-export declare const BANNER = "banner";
-export declare const TOP_NAVIGATION = "top-navigation";
-export declare const CONTENT = "content";
-export declare const MAIN = "main";
-export declare const LEFT_SIDEBAR = "left-sidebar";
-export declare const RIGHT_SIDEBAR = "right-sidebar";
-export declare const DEFAULT_BANNER_HEIGHT = 56;
-export declare const DEFAULT_TOP_NAVIGATION_HEIGHT = 56;
-export declare const DEFAULT_LEFT_SIDEBAR_WIDTH = 240;
-export declare const DEFAULT_RIGHT_SIDEBAR_WIDTH = 280;
-export declare const DEFAULT_RIGHT_PANEL_WIDTH = 368;
-export declare const DEFAULT_LEFT_PANEL_WIDTH = 368;
-export declare const COLLAPSED_LEFT_SIDEBAR_WIDTH = 20;
-export declare const MIN_LEFT_SIDEBAR_WIDTH = 80;
-export declare const DEFAULT_LEFT_SIDEBAR_FLYOUT_WIDTH = 240;
-export declare const MIN_LEFT_SIDEBAR_DRAG_THRESHOLD = 200;
-export declare const TRANSITION_DURATION = 300;
-export declare const FLYOUT_DELAY = 200;
-export declare const LEFT_SIDEBAR_EXPANDED_WIDTH = "expandedLeftSidebarWidth";
-export declare const PAGE_LAYOUT_LS_KEY = "DS_PAGE_LAYOUT_UI_STATE";
-export declare const IS_SIDEBAR_DRAGGING = "data-is-sidebar-dragging";
-export declare const IS_SIDEBAR_COLLAPSING = "data-is-sidebar-collapsing";
-export declare const IS_FLYOUT_OPEN = "data-is-flyout-open";
-export declare const GRAB_AREA_LINE_SELECTOR = "data-grab-area-line";
-export declare const GRAB_AREA_SELECTOR = "data-grab-area";
-export declare const RESIZE_BUTTON_SELECTOR = "data-resize-button";
-export declare const RESIZE_CONTROL_SELECTOR = "data-resize-control";
-export declare const PAGE_LAYOUT_SLOT_SELECTOR = "data-ds--page-layout--slot";
-export declare const DEFAULT_I18N_PROPS_SKIP_LINKS = "Skip to:";
-export declare const PAGE_LAYOUT_CONTAINER_SELECTOR = "data-layout-container";
-export declare const LEFT_PANEL_WIDTH: string;
-export declare const RIGHT_PANEL_WIDTH: string;
-export declare const LEFT_SIDEBAR_WIDTH: string;
-export declare const RIGHT_SIDEBAR_WIDTH: string;
-export declare const TOP_NAVIGATION_HEIGHT: string;
-export declare const BANNER_HEIGHT: string;
-export declare const LEFT_SIDEBAR_FLYOUT_WIDTH: string;

package/dist/types-ts4.0/common/hooks/index.d.ts

@@ -1,2 +0,0 @@
-export { default as useIsSidebarCollapsing } from './use-is-sidebar-collapsing';
-export { default as useIsSidebarDragging } from './use-is-sidebar-dragging';

package/dist/types-ts4.0/common/hooks/use-is-sidebar-collapsing.d.ts

@@ -1,2 +0,0 @@
-declare const useIsSidebarCollapsing: () => boolean;
-export default useIsSidebarCollapsing;

package/dist/types-ts4.0/common/hooks/use-is-sidebar-dragging.d.ts

@@ -1,2 +0,0 @@
-declare const useIsSidebarDragging: () => boolean;
-export default useIsSidebarDragging;

package/dist/types-ts4.0/common/safe-local-storage.d.ts

@@ -1,2 +0,0 @@
-declare const safeLocalStorage: () => Storage;
-export default safeLocalStorage;

package/dist/types-ts4.0/common/types.d.ts

@@ -1,117 +0,0 @@
-import { ElementType, ReactElement, ReactNode } from 'react';
-import { ResizeButtonProps } from '../components/resize-control/types';
-import { LeftSidebarState } from '../controllers/sidebar-resize-context';
-interface SlotProps {
-    /**
-     * Sets positon to fixed.
-     */
-    isFixed?: boolean;
-    /**
-     * A `testId` prop is provided for specified elements, which is a unique string that appears as a data attribute `data-testid` in the rendered code, serving as a hook for automated tests .
-     */
-    testId?: string;
-    /**
-     * React Children!
-     */
-    children: ReactNode;
-    id?: string;
-    skipLinkTitle?: string;
-}
-export interface SlotHeightProps extends SlotProps {
-    /**
-     * It save height in local storage.
-     */
-    shouldPersistHeight?: boolean;
-    /**
-     * Height!
-     */
-    height?: number;
-}
-export interface SlotWidthProps extends SlotProps {
-    /**
-     * It save width in local storage.
-     */
-    shouldPersistWidth?: boolean;
-    /**
-     * Width!
-     */
-    width?: number;
-}
-export interface LeftSidebarProps extends SlotWidthProps {
-    /**
-     * A `testId` prop is provided for specified elements, which is a unique string that appears as a data attribute `data-testid` in the rendered code, serving as a hook for automated tests.
-     */
-    testId?: string;
-    /**
-     * You can override prop(s) for the mentioned component(s).
-     */
-    overrides?: {
-        ResizeButton?: {
-            render?: (Component: ElementType<ResizeButtonProps>, props: ResizeButtonProps) => ReactElement;
-        };
-    };
-    /**
-     * Display label for grab area. This will be announced to the screenreaders when the grab area receives focus
-     */
-    resizeGrabAreaLabel?: string;
-    /**
-     * Display label for resize button.
-     */
-    resizeButtonLabel?: string;
-    /**
-     * Called when left-sidebar is collapsed.
-     */
-    onCollapse?: () => void;
-    /**
-     * Called when left-sidebar is expanded.
-     */
-    onExpand?: () => void;
-    /**
-     * Called when left-sidebar resize starts using mouse or touch.
-     */
-    onResizeStart?: (leftSidebarState: LeftSidebarState) => void;
-    /**
-     * Called when left-sidebar resize ends using mouse or touch.
-     */
-    onResizeEnd?: (leftSidebarState: LeftSidebarState) => void;
-    /**
-     * Called when left-sidebar is collapsed and mouse leaves the area.
-     */
-    onFlyoutCollapse?: () => void;
-    /**
-     * Called after flyout delay when left-sidebar is collapsed and mouse enters the area.
-     */
-    onFlyoutExpand?: () => void;
-    /**
-     * Controls whether the LeftSidebar mounts in a collapsed state, this will override the setting in localStorage
-     */
-    collapsedState?: 'collapsed' | 'expanded';
-    /**
-     * Controls the width when LeftSidebar mounts, this will override the setting in localStorage
-     */
-    width?: number;
-}
-export declare type SidebarResizeControllerProps = {
-    /**
-     * Called when left-sidebar expanded.
-     */
-    onLeftSidebarExpand?: (leftSidebarState: LeftSidebarState) => void;
-    /**
-     * Called when left-sidebar collapsed.
-     */
-    onLeftSidebarCollapse?: (leftSidebarState: LeftSidebarState) => void;
-};
-export declare type DimensionNames = 'leftPanelWidth' | 'bannerHeight' | 'topNavigationHeight' | 'leftSidebarWidth' | 'leftSidebarFlyoutWidth' | 'rightSidebarWidth' | 'rightPanelWidth';
-export declare type Dimensions = Partial<Record<DimensionNames, number>>;
-export interface PageLayoutProps extends SidebarResizeControllerProps {
-    /**
-     * React children!
-     */
-    children: ReactNode;
-    skipLinksLabel?: string;
-    /**
-     * A `testId` prop is provided for specified elements, which is a unique string that appears as a data attribute `data-testid` in the rendered code, serving as a hook for automated tests.
-     */
-    testId?: string;
-}
-export type { LeftSidebarState } from '../controllers/sidebar-resize-context';

package/dist/types-ts4.0/common/utils.d.ts

@@ -1,13 +0,0 @@
-import { DimensionNames, Dimensions } from './types';
-declare const emptyGridState: Dimensions;
-declare const mergeGridStateIntoStorage: (key: string, value: any) => void;
-declare const getGridStateFromStorage: (key: string) => any;
-declare const removeFromGridStateInStorage: (key: string, secondKey?: string | undefined) => void;
-declare const resolveDimension: (key: DimensionNames, dimension?: number, shouldPersist?: boolean) => any;
-declare const getLeftPanelWidth: () => number;
-declare const getLeftSidebarPercentage: (currentWidth: number, maxWidth: number) => number;
-declare const getPageLayoutSlotSelector: (slotName: string) => {
-    "data-ds--page-layout--slot": string;
-};
-declare const getPageLayoutSlotCSSSelector: (slotName: string) => string;
-export { emptyGridState, mergeGridStateIntoStorage, getGridStateFromStorage, removeFromGridStateInStorage, resolveDimension, getLeftPanelWidth, getLeftSidebarPercentage, getPageLayoutSlotSelector, getPageLayoutSlotCSSSelector, };

package/dist/types-ts4.0/components/index.d.ts

@@ -1,12 +0,0 @@
-export { default as PageLayout } from './slots/page-layout';
-export { default as Main } from './slots/main';
-export { default as RightPanel } from './slots/right-panel';
-export { default as LeftPanel } from './slots/left-panel';
-export { default as RightSidebar } from './slots/right-sidebar';
-export { default as LeftSidebar } from './slots/left-sidebar';
-export { default as LeftSidebarWithoutResize } from './slots/left-sidebar-without-resize';
-export { default as Banner } from './slots/banner-slot';
-export { default as TopNavigation } from './slots/top-navigation';
-export { default as Content } from './slots/content';
-export { default as ResizeControl } from './resize-control';
-export { useCustomSkipLink } from './skip-links';

package/dist/types-ts4.0/components/resize-control/grab-area.d.ts

@@ -1,9 +0,0 @@
-/** @jsx jsx */
-import { ComponentProps } from 'react';
-import { jsx } from '@emotion/react';
-export declare type GrabAreaProps = {
-    testId?: string;
-    isLeftSidebarCollapsed: boolean;
-} & ComponentProps<'button'>;
-declare const GrabArea: ({ testId, isLeftSidebarCollapsed, ...rest }: GrabAreaProps) => jsx.JSX.Element;
-export default GrabArea;

package/dist/types-ts4.0/components/resize-control/index.d.ts

@@ -1,4 +0,0 @@
-import { jsx } from '@emotion/react';
-import { ResizeControlProps } from './types';
-declare const ResizeControl: ({ testId, overrides, resizeButtonLabel, resizeGrabAreaLabel, onResizeStart, onResizeEnd, }: ResizeControlProps) => jsx.JSX.Element;
-export default ResizeControl;

package/dist/types-ts4.0/components/resize-control/resize-button.d.ts

@@ -1,4 +0,0 @@
-import { jsx } from '@emotion/react';
-import { ResizeButtonProps } from './types';
-declare const ResizeButton: ({ isLeftSidebarCollapsed, label, testId, ...props }: ResizeButtonProps) => jsx.JSX.Element;
-export default ResizeButton;

package/dist/types-ts4.0/components/resize-control/shadow.d.ts

@@ -1,6 +0,0 @@
-/** @jsx jsx */
-import { jsx } from '@emotion/react';
-declare const Shadow: ({ testId }: {
-    testId?: string | undefined;
-}) => jsx.JSX.Element;
-export default Shadow;

package/dist/types-ts4.0/components/resize-control/types.d.ts

@@ -1,25 +0,0 @@
-import { ButtonHTMLAttributes, ElementType, ReactElement } from 'react';
-import { LeftSidebarState } from '../../controllers/sidebar-resize-context';
-export declare type ResizeButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {
-    isLeftSidebarCollapsed: boolean;
-    label: string;
-    testId?: string;
-};
-export declare type ResizeControlProps = {
-    testId?: string;
-    overrides?: {
-        ResizeButton?: {
-            render?: (Component: ElementType<ResizeButtonProps>, props: ResizeButtonProps) => ReactElement;
-        };
-    };
-    resizeGrabAreaLabel?: string;
-    resizeButtonLabel?: string;
-    onCollapse?: (leftSidebarState: LeftSidebarState) => void;
-    onExpand?: (leftSidebarState: LeftSidebarState) => void;
-    onResizeStart?: (leftSidebarState: LeftSidebarState) => void;
-    onResizeEnd?: (leftSidebarState: LeftSidebarState) => void;
-    onFlyoutCollapse?: () => void;
-    onFlyoutExpand?: () => void;
-    leftSidebarState: LeftSidebarState;
-    setLeftSidebarState: (leftSidebarState: LeftSidebarState) => void;
-};

package/dist/types-ts4.0/components/skip-links/index.d.ts

@@ -1,2 +0,0 @@
-export { SkipLinkWrapper, SkipLink } from './skip-link-components';
-export { useCustomSkipLink } from './use-custom-skip-link';

package/dist/types-ts4.0/components/skip-links/skip-link-components.d.ts

@@ -1,11 +0,0 @@
-/** @jsx jsx */
-import { ReactNode } from 'react';
-import { jsx } from '@emotion/react';
-import { SkipLinkWrapperProps } from './types';
-export declare const SkipLinkWrapper: ({ skipLinksLabel }: SkipLinkWrapperProps) => jsx.JSX.Element | null;
-export declare const SkipLink: ({ href, children, isFocusable, title, }: {
-    href: string;
-    children: ReactNode;
-    isFocusable: boolean;
-    title: string;
-}) => jsx.JSX.Element;

package/dist/types-ts4.0/components/skip-links/types.d.ts

@@ -1,8 +0,0 @@
-export declare type SkipLinkData = {
-    id: string;
-    name: string;
-    ref?: undefined;
-};
-export declare type SkipLinkWrapperProps = {
-    skipLinksLabel: string;
-};

package/dist/types-ts4.0/components/skip-links/use-custom-skip-link.d.ts

@@ -1,2 +0,0 @@
-import { SkipLinkData } from '../../controllers';
-export declare const useCustomSkipLink: (id: SkipLinkData['id'], skipLinkTitle: SkipLinkData['skipLinkTitle'], listIndex?: SkipLinkData['listIndex']) => void;

package/dist/types-ts4.0/components/slots/banner-slot.d.ts

@@ -1,12 +0,0 @@
-import { jsx } from '@emotion/react';
-import { SlotHeightProps } from '../../common/types';
-/**
- * __Banner__
- *
- * Provides a slot for a Banner within the PageLayout.
- *
- * - [Examples](https://atlassian.design/components/page-layout/examples)
- * - [Code](https://atlassian.design/components/page-layout/code)
- */
-declare const Banner: (props: SlotHeightProps) => jsx.JSX.Element;
-export default Banner;

package/dist/types-ts4.0/components/slots/content.d.ts

@@ -1,23 +0,0 @@
-/** @jsx jsx */
-import { ReactNode } from 'react';
-import { jsx } from '@emotion/react';
-interface ContentProps {
-    /**
-     * React children
-     */
-    children: ReactNode;
-    /**
-     * A `testId` prop is provided for specified elements, which is a unique string that appears as a data attribute `data-testid` in the rendered code, serving as a hook for automated tests.
-     */
-    testId?: string;
-}
-/**
- * __Content__
- *
- * Provides a slot for your application content within the PageLayout.
- *
- * - [Examples](https://atlassian.design/components/page-layout/examples)
- * - [Code](https://atlassian.design/components/page-layout/code)
- */
-declare const Content: (props: ContentProps) => jsx.JSX.Element;
-export default Content;

package/dist/types-ts4.0/components/slots/internal/left-sidebar-inner.d.ts

@@ -1,10 +0,0 @@
-/** @jsx jsx */
-import type { ReactNode } from 'react';
-import { jsx } from '@emotion/react';
-declare type LeftSidebarInnerProps = {
-    children: ReactNode;
-    isFixed?: boolean;
-    isFlyoutOpen?: boolean;
-};
-declare const LeftSidebarInner: ({ children, isFixed, isFlyoutOpen, }: LeftSidebarInnerProps) => jsx.JSX.Element;
-export default LeftSidebarInner;

package/dist/types-ts4.0/components/slots/internal/left-sidebar-outer.d.ts

@@ -1,13 +0,0 @@
-/** @jsx jsx */
-import { MouseEventHandler, ReactNode } from 'react';
-declare type LeftSidebarOuterProps = {
-    children: ReactNode;
-    isFixed?: boolean;
-    isFlyoutOpen?: boolean;
-    testId?: string;
-    id?: string;
-    onMouseOver?: MouseEventHandler;
-    onMouseLeave?: MouseEventHandler;
-};
-declare const _default: import("react").ForwardRefExoticComponent<LeftSidebarOuterProps & import("react").RefAttributes<HTMLDivElement>>;
-export default _default;

package/dist/types-ts4.0/components/slots/internal/resizable-children-wrapper.d.ts

@@ -1,11 +0,0 @@
-/** @jsx jsx */
-import type { ReactNode } from 'react';
-import { jsx } from '@emotion/react';
-declare type ResizableChildrenWrapperProps = {
-    children: ReactNode;
-    isFlyoutOpen?: boolean;
-    isLeftSidebarCollapsed?: boolean;
-    hasCollapsedState?: boolean;
-};
-declare const ResizableChildrenWrapper: ({ children, isLeftSidebarCollapsed, hasCollapsedState, isFlyoutOpen, }: ResizableChildrenWrapperProps) => jsx.JSX.Element;
-export default ResizableChildrenWrapper;

package/dist/types-ts4.0/components/slots/internal/slot-focus-ring.d.ts

@@ -1,20 +0,0 @@
-/** @jsx jsx */
-import type { ReactNode } from 'react';
-import { jsx } from '@emotion/react';
-declare type SlotFocusRingProps = {
-    children: (props: {
-        className: string;
-    }) => ReactNode;
-    isSidebar?: boolean;
-};
-/**
- * We don't use `@atlaskit/focus-ring` here,
- * because we need inset focus styles and:
- *
- * 1. If we set them directly to the layout element,
- *    then any child element's background will cover the shadow.
- * 2. We cannot wrap `children` in `FocusRing`,
- *    because there's no guarantee the passed child takes `className`.
- */
-declare const SlotFocusRing: ({ children, isSidebar }: SlotFocusRingProps) => jsx.JSX.Element;
-export default SlotFocusRing;

package/dist/types-ts4.0/components/slots/left-panel.d.ts

@@ -1,12 +0,0 @@
-import { jsx } from '@emotion/react';
-import { SlotWidthProps } from '../../common/types';
-/**
- * __Left panel__
- *
- * Provides a slot for a left panel within the PageLayout.
- *
- * - [Examples](https://atlassian.design/components/page-layout/examples)
- * - [Code](https://atlassian.design/components/page-layout/code)
- */
-declare const LeftPanel: (props: SlotWidthProps) => jsx.JSX.Element;
-export default LeftPanel;

package/dist/types-ts4.0/components/slots/left-sidebar-without-resize.d.ts

@@ -1,12 +0,0 @@
-import { jsx } from '@emotion/react';
-import { SlotWidthProps } from '../../common/types';
-/**
- * __Left sidebar without resize__
- *
- * Provides a slot for a left sidebar without resize within the PageLayout.
- *
- * - [Examples](https://atlassian.design/components/page-layout/examples)
- * - [Code](https://atlassian.design/components/page-layout/code)
- */
-declare const LeftSidebarWithoutResize: (props: SlotWidthProps) => jsx.JSX.Element;
-export default LeftSidebarWithoutResize;

package/dist/types-ts4.0/components/slots/left-sidebar.d.ts

@@ -1,12 +0,0 @@
-import { jsx } from '@emotion/react';
-import { LeftSidebarProps } from '../../common/types';
-/**
- * __Left sidebar__
- *
- * Provides a slot for a left sidebar within the PageLayout.
- *
- * - [Examples](https://atlassian.design/components/page-layout/examples)
- * - [Code](https://atlassian.design/components/page-layout/code)
- */
-declare const LeftSidebar: (props: LeftSidebarProps) => jsx.JSX.Element;
-export default LeftSidebar;

package/dist/types-ts4.0/components/slots/main.d.ts

@@ -1,12 +0,0 @@
-import { jsx } from '@emotion/react';
-import { SlotWidthProps } from '../../common/types';
-/**
- * __Main__
- *
- * Provides a slot for main content within the PageLayout.
- *
- * - [Examples](https://atlassian.design/components/page-layout/examples)
- * - [Code](https://atlassian.design/components/page-layout/code)
- */
-declare const Main: (props: SlotWidthProps) => jsx.JSX.Element;
-export default Main;

package/dist/types-ts4.0/components/slots/page-layout.d.ts

@@ -1,12 +0,0 @@
-import { jsx } from '@emotion/react';
-import { PageLayoutProps } from '../../common/types';
-/**
- * __Page layout__
- *
- * A collection of components which let you compose an application's page layout.
- *
- * - [Examples](https://atlassian.design/components/page-layout/examples)
- * - [Code](https://atlassian.design/components/page-layout/code)
- */
-declare const PageLayout: ({ skipLinksLabel, children, testId, onLeftSidebarExpand, onLeftSidebarCollapse, }: PageLayoutProps) => jsx.JSX.Element;
-export default PageLayout;

package/dist/types-ts4.0/components/slots/right-panel.d.ts

@@ -1,12 +0,0 @@
-import { jsx } from '@emotion/react';
-import { SlotWidthProps } from '../../common/types';
-/**
- * __Right panel__
- *
- * Provides a slot for a right panel within the PageLayout.
- *
- * - [Examples](https://atlassian.design/components/page-layout/examples)
- * - [Code](https://atlassian.design/components/page-layout/code)
- */
-declare const RightPanel: (props: SlotWidthProps) => jsx.JSX.Element;
-export default RightPanel;

package/dist/types-ts4.0/components/slots/right-sidebar.d.ts

@@ -1,12 +0,0 @@
-import { jsx } from '@emotion/react';
-import { SlotWidthProps } from '../../common/types';
-/**
- * __Right sidebar__
- *
- * Provides a slot for a right sidebar within the PageLayout.
- *
- * - [Examples](https://atlassian.design/components/page-layout/examples)
- * - [Code](https://atlassian.design/components/page-layout/code)
- */
-declare const RightSidebar: (props: SlotWidthProps) => jsx.JSX.Element;
-export default RightSidebar;

package/dist/types-ts4.0/components/slots/slot-dimensions.d.ts

@@ -1,7 +0,0 @@
-/// <reference types="react" />
-interface SlotDimensionsProps {
-    variableName: string;
-    value?: number;
-}
-declare const _default: ({ variableName, value }: SlotDimensionsProps) => JSX.Element;
-export default _default;

package/dist/types-ts4.0/components/slots/top-navigation.d.ts

@@ -1,12 +0,0 @@
-import { jsx } from '@emotion/react';
-import { SlotHeightProps } from '../../common/types';
-/**
- * __Top navigation__
- *
- * Provides a slot for top navigation within the PageLayout.
- *
- * - [Examples](https://atlassian.design/components/page-layout/examples)
- * - [Code](https://atlassian.design/components/page-layout/code)
- */
-declare const TopNavigation: (props: SlotHeightProps) => jsx.JSX.Element;
-export default TopNavigation;

package/dist/types-ts4.0/controllers/index.d.ts

@@ -1,6 +0,0 @@
-export type { SkipLinkData } from './types';
-export { default as publishGridState } from './use-page-layout-grid';
-export { SidebarResizeContext, usePageLayoutResize, useLeftSidebarFlyoutLock, } from './sidebar-resize-context';
-export { SidebarResizeController } from './sidebar-resize-controller';
-export { useSkipLinks, useSkipLink } from './skip-link-context';
-export { SkipLinksController } from './skip-link-controller';

package/dist/types-ts4.0/controllers/sidebar-resize-context.d.ts

@@ -1,42 +0,0 @@
-import { KeyboardEvent, MouseEvent } from 'react';
-export declare type LeftSidebarState = {
-    isFlyoutOpen: boolean;
-    isResizing: boolean;
-    isLeftSidebarCollapsed: boolean;
-    leftSidebarWidth: number;
-    lastLeftSidebarWidth: number;
-    flyoutLockCount: number;
-    isFixed: boolean;
-};
-export declare type SidebarResizeContextValue = {
-    isLeftSidebarCollapsed: boolean;
-    expandLeftSidebar: () => void;
-    collapseLeftSidebar: (event?: MouseEvent | KeyboardEvent, collapseWithoutTransition?: boolean) => void;
-    leftSidebarState: LeftSidebarState;
-    setLeftSidebarState: (value: LeftSidebarState | ((prevState: LeftSidebarState) => LeftSidebarState)) => void;
-};
-export declare const SidebarResizeContext: import("react").Context<SidebarResizeContextValue>;
-export declare const usePageLayoutResize: () => {
-    isLeftSidebarCollapsed: boolean;
-    expandLeftSidebar: () => void;
-    collapseLeftSidebar: (event?: MouseEvent<Element, globalThis.MouseEvent> | KeyboardEvent<Element> | undefined, collapseWithoutTransition?: boolean | undefined) => void;
-    leftSidebarState: LeftSidebarState;
-};
-/**
- * _**WARNING:**_ This hook is intended as a temporary solution and
- * is likely to be removed in a future version of page-layout.
- *
- * ---
- *
- * This hook will prevent the left sidebar from automatically collapsing
- * when it is in a flyout state.
- *
- * The intended use case for this hook is to allow popup menus in the
- * left sidebar to be usable while it is in a flyout state.
- *
- * ## Usage
- * The intended usage is to use this hook within the popup component
- * you are rendering. This way the left sidebar will be locked for
- * as long as the popup is open.
- */
-export declare const useLeftSidebarFlyoutLock: () => void;

package/dist/types-ts4.0/controllers/sidebar-resize-controller.d.ts

@@ -1,3 +0,0 @@
-import { FC } from 'react';
-import { SidebarResizeControllerProps } from '../common/types';
-export declare const SidebarResizeController: FC<SidebarResizeControllerProps>;

package/dist/types-ts4.0/controllers/skip-link-context.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-import { SkipLinkContextProps } from './types';
-export declare const SkipLinksContext: import("react").Context<SkipLinkContextProps>;
-export declare const useSkipLinks: () => SkipLinkContextProps;
-export declare const useSkipLink: (id?: string | undefined, skipLinkTitle?: string | undefined) => void;

package/dist/types-ts4.0/controllers/skip-link-controller.d.ts

@@ -1,2 +0,0 @@
-import { FC } from 'react';
-export declare const SkipLinksController: FC;

package/dist/types-ts4.0/controllers/types.d.ts

@@ -1,22 +0,0 @@
-export declare type SkipLinkContextProps = {
-    skipLinksData: SkipLinkData[];
-    registerSkipLink: (skipLinkDate: SkipLinkData) => void;
-    unregisterSkipLink: (id: string | undefined) => void;
-};
-export declare type SkipLinkData = {
-    /**
-     * id for the element that will be skipped to
-     */
-    id: string;
-    /**
-     * Text for the link that will appear in the skip link menu
-     */
-    skipLinkTitle: string;
-    /**
-     * Desired position in the skip link menu
-     */
-    listIndex?: number;
-};
-export declare type SkipLinkI18n = {
-    title: string;
-};

package/dist/types-ts4.0/controllers/use-page-layout-grid.d.ts

@@ -1,3 +0,0 @@
-import { Dimensions } from '../common/types';
-declare const publishGridState: (gridState: Dimensions) => void;
-export default publishGridState;

package/dist/types-ts4.0/controllers/use-update-css-vars.d.ts

@@ -1,2 +0,0 @@
-declare function useUpdateCssVar(cssVar: string, value: number | string): void;
-export default useUpdateCssVar;

package/dist/types-ts4.0/index.d.ts

@@ -1,4 +0,0 @@
-export { PageLayout, Main, Content, RightSidebar, LeftSidebar, LeftSidebarWithoutResize, RightPanel, LeftPanel, Banner, TopNavigation, useCustomSkipLink, } from './components';
-export { LEFT_PANEL_WIDTH, RIGHT_PANEL_WIDTH, BANNER_HEIGHT, TOP_NAVIGATION_HEIGHT, LEFT_SIDEBAR_WIDTH, RIGHT_SIDEBAR_WIDTH, } from './common/constants';
-export { usePageLayoutResize, useLeftSidebarFlyoutLock } from './controllers';
-export type { SlotHeightProps, SlotWidthProps, Dimensions, LeftSidebarState, } from './common/types';