@octaviaflow/core 3.0.3 → 3.0.5

package/dist/index.js

@@ -618,16 +618,38 @@ function Button({
   fullWidth = false,
   className,
   children,
+  type,
   ...props
 }) {
   const ref = useRef3(null);
   const isDisabled = disabled || loading;
-  const { buttonProps } = useButton({ isDisabled, onPress: props.onClick }, ref);
+  const resolvedType = type ?? "button";
+  const { buttonProps } = useButton(
+    {
+      isDisabled,
+      onPress: props.onClick,
+      type: resolvedType
+    },
+    ref
+  );
   const { onDrag, onDragStart, onDragEnd, onAnimationStart, ...safeButtonProps } = buttonProps;
+  const {
+    onClick: _onClick,
+    onKeyDown: _onKeyDown,
+    onKeyUp: _onKeyUp,
+    onMouseDown: _onMouseDown,
+    onPointerDown: _onPointerDown,
+    onPointerUp: _onPointerUp,
+    onFocus: _onFocus,
+    onBlur: _onBlur,
+    ...passthroughProps
+  } = props;
   return /* @__PURE__ */ jsxs10(
     motion2.button,
     {
+      ...passthroughProps,
       ...safeButtonProps,
+      type: resolvedType,
       ref,
       className: cn(
         "ods-btn",
@@ -2444,6 +2466,14 @@ function Checkbox({
     ref
   );
   const isChecked = state.isSelected;
+  const {
+    onClick: _onClick,
+    onKeyDown: _onKeyDown,
+    onKeyUp: _onKeyUp,
+    onFocus: _onFocus,
+    onBlur: _onBlur,
+    ...passthroughProps
+  } = props;
   return /* @__PURE__ */ jsxs14(
     "label",
     {
@@ -2454,7 +2484,15 @@ function Checkbox({
         className
       ),
       children: [
-        /* @__PURE__ */ jsx15("input", { ...inputProps, ref, className: "ods-checkbox__input" }),
+        /* @__PURE__ */ jsx15(
+          "input",
+          {
+            ...passthroughProps,
+            ...inputProps,
+            ref,
+            className: "ods-checkbox__input"
+          }
+        ),
         /* @__PURE__ */ jsx15(
           "div",
           {
@@ -5972,7 +6010,7 @@ function DescriptionList({
 // src/components/Dialog/Dialog.tsx
 import { AnimatePresence as AnimatePresence3, motion as motion5 } from "framer-motion";
 import { useRef as useRef11 } from "react";
-import { FocusScope, useDialog, useModal, useOverlay } from "react-aria";
+import { FocusScope, OverlayProvider, useDialog, useModal, useOverlay } from "react-aria";
 import { createPortal } from "react-dom";
 
 // src/utils/motion.ts
@@ -6092,7 +6130,10 @@ function DialogContent({
 }
 function Dialog(props) {
   if (typeof document === "undefined") return null;
-  return createPortal(/* @__PURE__ */ jsx26(DialogContent, { ...props }), document.body);
+  return createPortal(
+    /* @__PURE__ */ jsx26(OverlayProvider, { children: /* @__PURE__ */ jsx26(DialogContent, { ...props }) }),
+    document.body
+  );
 }
 
 // src/components/DonutChart/DonutChart.tsx
@@ -10085,15 +10126,26 @@ function RadioGroup({
   orientation = "vertical",
   disabled = false,
   children,
-  className
+  className,
+  name,
+  required,
+  id,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledBy,
+  "aria-describedby": ariaDescribedBy
 }) {
   const ariaProps = {
-    label: typeof label === "string" ? label : "radio group",
+    label: typeof label === "string" ? label : ariaLabel || "radio group",
     value,
     defaultValue,
     onChange,
     isDisabled: disabled,
-    orientation
+    isRequired: required,
+    orientation,
+    name,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
+    "aria-describedby": ariaDescribedBy
   };
   const state = $384704861d32dbed$export$bca9d026f8e704eb(ariaProps);
   const ref = useRef23(null);
@@ -10103,6 +10155,7 @@ function RadioGroup({
     {
       ...radioGroupProps,
       ref,
+      id,
       className: cn(
         "ods-radio-group",
         `ods-radio-group--${orientation}`,
@@ -10119,7 +10172,13 @@ function RadioGroup({
 
 // src/components/Radio/Radio.tsx
 import { jsx as jsx61, jsxs as jsxs60 } from "react/jsx-runtime";
-function Radio({ value, label, disabled = false, className }) {
+function Radio({
+  value,
+  label,
+  disabled = false,
+  className,
+  ...props
+}) {
   const state = useRadioGroupContext();
   const ref = useRef24(null);
   const { inputProps } = useRadio(
@@ -10132,6 +10191,14 @@ function Radio({ value, label, disabled = false, className }) {
     ref
   );
   const isSelected = state.selectedValue === value;
+  const {
+    onClick: _onClick,
+    onKeyDown: _onKeyDown,
+    onKeyUp: _onKeyUp,
+    onFocus: _onFocus,
+    onBlur: _onBlur,
+    ...passthroughProps
+  } = props;
   return /* @__PURE__ */ jsxs60(
     "label",
     {
@@ -10142,7 +10209,15 @@ function Radio({ value, label, disabled = false, className }) {
         className
       ),
       children: [
-        /* @__PURE__ */ jsx61("input", { ...inputProps, ref, className: "ods-radio__input" }),
+        /* @__PURE__ */ jsx61(
+          "input",
+          {
+            ...passthroughProps,
+            ...inputProps,
+            ref,
+            className: "ods-radio__input"
+          }
+        ),
         /* @__PURE__ */ jsx61("div", { className: "ods-radio__circle", "aria-hidden": "true", children: /* @__PURE__ */ jsx61("div", { className: cn("ods-radio__dot", isSelected && "ods-radio__dot--visible") }) }),
         label && /* @__PURE__ */ jsx61("span", { className: "ods-radio__label", children: label })
       ]
@@ -10687,7 +10762,14 @@ function Select({
   disabled = false,
   size = "md",
   className,
-  name
+  name,
+  required,
+  id,
+  form,
+  autoFocus,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledBy,
+  "aria-describedby": ariaDescribedBy
 }) {
   const triggerRef = useRef26(null);
   const listBoxRef = useRef26(null);
@@ -10766,13 +10848,20 @@ function Select({
         className
       ),
       children: [
-        label && /* @__PURE__ */ jsx66("label", { className: "ods-select__label", children: label }),
+        label && /* @__PURE__ */ jsx66("label", { className: "ods-select__label", htmlFor: id, children: label }),
         /* @__PURE__ */ jsx66(HiddenSelect, { state, triggerRef, label, name }),
         /* @__PURE__ */ jsxs65(
           "button",
           {
             ...buttonProps,
             ref: triggerRef,
+            id,
+            form,
+            autoFocus,
+            "aria-label": ariaLabel,
+            "aria-labelledby": ariaLabelledBy,
+            "aria-describedby": ariaDescribedBy,
+            "aria-required": required || void 0,
             className: cn("ods-select__trigger", state.isOpen && "ods-select__trigger--open"),
             children: [
               /* @__PURE__ */ jsx66("span", { className: "ods-select__value", children: selectedOption ? /* @__PURE__ */ jsxs65(Fragment13, { children: [
@@ -11390,7 +11479,7 @@ function Skeleton({ variant = "text", width, height, lines = 1, className }) {
 // src/components/SlideoutPanel/SlideoutPanel.tsx
 import { AnimatePresence as AnimatePresence9, motion as motion12 } from "framer-motion";
 import { useRef as useRef28 } from "react";
-import { FocusScope as FocusScope2, useDialog as useDialog2, useModal as useModal2, useOverlay as useOverlay2 } from "react-aria";
+import { FocusScope as FocusScope2, OverlayProvider as OverlayProvider2, useDialog as useDialog2, useModal as useModal2, useOverlay as useOverlay2 } from "react-aria";
 import { createPortal as createPortal8 } from "react-dom";
 import { Fragment as Fragment16, jsx as jsx71, jsxs as jsxs69 } from "react/jsx-runtime";
 var slideVariants2 = {
@@ -11483,7 +11572,10 @@ function SlideoutContent({
 }
 function SlideoutPanel(props) {
   if (typeof document === "undefined") return null;
-  return createPortal8(/* @__PURE__ */ jsx71(SlideoutContent, { ...props }), document.body);
+  return createPortal8(
+    /* @__PURE__ */ jsx71(OverlayProvider2, { children: /* @__PURE__ */ jsx71(SlideoutContent, { ...props }) }),
+    document.body
+  );
 }
 
 // src/components/Slider/Slider.tsx
@@ -12085,6 +12177,14 @@ function Switch({
     ref
   );
   const isOn = state.isSelected;
+  const {
+    onClick: _onClick,
+    onKeyDown: _onKeyDown,
+    onKeyUp: _onKeyUp,
+    onFocus: _onFocus,
+    onBlur: _onBlur,
+    ...passthroughProps
+  } = props;
   return /* @__PURE__ */ jsxs75(
     "label",
     {
@@ -12095,7 +12195,15 @@ function Switch({
         className
       ),
       children: [
-        /* @__PURE__ */ jsx78("input", { ...inputProps, ref, className: "ods-switch__input" }),
+        /* @__PURE__ */ jsx78(
+          "input",
+          {
+            ...passthroughProps,
+            ...inputProps,
+            ref,
+            className: "ods-switch__input"
+          }
+        ),
         /* @__PURE__ */ jsx78("div", { className: cn("ods-switch__track", isOn && "ods-switch__track--on"), "aria-hidden": "true", children: /* @__PURE__ */ jsx78("div", { className: "ods-switch__thumb" }) }),
         label && /* @__PURE__ */ jsx78("span", { className: "ods-switch__label", children: label })
       ]
@@ -12541,6 +12649,7 @@ function Textarea({
           /* @__PURE__ */ jsx83(
             "textarea",
             {
+              ...props,
               ...inputProps,
               ref,
               rows,
@@ -15401,7 +15510,7 @@ function YamlViewer({
 // src/provider/OdsProvider.tsx
 import { generateCssVars, resolveConfig } from "@octaviaflow/config";
 import { createContext as createContext3, useContext as useContext3, useEffect as useEffect21, useMemo as useMemo18 } from "react";
-import { OverlayProvider } from "react-aria";
+import { OverlayProvider as OverlayProvider3 } from "react-aria";
 import { jsx as jsx98 } from "react/jsx-runtime";
 var OdsContext = createContext3(null);
 function OdsProvider({ config: userConfig, children }) {
@@ -15423,7 +15532,7 @@ function OdsProvider({ config: userConfig, children }) {
     }
   }, [resolved]);
   const contextValue = useMemo18(() => ({ config: resolved }), [resolved]);
-  return /* @__PURE__ */ jsx98(OdsContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx98(OverlayProvider, { children }) });
+  return /* @__PURE__ */ jsx98(OdsContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx98(OverlayProvider3, { children }) });
 }
 function useOds() {
   const ctx = useContext3(OdsContext);