@biblioteksentralen/react 1.0.0-beta.5 → 1.0.0-beta.6

package/README.md

@@ -0,0 +1,11 @@
+# React library for reusable code in Biblioteksentralens js-apps
+
+Simple React utility library for usage in Biblioteksentralen. Feel free to use, but functionality might not work as expected outside Biblioteksentralen context.
+
+Written in typescript.
+
+React components are written for usage in Nextjs, and might rely upon nextjs to work properly.
+
+## Storybook
+
+We have a storybook you can visit to see our components here: [https://biblioteksentralen.github.io/js-utils](https://biblioteksentralen.github.io/js-utils)

package/dist/index.d.ts

@@ -1,14 +1,118 @@
-export * from "@chakra-ui/react";
-export { Alert } from "./components/Alert";
-export { Button } from "./components/Button";
-export { ConditionalWrapper } from "./components/ConditionalWrapper";
-export { HideWithCSS } from "./components/HideWithCSS";
-export { Input } from "./components/Input";
-export { Link } from "./components/Link";
-export { VisuallyHidden } from "./components/VisuallyHidden";
-export { BiblioteksentralenProvider } from "./BiblioteksentralenProvider";
-export { ErrorBoundary } from "./components/ErrorBoundary";
-export { HashLinkTarget } from "./components/HashLinkTarget";
-export { withErrorBoundary } from "./components/withErrorBoundary";
-export { colors } from "@biblioteksentralen/utils";
-export { biblioteksentralenChakraTheme } from "./styles/chakraTheme/biblioteksentralenChakraTheme";
+import { FlexProps, AlertProps, ComponentWithAs, ButtonProps, ThemeTypings, BoxProps, InputProps, FormLabelProps, LinkProps, ChakraTheme } from '@chakra-ui/react';
+export * from '@chakra-ui/react';
+import React, { ReactNode, FunctionComponent, HTMLAttributes, ErrorInfo } from 'react';
+import { Modify } from '@biblioteksentralen/types';
+export { colors } from '@biblioteksentralen/utils';
+import { ChakraTheme as ChakraTheme$1 } from '@chakra-ui/theme';
+
+type Status = Exclude<AlertProps["status"], undefined | "loading">;
+type Variants = "inline";
+interface Props$7 extends FlexProps {
+    children: ReactNode;
+    status: Status;
+    variant?: Variants;
+}
+declare function Alert({ status, children, variant, ...rest }: Props$7): React.JSX.Element;
+
+type CustomButtonVariants = "primary" | "secondary" | "tertiary";
+
+/**
+ * Re-exporting chackras Button with a customised types
+ * This causes both chakras native variants and our home-made variants to show up in auto-complete
+ */
+type ButtonVariants = ButtonProps["variant"] | CustomButtonVariants;
+declare const Button: ComponentWithAs<"button", Modify<ButtonProps, {
+    variant?: ButtonVariants;
+}>>;
+
+type Props$6 = {
+    children: ReactNode;
+    wrapper: FunctionComponent<{
+        children: ReactNode;
+    }>;
+    condition: boolean;
+};
+/**
+ * Conditionally wrapps children with a component. If conditions are not met children mounted without the wrapper.
+ */
+declare const ConditionalWrapper: FunctionComponent<Props$6>;
+
+type Props$5 = {
+    children: ReactNode;
+    above?: ThemeTypings["breakpoints"];
+    below?: ThemeTypings["breakpoints"];
+} & Omit<BoxProps, "display">;
+/** Chakras <Hide /> component uses client side javascript to hide components. Causes components to flash on mobile while loading */
+declare const HideWithCSS: FunctionComponent<Props$5>;
+
+interface Props$4 extends InputProps {
+    label: string;
+    hideLabel?: boolean;
+    labelProps?: FormLabelProps;
+    helperText?: string;
+    errorMessage?: string;
+}
+/**
+ * Creating custom input-component to make sure label is always set (for accessibility)
+ * Also handles some common needs (helper text and error message. For more advanced input-components we leave it to the consumers to compose custom input-components based on Chakra
+ */
+declare const Input: React.ForwardRefExoticComponent<Props$4 & React.RefAttributes<unknown>>;
+
+type CustomLinkVariants = "plain";
+
+/**
+ * Re-exporting chackras Link with a customised types
+ * This causes both chakras native variants and our home-made variants to show up in auto-complete
+ */
+type LinkVariants = LinkProps["variant"] | CustomLinkVariants;
+declare const Link: ComponentWithAs<"a", Modify<LinkProps, {
+    variant?: LinkVariants;
+}>>;
+
+interface Props$3 extends HTMLAttributes<HTMLSpanElement> {
+    children: ReactNode;
+}
+declare function VisuallyHidden({ children, ...rest }: Props$3): React.JSX.Element;
+
+interface Props$2 {
+    children: ReactNode;
+    customTheme?: Partial<ChakraTheme>;
+}
+declare const BiblioteksentralenProvider: (props: Props$2) => React.JSX.Element;
+
+interface Props$1 {
+    boundaryName?: string;
+    children: ReactNode;
+}
+interface State {
+    hasError: boolean;
+    error?: Error;
+    errorInfo?: ErrorInfo;
+}
+declare class ErrorBoundary extends React.Component<Props$1, State> {
+    constructor(props: any);
+    static getDerivedStateFromError(error: any): {
+        hasError: boolean;
+    };
+    componentDidCatch(error: any, errorInfo: any): void;
+    render(): string | number | boolean | Iterable<React.ReactNode> | React.JSX.Element | null | undefined;
+}
+
+interface Props {
+    id: string;
+    /**
+     * angir hvor mye luft til vil ha over HashLinkTarget ved bruk av hash-lenke, eks '4rem'
+     */
+    spaceAbove?: string;
+    /**
+     * angir om du vil ha fokusramme rundt komponenten som mounter HashLinkTarget. Da må komponenten du wrapper med ha position: relative | absolute el
+     */
+    focusOnParent?: boolean;
+}
+declare function HashLinkTarget(props: Props): React.JSX.Element;
+
+declare const withErrorBoundary: <Props>(Component: React.ComponentType<Props>, boundaryName: string) => React.ForwardRefExoticComponent<React.PropsWithoutRef<Props> & React.RefAttributes<unknown>>;
+
+declare const biblioteksentralenChakraTheme: Partial<ChakraTheme$1>;
+
+export { Alert, BiblioteksentralenProvider, Button, ConditionalWrapper, ErrorBoundary, HashLinkTarget, HideWithCSS, Input, Link, VisuallyHidden, biblioteksentralenChakraTheme, withErrorBoundary };