datocms-react-ui 0.3.7 → 0.3.11

package/dist/esm/Form/index.d.ts

@@ -6,4 +6,76 @@ export interface FormProps {
     className?: string;
     children: ReactNode;
 }
+/**
+ * @example Full example
+ *
+ * ```js
+ * <Canvas ctx={ctx}>
+ *   <Form onSubmit={() => console.log('onSubmit')}>
+ *     <FieldGroup>
+ *       <TextField
+ *         required
+ *         name="name"
+ *         id="name"
+ *         label="Name"
+ *         value="Mark Smith"
+ *         placeholder="Enter full name"
+ *         hint="Provide a full name"
+ *         onChange={(newValue) => console.log(newValue)}
+ *       />
+ *       <TextField
+ *         required
+ *         name="email"
+ *         id="email"
+ *         label="Email"
+ *         type="email"
+ *         value=""
+ *         placeholder="your@email.com"
+ *         error="Please enter an email!"
+ *         hint="Enter email address"
+ *         onChange={(newValue) => console.log(newValue)}
+ *       />
+ *       <TextField
+ *         required
+ *         name="apiToken"
+ *         id="apiToken"
+ *         label="API Token"
+ *         value="XXXYYY123"
+ *         hint="Enter a valid API token"
+ *         textInputProps={{ monospaced: true }}
+ *         onChange={(newValue) => console.log(newValue)}
+ *       />
+ *       <SelectField
+ *         name="option"
+ *         id="option"
+ *         label="Option"
+ *         hint="Select one of the options"
+ *         value={{ label: 'Option 1', value: 'option1' }}
+ *         selectInputProps={{
+ *           options: [
+ *             { label: 'Option 1', value: 'option1' },
+ *             { label: 'Option 2', value: 'option2' },
+ *             { label: 'Option 3', value: 'option3' },
+ *           ],
+ *         }}
+ *         onChange={(newValue) => console.log(newValue)}
+ *       />
+ *       <SwitchField
+ *         name="debugMode"
+ *         id="debugMode"
+ *         label="Debug mode active?"
+ *         hint="Logs messages to console"
+ *         value={true}
+ *         onChange={(newValue) => console.log(newValue)}
+ *       />
+ *     </FieldGroup>
+ *     <FieldGroup>
+ *       <Button fullWidth buttonType="primary">
+ *         Submit
+ *       </Button>
+ *     </FieldGroup>
+ *   </Form>
+ * </Canvas>;
+ * ```
+ */
 export declare const Form: ({ children, className, onSubmit, spacing, ...otherProps }: FormProps) => JSX.Element;

package/dist/esm/Form/index.js

@@ -23,6 +23,78 @@ var __rest = (this && this.__rest) || function (s, e) {
 import React, { Children, useCallback, } from 'react';
 import cn from 'classnames';
 import styles from './styles.module.css.json';
+/**
+ * @example Full example
+ *
+ * ```js
+ * <Canvas ctx={ctx}>
+ *   <Form onSubmit={() => console.log('onSubmit')}>
+ *     <FieldGroup>
+ *       <TextField
+ *         required
+ *         name="name"
+ *         id="name"
+ *         label="Name"
+ *         value="Mark Smith"
+ *         placeholder="Enter full name"
+ *         hint="Provide a full name"
+ *         onChange={(newValue) => console.log(newValue)}
+ *       />
+ *       <TextField
+ *         required
+ *         name="email"
+ *         id="email"
+ *         label="Email"
+ *         type="email"
+ *         value=""
+ *         placeholder="your@email.com"
+ *         error="Please enter an email!"
+ *         hint="Enter email address"
+ *         onChange={(newValue) => console.log(newValue)}
+ *       />
+ *       <TextField
+ *         required
+ *         name="apiToken"
+ *         id="apiToken"
+ *         label="API Token"
+ *         value="XXXYYY123"
+ *         hint="Enter a valid API token"
+ *         textInputProps={{ monospaced: true }}
+ *         onChange={(newValue) => console.log(newValue)}
+ *       />
+ *       <SelectField
+ *         name="option"
+ *         id="option"
+ *         label="Option"
+ *         hint="Select one of the options"
+ *         value={{ label: 'Option 1', value: 'option1' }}
+ *         selectInputProps={{
+ *           options: [
+ *             { label: 'Option 1', value: 'option1' },
+ *             { label: 'Option 2', value: 'option2' },
+ *             { label: 'Option 3', value: 'option3' },
+ *           ],
+ *         }}
+ *         onChange={(newValue) => console.log(newValue)}
+ *       />
+ *       <SwitchField
+ *         name="debugMode"
+ *         id="debugMode"
+ *         label="Debug mode active?"
+ *         hint="Logs messages to console"
+ *         value={true}
+ *         onChange={(newValue) => console.log(newValue)}
+ *       />
+ *     </FieldGroup>
+ *     <FieldGroup>
+ *       <Button fullWidth buttonType="primary">
+ *         Submit
+ *       </Button>
+ *     </FieldGroup>
+ *   </Form>
+ * </Canvas>;
+ * ```
+ */
 export var Form = function (_a) {
     var children = _a.children, className = _a.className, onSubmit = _a.onSubmit, _b = _a.spacing, spacing = _b === void 0 ? 'default' : _b, otherProps = __rest(_a, ["children", "className", "onSubmit", "spacing"]);
     var classNames = cn(styles.Form, className);

package/dist/esm/Form/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/Form/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EACZ,QAAQ,EACR,WAAW,GAKZ,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,MAAM,MAAM,0BAA0B,CAAC;AAU9C,MAAM,CAAC,IAAM,IAAI,GAAG,UAAC,EAMT;IALV,IAAA,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,QAAQ,cAAA,EACR,eAAmB,EAAnB,OAAO,mBAAG,SAAS,KAAA,EAChB,UAAU,cALM,gDAMpB,CADc;IAEb,IAAM,UAAU,GAAG,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;IAE9C,IAAM,kBAAkB,GAAG,EAAE,CAAC,MAAM,CAAC,UAAU,EAAE,MAAM,CAAC,iBAAe,OAAS,CAAC,CAAC,CAAC;IAEnF,IAAM,YAAY,GAAG,WAAW,CAC9B,UAAC,KAAgB;QACf,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,IAAI,QAAQ,EAAE;YACZ,QAAQ,CAAC,KAAK,CAAC,CAAC;SACjB;IACH,CAAC,EACD,CAAC,QAAQ,CAAC,CACX,CAAC;IAEF,OAAO,CACL,uCAAM,SAAS,EAAE,UAAU,EAAE,QAAQ,EAAE,YAAY,IAAM,UAAU,GAChE,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,UAAC,KAAK;QAC5B,IAAI,KAAK,EAAE;YACT,OAAO,6BAAK,SAAS,EAAE,kBAAkB,IAAG,KAAK,CAAO,CAAC;SAC1D;QACD,OAAO,IAAI,CAAC;IACd,CAAC,CAAC,CACG,CACR,CAAC;AACJ,CAAC,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/Form/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EACZ,QAAQ,EACR,WAAW,GAKZ,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,MAAM,MAAM,0BAA0B,CAAC;AAU9C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuEG;AACH,MAAM,CAAC,IAAM,IAAI,GAAG,UAAC,EAMT;IALV,IAAA,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,QAAQ,cAAA,EACR,eAAmB,EAAnB,OAAO,mBAAG,SAAS,KAAA,EAChB,UAAU,cALM,gDAMpB,CADc;IAEb,IAAM,UAAU,GAAG,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;IAE9C,IAAM,kBAAkB,GAAG,EAAE,CAC3B,MAAM,CAAC,UAAU,EACjB,MAAM,CAAC,iBAAe,OAAS,CAAC,CACjC,CAAC;IAEF,IAAM,YAAY,GAAG,WAAW,CAC9B,UAAC,KAAgB;QACf,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,IAAI,QAAQ,EAAE;YACZ,QAAQ,CAAC,KAAK,CAAC,CAAC;SACjB;IACH,CAAC,EACD,CAAC,QAAQ,CAAC,CACX,CAAC;IAEF,OAAO,CACL,uCAAM,SAAS,EAAE,UAAU,EAAE,QAAQ,EAAE,YAAY,IAAM,UAAU,GAChE,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,UAAC,KAAK;QAC5B,IAAI,KAAK,EAAE;YACT,OAAO,6BAAK,SAAS,EAAE,kBAAkB,IAAG,KAAK,CAAO,CAAC;SAC1D;QACD,OAAO,IAAI,CAAC;IACd,CAAC,CAAC,CACG,CACR,CAAC;AACJ,CAAC,CAAC"}

package/dist/esm/Section/index.d.ts

@@ -0,0 +1,63 @@
+import { CSSProperties, ReactNode } from 'react';
+declare type SectionProps = {
+    title: ReactNode;
+    children?: ReactNode;
+    highlighted?: boolean;
+    collapsible?: {
+        isOpen: boolean;
+        onToggle: () => void;
+    };
+    headerClassName?: string;
+    titleClassName?: string;
+    headerStyle?: CSSProperties;
+    titleStyle?: CSSProperties;
+};
+/**
+ * @example Basic usage
+ *
+ * ```jsx
+ * <Canvas ctx={ctx}>
+ *   <Section title="Section title">
+ *     Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
+ *     eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
+ *     ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
+ *     aliquip ex ea commodo consequat.
+ *   </Section>
+ * </Canvas>;
+ * ```
+ *
+ * @example Highlighted
+ *
+ * ```jsx
+ * <Canvas ctx={ctx}>
+ *   <Section title="Section title" highlighted>
+ *     Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
+ *     eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
+ *     ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
+ *     aliquip ex ea commodo consequat.
+ *   </Section>
+ * </Canvas>;
+ * ```
+ *
+ * @example Collapsible
+ *
+ * ```jsx
+ * <Canvas ctx={ctx}>
+ *   <StateManager initial={true}>
+ *     {(isOpen, setOpen) => (
+ *       <Section
+ *         title="Section title"
+ *         collapsible={{ isOpen, onToggle: () => setOpen((v) => !v) }}
+ *       >
+ *         Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
+ *         eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
+ *         enim ad minim veniam, quis nostrud exercitation ullamco laboris
+ *         nisi ut aliquip ex ea commodo consequat.
+ *       </Section>
+ *     )}
+ *   </StateManager>
+ * </Canvas>;
+ * ```
+ */
+export declare function Section({ title, children, highlighted, collapsible, headerClassName, titleClassName, headerStyle, titleStyle, }: SectionProps): JSX.Element;
+export {};

package/dist/esm/Section/index.js

@@ -0,0 +1,63 @@
+import React from 'react';
+import cn from 'classnames';
+import s from './styles.module.css.json';
+/**
+ * @example Basic usage
+ *
+ * ```jsx
+ * <Canvas ctx={ctx}>
+ *   <Section title="Section title">
+ *     Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
+ *     eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
+ *     ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
+ *     aliquip ex ea commodo consequat.
+ *   </Section>
+ * </Canvas>;
+ * ```
+ *
+ * @example Highlighted
+ *
+ * ```jsx
+ * <Canvas ctx={ctx}>
+ *   <Section title="Section title" highlighted>
+ *     Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
+ *     eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
+ *     ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
+ *     aliquip ex ea commodo consequat.
+ *   </Section>
+ * </Canvas>;
+ * ```
+ *
+ * @example Collapsible
+ *
+ * ```jsx
+ * <Canvas ctx={ctx}>
+ *   <StateManager initial={true}>
+ *     {(isOpen, setOpen) => (
+ *       <Section
+ *         title="Section title"
+ *         collapsible={{ isOpen, onToggle: () => setOpen((v) => !v) }}
+ *       >
+ *         Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
+ *         eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
+ *         enim ad minim veniam, quis nostrud exercitation ullamco laboris
+ *         nisi ut aliquip ex ea commodo consequat.
+ *       </Section>
+ *     )}
+ *   </StateManager>
+ * </Canvas>;
+ * ```
+ */
+export function Section(_a) {
+    var _b, _c;
+    var title = _a.title, children = _a.children, highlighted = _a.highlighted, collapsible = _a.collapsible, headerClassName = _a.headerClassName, titleClassName = _a.titleClassName, headerStyle = _a.headerStyle, titleStyle = _a.titleStyle;
+    return (React.createElement("div", { className: cn(s['Section'], (_b = {}, _b[s['Section--highlighted']] = highlighted, _b)) },
+        React.createElement("div", { className: cn(s['Section__header'], headerClassName), style: headerStyle },
+            React.createElement("div", { className: cn(s['Section__title'], titleClassName), style: titleStyle },
+                collapsible && (React.createElement("button", { type: "button", className: cn(s['Section__arrow'], (_c = {},
+                        _c[s['Section__arrow--is-open']] = collapsible.isOpen,
+                        _c)), onClick: collapsible.onToggle })),
+                React.createElement("div", { className: s['Section__title__content'] }, title))),
+        (!collapsible || collapsible.isOpen) && children));
+}
+//# sourceMappingURL=index.js.map

package/dist/esm/Section/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/Section/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmC,MAAM,OAAO,CAAC;AACxD,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,CAAC,MAAM,0BAA0B,CAAC;AAazC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8CG;AACH,MAAM,UAAU,OAAO,CAAC,EAST;;QARb,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,WAAW,iBAAA,EACX,WAAW,iBAAA,EACX,eAAe,qBAAA,EACf,cAAc,oBAAA,EACd,WAAW,iBAAA,EACX,UAAU,gBAAA;IAEV,OAAO,CACL,6BACE,SAAS,EAAE,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,YAAI,GAAC,CAAC,CAAC,sBAAsB,CAAC,IAAG,WAAW,MAAG;QAEzE,6BACE,SAAS,EAAE,EAAE,CAAC,CAAC,CAAC,iBAAiB,CAAC,EAAE,eAAe,CAAC,EACpD,KAAK,EAAE,WAAW;YAElB,6BACE,SAAS,EAAE,EAAE,CACX,CAAC,CAAC,gBAAgB,CAAC,EAEnB,cAAc,CACf,EACD,KAAK,EAAE,UAAU;gBAEhB,WAAW,IAAI,CACd,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,EAAE,CAAC,CAAC,CAAC,gBAAgB,CAAC;wBAC/B,GAAC,CAAC,CAAC,yBAAyB,CAAC,IAAG,WAAW,CAAC,MAAM;4BAClD,EACF,OAAO,EAAE,WAAW,CAAC,QAAQ,GAC7B,CACH;gBACD,6BAAK,SAAS,EAAE,CAAC,CAAC,yBAAyB,CAAC,IAAG,KAAK,CAAO,CACvD,CACF;QACL,CAAC,CAAC,WAAW,IAAI,WAAW,CAAC,MAAM,CAAC,IAAI,QAAQ,CAC7C,CACP,CAAC;AACJ,CAAC"}

package/dist/esm/Section/styles.module.css.json

@@ -0,0 +1 @@
+{ "Section": "_Section_zh95u_1", "Section--highlighted": "_Section--highlighted_zh95u_5", "pageContentSectionHighligh": "_pageContentSectionHighligh_zh95u_1", "Section__header": "_Section__header_zh95u_19", "Section__title": "_Section__title_zh95u_38", "Section__title__content": "_Section__title__content_zh95u_52", "Section__arrow": "_Section__arrow_zh95u_55", "Section__arrow--is-open": "_Section__arrow--is-open_zh95u_82" }

package/dist/esm/SelectField/index.d.ts

@@ -0,0 +1,60 @@
+import { ReactNode } from 'react';
+import { AsyncCreatableSelectInputProps, AsyncSelectInputProps, CreatableSelectInputProps, FormLabelProps, SelectInputProps } from '..';
+import { GroupBase } from 'react-select';
+declare type SelectFieldProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> = {
+    id: string;
+    name: string;
+    label: ReactNode;
+    hint?: ReactNode;
+    placeholder?: string;
+    error?: ReactNode;
+    required?: boolean;
+    formLabelProps?: FormLabelProps;
+    value: SelectInputProps<Option, IsMulti, Group>['value'];
+    onChange: SelectInputProps<Option, IsMulti, Group>['onChange'];
+    selectInputProps?: SelectInputProps<Option, IsMulti, Group>;
+};
+export declare function SelectField<Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ id, name, label, hint, error, required, placeholder, formLabelProps, value, onChange, selectInputProps, }: SelectFieldProps<Option, IsMulti, Group>): JSX.Element;
+declare type AsyncSelectFieldProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> = {
+    id: string;
+    name: string;
+    label: ReactNode;
+    hint?: ReactNode;
+    placeholder?: string;
+    error?: ReactNode;
+    required?: boolean;
+    formLabelProps?: FormLabelProps;
+    value: AsyncSelectInputProps<Option, IsMulti, Group>['value'];
+    onChange: AsyncSelectInputProps<Option, IsMulti, Group>['onChange'];
+    selectInputProps?: AsyncSelectInputProps<Option, IsMulti, Group>;
+};
+export declare function AsyncSelectField<Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ id, name, label, hint, error, required, placeholder, formLabelProps, value, onChange, selectInputProps, }: AsyncSelectFieldProps<Option, IsMulti, Group>): JSX.Element;
+declare type CreatableSelectFieldProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> = {
+    id: string;
+    name: string;
+    label: ReactNode;
+    hint?: ReactNode;
+    placeholder?: string;
+    error?: ReactNode;
+    required?: boolean;
+    formLabelProps?: FormLabelProps;
+    value: CreatableSelectInputProps<Option, IsMulti, Group>['value'];
+    onChange: CreatableSelectInputProps<Option, IsMulti, Group>['onChange'];
+    selectInputProps?: CreatableSelectInputProps<Option, IsMulti, Group>;
+};
+export declare function CreatableSelectField<Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ id, name, label, hint, error, required, placeholder, formLabelProps, value, onChange, selectInputProps, }: CreatableSelectFieldProps<Option, IsMulti, Group>): JSX.Element;
+declare type AsyncCreatableSelectFieldProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> = {
+    id: string;
+    name: string;
+    label: ReactNode;
+    hint?: ReactNode;
+    placeholder?: string;
+    error?: ReactNode;
+    required?: boolean;
+    formLabelProps?: FormLabelProps;
+    value: AsyncCreatableSelectInputProps<Option, IsMulti, Group>['value'];
+    onChange: AsyncCreatableSelectInputProps<Option, IsMulti, Group>['onChange'];
+    selectInputProps?: AsyncCreatableSelectInputProps<Option, IsMulti, Group>;
+};
+export declare function AsyncCreatableSelectField<Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ id, name, label, hint, error, required, placeholder, formLabelProps, value, onChange, selectInputProps, }: AsyncCreatableSelectFieldProps<Option, IsMulti, Group>): JSX.Element;
+export {};

package/dist/esm/SelectField/index.js

@@ -0,0 +1,46 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import React from 'react';
+import { AsyncCreatableSelectInput, AsyncSelectInput, CreatableSelectInput, FieldError, FieldHint, FormLabel, SelectInput, } from '..';
+export function SelectField(_a) {
+    var id = _a.id, name = _a.name, label = _a.label, hint = _a.hint, error = _a.error, required = _a.required, placeholder = _a.placeholder, formLabelProps = _a.formLabelProps, value = _a.value, onChange = _a.onChange, selectInputProps = _a.selectInputProps;
+    return (React.createElement(React.Fragment, null,
+        React.createElement(FormLabel, __assign({}, formLabelProps, { htmlFor: id, required: required, error: !!error }), label),
+        React.createElement(SelectInput, __assign({}, selectInputProps, { id: id, name: name, value: value, placeholder: placeholder, onChange: onChange, error: !!error })),
+        error && React.createElement(FieldError, null, error),
+        hint && React.createElement(FieldHint, null, hint)));
+}
+export function AsyncSelectField(_a) {
+    var id = _a.id, name = _a.name, label = _a.label, hint = _a.hint, error = _a.error, required = _a.required, placeholder = _a.placeholder, formLabelProps = _a.formLabelProps, value = _a.value, onChange = _a.onChange, selectInputProps = _a.selectInputProps;
+    return (React.createElement(React.Fragment, null,
+        React.createElement(FormLabel, __assign({}, formLabelProps, { htmlFor: id, required: required, error: !!error }), label),
+        React.createElement(AsyncSelectInput, __assign({}, selectInputProps, { id: id, name: name, value: value, placeholder: placeholder, onChange: onChange, error: !!error })),
+        error && React.createElement(FieldError, null, error),
+        hint && React.createElement(FieldHint, null, hint)));
+}
+export function CreatableSelectField(_a) {
+    var id = _a.id, name = _a.name, label = _a.label, hint = _a.hint, error = _a.error, required = _a.required, placeholder = _a.placeholder, formLabelProps = _a.formLabelProps, value = _a.value, onChange = _a.onChange, selectInputProps = _a.selectInputProps;
+    return (React.createElement(React.Fragment, null,
+        React.createElement(FormLabel, __assign({}, formLabelProps, { htmlFor: id, required: required, error: !!error }), label),
+        React.createElement(CreatableSelectInput, __assign({}, selectInputProps, { id: id, name: name, value: value, placeholder: placeholder, onChange: onChange, error: !!error })),
+        error && React.createElement(FieldError, null, error),
+        hint && React.createElement(FieldHint, null, hint)));
+}
+export function AsyncCreatableSelectField(_a) {
+    var id = _a.id, name = _a.name, label = _a.label, hint = _a.hint, error = _a.error, required = _a.required, placeholder = _a.placeholder, formLabelProps = _a.formLabelProps, value = _a.value, onChange = _a.onChange, selectInputProps = _a.selectInputProps;
+    return (React.createElement(React.Fragment, null,
+        React.createElement(FormLabel, __assign({}, formLabelProps, { htmlFor: id, required: required, error: !!error }), label),
+        React.createElement(AsyncCreatableSelectInput, __assign({}, selectInputProps, { id: id, name: name, value: value, placeholder: placeholder, onChange: onChange, error: !!error })),
+        error && React.createElement(FieldError, null, error),
+        hint && React.createElement(FieldHint, null, hint)));
+}
+//# sourceMappingURL=index.js.map

package/dist/esm/SelectField/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/SelectField/index.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAoB,MAAM,OAAO,CAAC;AACzC,OAAO,EACL,yBAAyB,EAEzB,gBAAgB,EAEhB,oBAAoB,EAEpB,UAAU,EACV,SAAS,EACT,SAAS,EAET,WAAW,GAEZ,MAAM,IAAI,CAAC;AAqBZ,MAAM,UAAU,WAAW,CAIzB,EAYyC;QAXzC,EAAE,QAAA,EACF,IAAI,UAAA,EACJ,KAAK,WAAA,EACL,IAAI,UAAA,EACJ,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,WAAW,iBAAA,EACX,cAAc,oBAAA,EACd,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,gBAAgB,sBAAA;IAEhB,OAAO,CACL;QACE,oBAAC,SAAS,eAAK,cAAc,IAAE,OAAO,EAAE,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC,KAAK,KAC3E,KAAK,CACI;QAEZ,oBAAC,WAAW,eACN,gBAAgB,IACpB,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,CAAC,CAAC,KAAK,IACd;QAED,KAAK,IAAI,oBAAC,UAAU,QAAE,KAAK,CAAc;QACzC,IAAI,IAAI,oBAAC,SAAS,QAAE,IAAI,CAAa,CACrC,CACJ,CAAC;AACJ,CAAC;AAoBD,MAAM,UAAU,gBAAgB,CAI9B,EAY8C;QAX9C,EAAE,QAAA,EACF,IAAI,UAAA,EACJ,KAAK,WAAA,EACL,IAAI,UAAA,EACJ,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,WAAW,iBAAA,EACX,cAAc,oBAAA,EACd,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,gBAAgB,sBAAA;IAEhB,OAAO,CACL;QACE,oBAAC,SAAS,eAAK,cAAc,IAAE,OAAO,EAAE,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC,KAAK,KAC3E,KAAK,CACI;QAEZ,oBAAC,gBAAgB,eACX,gBAAgB,IACpB,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,CAAC,CAAC,KAAK,IACd;QAED,KAAK,IAAI,oBAAC,UAAU,QAAE,KAAK,CAAc;QACzC,IAAI,IAAI,oBAAC,SAAS,QAAE,IAAI,CAAa,CACrC,CACJ,CAAC;AACJ,CAAC;AAoBD,MAAM,UAAU,oBAAoB,CAIlC,EAYkD;QAXlD,EAAE,QAAA,EACF,IAAI,UAAA,EACJ,KAAK,WAAA,EACL,IAAI,UAAA,EACJ,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,WAAW,iBAAA,EACX,cAAc,oBAAA,EACd,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,gBAAgB,sBAAA;IAEhB,OAAO,CACL;QACE,oBAAC,SAAS,eAAK,cAAc,IAAE,OAAO,EAAE,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC,KAAK,KAC3E,KAAK,CACI;QAEZ,oBAAC,oBAAoB,eACf,gBAAgB,IACpB,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,CAAC,CAAC,KAAK,IACd;QAED,KAAK,IAAI,oBAAC,UAAU,QAAE,KAAK,CAAc;QACzC,IAAI,IAAI,oBAAC,SAAS,QAAE,IAAI,CAAa,CACrC,CACJ,CAAC;AACJ,CAAC;AAoBD,MAAM,UAAU,yBAAyB,CAIvC,EAYuD;QAXvD,EAAE,QAAA,EACF,IAAI,UAAA,EACJ,KAAK,WAAA,EACL,IAAI,UAAA,EACJ,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,WAAW,iBAAA,EACX,cAAc,oBAAA,EACd,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,gBAAgB,sBAAA;IAEhB,OAAO,CACL;QACE,oBAAC,SAAS,eAAK,cAAc,IAAE,OAAO,EAAE,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC,KAAK,KAC3E,KAAK,CACI;QAEZ,oBAAC,yBAAyB,eACpB,gBAAgB,IACpB,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,CAAC,CAAC,KAAK,IACd;QAED,KAAK,IAAI,oBAAC,UAAU,QAAE,KAAK,CAAc;QACzC,IAAI,IAAI,oBAAC,SAAS,QAAE,IAAI,CAAa,CACrC,CACJ,CAAC;AACJ,CAAC"}

package/dist/esm/SelectInput/index.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+import { Props as RawSelectProps, GroupBase } from 'react-select';
+import { AsyncProps } from 'react-select/async';
+import { AsyncCreatableProps } from 'react-select/async-creatable';
+import { CreatableProps } from 'react-select/creatable';
+declare type ErrorProp = {
+    error?: boolean;
+};
+export declare type SelectInputProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> = Omit<RawSelectProps<Option, IsMulti, Group>, 'theme' | 'styles'> & ErrorProp;
+export declare function SelectInput<Option = unknown, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>>({ isDisabled, error, ...other }: SelectInputProps<Option, IsMulti, Group>): JSX.Element;
+export declare type AsyncSelectInputProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> = Omit<AsyncProps<Option, IsMulti, Group>, 'theme' | 'styles'> & ErrorProp;
+export declare function AsyncSelectInput<Option = unknown, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>>({ isDisabled, error, ...other }: AsyncSelectInputProps<Option, IsMulti, Group>): JSX.Element;
+export declare type CreatableSelectInputProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> = Omit<CreatableProps<Option, IsMulti, Group>, 'theme' | 'styles'> & ErrorProp;
+export declare function CreatableSelectInput<Option = unknown, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>>({ isDisabled, error, ...other }: CreatableSelectInputProps<Option, IsMulti, Group>): JSX.Element;
+export declare type AsyncCreatableSelectInputProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> = Omit<AsyncCreatableProps<Option, IsMulti, Group>, 'theme' | 'styles'> & ErrorProp;
+export declare function AsyncCreatableSelectInput<Option = unknown, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>>({ isDisabled, error, ...other }: AsyncCreatableSelectInputProps<Option, IsMulti, Group>): JSX.Element;
+export {};

package/dist/esm/SelectInput/index.js

@@ -0,0 +1,106 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React, { useMemo } from 'react';
+import RawSelect from 'react-select';
+import RawAsyncSelect from 'react-select/async';
+import RawAsyncCreatableSelect from 'react-select/async-creatable';
+import RawCreatableSelect from 'react-select/creatable';
+var themeConfig = function (existing) { return (__assign(__assign({}, existing), { borderRadius: 0, colors: __assign(__assign({}, existing.colors), { primary25: 'var(--semi-transparent-accent-color)', 
+        // disabled
+        neutral10: 'var(--border-color)', 
+        // normal
+        neutral20: 'var(--border-color)', 
+        // focused
+        primary: 'var(--accent-color)', 
+        // hover
+        neutral30: 'var(--darker-border-color)' }) })); };
+var useStyles = function (isDisabled, error) {
+    return useMemo(function () {
+        return {
+            placeholder: function (provided) { return (__assign(__assign({}, provided), { color: 'var(--placeholder-body-color)' })); },
+            container: function (provided) {
+                return __assign(__assign({}, provided), { fontSize: 'inherit' });
+            },
+            control: function (provided, _a) {
+                var isFocused = _a.isFocused;
+                var result = provided;
+                result = __assign(__assign({}, result), { minHeight: 40 });
+                if (isFocused) {
+                    return __assign(__assign({}, result), { borderColor: error ? 'var(--alert-color)' : 'var(--accent-color)', backgroundColor: isDisabled ? 'var(--disabled-color)' : 'white', boxShadow: "0 0 0 3px " + (error
+                            ? 'rgba(var(--alert-color-rgb-components), 0.2)'
+                            : 'var(--semi-transparent-accent-color)'), '&:hover': {
+                            borderColor: error ? 'var(--alert-color)' : 'var(--accent-color)',
+                        } });
+                }
+                return __assign(__assign({}, result), { borderColor: error ? 'var(--alert-color)' : 'var(--border-color)', backgroundColor: isDisabled ? 'var(--disabled-color)' : 'white', '&:hover': {
+                        borderColor: error
+                            ? 'var(--alert-color)'
+                            : 'var(--darker-border-color)',
+                    } });
+            },
+            multiValueRemove: function (provided) { return (__assign(__assign({}, provided), { cursor: 'pointer' })); },
+            menu: function (provided) {
+                return __assign(__assign({}, provided), { minWidth: 250 });
+            },
+            input: function (provided) {
+                var result = __assign(__assign({}, provided), { boxShadow: 'none', 'input:focus': {
+                        boxShadow: 'none',
+                    } });
+                return result;
+            },
+            multiValue: function (provided) {
+                return __assign(__assign({}, provided), { zIndex: 100000, backgroundColor: 'var(--light-color)' });
+            },
+            multiValueLabel: function (provided) { return (__assign(__assign({}, provided), { fontSize: 'inherit', padding: 3 })); },
+        };
+    }, [isDisabled, error]);
+};
+export function SelectInput(_a) {
+    var isDisabled = _a.isDisabled, error = _a.error, other = __rest(_a, ["isDisabled", "error"]);
+    var styles = useStyles(isDisabled, error);
+    return (React.createElement(RawSelect, __assign({}, other, { isDisabled: isDisabled, theme: themeConfig, 
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        styles: styles })));
+}
+export function AsyncSelectInput(_a) {
+    var isDisabled = _a.isDisabled, error = _a.error, other = __rest(_a, ["isDisabled", "error"]);
+    var styles = useStyles(isDisabled, error);
+    return (React.createElement(RawAsyncSelect, __assign({}, other, { isDisabled: isDisabled, theme: themeConfig, 
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        styles: styles })));
+}
+export function CreatableSelectInput(_a) {
+    var isDisabled = _a.isDisabled, error = _a.error, other = __rest(_a, ["isDisabled", "error"]);
+    var styles = useStyles(isDisabled, error);
+    return (React.createElement(RawCreatableSelect, __assign({}, other, { isDisabled: isDisabled, theme: themeConfig, 
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        styles: styles })));
+}
+export function AsyncCreatableSelectInput(_a) {
+    var isDisabled = _a.isDisabled, error = _a.error, other = __rest(_a, ["isDisabled", "error"]);
+    var styles = useStyles(isDisabled, error);
+    return (React.createElement(RawAsyncCreatableSelect, __assign({}, other, { isDisabled: isDisabled, theme: themeConfig, 
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        styles: styles })));
+}
+//# sourceMappingURL=index.js.map

package/dist/esm/SelectInput/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/SelectInput/index.tsx"],"names":[],"mappings":"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"}

package/dist/esm/SwitchInput/index.d.ts

@@ -3,7 +3,7 @@ export declare type SwitchInputChangeEventHandler = (newValue: boolean, event: R
 export interface SwitchInputProps extends Omit<React.HTMLAttributes<HTMLButtonElement>, 'onChange'> {
     name: string;
     disabled?: boolean;
-    onChange: SwitchInputChangeEventHandler;
+    onChange?: SwitchInputChangeEventHandler;
     onKeyDown?: React.KeyboardEventHandler<HTMLButtonElement>;
     value: boolean;
 }

package/dist/esm/SwitchInput/index.js

@@ -27,7 +27,7 @@ export function SwitchInput(_a) {
     var _b;
     var className = _a.className, value = _a.value, disabled = _a.disabled, onClick = _a.onClick, onChange = _a.onChange, onKeyDown = _a.onKeyDown, restProps = __rest(_a, ["className", "value", "disabled", "onClick", "onChange", "onKeyDown"]);
     function triggerChange(newValue, event) {
-        if (!disabled) {
+        if (!disabled && onChange) {
             onChange(newValue, event);
         }
     }

package/dist/esm/SwitchInput/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/SwitchInput/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,CAAC,MAAM,0BAA0B,CAAC;AAgBzC,MAAM,UAAU,WAAW,CAAC,EAQT;;IAPjB,IAAA,SAAS,eAAA,EACT,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,OAAO,aAAA,EACP,QAAQ,cAAA,EACR,SAAS,eAAA,EACN,SAAS,cAPc,sEAQ3B,CADa;IAEZ,SAAS,aAAa,CACpB,QAAiB,EACjB,KAAmF;QAEnF,IAAI,CAAC,QAAQ,EAAE;YACb,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;SAC3B;IACH,CAAC;IAED,SAAS,iBAAiB,CAAC,CAAyC;QAClE,IAAI,CAAC,CAAC,GAAG,KAAK,WAAW,EAAE;YACzB,aAAa,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;SACzB;aAAM,IAAI,CAAC,CAAC,GAAG,KAAK,YAAY,EAAE;YACjC,aAAa,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC;SACxB;QACD,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAG,CAAC,CAAC,CAAC;IACjB,CAAC;IAED,SAAS,eAAe,CAAC,CAAsC;QAC7D,aAAa,CAAC,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;QACzB,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,CAAC,CAAC,CAAC;IACf,CAAC;IAED,IAAM,eAAe,GAAG,EAAE,CAAC,CAAC,CAAC,aAAa,CAAC,EAAE,SAAS;QACpD,GAAC,CAAC,CAAC,sBAAsB,CAAC,IAAG,KAAK;QAClC,GAAC,CAAC,CAAC,uBAAuB,CAAC,IAAG,QAAQ;YACtC,CAAC;IAEH,OAAO,CACL,2CACM,SAAS,IACb,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,QAAQ,kBACC,KAAK,EACnB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,eAAe,EAC1B,SAAS,EAAE,iBAAiB,EAC5B,OAAO,EAAE,eAAe;QAExB,8BAAM,SAAS,EAAE,CAAC,CAAC,oBAAoB,CAAC,GAAI,CACrC,CACV,CAAC;AACJ,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/SwitchInput/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,CAAC,MAAM,0BAA0B,CAAC;AAkBzC,MAAM,UAAU,WAAW,CAAC,EAQT;;IAPjB,IAAA,SAAS,eAAA,EACT,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,OAAO,aAAA,EACP,QAAQ,cAAA,EACR,SAAS,eAAA,EACN,SAAS,cAPc,sEAQ3B,CADa;IAEZ,SAAS,aAAa,CACpB,QAAiB,EACjB,KAE0C;QAE1C,IAAI,CAAC,QAAQ,IAAI,QAAQ,EAAE;YACzB,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;SAC3B;IACH,CAAC;IAED,SAAS,iBAAiB,CAAC,CAAyC;QAClE,IAAI,CAAC,CAAC,GAAG,KAAK,WAAW,EAAE;YACzB,aAAa,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;SACzB;aAAM,IAAI,CAAC,CAAC,GAAG,KAAK,YAAY,EAAE;YACjC,aAAa,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC;SACxB;QACD,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAG,CAAC,CAAC,CAAC;IACjB,CAAC;IAED,SAAS,eAAe,CAAC,CAAsC;QAC7D,aAAa,CAAC,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;QACzB,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,CAAC,CAAC,CAAC;IACf,CAAC;IAED,IAAM,eAAe,GAAG,EAAE,CAAC,CAAC,CAAC,aAAa,CAAC,EAAE,SAAS;QACpD,GAAC,CAAC,CAAC,sBAAsB,CAAC,IAAG,KAAK;QAClC,GAAC,CAAC,CAAC,uBAAuB,CAAC,IAAG,QAAQ;YACtC,CAAC;IAEH,OAAO,CACL,2CACM,SAAS,IACb,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,QAAQ,kBACC,KAAK,EACnB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,eAAe,EAC1B,SAAS,EAAE,iBAAiB,EAC5B,OAAO,EAAE,eAAe;QAExB,8BAAM,SAAS,EAAE,CAAC,CAAC,oBAAoB,CAAC,GAAI,CACrC,CACV,CAAC;AACJ,CAAC"}

package/dist/esm/TextInput/styles.module.css.json

@@ -1 +1 @@
-{ "TextInput": "_TextInput_6kjb7_1", "TextInput--monospaced": "_TextInput--monospaced_6kjb7_30", "TextInput--disabled": "_TextInput--disabled_6kjb7_34", "TextInput--error": "_TextInput--error_6kjb7_40" }
+{ "TextInput": "_TextInput_x2oj2_1", "TextInput--monospaced": "_TextInput--monospaced_x2oj2_30", "TextInput--disabled": "_TextInput--disabled_x2oj2_35", "TextInput--error": "_TextInput--error_x2oj2_41" }

package/dist/esm/index.d.ts

@@ -10,3 +10,6 @@ export * from './SwitchInput';
 export * from './TextField';
 export * from './TextInput';
 export * from './ContextInspector';
+export * from './Section';
+export * from './SelectInput';
+export * from './SelectField';

package/dist/esm/index.js

@@ -10,4 +10,7 @@ export * from './SwitchInput';
 export * from './TextField';
 export * from './TextInput';
 export * from './ContextInspector';
+export * from './Section';
+export * from './SelectInput';
+export * from './SelectField';
 //# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC;AAC5B,cAAc,oBAAoB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC;AAC5B,cAAc,oBAAoB,CAAC;AACnC,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC"}