@kaizen/components 1.67.10 → 1.67.12

package/codemods/upgradeIconV1/upgradeIconV1.spec.ts

@@ -1,20 +1,19 @@
 import { parseJsx } from "../__tests__/utils"
 import {
-  transformSource,
   printAst,
-  TransformConfig,
-  ImportModuleNameTagsMap,
+  type ImportModuleNameTagsMap,
+  transformSource,
+  type TransformSourceArgs,
 } from "../utils"
 import { upgradeIconV1 } from "./upgradeIconV1"
 
 const transformIcons = (
-  sourceFile: TransformConfig["sourceFile"],
+  sourceFile: TransformSourceArgs["sourceFile"],
   tagNames: ImportModuleNameTagsMap
 ): string =>
   transformSource({
     sourceFile,
-    astTransformer: upgradeIconV1,
-    tagName: tagNames,
+    transformers: [upgradeIconV1(tagNames)],
   })
 
 describe("upgradeIconV1()", () => {

package/codemods/upgradeIconV1/upgradeIconV1.ts

@@ -1,9 +1,9 @@
 import ts from "typescript"
 import {
   setImportToRemove,
-  ImportModuleNameTagsMap,
+  type ImportModuleNameTagsMap,
   updateKaioImports,
-  UpdateKaioImportsArgs,
+  type UpdateKaioImportsArgs,
   setImportToAdd,
 } from "../utils"
 import { getNewIconPropsFromOldIconName } from "./getNewIconPropsFromOldIconName"
@@ -20,8 +20,9 @@ const reverseStringMap = <Key extends string, Value extends string>(
 }
 
 export const upgradeIconV1 =
-  (context: ts.TransformationContext, tagNames: ImportModuleNameTagsMap) =>
-  (rootNode: ts.Node): ts.Node => {
+  (tagNames: ImportModuleNameTagsMap): ts.TransformerFactory<ts.SourceFile> =>
+  context =>
+  rootNode => {
     const oldImportSource = "@kaizen/components"
 
     const kaioTagNames = tagNames.get(oldImportSource)
@@ -85,10 +86,11 @@ export const upgradeIconV1 =
       }
       return ts.visitEachChild(node, visit, context)
     }
+
     const node = ts.visitNode(rootNode, visit)
 
     return updateKaioImports({
       importsToRemove: importsToRemove.size > 0 ? importsToRemove : undefined,
       importsToAdd: importsToAdd.size > 0 ? importsToAdd : undefined,
-    })(context)(node)
+    })(context)(node as ts.SourceFile)
   }

package/codemods/utils/__fixtures__/KaioComponent.tsx

@@ -1,6 +1,5 @@
-import * as React from "react"
+import React from "react"
 // @ts-ignore
 import { Pancakes } from "@kaizen/components"
-/* eslint-disable react/jsx-curly-brace-presence */
+
 export const KaioComponent = (): JSX.Element => <Pancakes topping="butter" />
-/* eslint-enable react/jsx-curly-brace-presence */

package/codemods/utils/__snapshots__/emptyLineEncoder.spec.ts.snap

@@ -0,0 +1,19 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`decodeEmptyLines() > replaces default line marker with empty line 1`] = `
+"import React from "react"
+// @ts-ignore
+import { Pancakes } from "@kaizen/components"
+
+export const KaioComponent = (): JSX.Element => <Pancakes topping="butter" />
+"
+`;
+
+exports[`encodeEmptyLines() > replaces empty lines with default line marker 1`] = `
+"import React from "react"
+// @ts-ignore
+import { Pancakes } from "@kaizen/components"
+/*!--empty-line--!*/
+export const KaioComponent = (): JSX.Element => <Pancakes topping="butter" />
+/*!--empty-line--!*/"
+`;

package/codemods/utils/__snapshots__/transformSource.spec.ts.snap

@@ -1,11 +1,21 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`transformSource > updates the value of Pancakes topping to jam 1`] = `
-"import * as React from "react";
+exports[`transformSource() > updates the value of Pancakes topping to jam 1`] = `
+"import React from "react";
 // @ts-ignore
 import { Pancakes } from "@kaizen/components";
-/* eslint-disable react/jsx-curly-brace-presence */
+
+export const KaioComponent = (): JSX.Element => <Pancakes topping="jam"/>;
+ 
+"
+`;
+
+exports[`transformSourceForTagName > updates the value of Pancakes topping to jam 1`] = `
+"import React from "react";
+// @ts-ignore
+import { Pancakes } from "@kaizen/components";
+
 export const KaioComponent = (): JSX.Element => <Pancakes topping="jam"/>;
-/* eslint-enable react/jsx-curly-brace-presence */
+ 
 "
 `;

package/codemods/utils/createEncodedSourceFile.ts

@@ -0,0 +1,15 @@
+import ts from "typescript"
+import { encodeEmptyLines } from "./emptyLineEncoder"
+
+export const createEncodedSourceFile = (
+  filePath: string,
+  sourceCode: string
+): ts.SourceFile => {
+  const encodedSource = encodeEmptyLines(sourceCode)
+  return ts.createSourceFile(
+    filePath,
+    encodedSource,
+    ts.ScriptTarget.Latest,
+    true
+  )
+}

package/codemods/utils/createProp.spec.ts

@@ -2,12 +2,11 @@ import ts from "typescript"
 import { parseJsx } from "../__tests__/utils/parseJsx"
 import { createStyleProp } from "./createProp"
 import { printAst } from "./printAst"
-import { TransformConfig, transformSource } from "./transformSource"
+import { TransformSourceArgs, transformSource } from "./transformSource"
 import { updateJsxElementWithNewProps } from "./updateJsxElementWithNewProps"
 
-export const mockedTransformer =
-  (context: ts.TransformationContext) =>
-  (rootNode: ts.Node): ts.Node => {
+export const mockedTransformer: ts.TransformerFactory<ts.SourceFile> =
+  context => rootNode => {
     const visit = (node: ts.Node): ts.Node => {
       if (ts.isJsxOpeningElement(node) || ts.isJsxSelfClosingElement(node)) {
         if (node.tagName.getText() === "Pancakes") {
@@ -32,16 +31,15 @@ export const mockedTransformer =
       }
       return ts.visitEachChild(node, visit, context)
     }
-    return ts.visitNode(rootNode, visit)
+    return ts.visitNode(rootNode, visit) as ts.SourceFile
   }
 
 const testCreateStyleProp = (
-  sourceFile: TransformConfig["sourceFile"]
+  sourceFile: TransformSourceArgs["sourceFile"]
 ): string =>
   transformSource({
     sourceFile,
-    astTransformer: mockedTransformer,
-    tagName: "Pancakes",
+    transformers: [mockedTransformer],
   })
 
 describe("createStyleProp()", () => {

package/codemods/utils/emptyLineEncoder.spec.ts

@@ -0,0 +1,25 @@
+import fs from "fs"
+import path from "path"
+import { decodeEmptyLines, encodeEmptyLines } from "./emptyLineEncoder"
+
+describe("encodeEmptyLines()", () => {
+  it("replaces empty lines with default line marker", () => {
+    const filePath = path.resolve(
+      path.join(__dirname, "./__fixtures__/KaioComponent.tsx")
+    )
+    const fileContent = fs.readFileSync(filePath, "utf8")
+    const output = encodeEmptyLines(fileContent)
+    expect(output).toMatchSnapshot()
+  })
+})
+
+describe("decodeEmptyLines()", () => {
+  it("replaces default line marker with empty line", () => {
+    const filePath = path.resolve(
+      path.join(__dirname, "./__fixtures__/KaioComponent.tsx")
+    )
+    const fileContent = fs.readFileSync(filePath, "utf8")
+    const output = decodeEmptyLines(fileContent)
+    expect(output).toMatchSnapshot()
+  })
+})

package/codemods/utils/emptyLineEncoder.ts

@@ -0,0 +1,18 @@
+// Fork of https://github.com/Serj-Tm/ts-empty-line-encoder/blob/master/encoder.ts
+const DEFAULT_EMPTY_LINE_MARKER: string = "!--empty-line--!"
+const DEFAULT_NEW_LINE: string = "\n"
+
+const toComment = (marker: string): string => `/*${marker}*/`
+
+export const encodeEmptyLines = (text: string): string => {
+  const marker = toComment(DEFAULT_EMPTY_LINE_MARKER)
+  const lines = text.split(/\r?\n/)
+  const commentedLines = lines.map(line => (line.trim() == "" ? marker : line))
+  return commentedLines.join(DEFAULT_NEW_LINE)
+}
+
+export const decodeEmptyLines = (text: string): string => {
+  const markerRegex = toComment(DEFAULT_EMPTY_LINE_MARKER).replace(/\*/g, "\\*")
+  const decoded = text.replace(new RegExp(markerRegex, "gi"), "")
+  return decoded
+}

package/codemods/utils/migrateStringProp.spec.ts

@@ -1,5 +1,9 @@
 import { parseJsx } from "../__tests__/utils"
-import { transformSource, printAst, TransformConfig } from "../utils"
+import {
+  transformSourceForTagName,
+  printAst,
+  TransformSourceForTagNameArgs,
+} from "../utils"
 import { migrateStringProp } from "./migrateStringProp"
 
 const transformTopping = (oldValue: string): string => {
@@ -12,9 +16,9 @@ const transformTopping = (oldValue: string): string => {
 }
 
 const testMigrateStringProp = (
-  sourceFile: TransformConfig["sourceFile"]
+  sourceFile: TransformSourceForTagNameArgs["sourceFile"]
 ): string =>
-  transformSource({
+  transformSourceForTagName({
     sourceFile,
     astTransformer: migrateStringProp(
       "toppingOld",

package/codemods/utils/migrateStringProp.ts

@@ -2,7 +2,6 @@ import ts from "typescript"
 import { getPropValueText } from "./getPropValueText"
 import { updateJsxElementWithNewProps } from "./updateJsxElementWithNewProps"
 
-/** Recurses through AST to find and update any jsx element that matched the tagName */
 export const migrateStringProp =
   <OldValue extends string, NewValue extends string>(
     oldPropName: string,
@@ -10,7 +9,7 @@ export const migrateStringProp =
     valueTransformer: (value: OldValue) => NewValue
   ) =>
   (context: ts.TransformationContext, tagName: string) =>
-  (rootNode: ts.Node): ts.Node => {
+  (rootNode: ts.SourceFile): ts.SourceFile => {
     const visit = (node: ts.Node): ts.Node => {
       if (ts.isJsxOpeningElement(node) || ts.isJsxSelfClosingElement(node)) {
         if (node.tagName.getText() === tagName) {
@@ -39,5 +38,5 @@ export const migrateStringProp =
       }
       return ts.visitEachChild(node, visit, context)
     }
-    return ts.visitNode(rootNode, visit)
+    return ts.visitNode(rootNode, visit) as ts.SourceFile
   }

package/codemods/utils/printAst.ts

@@ -1,4 +1,5 @@
 import ts from "typescript"
+
 /** A util that prints that is used to print the AST as a string */
 export const printAst = (ast: ts.SourceFile): string => {
   const printer = ts.createPrinter()

package/codemods/utils/removeProps.spec.ts

@@ -1,5 +1,5 @@
 import { parseJsx } from "../__tests__/utils"
-import { transformSource, printAst } from "../utils"
+import { transformSourceForTagName, printAst } from "../utils"
 import { removeProps } from "./removeProps"
 
 describe("removeProps()", () => {
@@ -10,7 +10,7 @@ describe("removeProps()", () => {
     const outputAst = parseJsx(`
       export const TestComponent = () => <Pancakes />
     `)
-    const transformed = transformSource({
+    const transformed = transformSourceForTagName({
       sourceFile: inputAst,
       astTransformer: removeProps(["topping"]),
       tagName: "Pancakes",
@@ -25,7 +25,7 @@ describe("removeProps()", () => {
     const outputAst = parseJsx(`
       export const TestComponent = () => <Pancakes />
     `)
-    const transformed = transformSource({
+    const transformed = transformSourceForTagName({
       sourceFile: inputAst,
       astTransformer: removeProps(["topping", "fruit"]),
       tagName: "Pancakes",
@@ -40,7 +40,7 @@ describe("removeProps()", () => {
     const outputAst = parseJsx(`
       export const TestComponent = () => <Pancakes id="123"/>
     `)
-    const transformed = transformSource({
+    const transformed = transformSourceForTagName({
       sourceFile: inputAst,
       astTransformer: removeProps(["topping"]),
       tagName: "Pancakes",
@@ -55,7 +55,7 @@ describe("removeProps()", () => {
     const outputAst = parseJsx(`
       export const TestComponent = () => <div><Pancakes /><Pancakes /></div>
     `)
-    const transformed = transformSource({
+    const transformed = transformSourceForTagName({
       sourceFile: inputAst,
       astTransformer: removeProps(["topping"]),
       tagName: "Pancakes",

package/codemods/utils/removeProps.ts

@@ -4,7 +4,7 @@ import { updateJsxElementWithNewProps } from "./updateJsxElementWithNewProps"
 export const removeProps =
   (propsToRemove: string[]) =>
   (context: ts.TransformationContext, tagName: string) =>
-  (rootNode: ts.Node): ts.Node => {
+  (rootNode: ts.SourceFile): ts.SourceFile => {
     function visit(node: ts.Node): ts.Node {
       if (ts.isJsxOpeningElement(node) || ts.isJsxSelfClosingElement(node)) {
         if (node.tagName.getText() === tagName) {
@@ -26,5 +26,5 @@ export const removeProps =
       }
       return ts.visitEachChild(node, visit, context)
     }
-    return ts.visitNode(rootNode, visit)
+    return ts.visitNode(rootNode, visit) as ts.SourceFile
   }

package/codemods/utils/transformComponentsInDir.ts

@@ -1,11 +1,15 @@
 import fs from "fs"
 import path from "path"
-import ts from "typescript"
-import { transformSource, getKaioTagName, TransformConfig } from "."
+import { createEncodedSourceFile } from "./createEncodedSourceFile"
+import { getKaioTagName } from "./getKaioTagName"
+import {
+  transformSourceForTagName,
+  type TransformSourceForTagNameArgs,
+} from "./transformSource"
 
 export const traverseDir = (
   dir: string,
-  transformFile: (componentFilePath: string, sourceFile: ts.SourceFile) => void
+  transformFile: (componentFilePath: string, sourceCode: string) => void
 ): void => {
   if (dir.includes("node_modules")) {
     return
@@ -19,15 +23,8 @@ export const traverseDir = (
     if (fs.statSync(fullPath).isDirectory()) {
       traverseDir(fullPath, transformFile)
     } else if (fullPath.endsWith(".tsx")) {
-      const source = fs.readFileSync(fullPath, "utf8")
-      const sourceFile = ts.createSourceFile(
-        fullPath,
-        source,
-        ts.ScriptTarget.Latest,
-        true
-      )
-
-      transformFile(fullPath, sourceFile)
+      const sourceCode = fs.readFileSync(fullPath, "utf8")
+      transformFile(fullPath, sourceCode)
     }
   })
 }
@@ -35,16 +32,18 @@ export const traverseDir = (
 /** Walks the directory and runs the AST transformer on the given component name */
 export const transformComponentsInDir = (
   dir: string,
-  transformer: TransformConfig["astTransformer"],
+  transformer: TransformSourceForTagNameArgs["astTransformer"],
   componentName: string
 ): void => {
   const transformFile = (
     componentFilePath: string,
-    sourceFile: ts.SourceFile
+    sourceCode: string
   ): void => {
+    const sourceFile = createEncodedSourceFile(componentFilePath, sourceCode)
+
     const tagName = getKaioTagName(sourceFile, componentName)
     if (tagName) {
-      const updatedSourceFile = transformSource({
+      const updatedSourceFile = transformSourceForTagName({
         sourceFile,
         astTransformer: transformer,
         tagName,

package/codemods/utils/transformSource.spec.ts

@@ -1,55 +1,84 @@
 import fs from "fs"
 import path from "path"
 import ts from "typescript"
-import { parseJsx } from "../__tests__/utils"
-import { TransformConfig, transformSource } from "./transformSource"
-
-export const mockedTransformer =
-  (context: ts.TransformationContext) =>
-  (rootNode: ts.Node): ts.Node => {
-    function visit(node: ts.Node): ts.Node {
-      if (ts.isJsxOpeningElement(node) || ts.isJsxSelfClosingElement(node)) {
-        if (node.tagName.getText() === "Pancakes") {
-          const newAttributes = node.attributes.properties.map(attr => {
-            if (ts.isJsxAttribute(attr) && attr.name.getText() === "topping") {
-              return ts.factory.updateJsxAttribute(
-                attr,
-                attr.name,
-                ts.factory.createStringLiteral("jam")
-              )
-            }
-            return attr
-          })
-          if (ts.isJsxSelfClosingElement(node)) {
-            return ts.factory.updateJsxSelfClosingElement(
-              node,
-              node.tagName,
-              node.typeArguments,
-              ts.factory.createJsxAttributes(newAttributes)
+import { createEncodedSourceFile } from "./createEncodedSourceFile"
+import {
+  TransformSourceForTagNameArgs,
+  transformSource,
+  transformSourceForTagName,
+} from "./transformSource"
+
+const visit =
+  (context: ts.TransformationContext, tagName: string) =>
+  (node: ts.Node): ts.Node => {
+    if (ts.isJsxOpeningElement(node) || ts.isJsxSelfClosingElement(node)) {
+      if (node.tagName.getText() === tagName) {
+        const newAttributes = node.attributes.properties.map(attr => {
+          if (ts.isJsxAttribute(attr) && attr.name.getText() === "topping") {
+            return ts.factory.updateJsxAttribute(
+              attr,
+              attr.name,
+              ts.factory.createStringLiteral("jam")
             )
           }
+          return attr
+        })
+        if (ts.isJsxSelfClosingElement(node)) {
+          return ts.factory.updateJsxSelfClosingElement(
+            node,
+            node.tagName,
+            node.typeArguments,
+            ts.factory.createJsxAttributes(newAttributes)
+          )
         }
       }
-      return ts.visitEachChild(node, visit, context)
     }
-    return ts.visitNode(rootNode, visit)
+    return ts.visitEachChild(node, visit(context, tagName), context)
   }
 
-describe("transformSource", () => {
+describe("transformSource()", () => {
+  it("updates the value of Pancakes topping to jam", () => {
+    const filePath = path.resolve(
+      path.join(__dirname, "./__fixtures__/KaioComponent.tsx")
+    )
+    const fileContent = fs.readFileSync(filePath, "utf8")
+    const sourceFile = createEncodedSourceFile(filePath, fileContent)
+    const mockTransformer =
+      (tagName: string): ts.TransformerFactory<ts.SourceFile> =>
+      context =>
+      rootNode =>
+        ts.visitNode(rootNode, visit(context, tagName)) as ts.SourceFile
+
+    const transformed = transformSource({
+      sourceFile,
+      transformers: [mockTransformer("Pancakes")],
+    })
+
+    expect(transformed).toMatchSnapshot()
+  })
+})
+
+describe("transformSourceForTagName", () => {
   it("updates the value of Pancakes topping to jam", () => {
     const filePath = path.resolve(
       path.join(__dirname, "./__fixtures__/KaioComponent.tsx")
     )
     const fileContent = fs.readFileSync(filePath, "utf8")
-    const sourceFile = parseJsx(fileContent)
+    const sourceFile = createEncodedSourceFile(filePath, fileContent)
+    const mockTransformer =
+      (context: ts.TransformationContext, tagName: string) =>
+      (rootNode: ts.SourceFile): ts.SourceFile =>
+        ts.visitNode(rootNode, visit(context, tagName)) as ts.SourceFile
 
-    const mockTransformConfig = {
+    const mockTransformSourceForTagNameArgs = {
       sourceFile,
-      astTransformer: mockedTransformer,
-      tagName: "mockAlias",
-    } satisfies TransformConfig
+      astTransformer: mockTransformer,
+      tagName: "Pancakes",
+    } satisfies TransformSourceForTagNameArgs
 
-    const transformed = transformSource(mockTransformConfig)
+    const transformed = transformSourceForTagName(
+      mockTransformSourceForTagNameArgs
+    )
 
     expect(transformed).toMatchSnapshot()
   })

package/codemods/utils/transformSource.ts

@@ -1,30 +1,43 @@
 import ts from "typescript"
-import { ImportModuleNameTagsMap } from "./getKaioTagName"
+import { decodeEmptyLines } from "./emptyLineEncoder"
 import { printAst } from "./printAst"
 
-export type TransformConfig<
-  TagName extends string | ImportModuleNameTagsMap = string,
-> = {
+export type TransformSourceArgs = {
+  sourceFile: ts.SourceFile
+  transformers: Array<ts.TransformerFactory<ts.SourceFile>>
+}
+
+export const transformSource = ({
+  sourceFile,
+  transformers,
+}: TransformSourceArgs): string => {
+  const result = ts.transform(sourceFile, transformers)
+  const transformedSource = printAst(result.transformed[0])
+  return decodeEmptyLines(transformedSource)
+}
+
+/**
+ * @deprecated - use transformSource instead of transformSourceForTagName
+ */
+export type TransformSourceForTagNameArgs = {
   sourceFile: ts.SourceFile
   astTransformer: (
     context: ts.TransformationContext,
-    tagName: TagName
-  ) => (rootNode: ts.Node) => ts.Node
-  tagName: TagName
+    tagName: string
+  ) => (rootNode: ts.SourceFile) => ts.SourceFile
+  tagName: string
 }
 
-/** Transforms the source file with the transformer and target import alias provided */
-export const transformSource = <
-  TagName extends string | ImportModuleNameTagsMap,
->({
+/**
+ * @deprecated - use transformSource instead
+ * Transforms the source file with the transformer and target import alias provided
+ */
+export const transformSourceForTagName = ({
   sourceFile,
   astTransformer,
   tagName,
-}: TransformConfig<TagName>): string => {
-  const result = ts.transform(sourceFile, [
-    context => astTransformer(context, tagName),
-  ])
-  const transformedSource = result.transformed[0] as ts.SourceFile
-
-  return printAst(transformedSource)
-}
+}: TransformSourceForTagNameArgs): string =>
+  transformSource({
+    sourceFile,
+    transformers: [context => astTransformer(context, tagName)],
+  })

package/codemods/utils/updateKaioImports.ts

@@ -118,9 +118,12 @@ export type UpdateKaioImportsArgs = {
 }
 
 export const updateKaioImports =
-  ({ importsToRemove, importsToAdd }: UpdateKaioImportsArgs) =>
-  (context: ts.TransformationContext) =>
-  (rootNode: ts.Node): ts.Node => {
+  ({
+    importsToRemove,
+    importsToAdd,
+  }: UpdateKaioImportsArgs): ts.TransformerFactory<ts.SourceFile> =>
+  context =>
+  rootNode => {
     if (!ts.isSourceFile(rootNode)) return rootNode
 
     if (!importsToRemove && !importsToAdd) return rootNode

package/dist/cjs/__actions__/Menu/v3/Menu.cjs

@@ -4,7 +4,7 @@ var tslib = require('tslib');
 var React = require('react');
 var reactAriaComponents = require('react-aria-components');
 var mergeClassNames = require('../../../utils/mergeClassNames.cjs');
-var Menu_module = require('./Menu.module.scss.cjs');
+var Menu_module = require('./Menu.module.css.cjs');
 function _interopDefault(e) {
   return e && e.__esModule ? e : {
     default: e

package/dist/cjs/__actions__/Menu/v3/{Menu.module.scss.cjs → Menu.module.css.cjs}

@@ -1,6 +1,6 @@
 'use strict';
 
 var styles = {
-  "menu": "Menu-module_menu__iHYqh"
+  "menu": "Menu-module_menu__AowD8"
 };
 module.exports = styles;

package/dist/cjs/__actions__/Menu/v3/MenuItem.cjs

@@ -4,7 +4,7 @@ var tslib = require('tslib');
 var React = require('react');
 var reactAriaComponents = require('react-aria-components');
 var mergeClassNames = require('../../../utils/mergeClassNames.cjs');
-var MenuItem_module = require('./MenuItem.module.scss.cjs');
+var MenuItem_module = require('./MenuItem.module.css.cjs');
 function _interopDefault(e) {
   return e && e.__esModule ? e : {
     default: e
@@ -19,12 +19,17 @@ var MenuItem = React.forwardRef(function (_a, ref) {
   var className = _a.className,
     icon = _a.icon,
     children = _a.children,
-    props = tslib.__rest(_a, ["className", "icon", "children"]);
+    textValue = _a.textValue,
+    props = tslib.__rest(_a, ["className", "icon", "children", "textValue"]);
+  var determinedTextValue = textValue || (typeof children === "string" ? children : undefined);
   return React__default.default.createElement(reactAriaComponents.MenuItem, tslib.__assign({
     ref: ref,
-    className: mergeClassNames.mergeClassNames(MenuItem_module.item, className)
-  }, props), React__default.default.createElement(React__default.default.Fragment, null, icon && React__default.default.createElement("span", {
+    className: mergeClassNames.mergeClassNames(MenuItem_module.item, className),
+    textValue: determinedTextValue
+  }, props), React__default.default.createElement(React__default.default.Fragment, null, typeof children === "string" && icon ? React__default.default.createElement("div", {
+    className: MenuItem_module.flexWrapper
+  }, React__default.default.createElement("span", {
     className: MenuItem_module.iconWrapper
-  }, icon), children));
+  }, icon), children) : React__default.default.createElement(React__default.default.Fragment, null, children)));
 });
 exports.MenuItem = MenuItem;

package/dist/cjs/__actions__/Menu/v3/MenuItem.module.css.cjs

@@ -0,0 +1,8 @@
+'use strict';
+
+var styles = {
+  "item": "MenuItem-module_item__uImZI",
+  "flexWrapper": "MenuItem-module_flexWrapper__hiXro",
+  "iconWrapper": "MenuItem-module_iconWrapper__QoZgd"
+};
+module.exports = styles;