@wavelengthusaf/components 4.2.2 → 4.4.0

package/README.md

@@ -14,6 +14,12 @@ npm install @wavelengthusaf/components
 
 ## Release Notes
 
+### 4.4.0
+
+- 2/24/2026
+- Added disabled attribute to MultiSelectAutocomplete
+
+
 ### 4.1.4
 
 - 12/4/2025

package/dist/cjs/index.cjs

@@ -7725,7 +7725,6 @@ var ChildDataTable2 = ({ columns, data, dropdownArrowLocation, sortIcon, dropdow
     const el = tableRef.current;
     if (!el) return;
     const handleReactDropdown = (event) => {
-      console.log("handling react dropdown");
       const customEvent = event;
       event.stopPropagation();
       const { container, itemId } = customEvent.detail;
@@ -7738,7 +7737,7 @@ var ChildDataTable2 = ({ columns, data, dropdownArrowLocation, sortIcon, dropdow
       if (item && item.dropdown && root) {
         root.render(item.dropdown);
       }
-      const dropdown = container.querySelector("#dropdown");
+      const dropdown = container.querySelector(".dropdown");
       if (dropdown) {
         dropdown.hidden = false;
       }
@@ -7747,7 +7746,7 @@ var ChildDataTable2 = ({ columns, data, dropdownArrowLocation, sortIcon, dropdow
       event.stopPropagation();
       const { container } = event.detail;
       const root = reactDropdownRoots.current.get(container);
-      const dropdown = container.querySelector("#dropdown");
+      const dropdown = container.querySelector(".dropdown");
       if (root && dropdown) {
         dropdown.hidden = true;
       }
@@ -8322,6 +8321,48 @@ WavelengthDatePicker.displayName = "WavelengthDatePicker";
 // src/index.ts
 
 
+// src/components/inputs/WavelengthCheckbox.tsx
+
+
+
+var WavelengthCheckbox = ({
+  size,
+  color: color2,
+  theme,
+  disabled,
+  text,
+  textSize,
+  ...rest
+}) => {
+  const ref = _react.useRef.call(void 0, null);
+  _react.useEffect.call(void 0, () => {
+    const el = ref.current;
+    if (!el) return;
+    if (size !== void 0) {
+      el.setAttribute("size", size);
+    }
+    if (color2 !== void 0) {
+      el.setAttribute("color", color2);
+    }
+    if (theme !== void 0) {
+      el.setAttribute("theme", theme);
+    }
+    if (disabled) {
+      el.setAttribute("disabled", "");
+    } else {
+      el.removeAttribute("disabled");
+    }
+    if (text !== void 0) {
+      el.setAttribute("text", text);
+    }
+    if (textSize !== void 0) {
+      el.setAttribute("text-size", textSize);
+    }
+  }, [size, color2, theme, disabled, text, textSize]);
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "wavelength-checkbox", { ref, ...rest });
+};
+WavelengthCheckbox.displayName = "WavelengthCheckbox";
+
 // src/components/samples/SampleComponent.tsx
 
 
@@ -8387,7 +8428,7 @@ var WavelengthNotificationPanel = ({
 // src/components/MultiSelect/WavelengthMultiSelectAutocomplete.tsx
 
 
-var WavelengthMultiSelectAutocomplete = ({ options, placeholder = "Select Options", label, name, style: style3, onChange, value, ...rest }) => {
+var WavelengthMultiSelectAutocomplete = ({ options, placeholder = "Select Options", label, name, style: style3, onChange, value, disabled, ...rest }) => {
   const componentRef = _react.useRef.call(void 0, null);
   _react.useEffect.call(void 0, () => {
     const component = componentRef.current;
@@ -8408,6 +8449,7 @@ var WavelengthMultiSelectAutocomplete = ({ options, placeholder = "Select Option
     if (placeholder) component.setAttribute("placeholder", placeholder);
     if (label) component.setAttribute("label", label);
     if (name) component.setAttribute("name", name);
+    if (disabled) component.setAttribute("disabled", disabled ? "true" : "false");
     if (options) component.autocompleteOptions = options;
     if (style3) component.customStyles = style3;
   }, [options, placeholder, name, label, style3]);
@@ -8493,7 +8535,8 @@ var WavelengthMultiSelectAutocomplete = ({ options, placeholder = "Select Option
 
 
 
-exports.ButtonIcon = ButtonIcon; exports.ButtonMenu = ButtonMenu; exports.ChildDataTable = ChildDataTable2; exports.ChildDataTableElement = _webcomponents.ChildDataTable; exports.DefaultCarousel = DefaultCarousel; exports.NestedDataTable = NestedDataTable; exports.SampleComponent = SampleComponent; exports.SampleComponentElement = _webcomponents.SampleComponent; exports.SliderCardCarousel = SliderCardCarousel; exports.WavelengthAccessAlert = WavelengthAccessAlert; exports.WavelengthAlert = WavelengthAlert; exports.WavelengthAppLogo = WavelengthAppLogo; exports.WavelengthAppTheme = WavelengthAppTheme; exports.WavelengthAutoComplete = WavelengthAutoComplete; exports.WavelengthAutocomplete = WavelengthAutocomplete; exports.WavelengthBanner = WavelengthBanner; exports.WavelengthBannerElement = _webcomponents.WavelengthBanner; exports.WavelengthBox = WavelengthBox; exports.WavelengthButton = WavelengthButton; exports.WavelengthButtonElement = _webcomponents.WavelengthButton; exports.WavelengthCommentDisplay = WavelengthCommentDisplay; exports.WavelengthConfirmationModal = WavelengthConfirmationModal; exports.WavelengthContentModal = WavelengthContentModal; exports.WavelengthContentPlaceholder = WavelengthContentPlaceholder; exports.WavelengthDataTable = WavelengthDataTable; exports.WavelengthDatePicker = WavelengthDatePicker; exports.WavelengthDatePickerElement = _webcomponents.WavelengthDatePicker; exports.WavelengthDefaultIcon = WavelengthDefaultIcon; exports.WavelengthDefaultPagination = WavelengthDefaultPagination; exports.WavelengthDragAndDrop = WavelengthDragAndDrop; exports.WavelengthDropdown = WavelengthDropdown; exports.WavelengthDropdownButton = WavelengthDropdownButton; exports.WavelengthExampleComponent = WavelengthExampleComponent; exports.WavelengthFileDownloader = WavelengthFileDownloader; exports.WavelengthFileDropZone = WavelengthFileDropZone; exports.WavelengthFooter = WavelengthFooter; exports.WavelengthForm = WavelengthForm; exports.WavelengthFormElement = _webcomponents.WavelengthForm; exports.WavelengthInput = WavelengthInput; exports.WavelengthInputElement = _webcomponents.WavelengthInput; exports.WavelengthManyPlanes = WavelengthManyPlanes; exports.WavelengthMultiSelectAutocomplete = WavelengthMultiSelectAutocomplete; exports.WavelengthMultiSelectAutocompleteElement = _webcomponents.WavelengthMultiSelectAutocomplete; exports.WavelengthNavBar = WavelengthNavBar; exports.WavelengthNotAvailablePage = WavelengthNotAvailablePage; exports.WavelengthNotificationPanel = WavelengthNotificationPanel; exports.WavelengthPermissionAlert = WavelengthPermissionAlert; exports.WavelengthPlaneTrail = WavelengthPlaneTrail; exports.WavelengthPopUpMenu = WavelengthPopUpMenu; exports.WavelengthProgressBar = WavelengthProgressBar; exports.WavelengthProgressBarElement = _webcomponents.WavelengthProgressBar; exports.WavelengthSearch = WavelengthSearch; exports.WavelengthSearchTextField = WavelengthSearchTextField; exports.WavelengthSideBar = WavelengthSideBar; exports.WavelengthSlider = WavelengthSlider; exports.WavelengthSnackbar = WavelengthSnackbar; exports.WavelengthSpinningLogo = WavelengthSpinningLogo; exports.WavelengthSpinningOuterCircle = WavelengthSpinningOuterCircle; exports.WavelengthStandardSnackbar = WavelengthStandardSnackbar; exports.WavelengthStyledButton = WavelengthStyledButton; exports.WavelengthTestSnackbar = WavelengthTestSnackbar; exports.WavelengthTitleBar = WavelengthTitleBar; exports.WavelengthTitleBarElement = _webcomponents.WavelengthTitleBar; exports.add = add; exports.ascendingRange = ascendingRange; exports.concat = concat; exports.findBestStringMatch = findBestStringMatch; exports.range = range; exports.useOutsideClick = useOutsideClick; exports.useThemeContext = useThemeContext;
+
+exports.ButtonIcon = ButtonIcon; exports.ButtonMenu = ButtonMenu; exports.ChildDataTable = ChildDataTable2; exports.ChildDataTableElement = _webcomponents.ChildDataTable; exports.DefaultCarousel = DefaultCarousel; exports.NestedDataTable = NestedDataTable; exports.SampleComponent = SampleComponent; exports.SampleComponentElement = _webcomponents.SampleComponent; exports.SliderCardCarousel = SliderCardCarousel; exports.WavelengthAccessAlert = WavelengthAccessAlert; exports.WavelengthAlert = WavelengthAlert; exports.WavelengthAppLogo = WavelengthAppLogo; exports.WavelengthAppTheme = WavelengthAppTheme; exports.WavelengthAutoComplete = WavelengthAutoComplete; exports.WavelengthAutocomplete = WavelengthAutocomplete; exports.WavelengthBanner = WavelengthBanner; exports.WavelengthBannerElement = _webcomponents.WavelengthBanner; exports.WavelengthBox = WavelengthBox; exports.WavelengthButton = WavelengthButton; exports.WavelengthButtonElement = _webcomponents.WavelengthButton; exports.WavelengthCheckbox = WavelengthCheckbox; exports.WavelengthCommentDisplay = WavelengthCommentDisplay; exports.WavelengthConfirmationModal = WavelengthConfirmationModal; exports.WavelengthContentModal = WavelengthContentModal; exports.WavelengthContentPlaceholder = WavelengthContentPlaceholder; exports.WavelengthDataTable = WavelengthDataTable; exports.WavelengthDatePicker = WavelengthDatePicker; exports.WavelengthDatePickerElement = _webcomponents.WavelengthDatePicker; exports.WavelengthDefaultIcon = WavelengthDefaultIcon; exports.WavelengthDefaultPagination = WavelengthDefaultPagination; exports.WavelengthDragAndDrop = WavelengthDragAndDrop; exports.WavelengthDropdown = WavelengthDropdown; exports.WavelengthDropdownButton = WavelengthDropdownButton; exports.WavelengthExampleComponent = WavelengthExampleComponent; exports.WavelengthFileDownloader = WavelengthFileDownloader; exports.WavelengthFileDropZone = WavelengthFileDropZone; exports.WavelengthFooter = WavelengthFooter; exports.WavelengthForm = WavelengthForm; exports.WavelengthFormElement = _webcomponents.WavelengthForm; exports.WavelengthInput = WavelengthInput; exports.WavelengthInputElement = _webcomponents.WavelengthInput; exports.WavelengthManyPlanes = WavelengthManyPlanes; exports.WavelengthMultiSelectAutocomplete = WavelengthMultiSelectAutocomplete; exports.WavelengthMultiSelectAutocompleteElement = _webcomponents.WavelengthMultiSelectAutocomplete; exports.WavelengthNavBar = WavelengthNavBar; exports.WavelengthNotAvailablePage = WavelengthNotAvailablePage; exports.WavelengthNotificationPanel = WavelengthNotificationPanel; exports.WavelengthPermissionAlert = WavelengthPermissionAlert; exports.WavelengthPlaneTrail = WavelengthPlaneTrail; exports.WavelengthPopUpMenu = WavelengthPopUpMenu; exports.WavelengthProgressBar = WavelengthProgressBar; exports.WavelengthProgressBarElement = _webcomponents.WavelengthProgressBar; exports.WavelengthSearch = WavelengthSearch; exports.WavelengthSearchTextField = WavelengthSearchTextField; exports.WavelengthSideBar = WavelengthSideBar; exports.WavelengthSlider = WavelengthSlider; exports.WavelengthSnackbar = WavelengthSnackbar; exports.WavelengthSpinningLogo = WavelengthSpinningLogo; exports.WavelengthSpinningOuterCircle = WavelengthSpinningOuterCircle; exports.WavelengthStandardSnackbar = WavelengthStandardSnackbar; exports.WavelengthStyledButton = WavelengthStyledButton; exports.WavelengthTestSnackbar = WavelengthTestSnackbar; exports.WavelengthTitleBar = WavelengthTitleBar; exports.WavelengthTitleBarElement = _webcomponents.WavelengthTitleBar; exports.add = add; exports.ascendingRange = ascendingRange; exports.concat = concat; exports.findBestStringMatch = findBestStringMatch; exports.range = range; exports.useOutsideClick = useOutsideClick; exports.useThemeContext = useThemeContext;
 /*! Bundled license information:
 
 react-is/cjs/react-is.production.min.js:

package/dist/cjs/index.d.cts

@@ -957,6 +957,16 @@ declare const WavelengthDatePicker: {
     displayName: string;
 };
 
+interface WavelengthCheckboxProps extends React__default.HTMLAttributes<HTMLElement> {
+    size?: string;
+    color?: string;
+    theme?: string;
+    disabled?: boolean;
+    text?: string;
+    textSize?: string;
+}
+declare const WavelengthCheckbox: React__default.FC<WavelengthCheckboxProps>;
+
 interface SampleComponentProps extends React__default.HTMLAttributes<HTMLElement> {
     testProp?: string;
     customStyle: StyleProp;
@@ -1007,7 +1017,8 @@ interface MultiSelectAutocompleteProps {
     style?: CustomStyleProp;
     onChange?: (selectedOptions: Option[]) => void;
     value?: Option[];
+    disabled?: boolean;
 }
 declare const WavelengthMultiSelectAutocomplete: React__default.FC<MultiSelectAutocompleteProps>;
 
-export { ButtonIcon, ButtonMenu, ChildDataTable, DefaultCarousel, type IFileSelectedEventDetail, type NavItem, NestedDataTable, SampleComponent, type SearchProps, type SearchResult, SliderCardCarousel, type StyledButtonPropsTwo, type ThemeProperties, WavelengthAccessAlert, WavelengthAlert, WavelengthAppLogo, WavelengthAppTheme, WavelengthAutoComplete, WavelengthAutocomplete, WavelengthBanner, WavelengthBox, WavelengthButton, WavelengthCommentDisplay, WavelengthConfirmationModal, WavelengthContentModal, WavelengthContentPlaceholder, WavelengthDataTable, WavelengthDatePicker, WavelengthDefaultIcon, WavelengthDefaultPagination, WavelengthDragAndDrop, WavelengthDropdown, WavelengthDropdownButton, WavelengthExampleComponent, WavelengthFileDownloader, WavelengthFileDropZone, type WavelengthFileDropZoneProps, WavelengthFooter, WavelengthForm, WavelengthInput, WavelengthManyPlanes, WavelengthMultiSelectAutocomplete, WavelengthNavBar, type WavelengthNavBarProps, WavelengthNotAvailablePage, WavelengthNotificationPanel, WavelengthPermissionAlert, WavelengthPlaneTrail, WavelengthPopUpMenu, WavelengthProgressBar, WavelengthSearch, WavelengthSearchTextField, WavelengthSideBar, WavelengthSlider, WavelengthSnackbar, WavelengthSpinningLogo, WavelengthSpinningOuterCircle, WavelengthStandardSnackbar, WavelengthStyledButton, WavelengthTestSnackbar, WavelengthTitleBar, add, ascendingRange, concat, findBestStringMatch, type menuItemProps, range, useOutsideClick, useThemeContext };
+export { ButtonIcon, ButtonMenu, ChildDataTable, DefaultCarousel, type IFileSelectedEventDetail, type NavItem, NestedDataTable, SampleComponent, type SearchProps, type SearchResult, SliderCardCarousel, type StyledButtonPropsTwo, type ThemeProperties, WavelengthAccessAlert, WavelengthAlert, WavelengthAppLogo, WavelengthAppTheme, WavelengthAutoComplete, WavelengthAutocomplete, WavelengthBanner, WavelengthBox, WavelengthButton, WavelengthCheckbox, WavelengthCommentDisplay, WavelengthConfirmationModal, WavelengthContentModal, WavelengthContentPlaceholder, WavelengthDataTable, WavelengthDatePicker, WavelengthDefaultIcon, WavelengthDefaultPagination, WavelengthDragAndDrop, WavelengthDropdown, WavelengthDropdownButton, WavelengthExampleComponent, WavelengthFileDownloader, WavelengthFileDropZone, type WavelengthFileDropZoneProps, WavelengthFooter, WavelengthForm, WavelengthInput, WavelengthManyPlanes, WavelengthMultiSelectAutocomplete, WavelengthNavBar, type WavelengthNavBarProps, WavelengthNotAvailablePage, WavelengthNotificationPanel, WavelengthPermissionAlert, WavelengthPlaneTrail, WavelengthPopUpMenu, WavelengthProgressBar, WavelengthSearch, WavelengthSearchTextField, WavelengthSideBar, WavelengthSlider, WavelengthSnackbar, WavelengthSpinningLogo, WavelengthSpinningOuterCircle, WavelengthStandardSnackbar, WavelengthStyledButton, WavelengthTestSnackbar, WavelengthTitleBar, add, ascendingRange, concat, findBestStringMatch, type menuItemProps, range, useOutsideClick, useThemeContext };

package/dist/esm/index.d.ts

@@ -957,6 +957,16 @@ declare const WavelengthDatePicker: {
     displayName: string;
 };
 
+interface WavelengthCheckboxProps extends React__default.HTMLAttributes<HTMLElement> {
+    size?: string;
+    color?: string;
+    theme?: string;
+    disabled?: boolean;
+    text?: string;
+    textSize?: string;
+}
+declare const WavelengthCheckbox: React__default.FC<WavelengthCheckboxProps>;
+
 interface SampleComponentProps extends React__default.HTMLAttributes<HTMLElement> {
     testProp?: string;
     customStyle: StyleProp;
@@ -1007,7 +1017,8 @@ interface MultiSelectAutocompleteProps {
     style?: CustomStyleProp;
     onChange?: (selectedOptions: Option[]) => void;
     value?: Option[];
+    disabled?: boolean;
 }
 declare const WavelengthMultiSelectAutocomplete: React__default.FC<MultiSelectAutocompleteProps>;
 
-export { ButtonIcon, ButtonMenu, ChildDataTable, DefaultCarousel, type IFileSelectedEventDetail, type NavItem, NestedDataTable, SampleComponent, type SearchProps, type SearchResult, SliderCardCarousel, type StyledButtonPropsTwo, type ThemeProperties, WavelengthAccessAlert, WavelengthAlert, WavelengthAppLogo, WavelengthAppTheme, WavelengthAutoComplete, WavelengthAutocomplete, WavelengthBanner, WavelengthBox, WavelengthButton, WavelengthCommentDisplay, WavelengthConfirmationModal, WavelengthContentModal, WavelengthContentPlaceholder, WavelengthDataTable, WavelengthDatePicker, WavelengthDefaultIcon, WavelengthDefaultPagination, WavelengthDragAndDrop, WavelengthDropdown, WavelengthDropdownButton, WavelengthExampleComponent, WavelengthFileDownloader, WavelengthFileDropZone, type WavelengthFileDropZoneProps, WavelengthFooter, WavelengthForm, WavelengthInput, WavelengthManyPlanes, WavelengthMultiSelectAutocomplete, WavelengthNavBar, type WavelengthNavBarProps, WavelengthNotAvailablePage, WavelengthNotificationPanel, WavelengthPermissionAlert, WavelengthPlaneTrail, WavelengthPopUpMenu, WavelengthProgressBar, WavelengthSearch, WavelengthSearchTextField, WavelengthSideBar, WavelengthSlider, WavelengthSnackbar, WavelengthSpinningLogo, WavelengthSpinningOuterCircle, WavelengthStandardSnackbar, WavelengthStyledButton, WavelengthTestSnackbar, WavelengthTitleBar, add, ascendingRange, concat, findBestStringMatch, type menuItemProps, range, useOutsideClick, useThemeContext };
+export { ButtonIcon, ButtonMenu, ChildDataTable, DefaultCarousel, type IFileSelectedEventDetail, type NavItem, NestedDataTable, SampleComponent, type SearchProps, type SearchResult, SliderCardCarousel, type StyledButtonPropsTwo, type ThemeProperties, WavelengthAccessAlert, WavelengthAlert, WavelengthAppLogo, WavelengthAppTheme, WavelengthAutoComplete, WavelengthAutocomplete, WavelengthBanner, WavelengthBox, WavelengthButton, WavelengthCheckbox, WavelengthCommentDisplay, WavelengthConfirmationModal, WavelengthContentModal, WavelengthContentPlaceholder, WavelengthDataTable, WavelengthDatePicker, WavelengthDefaultIcon, WavelengthDefaultPagination, WavelengthDragAndDrop, WavelengthDropdown, WavelengthDropdownButton, WavelengthExampleComponent, WavelengthFileDownloader, WavelengthFileDropZone, type WavelengthFileDropZoneProps, WavelengthFooter, WavelengthForm, WavelengthInput, WavelengthManyPlanes, WavelengthMultiSelectAutocomplete, WavelengthNavBar, type WavelengthNavBarProps, WavelengthNotAvailablePage, WavelengthNotificationPanel, WavelengthPermissionAlert, WavelengthPlaneTrail, WavelengthPopUpMenu, WavelengthProgressBar, WavelengthSearch, WavelengthSearchTextField, WavelengthSideBar, WavelengthSlider, WavelengthSnackbar, WavelengthSpinningLogo, WavelengthSpinningOuterCircle, WavelengthStandardSnackbar, WavelengthStyledButton, WavelengthTestSnackbar, WavelengthTitleBar, add, ascendingRange, concat, findBestStringMatch, type menuItemProps, range, useOutsideClick, useThemeContext };

package/dist/esm/index.js

@@ -7725,7 +7725,6 @@ var ChildDataTable2 = ({ columns, data, dropdownArrowLocation, sortIcon, dropdow
     const el = tableRef.current;
     if (!el) return;
     const handleReactDropdown = (event) => {
-      console.log("handling react dropdown");
       const customEvent = event;
       event.stopPropagation();
       const { container, itemId } = customEvent.detail;
@@ -7738,7 +7737,7 @@ var ChildDataTable2 = ({ columns, data, dropdownArrowLocation, sortIcon, dropdow
       if (item && item.dropdown && root) {
         root.render(item.dropdown);
       }
-      const dropdown = container.querySelector("#dropdown");
+      const dropdown = container.querySelector(".dropdown");
       if (dropdown) {
         dropdown.hidden = false;
       }
@@ -7747,7 +7746,7 @@ var ChildDataTable2 = ({ columns, data, dropdownArrowLocation, sortIcon, dropdow
       event.stopPropagation();
       const { container } = event.detail;
       const root = reactDropdownRoots.current.get(container);
-      const dropdown = container.querySelector("#dropdown");
+      const dropdown = container.querySelector(".dropdown");
       if (root && dropdown) {
         dropdown.hidden = true;
       }
@@ -8322,9 +8321,51 @@ WavelengthDatePicker.displayName = "WavelengthDatePicker";
 // src/index.ts
 import { WavelengthDatePicker as WavelengthDatePicker2 } from "@wavelengthusaf/web-components";
 
-// src/components/samples/SampleComponent.tsx
+// src/components/inputs/WavelengthCheckbox.tsx
 import { useRef as useRef15, useEffect as useEffect16 } from "react";
+import "@wavelengthusaf/web-components";
 import { jsx as jsx50 } from "react/jsx-runtime";
+var WavelengthCheckbox = ({
+  size,
+  color: color2,
+  theme,
+  disabled,
+  text,
+  textSize,
+  ...rest
+}) => {
+  const ref = useRef15(null);
+  useEffect16(() => {
+    const el = ref.current;
+    if (!el) return;
+    if (size !== void 0) {
+      el.setAttribute("size", size);
+    }
+    if (color2 !== void 0) {
+      el.setAttribute("color", color2);
+    }
+    if (theme !== void 0) {
+      el.setAttribute("theme", theme);
+    }
+    if (disabled) {
+      el.setAttribute("disabled", "");
+    } else {
+      el.removeAttribute("disabled");
+    }
+    if (text !== void 0) {
+      el.setAttribute("text", text);
+    }
+    if (textSize !== void 0) {
+      el.setAttribute("text-size", textSize);
+    }
+  }, [size, color2, theme, disabled, text, textSize]);
+  return /* @__PURE__ */ jsx50("wavelength-checkbox", { ref, ...rest });
+};
+WavelengthCheckbox.displayName = "WavelengthCheckbox";
+
+// src/components/samples/SampleComponent.tsx
+import { useRef as useRef16, useEffect as useEffect17 } from "react";
+import { jsx as jsx51 } from "react/jsx-runtime";
 var SampleComponent = ({
   testProp,
   children,
@@ -8333,8 +8374,8 @@ var SampleComponent = ({
   ...rest
   // This rest operator includes className, style, onClick, etc.
 }) => {
-  const ref = useRef15(null);
-  useEffect16(() => {
+  const ref = useRef16(null);
+  useEffect17(() => {
     const el = ref.current;
     if (!el) return;
     el.customStyles = customStyle2;
@@ -8342,14 +8383,14 @@ var SampleComponent = ({
       el.setAttribute("test-prop", testProp);
     }
   }, [testProp]);
-  return /* @__PURE__ */ jsx50("sample-component", { ref, ...rest, children });
+  return /* @__PURE__ */ jsx51("sample-component", { ref, ...rest, children });
 };
 SampleComponent.displayName = "SampleComponent";
 
 // src/components/NotificationPanel/WavelengthNotificationPanel.tsx
-import { useRef as useRef16, useEffect as useEffect17 } from "react";
+import { useRef as useRef17, useEffect as useEffect18 } from "react";
 import "@wavelengthusaf/web-components";
-import { jsx as jsx51 } from "react/jsx-runtime";
+import { jsx as jsx52 } from "react/jsx-runtime";
 var WavelengthNotificationPanel = ({
   notifications,
   darkMode,
@@ -8358,8 +8399,8 @@ var WavelengthNotificationPanel = ({
   ...rest
   // This rest operator includes className, style, onClick, etc.
 }) => {
-  const ref = useRef16(null);
-  useEffect17(() => {
+  const ref = useRef17(null);
+  useEffect18(() => {
     const el = ref.current;
     if (!el) return;
     if (notifications !== void 0) {
@@ -8378,18 +8419,18 @@ var WavelengthNotificationPanel = ({
       el.accountLink = accountLink;
     }
   }, [notifications, darkMode, rest.onMarkAsRead, rest.onSignOut, accountLink]);
-  return /* @__PURE__ */ jsx51("wavelength-notification-panel", { ref, ...rest, children });
+  return /* @__PURE__ */ jsx52("wavelength-notification-panel", { ref, ...rest, children });
 };
 
 // src/index.ts
 import { SampleComponent as SampleComponent2 } from "@wavelengthusaf/web-components";
 
 // src/components/MultiSelect/WavelengthMultiSelectAutocomplete.tsx
-import { useEffect as useEffect18, useRef as useRef17 } from "react";
-import { jsx as jsx52 } from "react/jsx-runtime";
-var WavelengthMultiSelectAutocomplete = ({ options, placeholder = "Select Options", label, name, style: style3, onChange, value, ...rest }) => {
-  const componentRef = useRef17(null);
-  useEffect18(() => {
+import { useEffect as useEffect19, useRef as useRef18 } from "react";
+import { jsx as jsx53 } from "react/jsx-runtime";
+var WavelengthMultiSelectAutocomplete = ({ options, placeholder = "Select Options", label, name, style: style3, onChange, value, disabled, ...rest }) => {
+  const componentRef = useRef18(null);
+  useEffect19(() => {
     const component = componentRef.current;
     if (!component) return;
     const handleValueChange = (event) => {
@@ -8402,22 +8443,23 @@ var WavelengthMultiSelectAutocomplete = ({ options, placeholder = "Select Option
       component.removeEventListener("change", handleValueChange);
     };
   }, [onChange]);
-  useEffect18(() => {
+  useEffect19(() => {
     const component = componentRef.current;
     if (!component) return;
     if (placeholder) component.setAttribute("placeholder", placeholder);
     if (label) component.setAttribute("label", label);
     if (name) component.setAttribute("name", name);
+    if (disabled) component.setAttribute("disabled", disabled ? "true" : "false");
     if (options) component.autocompleteOptions = options;
     if (style3) component.customStyles = style3;
   }, [options, placeholder, name, label, style3]);
-  useEffect18(() => {
+  useEffect19(() => {
     const component = componentRef.current;
     if (component && value) {
       component.value = value;
     }
   }, [value]);
-  return /* @__PURE__ */ jsx52("wavelength-multi-select-autocomplete", { ref: componentRef, ...rest });
+  return /* @__PURE__ */ jsx53("wavelength-multi-select-autocomplete", { ref: componentRef, ...rest });
 };
 
 // src/index.ts
@@ -8443,6 +8485,7 @@ export {
   WavelengthBox,
   WavelengthButton,
   WavelengthButton2 as WavelengthButtonElement,
+  WavelengthCheckbox,
   WavelengthCommentDisplay,
   WavelengthConfirmationModal,
   WavelengthContentModal,

package/package.json

@@ -2,7 +2,7 @@
   "name": "@wavelengthusaf/components",
   "author": "563 EWS - Wavelength",
   "license": "MIT",
-  "version": "4.2.2",
+  "version": "4.4.0",
   "description": "Common component library used by Wavelength developers",
   "main": "/dist/cjs/index.cjs",
   "module": "/dist/esm/index.js",
@@ -71,7 +71,7 @@
     "@emotion/styled": "^11.11.0",
     "@mui/icons-material": "^5.16.5",
     "@mui/material": "^5.15.7",
-    "@wavelengthusaf/web-components": "^1.4.1",
+    "@wavelengthusaf/web-components": "^1.6.0",
     "react": "^18.2.0",
     "react-router-dom": "^6.26.2",
     "styled-components": "^6.1.12",