@react-md/core 1.0.0-next.1 → 1.0.0-next.11

package/src/form/menuItemInputToggleStyles.ts

@@ -0,0 +1,78 @@
+import { cnb } from "cnbuilder";
+import { bem } from "../utils/bem.js";
+
+const styles = bem("rmd-menu-item-input-toggle");
+
+/** @remarks \@since 6.0.0 */
+export interface MenuItemInputToggleClassNameOptions {
+  className?: string;
+  type: "radio" | "checkbox" | "switch";
+}
+
+/**
+ * @remarks \@since 6.0.0
+ */
+export function menuItemInputToggle(
+  options: MenuItemInputToggleClassNameOptions
+): string {
+  const { className, type } = options;
+  return cnb(
+    `rmd-${type}-menu-item`,
+    styles({ switch: type === "switch" }),
+    className
+  );
+}
+
+/**
+ * @remarks \@since 6.0.0
+ */
+export interface MenuItemInputToggleTrackClassNameOptions {
+  className?: string;
+}
+
+/**
+ * @remarks \@since 6.0.0
+ */
+export function menuItemInputToggleTrack(
+  options: MenuItemInputToggleTrackClassNameOptions = {}
+): string {
+  const { className } = options;
+
+  return cnb(styles("track"), className);
+}
+
+/**
+ * @remarks \@since 6.0.0
+ */
+export interface MenuItemInputToggleBallClassNameOptions {
+  className?: string;
+}
+
+/**
+ * @remarks \@since 6.0.0
+ */
+export function menuItemInputToggleBall(
+  options: MenuItemInputToggleBallClassNameOptions = {}
+): string {
+  const { className } = options;
+
+  return cnb(styles("ball"), className);
+}
+
+/**
+ * @remarks \@since 6.0.0
+ */
+export interface MenuItemInputToggleIconClassNameOptions {
+  className?: string;
+}
+
+/**
+ * @remarks \@since 6.0.0
+ */
+export function menuItemInputToggleIcon(
+  options: MenuItemInputToggleIconClassNameOptions = {}
+): string {
+  const { className } = options;
+
+  return cnb(styles("icon"), className);
+}

package/src/form/selectUtils.ts

@@ -53,10 +53,8 @@ function getLabelFromChildren(children: ReactNode): string {
  * @remarks \@since 6.0.0
  */
 interface ExtractedOptions<Value extends string | number> {
-  options: readonly SelectOption<Value>[];
+  options: readonly Value[];
   currentOption: SelectOption<Value> | undefined;
-  searchValues: readonly string[];
-  currentIndex: number;
 }
 
 /**
@@ -68,9 +66,8 @@ export function extractOptionsFromChildren<Value extends string | number>(
   currentValue: Value | undefined
 ): ExtractedOptions<Value> {
   let currentOption: SelectOption<Value> | undefined;
-  let currentIndex = -1;
 
-  const options: SelectOption<Value>[] = [];
+  const options: Value[] = [];
   const searchValues: string[] = [];
   Children.forEach(children, (child) => {
     if (!isValidElement<SelectOption<Value>>(child)) {
@@ -84,11 +81,10 @@ export function extractOptionsFromChildren<Value extends string | number>(
         (!currentOption && typeof currentValue === "undefined")
       ) {
         currentOption = child.props;
-        currentIndex = options.length;
       }
 
       if (!disabled) {
-        options.push(child.props);
+        options.push(child.props.value);
         searchValues.push(getLabelFromChildren(children));
       }
     } else if (children) {
@@ -97,19 +93,12 @@ export function extractOptionsFromChildren<Value extends string | number>(
         ({ currentOption } = result);
       }
 
-      if (result.currentIndex !== -1) {
-        currentIndex = options.length + result.currentIndex;
-      }
-
       options.push(...result.options);
-      searchValues.push(...result.searchValues);
     }
   });
 
   return {
     options,
-    searchValues,
     currentOption,
-    currentIndex,
   };
 }

package/src/form/textAreaStyles.ts

@@ -8,8 +8,8 @@ import { type TextAreaResize } from "./useResizingTextArea.js";
 
 declare module "react" {
   interface CSSProperties {
-    "--rmd-form-textarea-height"?: string | number;
-    "--rmd-form-textarea-padding"?: string | number;
+    "--rmd-textarea-height"?: string | number;
+    "--rmd-textarea-padding"?: string | number;
   }
 }
 

package/src/form/{TextFieldContainerStyles.ts → textFieldContainerStyles.ts}

@@ -5,13 +5,13 @@ import { type FormComponentStates, type FormThemeOptions } from "./types.js";
 
 declare module "react" {
   interface CSSProperties {
-    "--rmd-form-text-height"?: string | number;
-    "--rmd-form-text-padding-left"?: string | number;
-    "--rmd-form-text-padding-right"?: string | number;
-    "--rmd-form-text-padding-top"?: string | number;
-    "--rmd-form-text-border-color"?: string;
-    "--rmd-form-text-hover-border-color"?: string;
-    "--rmd-form-text-filled-color"?: string;
+    "--rmd-text-field-height"?: string | number;
+    "--rmd-text-field-padding-left"?: string | number;
+    "--rmd-text-field-padding-right"?: string | number;
+    "--rmd-text-field-padding-top"?: string | number;
+    "--rmd-text-field-border-color"?: string;
+    "--rmd-text-field-hover-border-color"?: string;
+    "--rmd-text-field-filled-color"?: string;
     "--rmd-form-addon-top"?: string | number;
     "--rmd-form-addon-margin-top"?: string | number;
   }

package/src/form/types.ts

@@ -9,10 +9,8 @@ import { type PropsWithRef } from "../types.js";
 
 declare module "react" {
   interface CSSProperties {
-    "--rmd-form-error-color"?: string;
     "--rmd-form-active-color"?: string;
     "--rmd-form-focus-color"?: string;
-    "--rmd-form-disabled-color"?: string;
   }
 }
 
@@ -92,7 +90,7 @@ export interface FormComponentStates {
  * @see https://html.spec.whatwg.org/multipage/forms.html#autofill
  * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete#values
  */
-export type AutoCompleteValue =
+export type AutocompleteValue =
   | "off"
   | "on"
   | "name"
@@ -151,11 +149,11 @@ export type AutoCompleteValue =
 /**
  * @remarks \@since 6.0.0
  */
-export interface UserAgentAutoCompleteProps {
+export interface UserAgentAutocompleteProps {
   /**
    * Set this to enable additional autocompletion suggestions for a user for
    * different form fields. Using this prop will update the
-   * {@link UserAgentAutoCompleteProps.name} and {@link autoComplete} to default to
+   * {@link UserAgentAutocompleteProps.name} and {@link autoComplete} to default to
    * this value.
    *
    * @example
@@ -184,11 +182,11 @@ export interface UserAgentAutoCompleteProps {
    *
    * @see https://html.spec.whatwg.org/multipage/forms.html#autofill
    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete#values
-   * @see {@link AutoCompleteValue}
+   * @see {@link AutocompleteValue}
    * @see {@link autoComplete}
-   * @see {@link UserAgentAutoCompleteProps.name}
+   * @see {@link UserAgentAutocompleteProps.name}
    */
-  autoCompleteValue?: AutoCompleteValue;
+  autoCompleteValue?: AutocompleteValue;
 
   /**
    * @see {@link autoCompleteValue}