@primer/react-brand 0.68.0-rc.59bbed40 → 0.68.0-rc.5bd56cbb

package/esm/forms/TextInput/TextInput.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextInput.module.js","names":[],"sources":["../../../src/forms/TextInput/TextInput.module.css"],"sourcesContent":["/*\n * Default TextInput styles\n */\n.TextInput {\n  display: flex;\n  color: var(--brand-control-color-fg-default);\n  background-color: var(--brand-color-canvas-default);\n  border: none;\n  border-radius: var(--brand-borderRadius-medium);\n  line-height: var(--brand-text-lineHeight-100);\n  transition: var(--brand-control-animation-duration) var(--brand-control-animation-easing);\n  transition-property: color, background-color, box-shadow;\n}\n\n.TextInput::placeholder {\n  color: var(--brand-color-text-muted);\n  opacity: 1;\n}\n\n.TextInput[disabled] {\n  -webkit-text-fill-color: var(--brand-control-color-fg-disabled);\n  color: var(--brand-control-color-fg-disabled);\n  cursor: not-allowed;\n  background-color: var(--brand-control-color-canvas-disabled);\n  opacity: 1;\n}\n\n.TextInput:focus {\n  outline: none;\n}\n\n/*\n * Sizes\n */\n\n.TextInput-wrapper--medium {\n  height: var(--brand-control-medium-size);\n}\n\n.TextInput--medium {\n  font-weight: var(--brand-text-weight-100);\n  font-size: var(--brand-text-size-100);\n  padding: var(--brand-control-medium-paddingBlock-normal) var(--brand-control-medium-paddingInline-condensed);\n}\n\n.TextInput--large {\n  font-weight: var(--brand-text-weight-200);\n  font-size: var(--brand-text-size-200);\n  padding: var(--brand-control-large-paddingBlock-normal) var(--brand-control-large-paddingInline-condensed);\n}\n\n.TextInput-wrapper--large {\n  height: var(--brand-control-large-size);\n}\n\n/*\n * Visual states\n */\n.TextInput--fullWidth {\n  width: 100%;\n}\n\n/*\n * TextInput wrapper\n */\n\n.TextInput-wrapper--disabled {\n  border-color: var(--brand-control-color-border-disabled);\n}\n\n.TextInput-wrapper {\n  font-family: var(--brand-body-fontFamily);\n  display: inline-flex;\n  position: relative;\n  border: solid var(--brand-borderWidth-thin, 1px) var(--brand-control-color-border-default);\n  border-radius: var(--brand-borderRadius-medium);\n  transition: var(--brand-control-animation-duration) var(--brand-control-animation-easing);\n  transition-property: border;\n}\n\n.TextInput-wrapper--invisible {\n  border-color: transparent;\n}\n\n.TextInput-wrapper--fullWidth {\n  width: 100%;\n  display: flex;\n}\n\n.TextInput-wrapper:not(.TextInput-wrapper--fullWidth) {\n  width: min-content;\n}\n\n.TextInput-wrapper--monospace {\n  font-family: var(--brand-fontStack-monospace);\n}\n\n.TextInput-wrapper:focus-within {\n  border-color: var(--brand-color-focus);\n  box-shadow: 0 0 0 1px var(--brand-color-focus);\n  outline: none;\n}\n\n@media (forced-colors: active) {\n  .TextInput-wrapper:focus-within {\n    outline: var(--brand-borderWidth-thick) solid Highlight;\n    outline-offset: var(--base-size-2);\n  }\n}\n\n/*\n * Validation\n */\n\n.TextInput-wrapper--success,\n.TextInput-wrapper--success.TextInput-wrapper--disabled {\n  border-color: var(--brand-color-success-fg);\n}\n\n.TextInput-wrapper--error,\n.TextInput-wrapper--error.TextInput-wrapper--disabled {\n  border-color: var(--brand-color-danger-fg);\n}\n\n/*\n * TextInput visuals\n */\n.TextInput--has-leading-visual--medium {\n  padding-inline-start: calc(\n    var(--brand-control-medium-paddingInline-condensed) + var(--base-size-16) + var(--brand-control-medium-gap)\n  );\n}\n\n.TextInput--has-leading-visual--large {\n  padding-inline-start: calc(\n    var(--brand-control-large-paddingInline-condensed) + var(--base-size-20) + var(--brand-control-large-gap)\n  );\n}\n\n.TextInput--has-trailing-visual--medium {\n  padding-inline-end: calc(\n    var(--brand-control-medium-paddingInline-condensed) + var(--base-size-16) + var(--brand-control-medium-gap)\n  );\n}\n\n.TextInput--has-trailing-visual--large {\n  padding-inline-end: calc(\n    var(--brand-control-medium-paddingInline-condensed) + var(--base-size-20) + var(--brand-control-medium-gap)\n  );\n}\n\n.TextInput-leading-visual,\n.TextInput-trailing-visual {\n  display: grid;\n  position: absolute;\n  top: 0;\n  display: flex;\n  width: var(--base-size-16);\n  height: 100%;\n  align-items: center;\n  color: var(--color-fg-muted);\n  pointer-events: none;\n  color: var(--brand-color-text-default);\n}\n\n.TextInput-leading-visual--medium {\n  left: var(--brand-control-medium-paddingInline-condensed);\n}\n\n.TextInput-trailing-visual--medium {\n  right: var(--brand-control-medium-paddingInline-condensed);\n}\n\n.TextInput-leading-visual--large {\n  left: var(--brand-control-large-paddingInline-condensed);\n}\n\n.TextInput-trailing-visual--large {\n  right: var(--brand-control-large-paddingInline-condensed);\n}\n\n.TextInput-leading-visual-icon--medium {\n  width: var(--base-size-16);\n  height: var(--base-size-16);\n}\n\n.TextInput-leading-visual-icon--large {\n  width: var(--base-size-20);\n  height: var(--base-size-20);\n}\n\n/*\n * TextInput leading and trailing text\n */\n\n.TextInput-leading-text,\n.TextInput-trailing-text {\n  display: flex;\n  align-items: center;\n  color: var(--brand-color-text-muted);\n  pointer-events: none;\n  white-space: nowrap;\n}\n\n.TextInput-leading-text--disabled,\n.TextInput-trailing-text--disabled {\n  color: var(--brand-control-color-fg-disabled);\n  background-color: var(--brand-control-color-canvas-disabled);\n}\n\n.TextInput-leading-text {\n  border-top-left-radius: var(--brand-borderRadius-medium, 6px);\n  border-bottom-left-radius: var(--brand-borderRadius-medium, 6px);\n  border-right: 0;\n}\n\n.TextInput-trailing-text {\n  border-top-right-radius: var(--brand-borderRadius-medium, 6px);\n  border-bottom-right-radius: var(--brand-borderRadius-medium, 6px);\n  border-left: 0;\n}\n\n.TextInput-leading-text-inner,\n.TextInput-trailing-text-inner {\n  display: inline-flex;\n  color: var(--brand-color-text-muted);\n}\n\n.TextInput-leading-text-inner--medium,\n.TextInput-trailing-text-inner--medium {\n  padding-inline: var(--brand-control-medium-paddingInline-condensed);\n}\n\n.TextInput-leading-text-inner--large,\n.TextInput-trailing-text-inner--large {\n  padding-inline: var(--brand-control-large-paddingInline-condensed);\n}\n\n.TextInput-leading-text-inner {\n  border-right: 1px solid var(--brand-color-border-default);\n}\n\n.TextInput-trailing-text-inner {\n  border-left: 1px solid var(--brand-color-border-default);\n}\n\n.TextInput--has-leading-text {\n  border-left: 0;\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n}\n\n.TextInput--has-trailing-text {\n  border-right: 0;\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0;\n}\n\n.TextInput-leading-text--success,\n.TextInput-trailing-text--success {\n  border-color: var(--brand-color-success-fg);\n}\n\n.TextInput-leading-text--error,\n.TextInput-trailing-text--error {\n  border-color: var(--brand-color-danger-fg);\n}\n\n/* Remove all animations, transitions and smooth scroll for people that prefer not to see them */\n@media (prefers-reduced-motion: reduce) {\n  .TextInput,\n  .Checkbox::before,\n  .Checkbox::after,\n  .Checkbox * {\n    animation: none !important;\n    transition: none !important;\n    scroll-behavior: auto !important;\n  }\n}\n"],"mappings":""}

package/esm/forms/TextInput/index.d.ts

@@ -0,0 +1,2 @@
+export * from './TextInput';
+//# sourceMappingURL=index.d.ts.map

package/esm/forms/TextInput/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/forms/TextInput/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA"}

package/esm/forms/Textarea/Textarea.d.ts

@@ -0,0 +1,38 @@
+import React from 'react';
+import type { BaseProps } from '../../component-helpers';
+import type { FormInputSizes, FormValidationStatus } from '../form-types';
+export declare const DEFAULT_TEXTAREA_ROWS = 7;
+export declare const DEFAULT_TEXTAREA_COLS = 30;
+export declare const DEFAULT_TEXTAREA_RESIZE = "both";
+export type TextareaProps = {
+    /**
+     * Applies full width styling.
+     */
+    fullWidth?: boolean;
+    /**
+     * Removes border
+     */
+    invisible?: boolean;
+    /**
+     * Applies monospace styling.
+     */
+    monospace?: boolean;
+    /**
+     * Applies alternative sizing to the input
+     */
+    size?: FormInputSizes;
+    /**
+     * Applies a required attribute to the input
+     */
+    required?: boolean;
+    /**
+     *
+     */
+    validationStatus?: FormValidationStatus;
+    /**
+     * Allows resizing of the textarea
+     */
+    resize?: 'none' | 'both' | 'horizontal' | 'vertical';
+} & Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'size'> & BaseProps<HTMLTextAreaElement>;
+export declare const Textarea: React.ForwardRefExoticComponent<Omit<TextareaProps, "ref"> & React.RefAttributes<unknown>>;
+//# sourceMappingURL=Textarea.d.ts.map

package/esm/forms/Textarea/Textarea.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../src/forms/Textarea/Textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAGvC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,yBAAyB,CAAA;AACtD,OAAO,KAAK,EAAC,cAAc,EAAE,oBAAoB,EAAC,MAAM,eAAe,CAAA;AAIvE,eAAO,MAAM,qBAAqB,IAAI,CAAA;AACtC,eAAO,MAAM,qBAAqB,KAAK,CAAA;AACvC,eAAO,MAAM,uBAAuB,SAAS,CAAA;AAE7C,MAAM,MAAM,aAAa,GAAG;IAC1B;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB;;OAEG;IACH,IAAI,CAAC,EAAE,cAAc,CAAA;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;OAEG;IACH,gBAAgB,CAAC,EAAE,oBAAoB,CAAA;IACvC;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,YAAY,GAAG,UAAU,CAAA;CACrD,GAAG,IAAI,CAAC,KAAK,CAAC,sBAAsB,CAAC,mBAAmB,CAAC,EAAE,MAAM,CAAC,GACjE,SAAS,CAAC,mBAAmB,CAAC,CAAA;AAiEhC,eAAO,MAAM,QAAQ,4FAAwB,CAAA"}

package/esm/forms/Textarea/Textarea.js

@@ -0,0 +1,31 @@
+import e from "../../node_modules/clsx/dist/clsx.js";
+import t from "./Textarea.module.js";
+import { forwardRef as n } from "react";
+import { jsx as r } from "react/jsx-runtime";
+//#region src/forms/Textarea/Textarea.tsx
+var i = 7, a = 30, o = "both", s = {
+	root: "Textarea",
+	get outerContainer() {
+		return `${this.root}-outer-container`;
+	}
+}, c = n(({ children: n, className: i, cols: a = 30, disabled: c, fullWidth: l = !1, invisible: u = !1, monospace: d, placeholder: f, size: p = "medium", validationStatus: m, required: h, resize: g = o, rows: _ = 7, ...v }, y) => /* @__PURE__ */ r("span", {
+	className: e(t["Textarea-wrapper"], l && t["Textarea-wrapper--fullWidth"], u && t["Textarea-wrapper--invisible"], c && t["Textarea-wrapper--disabled"], d && t["Textarea-wrapper--monospace"], m && t[`Textarea-wrapper--${m}`]),
+	"data-testid": s.outerContainer,
+	children: /* @__PURE__ */ r("textarea", {
+		ref: y,
+		className: e(t.Textarea, "Textarea", t[`Textarea--${p}`], t[`Textarea-resize--${g}`], l && t["Textarea--fullWidth"], m && t[`Textarea--${m}`], i),
+		placeholder: f,
+		disabled: c,
+		"aria-invalid": m === "error",
+		required: h,
+		rows: _,
+		cols: a,
+		...v,
+		children: n
+	})
+}));
+c.displayName = "Textarea";
+//#endregion
+export { a as DEFAULT_TEXTAREA_COLS, o as DEFAULT_TEXTAREA_RESIZE, i as DEFAULT_TEXTAREA_ROWS, c as Textarea };
+
+//# sourceMappingURL=Textarea.js.map

package/esm/forms/Textarea/Textarea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Textarea.js","names":[],"sources":["../../../src/forms/Textarea/Textarea.tsx"],"sourcesContent":["import React, {forwardRef} from 'react'\nimport {clsx} from 'clsx'\n\nimport type {BaseProps} from '../../component-helpers'\nimport type {FormInputSizes, FormValidationStatus} from '../form-types'\n\nimport styles from './Textarea.module.css'\n\nexport const DEFAULT_TEXTAREA_ROWS = 7\nexport const DEFAULT_TEXTAREA_COLS = 30\nexport const DEFAULT_TEXTAREA_RESIZE = 'both'\n\nexport type TextareaProps = {\n  /**\n   * Applies full width styling.\n   */\n  fullWidth?: boolean\n  /**\n   * Removes border\n   */\n  invisible?: boolean\n  /**\n   * Applies monospace styling.\n   */\n  monospace?: boolean\n  /**\n   * Applies alternative sizing to the input\n   */\n  size?: FormInputSizes\n  /**\n   * Applies a required attribute to the input\n   */\n  required?: boolean\n  /**\n   *\n   */\n  validationStatus?: FormValidationStatus\n  /**\n   * Allows resizing of the textarea\n   */\n  resize?: 'none' | 'both' | 'horizontal' | 'vertical'\n} & Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'size'> &\n  BaseProps<HTMLTextAreaElement>\n\nconst testIds = {\n  root: 'Textarea',\n  get outerContainer() {\n    return `${this.root}-outer-container`\n  },\n}\n\nconst _Textarea = (\n  {\n    children,\n    className,\n    cols = DEFAULT_TEXTAREA_COLS,\n    disabled,\n    fullWidth = false,\n    invisible = false,\n    monospace,\n    placeholder,\n    size = 'medium',\n    validationStatus,\n    required,\n    resize = DEFAULT_TEXTAREA_RESIZE,\n    rows = DEFAULT_TEXTAREA_ROWS,\n    ...rest\n  }: TextareaProps,\n  ref,\n) => {\n  return (\n    <span\n      className={clsx(\n        styles['Textarea-wrapper'],\n        fullWidth && styles['Textarea-wrapper--fullWidth'],\n        invisible && styles['Textarea-wrapper--invisible'],\n        disabled && styles['Textarea-wrapper--disabled'],\n        monospace && styles['Textarea-wrapper--monospace'],\n        validationStatus && styles[`Textarea-wrapper--${validationStatus}`],\n      )}\n      data-testid={testIds.outerContainer}\n    >\n      <textarea\n        ref={ref}\n        className={clsx(\n          styles.Textarea,\n          'Textarea',\n          styles[`Textarea--${size}`],\n          styles[`Textarea-resize--${resize}`],\n          fullWidth && styles['Textarea--fullWidth'],\n          validationStatus && styles[`Textarea--${validationStatus}`],\n          className,\n        )}\n        placeholder={placeholder}\n        disabled={disabled}\n        aria-invalid={validationStatus === 'error'}\n        required={required}\n        rows={rows}\n        cols={cols}\n        {...rest}\n      >\n        {children}\n      </textarea>\n    </span>\n  )\n}\n\nexport const Textarea = forwardRef(_Textarea)\n\nTextarea.displayName = 'Textarea'\n"],"mappings":";;;;;AAQA,IAAa,IAAwB,GACxB,IAAwB,IACxB,IAA0B,QAkCjC,IAAU;CACd,MAAM;CACN,IAAI,iBAAiB;AACnB,SAAO,GAAG,KAAK,KAAK;;CAEvB,EA0DY,IAAW,GAvDtB,EACE,aACA,cACA,UAAA,IACA,aACA,eAAY,IACZ,eAAY,IACZ,cACA,gBACA,UAAO,UACP,qBACA,aACA,YAAS,GACT,UAAA,GACA,GAAG,KAEL,MAGE,kBAAC,QAAD;CACE,WAAW,EACT,EAAO,qBACP,KAAa,EAAO,gCACpB,KAAa,EAAO,gCACpB,KAAY,EAAO,+BACnB,KAAa,EAAO,gCACpB,KAAoB,EAAO,qBAAqB,KACjD;CACD,eAAa,EAAQ;WAErB,kBAAC,YAAD;EACO;EACL,WAAW,EACT,EAAO,UACP,YACA,EAAO,aAAa,MACpB,EAAO,oBAAoB,MAC3B,KAAa,EAAO,wBACpB,KAAoB,EAAO,aAAa,MACxC,EACD;EACY;EACH;EACV,gBAAc,MAAqB;EACzB;EACJ;EACA;EACN,GAAI;EAEH;EACQ,CAAA;CACN,CAAA,CAIkC;AAE7C,EAAS,cAAc"}

package/esm/forms/Textarea/Textarea.module-CdUlSjWq.css

@@ -0,0 +1 @@
+.Primer_Brand__Textarea-module__Textarea___mcWf5{color:var(--brand-control-color-fg-default);background-color:var(--brand-color-canvas-default);border-radius:var(--brand-borderRadius-medium);line-height:var(--brand-text-lineHeight-100);transition:var(--brand-control-animation-duration) var(--brand-control-animation-easing);border:none;transition-property:color,background-color,box-shadow;display:flex}.Primer_Brand__Textarea-module__Textarea___mcWf5::placeholder{color:var(--brand-color-text-muted);opacity:1}.Primer_Brand__Textarea-module__Textarea___mcWf5[disabled]{-webkit-text-fill-color:var(--brand-control-color-fg-disabled);color:var(--brand-control-color-fg-disabled);cursor:not-allowed;background-color:var(--brand-control-color-canvas-disabled);opacity:1;resize:none}.Primer_Brand__Textarea-module__Textarea___mcWf5:focus{outline:none}.Primer_Brand__Textarea-module__Textarea-resize--vertical___Vby4g{resize:vertical}.Primer_Brand__Textarea-module__Textarea-resize--horizontal___s4S8w{resize:horizontal}.Primer_Brand__Textarea-module__Textarea-resize--none___vLfq1{resize:none}.Primer_Brand__Textarea-module__Textarea-resize--both___SUVH9{resize:both}.Primer_Brand__Textarea-module__Textarea--medium___aewge{font-weight:var(--brand-text-weight-100);font-size:var(--brand-text-size-100);padding:var(--brand-control-medium-paddingBlock-normal) var(--brand-control-medium-paddingInline-condensed)}.Primer_Brand__Textarea-module__Textarea--large___5UAvr{font-weight:var(--brand-text-weight-200);font-size:var(--brand-text-size-200);padding:var(--brand-control-large-paddingBlock-normal) var(--brand-control-large-paddingInline-condensed)}.Primer_Brand__Textarea-module__Textarea--fullWidth___4Ds_8{width:100%}.Primer_Brand__Textarea-module__Textarea-wrapper--disabled___ZodGM{border-color:var(--brand-control-color-border-disabled)}.Primer_Brand__Textarea-module__Textarea-wrapper___MFMUn{font-family:var(--brand-body-fontFamily);border:solid 1px var(--brand-control-color-border-default);border:solid var(--brand-borderWidth-thin,1px) var(--brand-control-color-border-default);border-radius:var(--brand-borderRadius-medium);transition:var(--brand-control-animation-duration) var(--brand-control-animation-easing);transition-property:border;display:inline-flex;position:relative}.Primer_Brand__Textarea-module__Textarea-wrapper--invisible___PRsrD{border-color:#0000}.Primer_Brand__Textarea-module__Textarea-wrapper--fullWidth___0JycR{display:flex}.Primer_Brand__Textarea-module__Textarea-wrapper___MFMUn:not(.Primer_Brand__Textarea-module__Textarea-wrapper--fullWidth___0JycR){width:min-content}.Primer_Brand__Textarea-module__Textarea-wrapper--monospace___gvhYX{font-family:var(--brand-fontStack-monospace)}.Primer_Brand__Textarea-module__Textarea-wrapper___MFMUn:focus-within{border-color:var(--brand-color-focus);box-shadow:0 0 0 1px var(--brand-color-focus);outline:none}@media (forced-colors:active){.Primer_Brand__Textarea-module__Textarea-wrapper___MFMUn:focus-within{outline:var(--brand-borderWidth-thick) solid Highlight;outline-offset:var(--base-size-2)}}.Primer_Brand__Textarea-module__Textarea-wrapper--success___PQHrN,.Primer_Brand__Textarea-module__Textarea-wrapper--success___PQHrN.Primer_Brand__Textarea-module__Textarea-wrapper--disabled___ZodGM{border-color:var(--brand-color-success-fg)}.Primer_Brand__Textarea-module__Textarea-wrapper--error___7G92h,.Primer_Brand__Textarea-module__Textarea-wrapper--error___7G92h.Primer_Brand__Textarea-module__Textarea-wrapper--disabled___ZodGM{border-color:var(--brand-color-danger-fg)}@media (prefers-reduced-motion:reduce){.Primer_Brand__Textarea-module__Textarea___mcWf5,.Primer_Brand__Textarea-module__Textarea___mcWf5:before,.Primer_Brand__Textarea-module__Textarea___mcWf5:after,.Primer_Brand__Textarea-module__Textarea___mcWf5 *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

package/esm/forms/Textarea/Textarea.module.js

@@ -0,0 +1,21 @@
+import './Textarea.module-CdUlSjWq.css';var e = {
+	Textarea: "Primer_Brand__Textarea-module__Textarea___mcWf5",
+	"Textarea-resize--vertical": "Primer_Brand__Textarea-module__Textarea-resize--vertical___Vby4g",
+	"Textarea-resize--horizontal": "Primer_Brand__Textarea-module__Textarea-resize--horizontal___s4S8w",
+	"Textarea-resize--none": "Primer_Brand__Textarea-module__Textarea-resize--none___vLfq1",
+	"Textarea-resize--both": "Primer_Brand__Textarea-module__Textarea-resize--both___SUVH9",
+	"Textarea--medium": "Primer_Brand__Textarea-module__Textarea--medium___aewge",
+	"Textarea--large": "Primer_Brand__Textarea-module__Textarea--large___5UAvr",
+	"Textarea--fullWidth": "Primer_Brand__Textarea-module__Textarea--fullWidth___4Ds_8",
+	"Textarea-wrapper--disabled": "Primer_Brand__Textarea-module__Textarea-wrapper--disabled___ZodGM",
+	"Textarea-wrapper": "Primer_Brand__Textarea-module__Textarea-wrapper___MFMUn",
+	"Textarea-wrapper--invisible": "Primer_Brand__Textarea-module__Textarea-wrapper--invisible___PRsrD",
+	"Textarea-wrapper--fullWidth": "Primer_Brand__Textarea-module__Textarea-wrapper--fullWidth___0JycR",
+	"Textarea-wrapper--monospace": "Primer_Brand__Textarea-module__Textarea-wrapper--monospace___gvhYX",
+	"Textarea-wrapper--success": "Primer_Brand__Textarea-module__Textarea-wrapper--success___PQHrN",
+	"Textarea-wrapper--error": "Primer_Brand__Textarea-module__Textarea-wrapper--error___7G92h"
+};
+//#endregion
+export { e as default };
+
+//# sourceMappingURL=Textarea.module.js.map

package/esm/forms/Textarea/Textarea.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Textarea.module.js","names":[],"sources":["../../../src/forms/Textarea/Textarea.module.css"],"sourcesContent":["/*\n * Default Textarea styles\n */\n.Textarea {\n  display: flex;\n  color: var(--brand-control-color-fg-default);\n  background-color: var(--brand-color-canvas-default);\n  border: none;\n  border-radius: var(--brand-borderRadius-medium);\n  line-height: var(--brand-text-lineHeight-100);\n  transition: var(--brand-control-animation-duration) var(--brand-control-animation-easing);\n  transition-property: color, background-color, box-shadow;\n}\n\n.Textarea::placeholder {\n  color: var(--brand-color-text-muted);\n  opacity: 1;\n}\n\n.Textarea[disabled] {\n  -webkit-text-fill-color: var(--brand-control-color-fg-disabled);\n  color: var(--brand-control-color-fg-disabled);\n  cursor: not-allowed;\n  background-color: var(--brand-control-color-canvas-disabled);\n  opacity: 1;\n  resize: none;\n}\n\n.Textarea:focus {\n  outline: none;\n}\n\n.Textarea-resize--vertical {\n  resize: vertical;\n}\n\n.Textarea-resize--horizontal {\n  resize: horizontal;\n}\n\n.Textarea-resize--none {\n  resize: none;\n}\n\n.Textarea-resize--both {\n  resize: both;\n}\n\n/*\n * Sizes\n */\n.Textarea--medium {\n  font-weight: var(--brand-text-weight-100);\n  font-size: var(--brand-text-size-100);\n  padding: var(--brand-control-medium-paddingBlock-normal) var(--brand-control-medium-paddingInline-condensed);\n}\n\n.Textarea--large {\n  font-weight: var(--brand-text-weight-200);\n  font-size: var(--brand-text-size-200);\n  padding: var(--brand-control-large-paddingBlock-normal) var(--brand-control-large-paddingInline-condensed);\n}\n\n/*\n * Visual states\n */\n.Textarea--fullWidth {\n  width: 100%;\n}\n\n/*\n * Textarea wrapper\n */\n\n.Textarea-wrapper--disabled {\n  border-color: var(--brand-control-color-border-disabled);\n}\n\n.Textarea-wrapper {\n  font-family: var(--brand-body-fontFamily);\n  display: inline-flex;\n  position: relative;\n  border: solid var(--brand-borderWidth-thin, 1px) var(--brand-control-color-border-default);\n  border-radius: var(--brand-borderRadius-medium);\n  transition: var(--brand-control-animation-duration) var(--brand-control-animation-easing);\n  transition-property: border;\n}\n\n.Textarea-wrapper--invisible {\n  border-color: transparent;\n}\n\n.Textarea-wrapper--fullWidth {\n  display: flex;\n}\n\n.Textarea-wrapper:not(.Textarea-wrapper--fullWidth) {\n  width: min-content;\n}\n\n.Textarea-wrapper--monospace {\n  font-family: var(--brand-fontStack-monospace);\n}\n\n.Textarea-wrapper:focus-within {\n  border-color: var(--brand-color-focus);\n  box-shadow: 0 0 0 1px var(--brand-color-focus);\n  outline: none;\n}\n\n@media (forced-colors: active) {\n  .Textarea-wrapper:focus-within {\n    outline: var(--brand-borderWidth-thick) solid Highlight;\n    outline-offset: var(--base-size-2);\n  }\n}\n\n/*\n * Validation\n */\n\n.Textarea-wrapper--success,\n.Textarea-wrapper--success.Textarea-wrapper--disabled {\n  border-color: var(--brand-color-success-fg);\n}\n\n.Textarea-wrapper--error,\n.Textarea-wrapper--error.Textarea-wrapper--disabled {\n  border-color: var(--brand-color-danger-fg);\n}\n\n/* Remove all animations, transitions and smooth scroll for people that prefer not to see them */\n@media (prefers-reduced-motion: reduce) {\n  .Textarea,\n  .Textarea::before,\n  .Textarea::after,\n  .Textarea * {\n    animation: none !important;\n    transition: none !important;\n    scroll-behavior: auto !important;\n  }\n}\n"],"mappings":""}

package/esm/forms/Textarea/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Textarea';
+//# sourceMappingURL=index.d.ts.map

package/esm/forms/Textarea/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/forms/Textarea/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAA"}

package/esm/forms/form-types.d.ts

@@ -0,0 +1,3 @@
+export type FormValidationStatus = 'error' | 'success';
+export type FormInputSizes = 'medium' | 'large';
+//# sourceMappingURL=form-types.d.ts.map

package/esm/forms/form-types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-types.d.ts","sourceRoot":"","sources":["../../src/forms/form-types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,oBAAoB,GAAG,OAAO,GAAG,SAAS,CAAA;AACtD,MAAM,MAAM,cAAc,GAAG,QAAQ,GAAG,OAAO,CAAA"}

package/esm/forms/index.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Shared form (control) design tokens
+ */
+import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes.css';
+export * from './Checkbox';
+export * from './Textarea';
+export * from './TextInput';
+export * from './Select';
+export * from './Radio';
+export * from './FormControl';
+export * from './form-types';
+export * from './CheckboxGroup';
+export * from './RadioGroup';
+//# sourceMappingURL=index.d.ts.map

package/esm/forms/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/forms/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,2GAA2G,CAAA;AAElH,cAAc,YAAY,CAAA;AAC1B,cAAc,YAAY,CAAA;AAC1B,cAAc,aAAa,CAAA;AAC3B,cAAc,UAAU,CAAA;AACxB,cAAc,SAAS,CAAA;AACvB,cAAc,eAAe,CAAA;AAC7B,cAAc,cAAc,CAAA;AAC5B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,cAAc,CAAA"}

package/esm/hooks/useAnchoredPosition.d.ts

@@ -0,0 +1,21 @@
+import React, { RefObject } from 'react';
+import type { AnchorPosition, PositionSettings } from '@primer/behaviors';
+export type AnchoredPositionHookSettings = Partial<PositionSettings> & {
+    floatingElementRef?: React.RefObject<Element | null>;
+    anchorElementRef?: React.RefObject<Element | null>;
+};
+/**
+ * Calculates the top and left values for an absolutely-positioned floating element
+ * to be anchored to some anchor element. Returns refs for the floating element
+ * and the anchor element, along with the position.
+ * @param settings Settings for calculating the anchored position.
+ * @param dependencies Dependencies to determine when to re-calculate the position.
+ * @returns An object of {top: number, left: number} to absolutely-position the
+ * floating element.
+ */
+export declare function useAnchoredPosition(settings?: AnchoredPositionHookSettings, dependencies?: React.DependencyList): {
+    floatingElementRef: RefObject<Element | null> | undefined;
+    anchorElementRef: RefObject<Element | null> | undefined;
+    position: AnchorPosition | undefined;
+};
+//# sourceMappingURL=useAnchoredPosition.d.ts.map

package/esm/hooks/useAnchoredPosition.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAnchoredPosition.d.ts","sourceRoot":"","sources":["../../src/hooks/useAnchoredPosition.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAC,SAAS,EAAmC,MAAM,OAAO,CAAA;AAExE,OAAO,KAAK,EAAC,cAAc,EAAE,gBAAgB,EAAC,MAAM,mBAAmB,CAAA;AAGvE,MAAM,MAAM,4BAA4B,GAAG,OAAO,CAAC,gBAAgB,CAAC,GAAG;IACrE,kBAAkB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,OAAO,GAAG,IAAI,CAAC,CAAA;IACpD,gBAAgB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,OAAO,GAAG,IAAI,CAAC,CAAA;CACnD,CAAA;AAED;;;;;;;;GAQG;AACH,wBAAgB,mBAAmB,CACjC,QAAQ,CAAC,EAAE,4BAA4B,EACvC,YAAY,GAAE,KAAK,CAAC,cAAmB,GACtC;IACD,kBAAkB,EAAE,SAAS,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,SAAS,CAAA;IACzD,gBAAgB,EAAE,SAAS,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,SAAS,CAAA;IACvD,QAAQ,EAAE,cAAc,GAAG,SAAS,CAAA;CACrC,CA+BA"}

package/esm/hooks/useAnchoredPosition.js

@@ -0,0 +1,25 @@
+import { useResizeObserver as e } from "./useResizeObserver.js";
+import { useCallback as t, useEffect as n, useState as r } from "react";
+import { getAnchoredPosition as i } from "@primer/behaviors";
+//#region src/hooks/useAnchoredPosition.ts
+function a(a, o = []) {
+	let s = a?.floatingElementRef, c = a?.anchorElementRef, [l, u] = r(void 0), d = t(() => {
+		s.current instanceof Element && c.current instanceof Element ? u(i(s.current, c.current, {
+			side: a?.side,
+			align: a?.align
+		})) : u(void 0);
+	}, [
+		s,
+		c,
+		...o
+	]);
+	return n(d, [d]), e(d), {
+		floatingElementRef: s,
+		anchorElementRef: c,
+		position: l
+	};
+}
+//#endregion
+export { a as useAnchoredPosition };
+
+//# sourceMappingURL=useAnchoredPosition.js.map

package/esm/hooks/useAnchoredPosition.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAnchoredPosition.js","names":[],"sources":["../../src/hooks/useAnchoredPosition.ts"],"sourcesContent":["import React, {RefObject, useCallback, useEffect, useState} from 'react'\nimport {getAnchoredPosition} from '@primer/behaviors'\nimport type {AnchorPosition, PositionSettings} from '@primer/behaviors'\nimport {useResizeObserver} from './useResizeObserver'\n\nexport type AnchoredPositionHookSettings = Partial<PositionSettings> & {\n  floatingElementRef?: React.RefObject<Element | null>\n  anchorElementRef?: React.RefObject<Element | null>\n}\n\n/**\n * Calculates the top and left values for an absolutely-positioned floating element\n * to be anchored to some anchor element. Returns refs for the floating element\n * and the anchor element, along with the position.\n * @param settings Settings for calculating the anchored position.\n * @param dependencies Dependencies to determine when to re-calculate the position.\n * @returns An object of {top: number, left: number} to absolutely-position the\n * floating element.\n */\nexport function useAnchoredPosition(\n  settings?: AnchoredPositionHookSettings,\n  dependencies: React.DependencyList = [],\n): {\n  floatingElementRef: RefObject<Element | null> | undefined\n  anchorElementRef: RefObject<Element | null> | undefined\n  position: AnchorPosition | undefined\n} {\n  const floatingElementRef = settings?.floatingElementRef as RefObject<Element | null>\n  const anchorElementRef = settings?.anchorElementRef as RefObject<Element | null>\n\n  const [position, setPosition] = useState<AnchorPosition | undefined>(undefined)\n\n  const updatePosition = useCallback(\n    () => {\n      if (floatingElementRef.current instanceof Element && anchorElementRef.current instanceof Element) {\n        const anchoredPosition = getAnchoredPosition(floatingElementRef.current, anchorElementRef.current, {\n          side: settings?.side,\n          align: settings?.align,\n        })\n        setPosition(anchoredPosition)\n      } else {\n        setPosition(undefined)\n      }\n    },\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [floatingElementRef, anchorElementRef, ...dependencies],\n  )\n\n  useEffect(updatePosition, [updatePosition])\n\n  useResizeObserver(updatePosition)\n\n  return {\n    floatingElementRef,\n    anchorElementRef,\n    position,\n  }\n}\n"],"mappings":";;;;AAmBA,SAAgB,EACd,GACA,IAAqC,EAAE,EAKvC;CACA,IAAM,IAAqB,GAAU,oBAC/B,IAAmB,GAAU,kBAE7B,CAAC,GAAU,KAAe,EAAqC,KAAA,EAAU,EAEzE,IAAiB,QACf;AACJ,EAAI,EAAmB,mBAAmB,WAAW,EAAiB,mBAAmB,UAKvF,EAJyB,EAAoB,EAAmB,SAAS,EAAiB,SAAS;GACjG,MAAM,GAAU;GAChB,OAAO,GAAU;GAClB,CACW,CAAiB,GAE7B,EAAY,KAAA,EAAU;IAI1B;EAAC;EAAoB;EAAkB,GAAG;EAAa,CACxD;AAMD,QAJA,EAAU,GAAgB,CAAC,EAAe,CAAC,EAE3C,EAAkB,EAAe,EAE1B;EACL;EACA;EACA;EACD"}

package/esm/hooks/useCursorAnimation.d.ts

@@ -0,0 +1,38 @@
+export type UseCursorAnimationOptions = {
+    /**
+     * The text content to animate
+     */
+    text: string;
+    /**
+     * Whether to animate the text reveal with a cursor effect
+     */
+    animate?: boolean;
+    /**
+     * Duration of the reveal animation in milliseconds
+     */
+    duration?: number;
+    /**
+     * Delay to start the animation in milliseconds
+     */
+    delay?: number;
+    /**
+     * Loads after the page has fully loaded
+     */
+    waitForPageLoad?: boolean;
+};
+export type UseCursorAnimationResult = {
+    /**
+     * Whether the animation is currently running
+     */
+    isAnimating: boolean;
+    /**
+     * Whether to show the cursor
+     */
+    showCursor: boolean;
+    /**
+     * Progress of the animation (0 to 1)
+     */
+    progress: number;
+};
+export declare function useCursorAnimation({ text, animate, duration, delay, waitForPageLoad, }: UseCursorAnimationOptions): UseCursorAnimationResult;
+//# sourceMappingURL=useCursorAnimation.d.ts.map

package/esm/hooks/useCursorAnimation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCursorAnimation.d.ts","sourceRoot":"","sources":["../../src/hooks/useCursorAnimation.ts"],"names":[],"mappings":"AAGA,MAAM,MAAM,yBAAyB,GAAG;IACtC;;OAEG;IACH,IAAI,EAAE,MAAM,CAAA;IACZ;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAA;CAC1B,CAAA;AAED,MAAM,MAAM,wBAAwB,GAAG;IACrC;;OAEG;IACH,WAAW,EAAE,OAAO,CAAA;IACpB;;OAEG;IACH,UAAU,EAAE,OAAO,CAAA;IACnB;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAA;CACjB,CAAA;AAED,wBAAgB,kBAAkB,CAAC,EACjC,IAAI,EACJ,OAAO,EACP,QAAc,EACd,KAAW,EACX,eAAsB,GACvB,EAAE,yBAAyB,GAAG,wBAAwB,CAiFtD"}

package/esm/hooks/useCursorAnimation.js

@@ -0,0 +1,52 @@
+import { useReducedMotion as e } from "./useReducedMotion.js";
+import { useCallback as t, useEffect as n, useState as r } from "react";
+//#region src/hooks/useCursorAnimation.ts
+function i({ text: i, animate: a, duration: o = 500, delay: s = 500, waitForPageLoad: c = !0 }) {
+	let l = e(), u = a === !0 && !l && i.length > 0, [d, f] = r(u), [p, m] = r(+!u), h = t(() => {
+		if (!u) {
+			m(1), f(!1);
+			return;
+		}
+		f(!0), m(0);
+		let e = performance.now(), t = (n) => {
+			let r = n - e, i = Math.min(r / o, 1);
+			m(i), i < 1 ? requestAnimationFrame(t) : f(!1);
+		};
+		requestAnimationFrame(t);
+	}, [u, o]);
+	return n(() => {
+		if (!u) {
+			m(1), f(!1);
+			return;
+		}
+		let e = () => setTimeout(() => {
+			h();
+		}, s), t;
+		if (c && typeof window < "u") if (document.readyState === "complete") t = e();
+		else {
+			let n = () => {
+				t = e();
+			};
+			return window.addEventListener("load", n), () => {
+				window.removeEventListener("load", n), t && clearTimeout(t);
+			};
+		}
+		else t = e();
+		return () => {
+			t && clearTimeout(t);
+		};
+	}, [
+		h,
+		s,
+		u,
+		c
+	]), {
+		isAnimating: d,
+		showCursor: !l && a === !0,
+		progress: p
+	};
+}
+//#endregion
+export { i as useCursorAnimation };
+
+//# sourceMappingURL=useCursorAnimation.js.map

package/esm/hooks/useCursorAnimation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCursorAnimation.js","names":[],"sources":["../../src/hooks/useCursorAnimation.ts"],"sourcesContent":["import {useState, useEffect, useCallback} from 'react'\nimport {useReducedMotion} from './useReducedMotion'\n\nexport type UseCursorAnimationOptions = {\n  /**\n   * The text content to animate\n   */\n  text: string\n  /**\n   * Whether to animate the text reveal with a cursor effect\n   */\n  animate?: boolean\n  /**\n   * Duration of the reveal animation in milliseconds\n   */\n  duration?: number\n  /**\n   * Delay to start the animation in milliseconds\n   */\n  delay?: number\n  /**\n   * Loads after the page has fully loaded\n   */\n  waitForPageLoad?: boolean\n}\n\nexport type UseCursorAnimationResult = {\n  /**\n   * Whether the animation is currently running\n   */\n  isAnimating: boolean\n  /**\n   * Whether to show the cursor\n   */\n  showCursor: boolean\n  /**\n   * Progress of the animation (0 to 1)\n   */\n  progress: number\n}\n\nexport function useCursorAnimation({\n  text,\n  animate,\n  duration = 500,\n  delay = 500,\n  waitForPageLoad = true,\n}: UseCursorAnimationOptions): UseCursorAnimationResult {\n  const prefersReducedMotion = useReducedMotion()\n  const shouldAnimate = animate === true && !prefersReducedMotion && text.length > 0\n\n  const [isAnimating, setIsAnimating] = useState(shouldAnimate)\n  const [progress, setProgress] = useState(shouldAnimate ? 0 : 1)\n\n  const startAnimation = useCallback(() => {\n    if (!shouldAnimate) {\n      setProgress(1)\n      setIsAnimating(false)\n      return\n    }\n\n    setIsAnimating(true)\n    setProgress(0)\n\n    const startTime = performance.now()\n\n    const tick = (currentTime: number) => {\n      const elapsed = currentTime - startTime\n      const newProgress = Math.min(elapsed / duration, 1)\n\n      setProgress(newProgress)\n\n      if (newProgress < 1) {\n        requestAnimationFrame(tick)\n      } else {\n        setIsAnimating(false)\n      }\n    }\n\n    requestAnimationFrame(tick)\n  }, [shouldAnimate, duration])\n\n  useEffect(() => {\n    if (!shouldAnimate) {\n      setProgress(1)\n      setIsAnimating(false)\n      return\n    }\n\n    const startDelayTimer = () => {\n      return setTimeout(() => {\n        startAnimation()\n      }, delay)\n    }\n\n    let delayTimer: ReturnType<typeof setTimeout> | undefined\n\n    if (waitForPageLoad && typeof window !== 'undefined') {\n      // Check if page is already loaded\n      if (document.readyState === 'complete') {\n        delayTimer = startDelayTimer()\n      } else {\n        // Wait for page load before starting the delay timer\n        const handleLoad = () => {\n          delayTimer = startDelayTimer()\n        }\n        window.addEventListener('load', handleLoad)\n        return () => {\n          window.removeEventListener('load', handleLoad)\n          if (delayTimer) clearTimeout(delayTimer)\n        }\n      }\n    } else {\n      delayTimer = startDelayTimer()\n    }\n\n    return () => {\n      if (delayTimer) clearTimeout(delayTimer)\n    }\n  }, [startAnimation, delay, shouldAnimate, waitForPageLoad])\n\n  const showCursor = !prefersReducedMotion && animate === true\n\n  return {\n    isAnimating,\n    showCursor,\n    progress,\n  }\n}\n"],"mappings":";;;AAyCA,SAAgB,EAAmB,EACjC,SACA,YACA,cAAW,KACX,WAAQ,KACR,qBAAkB,MACoC;CACtD,IAAM,IAAuB,GAAkB,EACzC,IAAgB,MAAY,MAAQ,CAAC,KAAwB,EAAK,SAAS,GAE3E,CAAC,GAAa,KAAkB,EAAS,EAAc,EACvD,CAAC,GAAU,KAAe,EAAS,IAAsB,EAEzD,IAAiB,QAAkB;AACvC,MAAI,CAAC,GAAe;AAElB,GADA,EAAY,EAAE,EACd,EAAe,GAAM;AACrB;;AAIF,EADA,EAAe,GAAK,EACpB,EAAY,EAAE;EAEd,IAAM,IAAY,YAAY,KAAK,EAE7B,KAAQ,MAAwB;GACpC,IAAM,IAAU,IAAc,GACxB,IAAc,KAAK,IAAI,IAAU,GAAU,EAAE;AAInD,GAFA,EAAY,EAAY,EAEpB,IAAc,IAChB,sBAAsB,EAAK,GAE3B,EAAe,GAAM;;AAIzB,wBAAsB,EAAK;IAC1B,CAAC,GAAe,EAAS,CAAC;AA2C7B,QAzCA,QAAgB;AACd,MAAI,CAAC,GAAe;AAElB,GADA,EAAY,EAAE,EACd,EAAe,GAAM;AACrB;;EAGF,IAAM,UACG,iBAAiB;AACtB,MAAgB;KACf,EAAM,EAGP;AAEJ,MAAI,KAAmB,OAAO,SAAW,IAEvC,KAAI,SAAS,eAAe,WAC1B,KAAa,GAAiB;OACzB;GAEL,IAAM,UAAmB;AACvB,QAAa,GAAiB;;AAGhC,UADA,OAAO,iBAAiB,QAAQ,EAAW,QAC9B;AAEX,IADA,OAAO,oBAAoB,QAAQ,EAAW,EAC1C,KAAY,aAAa,EAAW;;;MAI5C,KAAa,GAAiB;AAGhC,eAAa;AACX,GAAI,KAAY,aAAa,EAAW;;IAEzC;EAAC;EAAgB;EAAO;EAAe;EAAgB,CAAC,EAIpD;EACL;EACA,YAJiB,CAAC,KAAwB,MAAY;EAKtD;EACD"}

package/esm/hooks/useFocusTrap.d.ts

@@ -0,0 +1,31 @@
+import React from 'react';
+export interface FocusTrapHookSettings {
+    /**
+     * Ref that will be used for the trapping container. If not provided, one will
+     * be created by this hook and returned.
+     */
+    containerRef: React.RefObject<HTMLElement | null>;
+    /**
+     * Ref for the element that should receive focus when the focus trap is first enabled.
+     * If not provided, one will be created by this hook and returned. Its use is optional.
+     */
+    initialFocusRef?: React.RefObject<HTMLElement | null>;
+    /**
+     * Set to true to disable the focus trap and clean up listeners. Can be re-enabled at any time.
+     */
+    disabled?: boolean;
+    /**
+     * If true, when this focus trap is cleaned up, restore focus to the element that had focus immediately before the focus trap was enabled. (Default: false)
+     */
+    restoreFocusOnCleanUp?: boolean;
+}
+/**
+ * Hook used to trap focus inside a container. Returns a ref that can be added to the container
+ * that should trap focus.
+ * @param settings {FocusTrapHookSettings}
+ */
+export declare function useFocusTrap(settings?: FocusTrapHookSettings, dependencies?: React.DependencyList): {
+    containerRef: React.RefObject<HTMLElement | null> | undefined;
+    initialFocusRef: React.RefObject<HTMLElement | null> | undefined;
+};
+//# sourceMappingURL=useFocusTrap.d.ts.map

package/esm/hooks/useFocusTrap.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFocusTrap.d.ts","sourceRoot":"","sources":["../../src/hooks/useFocusTrap.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,MAAM,WAAW,qBAAqB;IACpC;;;OAGG;IACH,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IAEjD;;;OAGG;IACH,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IAErD;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAElB;;OAEG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAA;CAChC;AAED;;;;GAIG;AACH,wBAAgB,YAAY,CAC1B,QAAQ,CAAC,EAAE,qBAAqB,EAChC,YAAY,GAAE,KAAK,CAAC,cAAmB,GACtC;IACD,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,GAAG,SAAS,CAAA;IAC7D,eAAe,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,GAAG,SAAS,CAAA;CACjE,CAyCA"}

package/esm/hooks/useFocusTrap.js

@@ -0,0 +1,28 @@
+import e from "react";
+import { focusTrap as t } from "@primer/behaviors";
+//#region src/hooks/useFocusTrap.ts
+function n(n, r = []) {
+	let i = n?.containerRef, a = n?.initialFocusRef, o = n?.disabled, s = e.useRef(null), c = e.useRef(null);
+	!c.current && !n?.disabled && (c.current = document.activeElement);
+	function l() {
+		s.current?.abort(), n?.restoreFocusOnCleanUp && c.current instanceof HTMLElement && (c.current.focus(), c.current = null);
+	}
+	return e.useEffect(() => {
+		if (i?.current instanceof HTMLElement) if (o) l();
+		else return s.current = t(i.current, a?.current ?? void 0) ?? null, () => {
+			l();
+		};
+	}, [
+		i,
+		a,
+		o,
+		...r
+	]), {
+		containerRef: i,
+		initialFocusRef: a
+	};
+}
+//#endregion
+export { n as useFocusTrap };
+
+//# sourceMappingURL=useFocusTrap.js.map

package/esm/hooks/useFocusTrap.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFocusTrap.js","names":[],"sources":["../../src/hooks/useFocusTrap.ts"],"sourcesContent":["import React from 'react'\nimport {focusTrap} from '@primer/behaviors'\n\nexport interface FocusTrapHookSettings {\n  /**\n   * Ref that will be used for the trapping container. If not provided, one will\n   * be created by this hook and returned.\n   */\n  containerRef: React.RefObject<HTMLElement | null>\n\n  /**\n   * Ref for the element that should receive focus when the focus trap is first enabled.\n   * If not provided, one will be created by this hook and returned. Its use is optional.\n   */\n  initialFocusRef?: React.RefObject<HTMLElement | null>\n\n  /**\n   * Set to true to disable the focus trap and clean up listeners. Can be re-enabled at any time.\n   */\n  disabled?: boolean\n\n  /**\n   * If true, when this focus trap is cleaned up, restore focus to the element that had focus immediately before the focus trap was enabled. (Default: false)\n   */\n  restoreFocusOnCleanUp?: boolean\n}\n\n/**\n * Hook used to trap focus inside a container. Returns a ref that can be added to the container\n * that should trap focus.\n * @param settings {FocusTrapHookSettings}\n */\nexport function useFocusTrap(\n  settings?: FocusTrapHookSettings,\n  dependencies: React.DependencyList = [],\n): {\n  containerRef: React.RefObject<HTMLElement | null> | undefined\n  initialFocusRef: React.RefObject<HTMLElement | null> | undefined\n} {\n  const containerRef = settings?.containerRef\n  const initialFocusRef = settings?.initialFocusRef\n  const disabled = settings?.disabled\n  const abortController = React.useRef<AbortController | null>(null)\n  const previousFocusedElement = React.useRef<Element | null>(null)\n\n  // If we are enabling a focus trap and haven't already stored the previously focused element\n  // go ahead an do that so we can restore later when the trap is disabled.\n  if (!previousFocusedElement.current && !settings?.disabled) {\n    previousFocusedElement.current = document.activeElement\n  }\n\n  // This function removes the event listeners that enable the focus trap and restores focus\n  // to the previously-focused element (if necessary).\n  function disableTrap() {\n    abortController.current?.abort()\n    if (settings?.restoreFocusOnCleanUp && previousFocusedElement.current instanceof HTMLElement) {\n      previousFocusedElement.current.focus()\n      previousFocusedElement.current = null\n    }\n  }\n\n  React.useEffect(\n    () => {\n      if (containerRef?.current instanceof HTMLElement) {\n        if (!disabled) {\n          abortController.current = focusTrap(containerRef.current, initialFocusRef?.current ?? undefined) ?? null\n          return () => {\n            disableTrap()\n          }\n        } else {\n          disableTrap()\n        }\n      }\n    },\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [containerRef, initialFocusRef, disabled, ...dependencies],\n  )\n\n  return {containerRef, initialFocusRef}\n}\n"],"mappings":";;;AAgCA,SAAgB,EACd,GACA,IAAqC,EAAE,EAIvC;CACA,IAAM,IAAe,GAAU,cACzB,IAAkB,GAAU,iBAC5B,IAAW,GAAU,UACrB,IAAkB,EAAM,OAA+B,KAAK,EAC5D,IAAyB,EAAM,OAAuB,KAAK;AAIjE,CAAI,CAAC,EAAuB,WAAW,CAAC,GAAU,aAChD,EAAuB,UAAU,SAAS;CAK5C,SAAS,IAAc;AAErB,EADA,EAAgB,SAAS,OAAO,EAC5B,GAAU,yBAAyB,EAAuB,mBAAmB,gBAC/E,EAAuB,QAAQ,OAAO,EACtC,EAAuB,UAAU;;AAqBrC,QAjBA,EAAM,gBACE;AACJ,MAAI,GAAc,mBAAmB,YACnC,KAAK,EAMH,IAAa;MAJb,QADA,EAAgB,UAAU,EAAU,EAAa,SAAS,GAAiB,WAAW,KAAA,EAAU,IAAI,YACvF;AACX,MAAa;;IAQrB;EAAC;EAAc;EAAiB;EAAU,GAAG;EAAa,CAC3D,EAEM;EAAC;EAAc;EAAgB"}

package/esm/hooks/useId.d.ts

@@ -0,0 +1,3 @@
+export type UseId = (id?: string) => string;
+export declare const useId: UseId;
+//# sourceMappingURL=useId.d.ts.map

package/esm/hooks/useId.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useId.d.ts","sourceRoot":"","sources":["../../src/hooks/useId.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,KAAK,GAAG,CAAC,EAAE,CAAC,EAAE,MAAM,KAAK,MAAM,CAAA;AAE3C,eAAO,MAAM,KAAK,EAAE,KAQnB,CAAA"}

package/esm/hooks/useId.js

@@ -0,0 +1,10 @@
+import { useId as e } from "react";
+//#region src/hooks/useId.ts
+var t = (t) => {
+	let n = e();
+	return t || n;
+};
+//#endregion
+export { t as useId };
+
+//# sourceMappingURL=useId.js.map

package/esm/hooks/useId.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useId.js","names":[],"sources":["../../src/hooks/useId.ts"],"sourcesContent":["import {useId as useReactId} from 'react'\n\nexport type UseId = (id?: string) => string\n\nexport const useId: UseId = id => {\n  const uniqueId = useReactId()\n\n  if (id) {\n    return id\n  }\n\n  return uniqueId\n}\n"],"mappings":";;AAIA,IAAa,KAAe,MAAM;CAChC,IAAM,IAAW,GAAY;AAM7B,QAJI,KAIG"}

package/esm/hooks/useIsomorphicLayoutEffect.d.ts

@@ -0,0 +1,4 @@
+import { useEffect } from 'react';
+declare const useIsomorphicLayoutEffect: typeof useEffect;
+export default useIsomorphicLayoutEffect;
+//# sourceMappingURL=useIsomorphicLayoutEffect.d.ts.map

package/esm/hooks/useIsomorphicLayoutEffect.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIsomorphicLayoutEffect.d.ts","sourceRoot":"","sources":["../../src/hooks/useIsomorphicLayoutEffect.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAkB,MAAM,OAAO,CAAA;AAEhD,QAAA,MAAM,yBAAyB,kBAKhB,CAAA;AAEf,eAAe,yBAAyB,CAAA"}

package/esm/hooks/useIsomorphicLayoutEffect.js

@@ -0,0 +1,7 @@
+import { useEffect as e, useLayoutEffect as t } from "react";
+//#region src/hooks/useIsomorphicLayoutEffect.ts
+var n = typeof window < "u" && window.document !== void 0 && window.document.createElement !== void 0 ? t : e;
+//#endregion
+export { n as default };
+
+//# sourceMappingURL=useIsomorphicLayoutEffect.js.map

package/esm/hooks/useIsomorphicLayoutEffect.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIsomorphicLayoutEffect.js","names":[],"sources":["../../src/hooks/useIsomorphicLayoutEffect.ts"],"sourcesContent":["import {useEffect, useLayoutEffect} from 'react'\n\nconst useIsomorphicLayoutEffect =\n  typeof window !== 'undefined' &&\n  typeof window.document !== 'undefined' &&\n  typeof window.document.createElement !== 'undefined'\n    ? useLayoutEffect\n    : useEffect\n\nexport default useIsomorphicLayoutEffect\n"],"mappings":";;AAEA,IAAM,IACJ,OAAO,SAAW,OACX,OAAO,aAAa,UACpB,OAAO,SAAS,kBAAkB,SACrC,IACA"}

package/esm/hooks/useKeyboardEscape.d.ts

@@ -0,0 +1,2 @@
+export declare function useKeyboardEscape(handler: any): void;
+//# sourceMappingURL=useKeyboardEscape.d.ts.map

package/esm/hooks/useKeyboardEscape.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useKeyboardEscape.d.ts","sourceRoot":"","sources":["../../src/hooks/useKeyboardEscape.ts"],"names":[],"mappings":"AAEA,wBAAgB,iBAAiB,CAAC,OAAO,KAAA,QAiBxC"}

package/esm/hooks/useKeyboardEscape.js

@@ -0,0 +1,14 @@
+import { useCallback as e, useEffect as t } from "react";
+//#region src/hooks/useKeyboardEscape.ts
+function n(n) {
+	let r = e((e) => {
+		e.key === "Escape" && n();
+	}, [n]);
+	t(() => (document.addEventListener("keydown", r, !1), () => {
+		document.removeEventListener("keydown", r, !1);
+	}), [r]);
+}
+//#endregion
+export { n as useKeyboardEscape };
+
+//# sourceMappingURL=useKeyboardEscape.js.map

package/esm/hooks/useKeyboardEscape.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useKeyboardEscape.js","names":[],"sources":["../../src/hooks/useKeyboardEscape.ts"],"sourcesContent":["import {useCallback, useEffect} from 'react'\n\nexport function useKeyboardEscape(handler) {\n  const handleKeyboardEscape = useCallback(\n    event => {\n      if (event.key === 'Escape') {\n        handler()\n      }\n    },\n    [handler],\n  )\n\n  useEffect(() => {\n    document.addEventListener('keydown', handleKeyboardEscape, false)\n\n    return () => {\n      document.removeEventListener('keydown', handleKeyboardEscape, false)\n    }\n  }, [handleKeyboardEscape])\n}\n"],"mappings":";;AAEA,SAAgB,EAAkB,GAAS;CACzC,IAAM,IAAuB,GAC3B,MAAS;AACP,EAAI,EAAM,QAAQ,YAChB,GAAS;IAGb,CAAC,EAAQ,CACV;AAED,UACE,SAAS,iBAAiB,WAAW,GAAsB,GAAM,QAEpD;AACX,WAAS,oBAAoB,WAAW,GAAsB,GAAM;KAErE,CAAC,EAAqB,CAAC"}

package/esm/hooks/useOnClickOutside.d.ts

@@ -0,0 +1,3 @@
+import { RefObject } from 'react';
+export declare function useOnClickOutside(ref: RefObject<HTMLElement | null>, handler?: (event: MouseEvent | TouchEvent | FocusEvent) => void, excludeRef?: RefObject<HTMLElement | null>): void;
+//# sourceMappingURL=useOnClickOutside.d.ts.map

package/esm/hooks/useOnClickOutside.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useOnClickOutside.d.ts","sourceRoot":"","sources":["../../src/hooks/useOnClickOutside.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAY,MAAM,OAAO,CAAA;AAE1C,wBAAgB,iBAAiB,CAC/B,GAAG,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,EAClC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,GAAG,UAAU,GAAG,UAAU,KAAK,IAAI,EAC/D,UAAU,CAAC,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,GACzC,IAAI,CA0BN"}

package/esm/hooks/useOnClickOutside.js

@@ -0,0 +1,20 @@
+import { useEffect as e } from "react";
+//#region src/hooks/useOnClickOutside.ts
+function t(t, n, r) {
+	e(() => {
+		let e = (e) => {
+			!t.current || t.current.contains(e.target) || r && r.current && r.current.contains(e.target) || n && n(e);
+		};
+		return document.addEventListener("mousedown", e), document.addEventListener("touchstart", e, { passive: !0 }), document.addEventListener("focusin", e), () => {
+			document.removeEventListener("mousedown", e), document.removeEventListener("touchstart", e), document.removeEventListener("focusin", e);
+		};
+	}, [
+		t,
+		n,
+		r
+	]);
+}
+//#endregion
+export { t as useOnClickOutside };
+
+//# sourceMappingURL=useOnClickOutside.js.map

package/esm/hooks/useOnClickOutside.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useOnClickOutside.js","names":[],"sources":["../../src/hooks/useOnClickOutside.ts"],"sourcesContent":["import {RefObject, useEffect} from 'react'\n\nexport function useOnClickOutside(\n  ref: RefObject<HTMLElement | null>,\n  handler?: (event: MouseEvent | TouchEvent | FocusEvent) => void,\n  excludeRef?: RefObject<HTMLElement | null>,\n): void {\n  useEffect(() => {\n    const listener = (event: MouseEvent | TouchEvent | FocusEvent) => {\n      // Do nothing if clicking ref's element or descendent elements\n      if (\n        !ref.current ||\n        ref.current.contains(event.target as Node) ||\n        (excludeRef && excludeRef.current && excludeRef.current.contains(event.target as Node))\n      ) {\n        return\n      }\n      if (handler) {\n        handler(event)\n      }\n    }\n\n    document.addEventListener('mousedown', listener)\n    document.addEventListener('touchstart', listener, {passive: true})\n    document.addEventListener('focusin', listener)\n\n    return () => {\n      document.removeEventListener('mousedown', listener)\n      document.removeEventListener('touchstart', listener)\n      document.removeEventListener('focusin', listener)\n    }\n  }, [ref, handler, excludeRef])\n}\n"],"mappings":";;AAEA,SAAgB,EACd,GACA,GACA,GACM;AACN,SAAgB;EACd,IAAM,KAAY,MAAgD;AAG9D,IAAC,EAAI,WACL,EAAI,QAAQ,SAAS,EAAM,OAAe,IACzC,KAAc,EAAW,WAAW,EAAW,QAAQ,SAAS,EAAM,OAAe,IAIpF,KACF,EAAQ,EAAM;;AAQlB,SAJA,SAAS,iBAAiB,aAAa,EAAS,EAChD,SAAS,iBAAiB,cAAc,GAAU,EAAC,SAAS,IAAK,CAAC,EAClE,SAAS,iBAAiB,WAAW,EAAS,QAEjC;AAGX,GAFA,SAAS,oBAAoB,aAAa,EAAS,EACnD,SAAS,oBAAoB,cAAc,EAAS,EACpD,SAAS,oBAAoB,WAAW,EAAS;;IAElD;EAAC;EAAK;EAAS;EAAW,CAAC"}

package/esm/hooks/useReducedMotion.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Hook that returns true if the user prefers reduced motion.
+ * Respects the prefers-reduced-motion media query.
+ */
+export declare function useReducedMotion(): boolean;
+//# sourceMappingURL=useReducedMotion.d.ts.map

package/esm/hooks/useReducedMotion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useReducedMotion.d.ts","sourceRoot":"","sources":["../../src/hooks/useReducedMotion.ts"],"names":[],"mappings":"AAEA;;;GAGG;AACH,wBAAgB,gBAAgB,IAAI,OAAO,CAkB1C"}

package/esm/hooks/useReducedMotion.js

@@ -0,0 +1,17 @@
+import { useEffect as e, useState as t } from "react";
+//#region src/hooks/useReducedMotion.ts
+function n() {
+	let [n, r] = t(() => typeof window < "u" ? window.matchMedia("(prefers-reduced-motion: reduce)").matches : !1);
+	return e(() => {
+		let e = window.matchMedia("(prefers-reduced-motion: reduce)");
+		r(e.matches);
+		let t = (e) => {
+			r(e.matches);
+		};
+		return e.addEventListener("change", t), () => e.removeEventListener("change", t);
+	}, []), n;
+}
+//#endregion
+export { n as useReducedMotion };
+
+//# sourceMappingURL=useReducedMotion.js.map

package/esm/hooks/useReducedMotion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useReducedMotion.js","names":[],"sources":["../../src/hooks/useReducedMotion.ts"],"sourcesContent":["import {useState, useEffect} from 'react'\n\n/**\n * Hook that returns true if the user prefers reduced motion.\n * Respects the prefers-reduced-motion media query.\n */\nexport function useReducedMotion(): boolean {\n  const [prefersReducedMotion, setPrefersReducedMotion] = useState(() =>\n    typeof window !== 'undefined' ? window.matchMedia('(prefers-reduced-motion: reduce)').matches : false,\n  )\n\n  useEffect(() => {\n    const mediaQuery = window.matchMedia('(prefers-reduced-motion: reduce)')\n    setPrefersReducedMotion(mediaQuery.matches)\n\n    const handleChange = (event: MediaQueryListEvent) => {\n      setPrefersReducedMotion(event.matches)\n    }\n\n    mediaQuery.addEventListener('change', handleChange)\n    return () => mediaQuery.removeEventListener('change', handleChange)\n  }, [])\n\n  return prefersReducedMotion\n}\n"],"mappings":";;AAMA,SAAgB,IAA4B;CAC1C,IAAM,CAAC,GAAsB,KAA2B,QACtD,OAAO,SAAW,MAAc,OAAO,WAAW,mCAAmC,CAAC,UAAU,GACjG;AAcD,QAZA,QAAgB;EACd,IAAM,IAAa,OAAO,WAAW,mCAAmC;AACxE,IAAwB,EAAW,QAAQ;EAE3C,IAAM,KAAgB,MAA+B;AACnD,KAAwB,EAAM,QAAQ;;AAIxC,SADA,EAAW,iBAAiB,UAAU,EAAa,QACtC,EAAW,oBAAoB,UAAU,EAAa;IAClE,EAAE,CAAC,EAEC"}

package/esm/hooks/useRef.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+/**
+ * There are some situations where we only want to create a new ref if one is not provided to a component
+ * or hook as a prop. However, due to the `rules-of-hooks`, we cannot conditionally make a call to `React.useRef`
+ * only in the situations where the ref is not provided as a prop.
+ * This hook aims to encapsulate that logic, so the consumer doesn't need to be concerned with violating `rules-of-hooks`.
+ * @param providedRef The ref to use - can be a RefObject, RefCallback (functional ref), null or undefined.
+ * @type TRef The type of the RefObject which should be created.
+ * @returns A RefObject that either uses the provided ref, wraps a functional ref, or creates a new one
+ */
+export declare function useProvidedRefOrCreate<TRef>(providedRef?: React.RefObject<TRef> | React.RefCallback<TRef> | null): React.RefObject<TRef>;
+//# sourceMappingURL=useRef.d.ts.map

package/esm/hooks/useRef.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRef.d.ts","sourceRoot":"","sources":["../../src/hooks/useRef.ts"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAA;AAE5C;;;;;;;;GAQG;AACH,wBAAgB,sBAAsB,CAAC,IAAI,EACzC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,GAAG,IAAI,GACnE,KAAK,CAAC,SAAS,CAAC,IAAI,CAAC,CAsCvB"}