@forgedevstack/bear 1.2.3 → 1.2.4

package/dist/components/Radio/Radio.types.d.ts

@@ -1,6 +1,7 @@
 import { InputHTMLAttributes, ReactNode } from 'react';
 import { BearSize, BearVariant } from '../../types';
 export interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {
+    id?: string;
     /** Radio label */
     label?: ReactNode;
     /** Size of the radio */

package/dist/components/RadioCard/RadioCard.types.d.ts

@@ -1,5 +1,6 @@
 import { ReactNode, HTMLAttributes } from 'react';
 export interface RadioCardProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
+    id?: string;
     value: string;
     checked?: boolean;
     onChange?: (value: string) => void;

package/dist/components/Rating/Rating.types.d.ts

@@ -1,6 +1,7 @@
 import { HTMLAttributes, ReactNode } from 'react';
 export type RatingSize = 'sm' | 'md' | 'lg';
 export interface RatingProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
+    id?: string;
     /** Current value (0-max) */
     value?: number;
     /** Default value (uncontrolled) */

package/dist/components/ResizablePanel/ResizablePanel.types.d.ts

@@ -1,5 +1,6 @@
 import { ReactNode } from 'react';
 export interface ResizablePanelProps {
+    id?: string;
     /** First pane content */
     first: ReactNode;
     /** Second pane content */

package/dist/components/ResizableTextarea/ResizableTextarea.types.d.ts

@@ -1,5 +1,6 @@
 import { TextareaHTMLAttributes } from 'react';
 export interface ResizableTextareaProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'style'> {
+    id?: string;
     /** Textarea label */
     label?: string;
     /** Helper text below textarea */

package/dist/components/Result/Result.types.d.ts

@@ -1,6 +1,7 @@
 import { ReactNode, HTMLAttributes } from 'react';
 export type ResultStatus = 'success' | 'error' | 'info' | 'warning' | '404' | '403' | '500';
 export interface ResultProps extends HTMLAttributes<HTMLDivElement> {
+    id?: string;
     status: ResultStatus;
     title: string;
     subtitle?: string;

package/dist/components/RichEditor/RichEditor.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),c=require("react"),m=require("../../utils/cn.cjs"),u=require("./helpers/formatHelpers.cjs"),f=require("./RichEditor.const.cjs"),ce=require("../../hooks/useMediaQuery.cjs"),C=require("./components/ToolbarButton/ToolbarButton.cjs"),ue=require("./components/ToolbarDropdown/ToolbarDropdown.cjs"),z=require("./components/ToolbarColorPicker/ToolbarColorPicker.cjs"),de=require("./components/ToolbarMore/ToolbarMore.cjs"),i=require("../Icon/icons/editor.cjs"),ge=6,fe=A=>{const{value:x,defaultValue:k="",onChange:R,placeholder:v="Start typing...",disabled:o=!1,readOnly:r=!1,minHeight:j=f.RICH_EDITOR_MIN_HEIGHT,maxHeight:b,toolbar:D=f.RICH_EDITOR_DEFAULT_TOOLBAR,className:N="",testId:M,id:F,allowImagePaste:L=!0,showCharCount:p=!1,charCountMax:_,...w}=A,l=c.useRef(null),E=ce.useMediaQuery(`(max-width: ${f.RICH_EDITOR_MOBILE_BREAKPOINT}px)`),O=E?f.RICH_EDITOR_MOBILE_TOOLBAR:D,[q,U]=c.useState(new Set),[P,H]=c.useState("p"),[B,V]=c.useState(0),[J,G]=c.useState("#000000"),[$,Q]=c.useState("#fef08a"),[K,Y]=c.useState([]),[W,X]=c.useState([]);c.useEffect(()=>{const e="bear-rich-editor-styles";if(!document.getElementById(e)){const n=document.createElement("style");n.id=e,n.textContent=f.RICH_EDITOR_CONTENT_STYLES,document.head.appendChild(n)}},[]),c.useEffect(()=>{l.current&&x!==void 0&&l.current.innerHTML!==x&&(l.current.innerHTML=x)},[x]),c.useEffect(()=>{l.current&&k&&!x&&(l.current.innerHTML=k)},[]);const I=c.useCallback(()=>{U(u.getActiveFormats());const e=u.queryCommandValue("formatBlock");e&&H(e.toLowerCase().replace(/[<>]/g,""))},[]),a=c.useCallback(()=>{var e;l.current&&(R&&R(l.current.innerHTML),p&&V(((e=l.current.textContent)==null?void 0:e.length)??0)),I()},[R,I,p]),Z=c.useCallback(e=>{var d;if(o||r)return;(d=l.current)==null||d.focus();const n=f.RICH_EDITOR_BUTTON_CONFIG[e];if(!n)return;const g="value"in n?n.value:void 0;g?u.execCommand(n.command,g):u.execCommand(n.command),I(),a()},[o,r,I,a]),ee=c.useCallback(e=>{var n;o||r||((n=l.current)==null||n.focus(),u.execCommand("formatBlock",e),H(e),a())},[o,r,a]),te=c.useCallback(()=>{var d;if(o||r)return;const e=window.getSelection(),n=e&&e.toString().length>0,g=prompt("Enter URL:",n?"":"https://");g&&((d=l.current)==null||d.focus(),u.insertLink(g),a())},[o,r,a]),T=c.useCallback((e,n)=>{if(!e)return;(n==="text"?Y:X)(d=>{const s=d.filter(h=>h!==e);return[e,...s].slice(0,ge)})},[]),ne=c.useCallback(e=>{var n;o||r||((n=l.current)==null||n.focus(),u.setTextColor(e),G(e),T(e,"text"),a())},[o,r,a,T]),oe=c.useCallback(e=>{var n;o||r||((n=l.current)==null||n.focus(),u.setHighlightColor(e),Q(e),T(e,"highlight"),a())},[o,r,a,T]),re=c.useCallback(e=>{var n;o||r||((n=l.current)==null||n.focus(),u.setTextColor(e),a())},[o,r,a]),ie=c.useCallback(e=>{var n;o||r||((n=l.current)==null||n.focus(),u.setHighlightColor(e),a())},[o,r,a]),se=c.useCallback(async e=>{var g;if(!L)return;const n=(g=e.clipboardData)==null?void 0:g.items;if(n)for(let d=0;d<n.length;d++){const s=n[d];if(s.type.startsWith("image/")){e.preventDefault();const h=s.getAsFile();if(h){const y=await u.fileToDataUrl(h);u.insertImage(y),a()}return}}},[L,a]),ae=c.useCallback(()=>{if(o||r)return;const e=document.createElement("input");e.type="file",e.accept="image/*",e.onchange=async n=>{var d,s;const g=(d=n.target.files)==null?void 0:d[0];if(g){const h=await u.fileToDataUrl(g);(s=l.current)==null||s.focus(),u.insertImage(h),a()}},e.click()},[o,r,a]),le={bold:t.jsx(i.BoldIcon,{size:16}),italic:t.jsx(i.ItalicIcon,{size:16}),underline:t.jsx(i.UnderlineIcon,{size:16}),strikethrough:t.jsx(i.StrikethroughIcon,{size:16}),heading1:t.jsx(i.Heading1Icon,{size:16}),heading2:t.jsx(i.Heading2Icon,{size:16}),heading3:t.jsx(i.Heading3Icon,{size:16}),bulletList:t.jsx(i.ListBulletIcon,{size:16}),orderedList:t.jsx(i.ListNumberedIcon,{size:16}),blockquote:t.jsx(i.QuoteIcon,{size:16}),code:t.jsx(i.CodeIcon,{size:16}),link:t.jsx(i.InsertLinkIcon,{size:16}),alignLeft:t.jsx(i.AlignLeftIcon,{size:16}),alignCenter:t.jsx(i.AlignCenterIcon,{size:16}),alignRight:t.jsx(i.AlignRightIcon,{size:16}),alignJustify:t.jsx(i.AlignJustifyIcon,{size:16}),image:t.jsx(i.InsertPhotoIcon,{size:16}),indent:t.jsx(i.IndentIncreaseIcon,{size:16}),outdent:t.jsx(i.IndentDecreaseIcon,{size:16}),clearFormat:t.jsx(i.FormatClearIcon,{size:16}),table:t.jsx(i.TableIcon,{size:16})},S=(e,n)=>{if(e==="divider")return t.jsx("div",{className:m.cn("Bear-RichEditor__divider",f.RICH_EDITOR_DIVIDER_CLASSES)},`divider-${n}`);if(e==="headingDropdown")return t.jsx(ue.ToolbarDropdown,{options:f.RICH_EDITOR_HEADING_OPTIONS,value:P,onChange:ee,title:"Text Style",disabled:o||r,icon:t.jsx(i.TextIcon,{size:16})},"heading-dropdown");if(e==="textColor")return t.jsx(z.ToolbarColorPicker,{value:J,onChange:ne,title:"Text Color",disabled:o||r,type:"text",recentColors:K,onApplyLast:re},"text-color");if(e==="highlightColor")return t.jsx(z.ToolbarColorPicker,{value:$,onChange:oe,title:"Highlight Color",disabled:o||r,type:"highlight",recentColors:W,onApplyLast:ie},"highlight-color");if(e==="link")return t.jsx(C.ToolbarButton,{icon:t.jsx(i.InsertLinkIcon,{size:16}),title:"Insert Link",onClick:te,disabled:o||r},"link");if(e==="image")return t.jsx(C.ToolbarButton,{icon:t.jsx(i.InsertPhotoIcon,{size:16}),title:"Insert Image",onClick:ae,disabled:o||r},"image");if(e==="alignLeft")return t.jsx(C.ToolbarButton,{icon:t.jsx(i.AlignLeftIcon,{size:16}),title:"Align Left",onClick:()=>{var s;(s=l.current)==null||s.focus(),u.execCommand("justifyLeft"),a()},disabled:o||r},"alignLeft");if(e==="alignCenter")return t.jsx(C.ToolbarButton,{icon:t.jsx(i.AlignCenterIcon,{size:16}),title:"Align Center",onClick:()=>{var s;(s=l.current)==null||s.focus(),u.execCommand("justifyCenter"),a()},disabled:o||r},"alignCenter");if(e==="alignRight")return t.jsx(C.ToolbarButton,{icon:t.jsx(i.AlignRightIcon,{size:16}),title:"Align Right",onClick:()=>{var s;(s=l.current)==null||s.focus(),u.execCommand("justifyRight"),a()},disabled:o||r},"alignRight");if(e==="alignJustify")return t.jsx(C.ToolbarButton,{icon:t.jsx(i.AlignJustifyIcon,{size:16}),title:"Justify",onClick:()=>{var s;(s=l.current)==null||s.focus(),u.execCommand("justifyFull"),a()},disabled:o||r},"alignJustify");if(e==="indent")return t.jsx(C.ToolbarButton,{icon:t.jsx(i.IndentIncreaseIcon,{size:16}),title:"Increase Indent",onClick:()=>{var s;(s=l.current)==null||s.focus(),u.execCommand("indent"),a()},disabled:o||r},"indent");if(e==="outdent")return t.jsx(C.ToolbarButton,{icon:t.jsx(i.IndentDecreaseIcon,{size:16}),title:"Decrease Indent",onClick:()=>{var s;(s=l.current)==null||s.focus(),u.execCommand("outdent"),a()},disabled:o||r},"outdent");if(e==="clearFormat")return t.jsx(C.ToolbarButton,{icon:t.jsx(i.FormatClearIcon,{size:16}),title:"Clear Formatting",onClick:()=>{var s;(s=l.current)==null||s.focus(),u.execCommand("removeFormat"),a()},disabled:o||r},"clearFormat");if(e==="more"){const s=E?f.RICH_EDITOR_MOBILE_MORE_ITEMS:["alignLeft","alignCenter","alignRight","alignJustify","indent","outdent","blockquote","code","clearFormat"];return t.jsx(de.ToolbarMore,{disabled:o||r,isMobile:E,children:s.map((h,y)=>S(h,y+1e3))},"more")}const g=f.RICH_EDITOR_BUTTON_CONFIG[e],d=le[e];return!g||!d?null:t.jsx(C.ToolbarButton,{icon:d,title:g.title,active:q.has(e),onClick:()=>Z(e),disabled:o||r},e)};return t.jsxs("div",{id:F,"data-testid":M,className:m.cn("Bear-RichEditor",f.RICH_EDITOR_ROOT_CLASSES,o&&"Bear-RichEditor--disabled",r&&"Bear-RichEditor--readonly",N),...w,children:[O.length>0&&t.jsx("div",{className:m.cn("Bear-RichEditor__toolbar",f.RICH_EDITOR_TOOLBAR_CLASSES),children:O.map((e,n)=>S(e,n))}),t.jsx("div",{ref:l,contentEditable:!o&&!r,onInput:a,onSelect:I,onKeyUp:I,onMouseUp:I,onPaste:se,"data-placeholder":v,className:m.cn("Bear-RichEditor__content",f.RICH_EDITOR_CONTENT_CLASSES,"[&:empty]:before:bear-content-[attr(data-placeholder)] [&:empty]:before:bear-text-gray-400 [&:empty]:before:bear-pointer-events-none",o&&"Bear-RichEditor__content--disabled bear-opacity-50 bear-cursor-not-allowed"),style:{minHeight:typeof j=="number"?`${j}px`:j,maxHeight:b?typeof b=="number"?`${b}px`:b:void 0,overflowY:b?"auto":void 0}}),p&&_!=null&&t.jsxs("div",{className:m.cn("Bear-RichEditor__char-count bear-text-xs bear-tabular-nums bear-px-3 bear-py-1.5 bear-text-right bear-border-t bear-border-gray-200 dark:bear-border-gray-700",B>_?"bear-text-red-500":"bear-text-gray-400 dark:bear-text-gray-500"),children:[B,"/",_]})]})};exports.RichEditor=fe;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),c=require("react"),m=require("../../utils/cn.cjs"),u=require("./helpers/formatHelpers.cjs"),f=require("./RichEditor.const.cjs"),le=require("../../hooks/useMediaQuery.cjs"),C=require("./components/ToolbarButton/ToolbarButton.cjs"),ce=require("./components/ToolbarDropdown/ToolbarDropdown.cjs"),z=require("./components/ToolbarColorPicker/ToolbarColorPicker.cjs"),ue=require("./components/ToolbarMore/ToolbarMore.cjs"),i=require("../Icon/icons/editor.cjs"),de=6,ge=A=>{const{value:x,defaultValue:k="",onChange:R,placeholder:v="Start typing...",disabled:o=!1,readOnly:r=!1,minHeight:j=f.RICH_EDITOR_MIN_HEIGHT,maxHeight:b,toolbar:D=f.RICH_EDITOR_DEFAULT_TOOLBAR,className:N="",testId:M,allowImagePaste:L=!0,showCharCount:p=!1,charCountMax:_,...F}=A,l=c.useRef(null),E=le.useMediaQuery(`(max-width: ${f.RICH_EDITOR_MOBILE_BREAKPOINT}px)`),O=E?f.RICH_EDITOR_MOBILE_TOOLBAR:D,[w,q]=c.useState(new Set),[U,H]=c.useState("p"),[B,P]=c.useState(0),[V,J]=c.useState("#000000"),[G,$]=c.useState("#fef08a"),[Q,K]=c.useState([]),[Y,W]=c.useState([]);c.useEffect(()=>{const e="bear-rich-editor-styles";if(!document.getElementById(e)){const n=document.createElement("style");n.id=e,n.textContent=f.RICH_EDITOR_CONTENT_STYLES,document.head.appendChild(n)}},[]),c.useEffect(()=>{l.current&&x!==void 0&&l.current.innerHTML!==x&&(l.current.innerHTML=x)},[x]),c.useEffect(()=>{l.current&&k&&!x&&(l.current.innerHTML=k)},[]);const I=c.useCallback(()=>{q(u.getActiveFormats());const e=u.queryCommandValue("formatBlock");e&&H(e.toLowerCase().replace(/[<>]/g,""))},[]),a=c.useCallback(()=>{var e;l.current&&(R&&R(l.current.innerHTML),p&&P(((e=l.current.textContent)==null?void 0:e.length)??0)),I()},[R,I,p]),X=c.useCallback(e=>{var d;if(o||r)return;(d=l.current)==null||d.focus();const n=f.RICH_EDITOR_BUTTON_CONFIG[e];if(!n)return;const g="value"in n?n.value:void 0;g?u.execCommand(n.command,g):u.execCommand(n.command),I(),a()},[o,r,I,a]),Z=c.useCallback(e=>{var n;o||r||((n=l.current)==null||n.focus(),u.execCommand("formatBlock",e),H(e),a())},[o,r,a]),ee=c.useCallback(()=>{var d;if(o||r)return;const e=window.getSelection(),n=e&&e.toString().length>0,g=prompt("Enter URL:",n?"":"https://");g&&((d=l.current)==null||d.focus(),u.insertLink(g),a())},[o,r,a]),T=c.useCallback((e,n)=>{if(!e)return;(n==="text"?K:W)(d=>{const s=d.filter(h=>h!==e);return[e,...s].slice(0,de)})},[]),te=c.useCallback(e=>{var n;o||r||((n=l.current)==null||n.focus(),u.setTextColor(e),J(e),T(e,"text"),a())},[o,r,a,T]),ne=c.useCallback(e=>{var n;o||r||((n=l.current)==null||n.focus(),u.setHighlightColor(e),$(e),T(e,"highlight"),a())},[o,r,a,T]),oe=c.useCallback(e=>{var n;o||r||((n=l.current)==null||n.focus(),u.setTextColor(e),a())},[o,r,a]),re=c.useCallback(e=>{var n;o||r||((n=l.current)==null||n.focus(),u.setHighlightColor(e),a())},[o,r,a]),ie=c.useCallback(async e=>{var g;if(!L)return;const n=(g=e.clipboardData)==null?void 0:g.items;if(n)for(let d=0;d<n.length;d++){const s=n[d];if(s.type.startsWith("image/")){e.preventDefault();const h=s.getAsFile();if(h){const y=await u.fileToDataUrl(h);u.insertImage(y),a()}return}}},[L,a]),se=c.useCallback(()=>{if(o||r)return;const e=document.createElement("input");e.type="file",e.accept="image/*",e.onchange=async n=>{var d,s;const g=(d=n.target.files)==null?void 0:d[0];if(g){const h=await u.fileToDataUrl(g);(s=l.current)==null||s.focus(),u.insertImage(h),a()}},e.click()},[o,r,a]),ae={bold:t.jsx(i.BoldIcon,{size:16}),italic:t.jsx(i.ItalicIcon,{size:16}),underline:t.jsx(i.UnderlineIcon,{size:16}),strikethrough:t.jsx(i.StrikethroughIcon,{size:16}),heading1:t.jsx(i.Heading1Icon,{size:16}),heading2:t.jsx(i.Heading2Icon,{size:16}),heading3:t.jsx(i.Heading3Icon,{size:16}),bulletList:t.jsx(i.ListBulletIcon,{size:16}),orderedList:t.jsx(i.ListNumberedIcon,{size:16}),blockquote:t.jsx(i.QuoteIcon,{size:16}),code:t.jsx(i.CodeIcon,{size:16}),link:t.jsx(i.InsertLinkIcon,{size:16}),alignLeft:t.jsx(i.AlignLeftIcon,{size:16}),alignCenter:t.jsx(i.AlignCenterIcon,{size:16}),alignRight:t.jsx(i.AlignRightIcon,{size:16}),alignJustify:t.jsx(i.AlignJustifyIcon,{size:16}),image:t.jsx(i.InsertPhotoIcon,{size:16}),indent:t.jsx(i.IndentIncreaseIcon,{size:16}),outdent:t.jsx(i.IndentDecreaseIcon,{size:16}),clearFormat:t.jsx(i.FormatClearIcon,{size:16}),table:t.jsx(i.TableIcon,{size:16})},S=(e,n)=>{if(e==="divider")return t.jsx("div",{className:m.cn("Bear-RichEditor__divider",f.RICH_EDITOR_DIVIDER_CLASSES)},`divider-${n}`);if(e==="headingDropdown")return t.jsx(ce.ToolbarDropdown,{options:f.RICH_EDITOR_HEADING_OPTIONS,value:U,onChange:Z,title:"Text Style",disabled:o||r,icon:t.jsx(i.TextIcon,{size:16})},"heading-dropdown");if(e==="textColor")return t.jsx(z.ToolbarColorPicker,{value:V,onChange:te,title:"Text Color",disabled:o||r,type:"text",recentColors:Q,onApplyLast:oe},"text-color");if(e==="highlightColor")return t.jsx(z.ToolbarColorPicker,{value:G,onChange:ne,title:"Highlight Color",disabled:o||r,type:"highlight",recentColors:Y,onApplyLast:re},"highlight-color");if(e==="link")return t.jsx(C.ToolbarButton,{icon:t.jsx(i.InsertLinkIcon,{size:16}),title:"Insert Link",onClick:ee,disabled:o||r},"link");if(e==="image")return t.jsx(C.ToolbarButton,{icon:t.jsx(i.InsertPhotoIcon,{size:16}),title:"Insert Image",onClick:se,disabled:o||r},"image");if(e==="alignLeft")return t.jsx(C.ToolbarButton,{icon:t.jsx(i.AlignLeftIcon,{size:16}),title:"Align Left",onClick:()=>{var s;(s=l.current)==null||s.focus(),u.execCommand("justifyLeft"),a()},disabled:o||r},"alignLeft");if(e==="alignCenter")return t.jsx(C.ToolbarButton,{icon:t.jsx(i.AlignCenterIcon,{size:16}),title:"Align Center",onClick:()=>{var s;(s=l.current)==null||s.focus(),u.execCommand("justifyCenter"),a()},disabled:o||r},"alignCenter");if(e==="alignRight")return t.jsx(C.ToolbarButton,{icon:t.jsx(i.AlignRightIcon,{size:16}),title:"Align Right",onClick:()=>{var s;(s=l.current)==null||s.focus(),u.execCommand("justifyRight"),a()},disabled:o||r},"alignRight");if(e==="alignJustify")return t.jsx(C.ToolbarButton,{icon:t.jsx(i.AlignJustifyIcon,{size:16}),title:"Justify",onClick:()=>{var s;(s=l.current)==null||s.focus(),u.execCommand("justifyFull"),a()},disabled:o||r},"alignJustify");if(e==="indent")return t.jsx(C.ToolbarButton,{icon:t.jsx(i.IndentIncreaseIcon,{size:16}),title:"Increase Indent",onClick:()=>{var s;(s=l.current)==null||s.focus(),u.execCommand("indent"),a()},disabled:o||r},"indent");if(e==="outdent")return t.jsx(C.ToolbarButton,{icon:t.jsx(i.IndentDecreaseIcon,{size:16}),title:"Decrease Indent",onClick:()=>{var s;(s=l.current)==null||s.focus(),u.execCommand("outdent"),a()},disabled:o||r},"outdent");if(e==="clearFormat")return t.jsx(C.ToolbarButton,{icon:t.jsx(i.FormatClearIcon,{size:16}),title:"Clear Formatting",onClick:()=>{var s;(s=l.current)==null||s.focus(),u.execCommand("removeFormat"),a()},disabled:o||r},"clearFormat");if(e==="more"){const s=E?f.RICH_EDITOR_MOBILE_MORE_ITEMS:["alignLeft","alignCenter","alignRight","alignJustify","indent","outdent","blockquote","code","clearFormat"];return t.jsx(ue.ToolbarMore,{disabled:o||r,isMobile:E,children:s.map((h,y)=>S(h,y+1e3))},"more")}const g=f.RICH_EDITOR_BUTTON_CONFIG[e],d=ae[e];return!g||!d?null:t.jsx(C.ToolbarButton,{icon:d,title:g.title,active:w.has(e),onClick:()=>X(e),disabled:o||r},e)};return t.jsxs("div",{"data-testid":M,className:m.cn("Bear-RichEditor",f.RICH_EDITOR_ROOT_CLASSES,o&&"Bear-RichEditor--disabled",r&&"Bear-RichEditor--readonly",N),...F,children:[O.length>0&&t.jsx("div",{className:m.cn("Bear-RichEditor__toolbar",f.RICH_EDITOR_TOOLBAR_CLASSES),children:O.map((e,n)=>S(e,n))}),t.jsx("div",{ref:l,contentEditable:!o&&!r,onInput:a,onSelect:I,onKeyUp:I,onMouseUp:I,onPaste:ie,"data-placeholder":v,className:m.cn("Bear-RichEditor__content",f.RICH_EDITOR_CONTENT_CLASSES,"[&:empty]:before:bear-content-[attr(data-placeholder)] [&:empty]:before:bear-text-gray-400 [&:empty]:before:bear-pointer-events-none",o&&"Bear-RichEditor__content--disabled bear-opacity-50 bear-cursor-not-allowed"),style:{minHeight:typeof j=="number"?`${j}px`:j,maxHeight:b?typeof b=="number"?`${b}px`:b:void 0,overflowY:b?"auto":void 0}}),p&&_!=null&&t.jsxs("div",{className:m.cn("Bear-RichEditor__char-count bear-text-xs bear-tabular-nums bear-px-3 bear-py-1.5 bear-text-right bear-border-t bear-border-gray-200 dark:bear-border-gray-700",B>_?"bear-text-red-500":"bear-text-gray-400 dark:bear-text-gray-500"),children:[B,"/",_]})]})};exports.RichEditor=ge;

package/dist/components/RichEditor/RichEditor.js

@@ -1,15 +1,15 @@
 import { jsxs as S, jsx as t } from "react/jsx-runtime";
-import { useRef as ye, useState as C, useEffect as x, useCallback as d } from "react";
+import { useRef as Ee, useState as C, useEffect as x, useCallback as d } from "react";
 import { cn as p } from "../../utils/cn.js";
-import { getActiveFormats as Le, queryCommandValue as xe, execCommand as u, insertLink as He, setTextColor as B, setHighlightColor as D, fileToDataUrl as N, insertImage as F } from "./helpers/formatHelpers.js";
-import { RICH_EDITOR_MIN_HEIGHT as Oe, RICH_EDITOR_DEFAULT_TOOLBAR as ke, RICH_EDITOR_CONTENT_STYLES as ze, RICH_EDITOR_BUTTON_CONFIG as M, RICH_EDITOR_MOBILE_TOOLBAR as ve, RICH_EDITOR_TOOLBAR_CLASSES as Ae, RICH_EDITOR_CONTENT_CLASSES as Se, RICH_EDITOR_ROOT_CLASSES as Be, RICH_EDITOR_DIVIDER_CLASSES as De, RICH_EDITOR_HEADING_OPTIONS as Ne, RICH_EDITOR_MOBILE_MORE_ITEMS as Fe, RICH_EDITOR_MOBILE_BREAKPOINT as Me } from "./RichEditor.const.js";
-import { useMediaQuery as we } from "../../hooks/useMediaQuery.js";
+import { getActiveFormats as ye, queryCommandValue as Le, execCommand as u, insertLink as xe, setTextColor as B, setHighlightColor as D, fileToDataUrl as N, insertImage as F } from "./helpers/formatHelpers.js";
+import { RICH_EDITOR_MIN_HEIGHT as He, RICH_EDITOR_DEFAULT_TOOLBAR as Oe, RICH_EDITOR_CONTENT_STYLES as ke, RICH_EDITOR_BUTTON_CONFIG as M, RICH_EDITOR_MOBILE_TOOLBAR as ze, RICH_EDITOR_TOOLBAR_CLASSES as ve, RICH_EDITOR_CONTENT_CLASSES as Ae, RICH_EDITOR_ROOT_CLASSES as Se, RICH_EDITOR_DIVIDER_CLASSES as Be, RICH_EDITOR_HEADING_OPTIONS as De, RICH_EDITOR_MOBILE_MORE_ITEMS as Ne, RICH_EDITOR_MOBILE_BREAKPOINT as Fe } from "./RichEditor.const.js";
+import { useMediaQuery as Me } from "../../hooks/useMediaQuery.js";
 import { ToolbarButton as f } from "./components/ToolbarButton/ToolbarButton.js";
-import { ToolbarDropdown as Ue } from "./components/ToolbarDropdown/ToolbarDropdown.js";
+import { ToolbarDropdown as we } from "./components/ToolbarDropdown/ToolbarDropdown.js";
 import { ToolbarColorPicker as w } from "./components/ToolbarColorPicker/ToolbarColorPicker.js";
-import { ToolbarMore as Ve } from "./components/ToolbarMore/ToolbarMore.js";
-import { TextIcon as Pe, InsertLinkIcon as U, InsertPhotoIcon as V, AlignLeftIcon as P, AlignCenterIcon as j, AlignRightIcon as J, AlignJustifyIcon as $, IndentIncreaseIcon as q, IndentDecreaseIcon as G, FormatClearIcon as K, TableIcon as je, CodeIcon as Je, QuoteIcon as $e, ListNumberedIcon as qe, ListBulletIcon as Ge, Heading3Icon as Ke, Heading2Icon as Qe, Heading1Icon as Ye, StrikethroughIcon as We, UnderlineIcon as Xe, ItalicIcon as Ze, BoldIcon as et } from "../Icon/icons/editor.js";
-const tt = 6, gt = (Q) => {
+import { ToolbarMore as Ue } from "./components/ToolbarMore/ToolbarMore.js";
+import { TextIcon as Ve, InsertLinkIcon as U, InsertPhotoIcon as V, AlignLeftIcon as P, AlignCenterIcon as j, AlignRightIcon as J, AlignJustifyIcon as $, IndentIncreaseIcon as q, IndentDecreaseIcon as G, FormatClearIcon as K, TableIcon as Pe, CodeIcon as je, QuoteIcon as Je, ListNumberedIcon as $e, ListBulletIcon as qe, Heading3Icon as Ge, Heading2Icon as Ke, Heading1Icon as Qe, StrikethroughIcon as Ye, UnderlineIcon as We, ItalicIcon as Xe, BoldIcon as Ze } from "../Icon/icons/editor.js";
+const et = 6, ft = (Q) => {
   const {
     value: I,
     defaultValue: H = "",
@@ -17,22 +17,21 @@ const tt = 6, gt = (Q) => {
     placeholder: Y = "Start typing...",
     disabled: r = !1,
     readOnly: o = !1,
-    minHeight: T = Oe,
+    minHeight: T = He,
     maxHeight: m,
-    toolbar: W = ke,
+    toolbar: W = Oe,
     className: X = "",
     testId: Z,
-    id: ee,
     allowImagePaste: O = !0,
     showCharCount: _ = !1,
     charCountMax: E,
-    ...te
-  } = Q, l = ye(null), y = we(`(max-width: ${Me}px)`), k = y ? ve : W, [ne, re] = C(/* @__PURE__ */ new Set()), [oe, z] = C("p"), [v, ie] = C(0), [ae, le] = C("#000000"), [se, ce] = C("#fef08a"), [de, ue] = C([]), [fe, ge] = C([]);
+    ...ee
+  } = Q, l = Ee(null), y = Me(`(max-width: ${Fe}px)`), k = y ? ze : W, [te, ne] = C(/* @__PURE__ */ new Set()), [re, z] = C("p"), [v, oe] = C(0), [ie, ae] = C("#000000"), [le, se] = C("#fef08a"), [ce, de] = C([]), [ue, fe] = C([]);
   x(() => {
     const e = "bear-rich-editor-styles";
     if (!document.getElementById(e)) {
       const n = document.createElement("style");
-      n.id = e, n.textContent = ze, document.head.appendChild(n);
+      n.id = e, n.textContent = ke, document.head.appendChild(n);
     }
   }, []), x(() => {
     l.current && I !== void 0 && l.current.innerHTML !== I && (l.current.innerHTML = I);
@@ -40,13 +39,13 @@ const tt = 6, gt = (Q) => {
     l.current && H && !I && (l.current.innerHTML = H);
   }, []);
   const h = d(() => {
-    re(Le());
-    const e = xe("formatBlock");
+    ne(ye());
+    const e = Le("formatBlock");
     e && z(e.toLowerCase().replace(/[<>]/g, ""));
   }, []), a = d(() => {
     var e;
-    l.current && (R && R(l.current.innerHTML), _ && ie(((e = l.current.textContent) == null ? void 0 : e.length) ?? 0)), h();
-  }, [R, h, _]), he = d((e) => {
+    l.current && (R && R(l.current.innerHTML), _ && oe(((e = l.current.textContent) == null ? void 0 : e.length) ?? 0)), h();
+  }, [R, h, _]), ge = d((e) => {
     var s;
     if (r || o) return;
     (s = l.current) == null || s.focus();
@@ -54,33 +53,33 @@ const tt = 6, gt = (Q) => {
     if (!n) return;
     const c = "value" in n ? n.value : void 0;
     c ? u(n.command, c) : u(n.command), h(), a();
-  }, [r, o, h, a]), Ce = d((e) => {
+  }, [r, o, h, a]), he = d((e) => {
     var n;
     r || o || ((n = l.current) == null || n.focus(), u("formatBlock", e), z(e), a());
-  }, [r, o, a]), Ie = d(() => {
+  }, [r, o, a]), Ce = d(() => {
     var s;
     if (r || o) return;
     const e = window.getSelection(), n = e && e.toString().length > 0, c = prompt("Enter URL:", n ? "" : "https://");
-    c && ((s = l.current) == null || s.focus(), He(c), a());
+    c && ((s = l.current) == null || s.focus(), xe(c), a());
   }, [r, o, a]), b = d((e, n) => {
     if (!e) return;
-    (n === "text" ? ue : ge)((s) => {
+    (n === "text" ? de : fe)((s) => {
       const i = s.filter((g) => g !== e);
-      return [e, ...i].slice(0, tt);
+      return [e, ...i].slice(0, et);
     });
-  }, []), me = d((e) => {
+  }, []), Ie = d((e) => {
     var n;
-    r || o || ((n = l.current) == null || n.focus(), B(e), le(e), b(e, "text"), a());
-  }, [r, o, a, b]), pe = d((e) => {
+    r || o || ((n = l.current) == null || n.focus(), B(e), ae(e), b(e, "text"), a());
+  }, [r, o, a, b]), me = d((e) => {
     var n;
-    r || o || ((n = l.current) == null || n.focus(), D(e), ce(e), b(e, "highlight"), a());
-  }, [r, o, a, b]), be = d((e) => {
+    r || o || ((n = l.current) == null || n.focus(), D(e), se(e), b(e, "highlight"), a());
+  }, [r, o, a, b]), pe = d((e) => {
     var n;
     r || o || ((n = l.current) == null || n.focus(), B(e), a());
-  }, [r, o, a]), Re = d((e) => {
+  }, [r, o, a]), be = d((e) => {
     var n;
     r || o || ((n = l.current) == null || n.focus(), D(e), a());
-  }, [r, o, a]), Te = d(async (e) => {
+  }, [r, o, a]), Re = d(async (e) => {
     var c;
     if (!O) return;
     const n = (c = e.clipboardData) == null ? void 0 : c.items;
@@ -97,7 +96,7 @@ const tt = 6, gt = (Q) => {
           return;
         }
       }
-  }, [O, a]), _e = d(() => {
+  }, [O, a]), Te = d(() => {
     if (r || o) return;
     const e = document.createElement("input");
     e.type = "file", e.accept = "image/*", e.onchange = async (n) => {
@@ -108,18 +107,18 @@ const tt = 6, gt = (Q) => {
         (i = l.current) == null || i.focus(), F(g), a();
       }
     }, e.click();
-  }, [r, o, a]), Ee = {
-    bold: /* @__PURE__ */ t(et, { size: 16 }),
-    italic: /* @__PURE__ */ t(Ze, { size: 16 }),
-    underline: /* @__PURE__ */ t(Xe, { size: 16 }),
-    strikethrough: /* @__PURE__ */ t(We, { size: 16 }),
-    heading1: /* @__PURE__ */ t(Ye, { size: 16 }),
-    heading2: /* @__PURE__ */ t(Qe, { size: 16 }),
-    heading3: /* @__PURE__ */ t(Ke, { size: 16 }),
-    bulletList: /* @__PURE__ */ t(Ge, { size: 16 }),
-    orderedList: /* @__PURE__ */ t(qe, { size: 16 }),
-    blockquote: /* @__PURE__ */ t($e, { size: 16 }),
-    code: /* @__PURE__ */ t(Je, { size: 16 }),
+  }, [r, o, a]), _e = {
+    bold: /* @__PURE__ */ t(Ze, { size: 16 }),
+    italic: /* @__PURE__ */ t(Xe, { size: 16 }),
+    underline: /* @__PURE__ */ t(We, { size: 16 }),
+    strikethrough: /* @__PURE__ */ t(Ye, { size: 16 }),
+    heading1: /* @__PURE__ */ t(Qe, { size: 16 }),
+    heading2: /* @__PURE__ */ t(Ke, { size: 16 }),
+    heading3: /* @__PURE__ */ t(Ge, { size: 16 }),
+    bulletList: /* @__PURE__ */ t(qe, { size: 16 }),
+    orderedList: /* @__PURE__ */ t($e, { size: 16 }),
+    blockquote: /* @__PURE__ */ t(Je, { size: 16 }),
+    code: /* @__PURE__ */ t(je, { size: 16 }),
     link: /* @__PURE__ */ t(U, { size: 16 }),
     alignLeft: /* @__PURE__ */ t(P, { size: 16 }),
     alignCenter: /* @__PURE__ */ t(j, { size: 16 }),
@@ -129,20 +128,20 @@ const tt = 6, gt = (Q) => {
     indent: /* @__PURE__ */ t(q, { size: 16 }),
     outdent: /* @__PURE__ */ t(G, { size: 16 }),
     clearFormat: /* @__PURE__ */ t(K, { size: 16 }),
-    table: /* @__PURE__ */ t(je, { size: 16 })
+    table: /* @__PURE__ */ t(Pe, { size: 16 })
   }, A = (e, n) => {
     if (e === "divider")
-      return /* @__PURE__ */ t("div", { className: p("Bear-RichEditor__divider", De) }, `divider-${n}`);
+      return /* @__PURE__ */ t("div", { className: p("Bear-RichEditor__divider", Be) }, `divider-${n}`);
     if (e === "headingDropdown")
       return /* @__PURE__ */ t(
-        Ue,
+        we,
         {
-          options: Ne,
-          value: oe,
-          onChange: Ce,
+          options: De,
+          value: re,
+          onChange: he,
           title: "Text Style",
           disabled: r || o,
-          icon: /* @__PURE__ */ t(Pe, { size: 16 })
+          icon: /* @__PURE__ */ t(Ve, { size: 16 })
         },
         "heading-dropdown"
       );
@@ -150,13 +149,13 @@ const tt = 6, gt = (Q) => {
       return /* @__PURE__ */ t(
         w,
         {
-          value: ae,
-          onChange: me,
+          value: ie,
+          onChange: Ie,
           title: "Text Color",
           disabled: r || o,
           type: "text",
-          recentColors: de,
-          onApplyLast: be
+          recentColors: ce,
+          onApplyLast: pe
         },
         "text-color"
       );
@@ -164,13 +163,13 @@ const tt = 6, gt = (Q) => {
       return /* @__PURE__ */ t(
         w,
         {
-          value: se,
-          onChange: pe,
+          value: le,
+          onChange: me,
           title: "Highlight Color",
           disabled: r || o,
           type: "highlight",
-          recentColors: fe,
-          onApplyLast: Re
+          recentColors: ue,
+          onApplyLast: be
         },
         "highlight-color"
       );
@@ -180,7 +179,7 @@ const tt = 6, gt = (Q) => {
         {
           icon: /* @__PURE__ */ t(U, { size: 16 }),
           title: "Insert Link",
-          onClick: Ie,
+          onClick: Ce,
           disabled: r || o
         },
         "link"
@@ -191,7 +190,7 @@ const tt = 6, gt = (Q) => {
         {
           icon: /* @__PURE__ */ t(V, { size: 16 }),
           title: "Insert Image",
-          onClick: _e,
+          onClick: Te,
           disabled: r || o
         },
         "image"
@@ -295,7 +294,7 @@ const tt = 6, gt = (Q) => {
         "clearFormat"
       );
     if (e === "more")
-      return /* @__PURE__ */ t(Ve, { disabled: r || o, isMobile: y, children: (y ? Fe : [
+      return /* @__PURE__ */ t(Ue, { disabled: r || o, isMobile: y, children: (y ? Ne : [
         "alignLeft",
         "alignCenter",
         "alignRight",
@@ -306,14 +305,14 @@ const tt = 6, gt = (Q) => {
         "code",
         "clearFormat"
       ]).map((g, L) => A(g, L + 1e3)) }, "more");
-    const c = M[e], s = Ee[e];
+    const c = M[e], s = _e[e];
     return !c || !s ? null : /* @__PURE__ */ t(
       f,
       {
         icon: s,
         title: c.title,
-        active: ne.has(e),
-        onClick: () => he(e),
+        active: te.has(e),
+        onClick: () => ge(e),
         disabled: r || o
       },
       e
@@ -322,18 +321,17 @@ const tt = 6, gt = (Q) => {
   return /* @__PURE__ */ S(
     "div",
     {
-      id: ee,
       "data-testid": Z,
       className: p(
         "Bear-RichEditor",
-        Be,
+        Se,
         r && "Bear-RichEditor--disabled",
         o && "Bear-RichEditor--readonly",
         X
       ),
-      ...te,
+      ...ee,
       children: [
-        k.length > 0 && /* @__PURE__ */ t("div", { className: p("Bear-RichEditor__toolbar", Ae), children: k.map((e, n) => A(e, n)) }),
+        k.length > 0 && /* @__PURE__ */ t("div", { className: p("Bear-RichEditor__toolbar", ve), children: k.map((e, n) => A(e, n)) }),
         /* @__PURE__ */ t(
           "div",
           {
@@ -343,11 +341,11 @@ const tt = 6, gt = (Q) => {
             onSelect: h,
             onKeyUp: h,
             onMouseUp: h,
-            onPaste: Te,
+            onPaste: Re,
             "data-placeholder": Y,
             className: p(
               "Bear-RichEditor__content",
-              Se,
+              Ae,
               "[&:empty]:before:bear-content-[attr(data-placeholder)] [&:empty]:before:bear-text-gray-400 [&:empty]:before:bear-pointer-events-none",
               r && "Bear-RichEditor__content--disabled bear-opacity-50 bear-cursor-not-allowed"
             ),
@@ -377,5 +375,5 @@ const tt = 6, gt = (Q) => {
   );
 };
 export {
-  gt as RichEditor
+  ft as RichEditor
 };

package/dist/components/RingProgress/RingProgress.types.d.ts

@@ -5,6 +5,7 @@ export interface RingProgressSection {
     tooltip?: string;
 }
 export interface RingProgressProps extends HTMLAttributes<HTMLDivElement> {
+    id?: string;
     sections: RingProgressSection[];
     size?: number;
     thickness?: number;

package/dist/components/ScrollArea/ScrollArea.const.d.ts

@@ -0,0 +1 @@
+export declare const S_C_R_O_L_L_A_R_E_A_ROOT_CLASS = "Bear-ScrollArea";

package/dist/components/ScrollArea/ScrollArea.types.d.ts

@@ -1,5 +1,7 @@
 import { ReactNode } from 'react';
 export interface ScrollAreaProps {
+    testId?: string;
+    id?: string;
     children: ReactNode;
     className?: string;
     orientation?: 'vertical' | 'horizontal' | 'both';

package/dist/components/SegmentedControl/SegmentedControl.const.d.ts

@@ -0,0 +1 @@
+export declare const S_E_G_M_E_N_T_E_D_C_O_N_T_R_O_L_ROOT_CLASS = "Bear-SegmentedControl";

package/dist/components/SegmentedControl/SegmentedControl.types.d.ts

@@ -5,6 +5,8 @@ export interface SegmentedControlItem {
     disabled?: boolean;
 }
 export interface SegmentedControlProps {
+    testId?: string;
+    id?: string;
     items: SegmentedControlItem[];
     value?: string;
     defaultValue?: string;

package/dist/components/Select/Select.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),t=require("react"),o=require("../../utils/cn.cjs"),S=require("../../hooks/useClickOutside.cjs");require("../../context/BearProvider.cjs");require("../../hooks/useBearComponent/useBearComponent.cjs");const g=require("../Icon/index.cjs"),R=require("../Portal/Portal.cjs"),E={sm:"bear-h-8 bear-text-sm bear-px-3",md:"bear-h-10 bear-text-base bear-px-4",lg:"bear-h-12 bear-text-lg bear-px-5"},P=({options:x,value:s,onChange:n,placeholder:y="Select an option",label:m,error:d,disabled:i=!1,size:j="md",fullWidth:k=!1,className:p})=>{const[a,c]=t.useState(!1),[u,C]=t.useState({top:0,left:0,width:0}),f=t.useRef(null),v=t.useRef(null),w=!!d,l=x.find(e=>e.value===s),N=t.useCallback(()=>c(!1),[]);S.useClickOutsideMultiple([f,v],N,{enabled:a});const q=e=>{n==null||n(e),c(!1)};return t.useEffect(()=>{if(!a)return;const e=()=>{var h;const b=(h=f.current)==null?void 0:h.getBoundingClientRect();b&&C({top:b.bottom+4,left:Math.max(8,Math.min(b.left,window.innerWidth-b.width-8)),width:b.width})};return e(),window.addEventListener("resize",e),window.addEventListener("scroll",e,!0),()=>{window.removeEventListener("resize",e),window.removeEventListener("scroll",e,!0)}},[a]),r.jsxs("div",{ref:f,className:o.cn("bear-relative bear-flex bear-flex-col bear-gap-1.5",k&&"bear-w-full"),children:[m&&r.jsx("label",{className:"bear-text-sm bear-font-medium",style:{color:"var(--bear-text-secondary)"},children:m}),r.jsxs("button",{type:"button",disabled:i,onClick:()=>!i&&c(!a),className:o.cn("bear-flex bear-items-center bear-justify-between bear-w-full","bear-rounded-lg bear-border bear-text-left bear-outline-none bear-transition-all bear-duration-200","focus:bear-ring-2 focus:bear-ring-offset-2 focus:bear-ring-offset-[var(--bear-bg-primary)]",w?"bear-border-red-500 focus:bear-ring-red-500":"focus:bear-border-bear-500 focus:bear-ring-bear-500 dark:focus:bear-border-bear-500 dark:focus:bear-ring-bear-500",i&&"bear-opacity-50 bear-cursor-not-allowed",E[j],p),style:{backgroundColor:"var(--bear-bg-primary)",borderColor:w?void 0:"var(--bear-border-default)",color:l?"var(--bear-text-primary)":"var(--bear-text-muted)"},children:[r.jsx("span",{children:(l==null?void 0:l.label)||y}),r.jsx(g.ChevronDownIcon,{className:o.cn("bear-w-4 bear-h-4 bear-shrink-0 bear-transition-transform",a&&"bear-rotate-180"),style:{color:"var(--bear-text-muted)"}})]}),a&&r.jsx(R.Portal,{children:r.jsx("div",{ref:v,className:"bear-fixed bear-rounded-lg bear-border bear-shadow-lg bear-overflow-hidden",style:{backgroundColor:"var(--bear-bg-primary)",borderColor:"var(--bear-border-default)",top:u.top,left:u.left,width:u.width,zIndex:1e4},children:r.jsx("div",{className:"bear-max-h-60 bear-overflow-y-auto",children:x.map(e=>r.jsxs("button",{type:"button",disabled:e.disabled,onClick:()=>!e.disabled&&q(e.value),className:o.cn("bear-flex bear-items-center bear-justify-between bear-w-full bear-px-4 bear-py-2","bear-text-left bear-transition-colors",e.disabled&&"bear-cursor-not-allowed",e.value===s&&"bear-bg-bear-100 bear-text-bear-700 dark:bear-bg-bear-600/20 dark:bear-text-bear-300",!e.disabled&&e.value!==s&&"hover:bear-bg-[var(--bear-bg-tertiary)]"),style:e.disabled?{color:"var(--bear-text-muted)"}:e.value===s?void 0:{color:"var(--bear-text-secondary)"},children:[e.label,e.value===s&&r.jsx(g.CheckIcon,{className:"bear-w-4 bear-h-4 bear-shrink-0 bear-text-bear-600 dark:bear-text-bear-400"})]},e.value))})})}),d&&r.jsx("p",{className:"bear-text-sm bear-text-red-500",children:d})]})};exports.Select=P;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),t=require("react"),o=require("../../utils/cn.cjs"),S=require("../../hooks/useClickOutside.cjs");require("../../context/BearProvider.cjs");require("../../hooks/useBearComponent/useBearComponent.cjs");require("../FormControl/FormControl.context.cjs");const g=require("../Icon/index.cjs"),R=require("../Portal/Portal.cjs"),E={sm:"bear-h-8 bear-text-sm bear-px-3",md:"bear-h-10 bear-text-base bear-px-4",lg:"bear-h-12 bear-text-lg bear-px-5"},P=({options:x,value:s,onChange:n,placeholder:y="Select an option",label:m,error:i,disabled:d=!1,size:j="md",fullWidth:k=!1,className:p})=>{const[a,c]=t.useState(!1),[u,q]=t.useState({top:0,left:0,width:0}),f=t.useRef(null),v=t.useRef(null),w=!!i,l=x.find(e=>e.value===s),C=t.useCallback(()=>c(!1),[]);S.useClickOutsideMultiple([f,v],C,{enabled:a});const N=e=>{n==null||n(e),c(!1)};return t.useEffect(()=>{if(!a)return;const e=()=>{var h;const b=(h=f.current)==null?void 0:h.getBoundingClientRect();b&&q({top:b.bottom+4,left:Math.max(8,Math.min(b.left,window.innerWidth-b.width-8)),width:b.width})};return e(),window.addEventListener("resize",e),window.addEventListener("scroll",e,!0),()=>{window.removeEventListener("resize",e),window.removeEventListener("scroll",e,!0)}},[a]),r.jsxs("div",{ref:f,className:o.cn("bear-relative bear-flex bear-flex-col bear-gap-1.5",k&&"bear-w-full"),children:[m&&r.jsx("label",{className:"bear-text-sm bear-font-medium",style:{color:"var(--bear-text-secondary)"},children:m}),r.jsxs("button",{type:"button",disabled:d,onClick:()=>!d&&c(!a),className:o.cn("bear-flex bear-items-center bear-justify-between bear-w-full","bear-rounded-lg bear-border bear-text-left bear-outline-none bear-transition-all bear-duration-200","focus:bear-ring-2 focus:bear-ring-offset-2 focus:bear-ring-offset-[var(--bear-bg-primary)]",w?"bear-border-red-500 focus:bear-ring-red-500":"focus:bear-border-bear-500 focus:bear-ring-bear-500 dark:focus:bear-border-bear-500 dark:focus:bear-ring-bear-500",d&&"bear-opacity-50 bear-cursor-not-allowed",E[j],p),style:{backgroundColor:"var(--bear-bg-primary)",borderColor:w?void 0:"var(--bear-border-default)",color:l?"var(--bear-text-primary)":"var(--bear-text-muted)"},children:[r.jsx("span",{children:(l==null?void 0:l.label)||y}),r.jsx(g.ChevronDownIcon,{className:o.cn("bear-w-4 bear-h-4 bear-shrink-0 bear-transition-transform",a&&"bear-rotate-180"),style:{color:"var(--bear-text-muted)"}})]}),a&&r.jsx(R.Portal,{children:r.jsx("div",{ref:v,className:"bear-fixed bear-rounded-lg bear-border bear-shadow-lg bear-overflow-hidden",style:{backgroundColor:"var(--bear-bg-primary)",borderColor:"var(--bear-border-default)",top:u.top,left:u.left,width:u.width,zIndex:1e4},children:r.jsx("div",{className:"bear-max-h-60 bear-overflow-y-auto",children:x.map(e=>r.jsxs("button",{type:"button",disabled:e.disabled,onClick:()=>!e.disabled&&N(e.value),className:o.cn("bear-flex bear-items-center bear-justify-between bear-w-full bear-px-4 bear-py-2","bear-text-left bear-transition-colors",e.disabled&&"bear-cursor-not-allowed",e.value===s&&"bear-bg-bear-100 bear-text-bear-700 dark:bear-bg-bear-600/20 dark:bear-text-bear-300",!e.disabled&&e.value!==s&&"hover:bear-bg-[var(--bear-bg-tertiary)]"),style:e.disabled?{color:"var(--bear-text-muted)"}:e.value===s?void 0:{color:"var(--bear-text-secondary)"},children:[e.label,e.value===s&&r.jsx(g.CheckIcon,{className:"bear-w-4 bear-h-4 bear-shrink-0 bear-text-bear-600 dark:bear-text-bear-400"})]},e.value))})})}),i&&r.jsx("p",{className:"bear-text-sm bear-text-red-500",children:i})]})};exports.Select=P;

package/dist/components/Select/Select.const.d.ts

@@ -0,0 +1 @@
+export declare const S_E_L_E_C_T_ROOT_CLASS = "Bear-Select";

package/dist/components/Select/Select.js

@@ -4,13 +4,14 @@ import { cn as o } from "../../utils/cn.js";
 import { useClickOutsideMultiple as M } from "../../hooks/useClickOutside.js";
 import "../../context/BearProvider.js";
 import "../../hooks/useBearComponent/useBearComponent.js";
+import "../FormControl/FormControl.context.js";
 import { ChevronDownIcon as P, CheckIcon as R } from "../Icon/index.js";
 import { Portal as S } from "../Portal/Portal.js";
 const B = {
   sm: "bear-h-8 bear-text-sm bear-px-3",
   md: "bear-h-10 bear-text-base bear-px-4",
   lg: "bear-h-12 bear-text-lg bear-px-5"
-}, J = ({
+}, K = ({
   options: m,
   value: t,
   onChange: s,
@@ -122,5 +123,5 @@ const B = {
   );
 };
 export {
-  J as Select
+  K as Select
 };

package/dist/components/Select/Select.types.d.ts

@@ -1,9 +1,12 @@
+import { ReactNode } from 'react';
 export interface SelectOption {
     value: string;
     label: string;
     disabled?: boolean;
 }
 export interface SelectProps {
+    testId?: string;
+    id?: string;
     /** Select options */
     options: SelectOption[];
     /** Current value */
@@ -22,6 +25,8 @@ export interface SelectProps {
     size?: 'sm' | 'md' | 'lg';
     /** Whether select is full width */
     fullWidth?: boolean;
-    /** Additional class names */
+    displayEmpty?: boolean;
+    renderValue?: (value: string) => ReactNode;
+    native?: boolean;
     className?: string;
 }

package/dist/components/Sidebar/Sidebar.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("../../utils/cn.cjs");require("react");const t=require("../Icon/index.cjs"),p=require("./components/SidebarItem/SidebarItem.cjs"),a=require("./Sidebar.const.cjs"),L=S=>{const{items:b,collapsed:r=!1,onCollapsedChange:d,width:_=a.SIDEBAR_WIDTH,collapsedWidth:I=a.SIDEBAR_COLLAPSED_WIDTH,header:o,footer:c,showHeader:E=!0,activeItemId:h,onItemClick:u,activeVariant:f="fill",fullHeight:A=!1,variant:s="default",position:l="left",className:C,style:x,testId:B,id:R}=S,m=r?I:_,v=l==="left"?"bear-border-r":"bear-border-l",D=E&&o;return e.jsxs("aside",{id:R,"data-testid":B,className:i.cn("Bear-Sidebar",`Bear-Sidebar--${s}`,r&&"Bear-Sidebar--collapsed","bear-flex bear-flex-col bear-h-full bear-transition-all bear-duration-300",A&&"bear-min-h-full",s==="default"&&v,a.SIDEBAR_VARIANT_STYLES[s],C),style:{width:m,...x},children:[D&&e.jsxs("div",{className:i.cn("Bear-Sidebar__header",a.SIDEBAR_HEADER_CLASSES),children:[!r&&o,d&&e.jsx("button",{type:"button",onClick:()=>d(!r),className:i.cn("Bear-Sidebar__toggle",a.SIDEBAR_TOGGLE_CLASSES),"aria-label":r?"Expand sidebar":"Collapse sidebar",children:r?l==="left"?e.jsx(t.ChevronRightIcon,{size:a.SIDEBAR_TOGGLE_ICON_SIZE}):e.jsx(t.ChevronLeftIcon,{size:a.SIDEBAR_TOGGLE_ICON_SIZE}):l==="left"?e.jsx(t.ChevronLeftIcon,{size:a.SIDEBAR_TOGGLE_ICON_SIZE}):e.jsx(t.ChevronRightIcon,{size:a.SIDEBAR_TOGGLE_ICON_SIZE})})]}),e.jsx("nav",{className:"Bear-Sidebar__nav bear-flex-1 bear-overflow-y-auto bear-px-2 bear-py-3 bear-space-y-1 bear-min-h-0",children:b.map(n=>e.jsx(p.SidebarItem,{item:n,isActive:n.id===h,collapsed:r,onClick:u,activeVariant:f},n.id))}),c&&e.jsx("div",{className:i.cn("Bear-Sidebar__footer",a.SIDEBAR_FOOTER_CLASSES),children:r?null:c})]})};exports.Sidebar=L;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("../../utils/cn.cjs");require("react");const t=require("../Icon/index.cjs"),D=require("./components/SidebarItem/SidebarItem.cjs"),a=require("./Sidebar.const.cjs"),p=S=>{const{items:b,collapsed:r=!1,onCollapsedChange:o,width:_=a.SIDEBAR_WIDTH,collapsedWidth:I=a.SIDEBAR_COLLAPSED_WIDTH,header:d,footer:c,showHeader:E=!0,activeItemId:h,onItemClick:u,activeVariant:f="fill",fullHeight:A=!1,variant:s="default",position:l="left",className:C,style:x,testId:B}=S,R=r?I:_,m=l==="left"?"bear-border-r":"bear-border-l",v=E&&d;return e.jsxs("aside",{"data-testid":B,className:i.cn("Bear-Sidebar",`Bear-Sidebar--${s}`,r&&"Bear-Sidebar--collapsed","bear-flex bear-flex-col bear-h-full bear-transition-all bear-duration-300",A&&"bear-min-h-full",s==="default"&&m,a.SIDEBAR_VARIANT_STYLES[s],C),style:{width:R,...x},children:[v&&e.jsxs("div",{className:i.cn("Bear-Sidebar__header",a.SIDEBAR_HEADER_CLASSES),children:[!r&&d,o&&e.jsx("button",{type:"button",onClick:()=>o(!r),className:i.cn("Bear-Sidebar__toggle",a.SIDEBAR_TOGGLE_CLASSES),"aria-label":r?"Expand sidebar":"Collapse sidebar",children:r?l==="left"?e.jsx(t.ChevronRightIcon,{size:a.SIDEBAR_TOGGLE_ICON_SIZE}):e.jsx(t.ChevronLeftIcon,{size:a.SIDEBAR_TOGGLE_ICON_SIZE}):l==="left"?e.jsx(t.ChevronLeftIcon,{size:a.SIDEBAR_TOGGLE_ICON_SIZE}):e.jsx(t.ChevronRightIcon,{size:a.SIDEBAR_TOGGLE_ICON_SIZE})})]}),e.jsx("nav",{className:"Bear-Sidebar__nav bear-flex-1 bear-overflow-y-auto bear-px-2 bear-py-3 bear-space-y-1 bear-min-h-0",children:b.map(n=>e.jsx(D.SidebarItem,{item:n,isActive:n.id===h,collapsed:r,onClick:u,activeVariant:f},n.id))}),c&&e.jsx("div",{className:i.cn("Bear-Sidebar__footer",a.SIDEBAR_FOOTER_CLASSES),children:r?null:c})]})};exports.Sidebar=p;

package/dist/components/Sidebar/Sidebar.js

@@ -2,15 +2,15 @@ import { jsxs as b, jsx as a } from "react/jsx-runtime";
 import { cn as r } from "../../utils/cn.js";
 import "react";
 import { ChevronRightIcon as c, ChevronLeftIcon as S } from "../Icon/index.js";
-import { SidebarItem as N } from "./components/SidebarItem/SidebarItem.js";
-import { SIDEBAR_WIDTH as T, SIDEBAR_COLLAPSED_WIDTH as y, SIDEBAR_TOGGLE_ICON_SIZE as i, SIDEBAR_TOGGLE_CLASSES as H, SIDEBAR_HEADER_CLASSES as O, SIDEBAR_FOOTER_CLASSES as g, SIDEBAR_VARIANT_STYLES as w } from "./Sidebar.const.js";
-const F = (f) => {
+import { SidebarItem as x } from "./components/SidebarItem/SidebarItem.js";
+import { SIDEBAR_WIDTH as N, SIDEBAR_COLLAPSED_WIDTH as T, SIDEBAR_TOGGLE_ICON_SIZE as i, SIDEBAR_TOGGLE_CLASSES as y, SIDEBAR_HEADER_CLASSES as H, SIDEBAR_FOOTER_CLASSES as O, SIDEBAR_VARIANT_STYLES as g } from "./Sidebar.const.js";
+const V = (f) => {
   const {
     items: m,
     collapsed: e = !1,
     onCollapsedChange: d,
-    width: _ = T,
-    collapsedWidth: h = y,
+    width: _ = N,
+    collapsedWidth: h = T,
     header: s,
     footer: n,
     showHeader: p = !0,
@@ -22,13 +22,11 @@ const F = (f) => {
     position: t = "left",
     className: u,
     style: C,
-    testId: v,
-    id: D
-  } = f, R = e ? h : _, L = t === "left" ? "bear-border-r" : "bear-border-l", x = p && s;
+    testId: v
+  } = f, D = e ? h : _, R = t === "left" ? "bear-border-r" : "bear-border-l", L = p && s;
   return /* @__PURE__ */ b(
     "aside",
     {
-      id: D,
       "data-testid": v,
       className: r(
         "Bear-Sidebar",
@@ -36,27 +34,27 @@ const F = (f) => {
         e && "Bear-Sidebar--collapsed",
         "bear-flex bear-flex-col bear-h-full bear-transition-all bear-duration-300",
         B && "bear-min-h-full",
-        l === "default" && L,
-        w[l],
+        l === "default" && R,
+        g[l],
         u
       ),
-      style: { width: R, ...C },
+      style: { width: D, ...C },
       children: [
-        x && /* @__PURE__ */ b("div", { className: r("Bear-Sidebar__header", O), children: [
+        L && /* @__PURE__ */ b("div", { className: r("Bear-Sidebar__header", H), children: [
           !e && s,
           d && /* @__PURE__ */ a(
             "button",
             {
               type: "button",
               onClick: () => d(!e),
-              className: r("Bear-Sidebar__toggle", H),
+              className: r("Bear-Sidebar__toggle", y),
               "aria-label": e ? "Expand sidebar" : "Collapse sidebar",
               children: e ? t === "left" ? /* @__PURE__ */ a(c, { size: i }) : /* @__PURE__ */ a(S, { size: i }) : t === "left" ? /* @__PURE__ */ a(S, { size: i }) : /* @__PURE__ */ a(c, { size: i })
             }
           )
         ] }),
         /* @__PURE__ */ a("nav", { className: "Bear-Sidebar__nav bear-flex-1 bear-overflow-y-auto bear-px-2 bear-py-3 bear-space-y-1 bear-min-h-0", children: m.map((o) => /* @__PURE__ */ a(
-          N,
+          x,
           {
             item: o,
             isActive: o.id === E,
@@ -66,11 +64,11 @@ const F = (f) => {
           },
           o.id
         )) }),
-        n && /* @__PURE__ */ a("div", { className: r("Bear-Sidebar__footer", g), children: e ? null : n })
+        n && /* @__PURE__ */ a("div", { className: r("Bear-Sidebar__footer", O), children: e ? null : n })
       ]
     }
   );
 };
 export {
-  F as Sidebar
+  V as Sidebar
 };