@windstream/react-shared-components 0.0.86 → 0.0.87

package/src/components/material-icon/constants.ts

@@ -1,96 +1,97 @@
-//If new icon need to add, Add iconname in iconNameList array and follow instruction in README.md
-export const iconNameList = [
-  "info",
-  "download",
-  "featured_seasonal_and_gifts",
-  "visibility",
-  "paid",
-  "check_box",
-  "check_box_outline_blank",
-  "radio_button_unchecked",
-  "radio_button_checked",
-  "counter_1",
-  "counter_2",
-  "counter_3",
-  "error",
-  "search",
-  "cancel",
-  "router",
-  "broadcast_on_home",
-  "check",
-  "check_circle",
-  "lock",
-  "shield_lock",
-  "phone_in_talk",
-  "call",
-  "chevron_left",
-  "chevron_right",
-  "keyboard_arrow_down",
-  "keyboard_arrow_up",
-  "arrow_back",
-  "arrow_forward",
-  "help",
-  "home_pin",
-  "location_on",
-  "timer",
-  "schedule",
-  "add",
-  "remove",
-  "bolt",
-  "rocket",
-  "cloud_sync",
-  "close",
-  "groups",
-  "speed",
-  "mail",
-  "credit_card",
-  "language",
-  "forum",
-  "contract",
-  "local_atm",
-  "headset_mic",
-  "sensors",
-  "wifi",
-  "settings",
-  "home",
-  "devices",
-  "build",
-  "thumb_up",
-  "desktop_windows",
-  "block",
-  "all_inclusive",
-  "verified_user",
-  "extension",
-  "stadia_controller",
-  "visibility_off",
-  "close_fullscreen",
-  "progress_activity",
-  "travel_explore",
-  "share",
-  "business_center",
-  "upload",
-  "videocam",
-  "expand_circle_right",
-  "add_circle",
-  "do_not_disturb_on",
-  "expand_circle_up",
-  "expand_circle_down",
-  "replay",
-  "fiber_manual_record",
-  "menu",
-  "dangerous",
-  "star",
-] as const;
-
-export const OpticalSizes = ["20dp", "24dp", "40dp", "48dp"] as const;
-export const weights = [
-  "100",
-  "200",
-  "300",
-  "400",
-  "500",
-  "600",
-  "700",
-] as const;
-export const emphasis = [-25, 0, 200] as const;
-export const sizes = [20, 24, 32, 40, 48, 52] as const;
+//If new icon need to add, Add iconname in iconNameList array and follow instruction in README.md
+export const iconNameList = [
+  "info",
+  "download",
+  "featured_seasonal_and_gifts",
+  "visibility",
+  "paid",
+  "check_box",
+  "check_box_outline_blank",
+  "radio_button_unchecked",
+  "radio_button_checked",
+  "counter_1",
+  "counter_2",
+  "counter_3",
+  "error",
+  "search",
+  "cancel",
+  "router",
+  "broadcast_on_home",
+  "check",
+  "check_circle",
+  "lock",
+  "shield_lock",
+  "phone_in_talk",
+  "call",
+  "chevron_left",
+  "chevron_right",
+  "keyboard_arrow_down",
+  "keyboard_arrow_up",
+  "arrow_back",
+  "arrow_forward",
+  "help",
+  "home_pin",
+  "location_on",
+  "timer",
+  "schedule",
+  "add",
+  "remove",
+  "bolt",
+  "rocket",
+  "cloud_sync",
+  "close",
+  "groups",
+  "speed",
+  "mail",
+  "credit_card",
+  "language",
+  "forum",
+  "contract",
+  "local_atm",
+  "headset_mic",
+  "sensors",
+  "wifi",
+  "settings",
+  "home",
+  "devices",
+  "build",
+  "thumb_up",
+  "desktop_windows",
+  "block",
+  "all_inclusive",
+  "verified_user",
+  "extension",
+  "stadia_controller",
+  "visibility_off",
+  "close_fullscreen",
+  "progress_activity",
+  "travel_explore",
+  "share",
+  "business_center",
+  "upload",
+  "videocam",
+  "expand_circle_right",
+  "add_circle",
+  "do_not_disturb_on",
+  "expand_circle_up",
+  "expand_circle_down",
+  "replay",
+  "fiber_manual_record",
+  "menu",
+  "dangerous",
+  "star",
+  "play_arrow",
+] as const;
+
+export const OpticalSizes = ["20dp", "24dp", "40dp", "48dp"] as const;
+export const weights = [
+  "100",
+  "200",
+  "300",
+  "400",
+  "500",
+  "600",
+  "700",
+] as const;
+export const emphasis = [-25, 0, 200] as const;
+export const sizes = [20, 24, 32, 40, 48, 52] as const;

package/src/components/material-icon/index.tsx

@@ -1,44 +1,44 @@
-import React from "react";
-import { cx } from "../../utils";
-import type { IconProps } from "./types";
-
-const MaterialIcon: React.FC<IconProps> = ({
-  name,
-  fill = 0,
-  opticalSize = "48dp",
-  weight = "200",
-  emphasis = 145,
-  size = 24,
-  color = "currentColor",
-  style = {},
-  className,
-  onClick,
-  dataTestId,
-}) => {
-  const fontVariationSettings = `'FILL' ${fill}, 'wght' ${weight}, 'GRAD' ${emphasis}, 'opsz' ${opticalSize.substring(0, 2)}`;
-
-  const combinedStyle: React.CSSProperties = {
-    fontVariationSettings,
-    fontSize: `${size}px`,
-    fontFamily: "'Material Symbols Rounded'",
-    color: color || "currentColor",
-    ...style,
-  };
-
-  return (
-    <span
-      style={combinedStyle}
-      className={cx("material-symbols-rounded", className)}
-      onClick={onClick}
-      data-testid={dataTestId}
-    >
-      {name}
-    </span>
-  );
-};
-
-export { MaterialIcon };
-
-MaterialIcon.displayName = "MaterialIcon";
-
-export type { IconProps, IconName } from "./types";
+import React from "react";
+import { cx } from "../../utils";
+import type { IconProps } from "./types";
+
+const MaterialIcon: React.FC<IconProps> = ({
+  name,
+  fill = 0,
+  opticalSize = "48dp",
+  weight = "200",
+  emphasis = 145,
+  size = 24,
+  color = "currentColor",
+  style = {},
+  className,
+  onClick,
+  dataTestId,
+}) => {
+  const fontVariationSettings = `'FILL' ${fill}, 'wght' ${weight}, 'GRAD' ${emphasis}, 'opsz' ${opticalSize.substring(0, 2)}`;
+
+  const combinedStyle: React.CSSProperties = {
+    fontVariationSettings,
+    fontSize: `${size}px`,
+    fontFamily: "'Material Symbols Rounded'",
+    color: color || "currentColor",
+    ...style,
+  };
+
+  return (
+    <span
+      style={combinedStyle}
+      className={cx("material-symbols-rounded", className)}
+      onClick={onClick}
+      data-testid={dataTestId}
+    >
+      {name}
+    </span>
+  );
+};
+
+export { MaterialIcon };
+
+MaterialIcon.displayName = "MaterialIcon";
+
+export type { IconProps, IconName } from "./types";

package/src/components/material-icon/types.ts

@@ -1,31 +1,31 @@
-import type { CSSProperties } from "react";
-import {
-  emphasis,
-  iconNameList,
-  OpticalSizes,
-  sizes,
-  weights,
-} from "./constants";
-
-export type Fill = 1 | 0;
-
-export type IconName = (typeof iconNameList)[number];
-
-export type OpticalSize = (typeof OpticalSizes)[number];
-export type Weight = (typeof weights)[number];
-export type Emphasis = (typeof emphasis)[number];
-export type Size = (typeof sizes)[number];
-
-export type IconProps = {
-  name: IconName;
-  fill?: Fill;
-  opticalSize?: OpticalSize;
-  weight?: Weight;
-  emphasis?: Emphasis;
-  size?: Size;
-  color?: string;
-  style?: CSSProperties;
-  className?: string;
-  onClick?: () => void;
-  dataTestId?: string;
-};
+import type { CSSProperties } from "react";
+import {
+  emphasis,
+  iconNameList,
+  OpticalSizes,
+  sizes,
+  weights,
+} from "./constants";
+
+export type Fill = 1 | 0;
+
+export type IconName = (typeof iconNameList)[number];
+
+export type OpticalSize = (typeof OpticalSizes)[number];
+export type Weight = (typeof weights)[number];
+export type Emphasis = (typeof emphasis)[number];
+export type Size = (typeof sizes)[number];
+
+export type IconProps = {
+  name: IconName;
+  fill?: Fill;
+  opticalSize?: OpticalSize;
+  weight?: Weight;
+  emphasis?: Emphasis;
+  size?: Size;
+  color?: string;
+  style?: CSSProperties;
+  className?: string;
+  onClick?: () => void;
+  dataTestId?: string;
+};