@nulogy/components 11.0.0 → 11.1.0

package/dist/src/BottomSheet/BottomSheet.d.ts

@@ -0,0 +1,23 @@
+import React from "react";
+import { WidthProps } from "styled-system";
+interface Props {
+    isOpen?: boolean;
+    "aria-label"?: string;
+    onClose?: () => void;
+    title?: string;
+    helpText?: React.ReactNode;
+    closeButtonLabel?: string;
+    hideCloseButton?: boolean;
+    secondaryAction?: (props: {
+        onClose: () => void;
+    }) => React.ReactElement;
+    primaryAction?: (props: {
+        onClose: () => void;
+    }) => React.ReactElement;
+    disableCloseOnOverlayClick?: boolean;
+    sheetWidth?: WidthProps["width"];
+    contentWidth?: WidthProps["width"];
+    children?: React.ReactNode;
+}
+export default function BottomSheet({ title, helpText, closeButtonLabel, secondaryAction, primaryAction, isOpen, onClose, sheetWidth, contentWidth, disableCloseOnOverlayClick, hideCloseButton, children, ...props }: Props): React.JSX.Element;
+export {};

package/dist/src/BottomSheet/BottomSheet.parts.d.ts

@@ -0,0 +1,44 @@
+import { DialogContentProps, DialogOverlayProps } from "@reach/dialog";
+import { AnimatePresenceProps } from "framer-motion";
+import React from "react";
+import { HeightProps, LayoutProps, MaxHeightProps, MaxWidthProps, SpaceProps, WidthProps } from "styled-system";
+interface RootProps extends AnimatePresenceProps {
+    isOpen: boolean;
+    onClose: () => void;
+    children: React.ReactNode;
+}
+declare function Root({ isOpen, onClose, children, ...props }: RootProps): React.JSX.Element;
+interface OverlayPartProps extends DialogOverlayProps {
+    closeOnClick?: boolean;
+}
+declare function OverlayPart({ closeOnClick, children, ...props }: OverlayPartProps): React.JSX.Element;
+interface SheetPartProps extends DialogContentProps, WidthProps, MaxWidthProps, HeightProps, MaxHeightProps, SpaceProps, LayoutProps {
+    children: React.ReactNode;
+    "aria-label": string;
+}
+declare function SheetPart({ children, ...props }: SheetPartProps): React.JSX.Element;
+export declare const BottomSheetParts: {
+    Root: typeof Root;
+    Overlay: typeof OverlayPart;
+    Sheet: typeof SheetPart;
+    ContentContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+    Header: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+    Title: import("styled-components").StyledComponent<"p", import("styled-components").DefaultTheme, React.HTMLAttributes<HTMLParagraphElement> & {
+        variant?: import("../NDSProvider/ComponentVariantContext").ComponentVariant;
+        inline?: boolean;
+        disabled?: boolean;
+        textTransform?: "-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "full-width" | "capitalize" | "full-size-kana" | "lowercase" | "uppercase";
+        fontSize?: string;
+    } & import("..").StyledProps & {
+        as: string;
+    }, "as">;
+    HelpText: import("styled-components").StyledComponent<"p", import("styled-components").DefaultTheme, React.HTMLAttributes<HTMLParagraphElement> & {
+        variant?: import("../NDSProvider/ComponentVariantContext").ComponentVariant;
+        inline?: boolean;
+        disabled?: boolean;
+        textTransform?: "-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "full-width" | "capitalize" | "full-size-kana" | "lowercase" | "uppercase";
+        fontSize?: string;
+    } & import("..").StyledProps, never>;
+    Footer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+};
+export {};

package/dist/src/BottomSheet/BottomSheet.styled.d.ts

@@ -0,0 +1,38 @@
+/// <reference types="react" />
+import { DialogContentProps } from "@reach/dialog";
+import type { AnimationProps } from "framer-motion";
+import type { HeightProps, LayoutProps, MaxHeightProps, MaxWidthProps, SpaceProps, WidthProps } from "styled-system";
+declare const Overlay: import("styled-components").StyledComponent<import("framer-motion").CustomDomComponent<import("@reach/utils/dist/declarations/src/polymorphic").Merge<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: import("react").Ref<HTMLDivElement>;
+}, import("@reach/dialog/dist/declarations/src").DialogOverlayProps & {
+    as?: "div";
+}>>, import("styled-components").DefaultTheme, {}, never>;
+interface SheetProps extends DialogContentProps, AnimationProps, WidthProps, MaxWidthProps, HeightProps, MaxHeightProps, SpaceProps, LayoutProps {
+}
+declare const Sheet: import("styled-components").StyledComponent<import("framer-motion").CustomDomComponent<import("@reach/utils/dist/declarations/src/polymorphic").Merge<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: import("react").Ref<HTMLDivElement>;
+}, DialogContentProps & {
+    as?: "div";
+}>>, import("styled-components").DefaultTheme, {
+    [x: string]: {};
+} & SheetProps, never>;
+declare const ContentContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+declare const Footer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+declare const Header: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+declare const Title: import("styled-components").StyledComponent<"p", import("styled-components").DefaultTheme, import("react").HTMLAttributes<HTMLParagraphElement> & {
+    variant?: import("../NDSProvider/ComponentVariantContext").ComponentVariant;
+    inline?: boolean;
+    disabled?: boolean;
+    textTransform?: "-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "full-width" | "capitalize" | "full-size-kana" | "lowercase" | "uppercase";
+    fontSize?: string;
+} & import("../StyledProps").StyledProps & {
+    as: string;
+}, "as">;
+declare const HelpText: import("styled-components").StyledComponent<"p", import("styled-components").DefaultTheme, import("react").HTMLAttributes<HTMLParagraphElement> & {
+    variant?: import("../NDSProvider/ComponentVariantContext").ComponentVariant;
+    inline?: boolean;
+    disabled?: boolean;
+    textTransform?: "-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "full-width" | "capitalize" | "full-size-kana" | "lowercase" | "uppercase";
+    fontSize?: string;
+} & import("../StyledProps").StyledProps, never>;
+export { Overlay, Sheet, ContentContainer, Footer, Header, Title, HelpText };

package/dist/src/BottomSheet/BottomSheetProvider.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+interface BottomSheetContextType {
+    isOpen: boolean;
+    onClose: () => void;
+}
+declare function useBottomSheet(): BottomSheetContextType;
+declare function BottomSheetProvider({ isOpen, onClose, children, }: {
+    isOpen: boolean;
+    onClose: () => void;
+    children: React.ReactNode;
+}): React.JSX.Element;
+export { BottomSheetProvider, useBottomSheet };

package/dist/src/BottomSheet/stories/BottomSheet.actions.story.d.ts

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

package/dist/src/BottomSheet/stories/BottomSheet.content.story.d.ts

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

package/dist/src/BottomSheet/stories/BottomSheet.features.story.d.ts

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

package/dist/src/BottomSheet/stories/BottomSheet.parts.story.d.ts

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

package/dist/src/BottomSheet/stories/BottomSheet.story.d.ts

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

package/dist/src/Link/Link.d.ts

@@ -8,5 +8,13 @@ export type LinkProps = React.ComponentPropsWithRef<"a"> & Partial<StyledProps>
     to?: string;
     as?: React.ElementType | string;
 };
-declare const Link: React.ForwardRefExoticComponent<Omit<LinkProps, "ref"> & React.RefAttributes<HTMLLinkElement>>;
+declare const Link: import("styled-components").StyledComponent<"a", import("styled-components").DefaultTheme, Omit<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
+    ref?: React.Ref<HTMLAnchorElement>;
+} & Partial<StyledProps> & {
+    underline?: boolean;
+    hover?: string;
+    variant?: ComponentVariant;
+    to?: string;
+    as?: React.ElementType | string;
+}, never>;
 export default Link;

package/dist/src/Select/Select.story.d.ts

@@ -102,6 +102,7 @@ export declare const WithCustomOptionComponent: {
         name: string;
     };
 };
+export declare const WithACustomSelectedOption: () => React.JSX.Element;
 export declare const UsingRefToControlFocus: {
     (): React.JSX.Element;
     story: {

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

@@ -1,6 +1,10 @@
+import { styleFn, variant as styledSystemVariant } from "styled-system";
 import type { SpaceProps, PaddingProps, MarginProps, WidthProps, FontSizeProps, FontFamilyProps, TextAlignProps, LineHeightProps, FontWeightProps, FontStyleProps, LetterSpacingProps, DisplayProps, MaxWidthProps, MinWidthProps, HeightProps, MaxHeightProps, MinHeightProps, SizeProps, VerticalAlignProps, AlignItemsProps, AlignContentProps, JustifyItemsProps, JustifyContentProps, FlexWrapProps, FlexBasisProps, FlexDirectionProps, FlexProps, JustifySelfProps, AlignSelfProps, OrderProps, GridGapProps, GridColumnGapProps, GridRowGapProps, GridColumnProps, GridRowProps, GridAutoFlowProps, GridAutoColumnsProps, GridAutoRowsProps, GridTemplateColumnsProps, GridTemplateRowsProps, GridTemplateAreasProps, GridAreaProps, BorderProps, BorderTopProps, BorderRightProps, BorderBottomProps, BorderLeftProps, BordersProps, BorderColorProps, BorderRadiusProps, BoxShadowProps, OpacityProps, OverflowProps, BackgroundProps, BackgroundImageProps, BackgroundPositionProps, BackgroundRepeatProps, BackgroundSizeProps, PositionProps, ZIndexProps, TopProps, RightProps, BottomProps, LeftProps, TextStyleProps, ColorStyleProps, ButtonStyleProps, FlexboxProps, GridProps, BackgroundColorProps, FlexGrowProps, TypographyProps, LayoutProps } from "styled-system";
 import { CSSProperties } from "react";
-export declare const addStyledProps: import("styled-system").styleFn;
+export declare function getStyledPropNames(...styleFns: styleFn[]): string[];
+export declare const excludeStyledProps: (...styleFns: styleFn[]) => (prop: string | number) => boolean;
+export declare const variant: typeof styledSystemVariant;
+export declare const addStyledProps: styleFn;
 interface TransitionProps {
     transition?: CSSProperties["transition"];
     transitionDelay?: CSSProperties["transitionDelay"];

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

@@ -0,0 +1,5 @@
+/**
+ * No operation function that does nothing and returns nothing.
+ * Useful as a default callback or placeholder.
+ */
+export declare function noop(): void;

package/dist/src/utils/story/dashed.d.ts

@@ -0,0 +1,9 @@
+import { StyledComponent } from "styled-components";
+import { ComponentType } from "react";
+import { DefaultNDSThemeType } from "../../theme.type";
+/**
+ * A styled utility that adds a dashed border around a component
+ * to highlight its boundaries. To be used in Storybook exclusively.
+ * Do not export for production.
+ */
+export declare const dashed: <P extends object>(component: ComponentType<P>) => StyledComponent<ComponentType<P>, DefaultNDSThemeType, {}, never>;

package/dist/src/utils/story/placeholder.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { BoxProps } from "../../Box";
+/**
+ * A dialognaly striped and bordered rectangle that can be used as a placeholder for content.
+ * To be used in Storybook exclusively. Do not export for production.
+ */
+export declare function Placeholder(props: BoxProps): React.JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nulogy/components",
-  "version": "11.0.0",
+  "version": "11.1.0",
   "description": "Component library for the Nulogy Design System - http://nulogy.design",
   "private": false,
   "publishConfig": {
@@ -145,6 +145,7 @@
   "dependencies": {
     "@babel/runtime": "^7.9.6",
     "@nulogy/tokens": "^5.4.0",
+    "@reach/dialog": "0.17.0",
     "@styled-system/prop-types": "^5.1.4",
     "@styled-system/theme-get": "^5.1.2",
     "@types/styled-system": "5.1.22",

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

@@ -1,2 +0,0 @@
-export function Deprecated(Component: any, message?: string): (props: any) => React.JSX.Element;
-import React from "react";

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

@@ -1 +0,0 @@
-export function conditionallyRequiredProp(propType: any, dependsOnPropName: any): (props: any, propName: any, componentName: any, ...rest: any[]) => any;

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

@@ -1,9 +0,0 @@
-import { StyledComponent } from "styled-components";
-import { ComponentType } from "react";
-import { DefaultNDSThemeType } from "../theme.type";
-/**
- * A styled utility that adds a dashed border around a component
- * to highlight its boundaries. To be used in Storybook exclusively.
- */
-declare const dashed: <P extends object>(component: ComponentType<P>) => StyledComponent<ComponentType<P>, DefaultNDSThemeType, {}, never>;
-export default dashed;

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

@@ -1 +0,0 @@
-export function deprecatedProp(propType: any, newPropName: any): (props: any, propName: any, componentName: any, ...rest: any[]) => any;