@nulogy/components 13.1.2 → 13.1.4

package/dist/src/AsyncSelect/AsyncSelect.graphql.story.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const WithApolloClientExample: () => React.JSX.Element;

package/dist/src/AsyncSelect/AsyncSelectComponents.d.ts

@@ -1,11 +1,14 @@
 import React from "react";
-import { ClearIndicatorProps, ContainerProps, ControlProps, DropdownIndicatorProps, InputProps, MenuProps, MultiValueProps } from "react-select";
+import { ClearIndicatorProps, ContainerProps, ControlProps, DropdownIndicatorProps, InputProps, MenuProps, MultiValueProps, Props } from "react-select";
 import { GroupBase } from "react-select";
 import { OptionProps } from "react-select";
 import { IconName } from "@nulogy/icons";
 import type { ComponentVariant } from "../NDSProvider/ComponentVariantContext";
-export declare const SelectControl: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ iconLeft, isFocused, children, ...props }: ControlProps<Option, IsMulti, Group> & {
+interface CustomSelectProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> extends Props<Option, IsMulti, Group> {
     iconLeft?: IconName | "loading";
+}
+export declare const SelectControl: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ isFocused, children, ...props }: ControlProps<Option, IsMulti, Group> & {
+    selectProps: CustomSelectProps<Option, IsMulti, Group>;
 }) => React.JSX.Element;
 export declare const SelectMultiValue: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: MultiValueProps<Option, IsMulti, Group>) => React.JSX.Element;
 export declare const SelectClearIndicator: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: ClearIndicatorProps<Option, IsMulti, Group>) => React.JSX.Element;
@@ -16,3 +19,4 @@ export declare const SelectMenu: <Option, IsMulti extends boolean, Group extends
 export declare function SelectOption<Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: OptionProps<Option, IsMulti, Group> & {
     variant?: ComponentVariant;
 }): React.JSX.Element;
+export {};

package/dist/src/Layout/Sidebar.d.ts

@@ -2,7 +2,7 @@ import React, { RefObject } from "react";
 import { AnimatedBoxProps } from "../Box/Box";
 type PredefinedSidebarWidth = "xs" | "s" | "m" | "l" | "xl";
 type SidebarWidth = PredefinedSidebarWidth | (string & {});
-type SidebarProps = Omit<AnimatedBoxProps, "width"> & {
+export type SidebarProps = Omit<AnimatedBoxProps, "width"> & {
     children?: React.ReactNode;
     onClose?: () => void;
     title?: string;

package/dist/src/utils/index.d.ts

@@ -8,5 +8,4 @@ export { default as PopperArrow } from "./PopperArrow";
 export { default as ScrollIndicators } from "./ScrollIndicators";
 export { default as withMenuState } from "./withMenuState";
 export type { WithMenuStateProps, AcceptsMenuStateProps } from "./withMenuState";
-export { default as PreventBodyElementScrolling } from "./PreventBodyElementScrolling";
 export { default as useWindowDimensions } from "./useWindowDimensions";

package/dist/src/utils/testing/useUrlProps.d.ts

@@ -0,0 +1,6 @@
+/**
+ * useUrlProps is a hook that reads URL search parameters and returns them as an object.
+ * It is meant to be used in Storybook stories to allow for easy URL-based configuration from Cypress specs.
+ *
+ */
+export declare function useUrlProps<T extends Record<string, unknown>>(defaultProps?: T): T;

package/dist/src/utils/useScrollLock.d.ts

@@ -0,0 +1,55 @@
+import { useLayoutEffect } from "react";
+export declare const useIsomorphicLayoutEffect: typeof useLayoutEffect;
+/** Hook options. */
+type UseScrollLockOptions = {
+    /**
+     * Whether to lock the scroll initially.
+     * @default true
+     */
+    autoLock?: boolean;
+    /**
+     * The target element to lock the scroll (default is the body element).
+     * @default document.body
+     */
+    lockTarget?: HTMLElement | string;
+    /**
+     * Whether to prevent width reflow when locking the scroll.
+     * @default true
+     */
+    widthReflow?: boolean;
+};
+/** Hook return type. */
+type UseScrollLockReturn = {
+    /** Whether the scroll is locked. */
+    isLocked: boolean;
+    /** Lock the scroll. */
+    lock: () => void;
+    /** Unlock the scroll. */
+    unlock: () => void;
+};
+/**
+ * A custom hook that locks and unlocks scroll.
+ * @param {UseScrollLockOptions} [options] - Options to configure the hook, by default it will lock the scroll automatically.
+ * @returns {UseScrollLockReturn} - An object containing the lock and unlock functions.
+ * @public
+ * @see [Documentation](https://usehooks-ts.com/react-hook/use-scroll-lock)
+ * @example
+ * ```tsx
+ * // Lock the scroll when the modal is mounted, and unlock it when it's unmounted
+ * useScrollLock()
+ * ```
+ * @example
+ * ```tsx
+ * // Manually lock and unlock the scroll
+ * const { lock, unlock } = useScrollLock({ autoLock: false })
+ *
+ * return (
+ *  <div>
+ *   <button onClick={lock}>Lock</button>
+ *   <button onClick={unlock}>Unlock</button>
+ *  </div>
+ * )
+ * ```
+ */
+export declare function useScrollLock(options?: UseScrollLockOptions): UseScrollLockReturn;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nulogy/components",
-  "version": "13.1.2",
+  "version": "13.1.4",
   "description": "Component library for the Nulogy Design System - http://nulogy.design",
   "private": false,
   "publishConfig": {
@@ -61,6 +61,7 @@
     "typescript": "4.9.5"
   },
   "devDependencies": {
+    "@apollo/client": "^3.11.8",
     "@babel/core": "^7.0.0-0",
     "@babel/plugin-proposal-private-methods": "^7.10.4",
     "@babel/plugin-proposal-private-property-in-object": "^7.10.4",
@@ -117,6 +118,7 @@
     "enzyme-to-json": "3.4.4",
     "eslint": "6.8.0",
     "eslint-plugin-prettier": "^3.1.4",
+    "graphql": "15.8.0",
     "http-server": "^14.0.0",
     "husky": "^4.3.0",
     "jest": "29.7.0",
@@ -172,7 +174,7 @@
     "react-popper": "1.3.11",
     "react-popper-2": "npm:react-popper@2.2.4",
     "react-resize-detector": "^9.1.0",
-    "react-select": "^5.8.0",
+    "react-select": "^5.9.0",
     "react-window": "^1.8.11",
     "smoothscroll-polyfill": "^0.4.4",
     "styled-system": "^5.1.4",

package/dist/src/utils/PreventBodyElementScrolling.d.ts

@@ -1,8 +0,0 @@
-export default class PreventBodyElementScrolling extends React.Component<any, any, any> {
-    constructor(props: any);
-    constructor(props: any, context: any);
-    componentDidMount(): void;
-    componentWillUnmount(): void;
-    render(): React.JSX.Element;
-}
-import React from "react";