create utility functions for most used lint rules

.vscode/launch.json

@@ -34,7 +34,7 @@
 			"autoAttachChildProcesses": true,
 			"skipFiles": ["<node_internals>/**", "**/node_modules/**"],
 			"program": "${workspaceRoot}/node_modules/vitest/vitest.mjs",
-			"args": ["dev", "--singleThread=true", "${relativeFile}"],
+			"args": ["run", "--singleThread=true", "--testTimeout=2000000000", "${relativeFile}"],
 			"smartStep": true,
 			"console": "integratedTerminal"
 		},
@@ -49,7 +49,6 @@
 				// change this path to specify what folder should be opened upon running this configuration
 				"${workspaceFolder}/inlang/development-projects/inlang-nextjs"
 			],
-			"sourceMaps": true,
 			"outFiles": [
 				"${workspaceFolder}/**/*.js",
 				"${workspaceFolder}/**/*.ts",

inlang/development-projects/inlang-nextjs/other-folder/backend.inlang/settings.json

@@ -11,10 +11,10 @@
 	],
 	"plugin.inlang.i18next": {
 		"pathPattern": {
-			"client-page": "./../../app/i18n/locales/{languageTag}/client-page.json",
-			"footer": "./../../app/i18n/locales/{languageTag}/footer.json",
-			"second-page": "./../../app/i18n/locales/{languageTag}/second-page.json",
-			"translation": "./../../app/i18n/locales/{languageTag}/translation.json"
+			"client-page": "./../app/i18n/locales/{languageTag}/client-page.json",
+			"footer": "./../app/i18n/locales/{languageTag}/footer.json",
+			"second-page": "./../app/i18n/locales/{languageTag}/second-page.json",
+			"translation": "./../app/i18n/locales/{languageTag}/translation.json"
 		}
 	},
 	"experimental": {

inlang/development-projects/inlang-nextjs/project.inlang/settings.json

@@ -1,28 +1,21 @@
 {
-  "$schema": "https://inlang.com/schema/project-settings",
-  "sourceLanguageTag": "en",
-  "languageTags": [
-    "en",
-    "de",
-    "cz"
-  ],
-  "modules": [
-    "./../../source-code/plugins/i18next/dist/index.js",
-    "./../../source-code/message-lint-rules/emptyPattern/dist/index.js",
-    "./../../source-code/message-lint-rules/identicalPattern/dist/index.js",
-    "./../../source-code/message-lint-rules/missingTranslation/dist/index.js",
-    "./../../source-code/message-lint-rules/messageWithoutSource/dist/index.js"
-  ],
-  "plugin.inlang.i18next": {
-    "pathPattern": {
-      "client-page": "./app/i18n/locales/{languageTag}/client-page.json",
-      "footer": "./app/i18n/locales/{languageTag}/footer.json",
-      "second-page": "./app/i18n/locales/{languageTag}/second-page.json",
-      "translation": "./app/i18n/locales/{languageTag}/translation.json"
-    },
-    "variableReferencePattern": [
-      "{{",
-      "}}"
-    ]
-  }
-}
+	"$schema": "https://inlang.com/schema/project-settings",
+	"sourceLanguageTag": "en",
+	"languageTags": ["en", "de", "cz"],
+	"modules": [
+		"../../source-code/plugins/i18next/dist/index.js",
+		"../../source-code/message-lint-rules/emptyPattern/dist/index.js",
+		"../../source-code/message-lint-rules/identicalPattern/dist/index.js",
+		"../../source-code/message-lint-rules/missingTranslation/dist/index.js",
+		"../../source-code/message-lint-rules/messageWithoutSource/dist/index.js"
+	],
+	"plugin.inlang.i18next": {
+		"pathPattern": {
+			"client-page": "./app/i18n/locales/{languageTag}/client-page.json",
+			"footer": "./app/i18n/locales/{languageTag}/footer.json",
+			"second-page": "./app/i18n/locales/{languageTag}/second-page.json",
+			"translation": "./app/i18n/locales/{languageTag}/translation.json"
+		},
+		"variableReferencePattern": ["{{", "}}"]
+	}
+}

inlang/development-projects/sdk-importer/index.js

@@ -0,0 +1,14 @@
+import { loadProjectFromDirectoryInMemory, selectBundleNested } from "@inlang/sdk2"
+import icu1Importer from "@inlang/plugin-icu1"
+import fs from "node:fs/promises"
+import path from "node:path"
+
+const project = await loadProjectFromDirectoryInMemory({
+	providePlugins: [icu1Importer],
+	path: path.join(process.cwd(), "project.inlang"),
+	fs: fs,
+})
+
+// get bundles
+const bundles = await selectBundleNested(project.db).selectAll().execute()
+console.log(JSON.stringify(bundles, undefined, 2))

inlang/development-projects/sdk-importer/messages/de.json

@@ -0,0 +1,3 @@
+{
+	"likes": "Du hast {count, plural, one {einen Like} other {{count} Likes}}"
+}

inlang/development-projects/sdk-importer/messages/en.json

@@ -0,0 +1,3 @@
+{
+	"likes": "You have {count, plural, one {einen Like} other {{count} Likes}}"
+}

inlang/development-projects/sdk-importer/package.json

@@ -0,0 +1,10 @@
+{
+    "name": "sdk2-importer",
+    "version": "0.0.1",
+    "private": true,
+    "type": "module",
+    "dependencies": {
+        "@inlang/sdk2": "workspace:*",
+        "@inlang/plugin-icu1": "workspace:*"
+    }
+}

inlang/development-projects/sdk-importer/project.inlang/settings.json

@@ -0,0 +1,8 @@
+{
+	"baseLocale": "en",
+	"locales": ["en", "de"],
+	"modules": ["local:@inlang/icu1-importer"],
+	"plugin.inlang.icu-messageformat-1": {
+		"pathPattern": "./messages/{locale}.json"
+	}
+}

inlang/development-projects/sdk-importer/tsconfig.json

@@ -0,0 +1,9 @@
+{
+	"compilerOptions": {
+		"module": "ESNext",
+		"moduleResolution": "Bundler",
+		"target": "ESNext",
+		"checkJs": true,
+		"allowJs": true
+	}
+}

inlang/source-code/bundle-component/package.json

@@ -0,0 +1,50 @@
+{
+	"name": "@inlang/bundle-component",
+	"type": "module",
+	"version": "0.0.1",
+	"publishConfig": {
+		"access": "public"
+	},
+	"description": "",
+	"exports": {
+		".": "./dist/index.js"
+	},
+	"scripts": {
+		"dev": "tsc --watch",
+		"build": "tsc",
+		"test": "tsc --noEmit && vitest run --passWithNoTests --coverage",
+		"format": "prettier --write **/*.ts",
+		"storybook": "storybook dev -p 6006"
+	},
+	"keywords": [],
+	"author": "",
+	"license": "ISC",
+	"devDependencies": {
+		"@nx/storybook": "^18.0.4",
+		"@storybook/addon-essentials": "^7.6.16",
+		"@storybook/addon-links": "^7.6.16",
+		"@storybook/blocks": "^7.6.16",
+		"@storybook/web-components": "^7.6.16",
+		"@storybook/web-components-vite": "^7.6.16",
+		"@types/chroma-js": "^2.4.4",
+		"@vitest/coverage-v8": "^0.33.0",
+		"esbuild": "^0.20.0",
+		"lit": "^3.1.2",
+		"react": "^18.2.0",
+		"react-dom": "^18.2.0",
+		"storybook": "^7.6.16",
+		"vitest": "0.33.0"
+	},
+	"dependencies": {
+		"@inlang/sdk2": "workspace:^",
+		"@lexical/plain-text": "^0.16.1",
+		"@lexical/utils": "^0.16.1",
+		"@lit/task": "^1.0.0",
+		"@shoelace-style/shoelace": "2.14.0",
+		"@sinclair/typebox": "0.31.28",
+		"@storybook/preview-api": "^8.2.9",
+		"chroma-js": "^2.4.2",
+		"lexical": "^0.16.1",
+		"typescript": "^5.5.4"
+	}
+}

inlang/source-code/bundle-component/src/helper/event.ts

@@ -0,0 +1,26 @@
+//generalized event dispatcher
+
+import type { Bundle, Message, Variant } from "@inlang/sdk2"
+
+export type DispatchChangeInterface = {
+	type: "Bundle" | "Message" | "Variant"
+	operation: "create" | "update" | "delete"
+	newData: Bundle | Message | Variant | undefined
+	meta?: Record<string, any>
+}
+
+export const createChangeEvent = (props: DispatchChangeInterface) => {
+	const onChangeEvent = new CustomEvent("change", {
+		bubbles: true,
+		composed: true,
+		detail: {
+			argument: {
+				type: props.type,
+				operation: props.operation,
+				newData: props.newData,
+				meta: props.meta,
+			},
+		},
+	})
+	return onChangeEvent
+}

inlang/source-code/message-bundle-component/src/helper/overridePrimitiveColors.ts → inlang/source-code/bundle-component/src/helper/overridePrimitiveColors.ts

@@ -22,7 +22,7 @@ const overridePrimitiveColors = () => {
 const appendCSSProperties = (
 	colorShades: Record<number, string>,
 	primitive: string,
-	element: HTMLElement
+	element: Element
 ) => {
 	let textContent = Object.entries(colorShades)
 		.map(([index, shade]) => `--sl-color-${primitive}-${index}: ${shade} !important;`)

inlang/source-code/bundle-component/src/helper/patternToString.test.ts

@@ -0,0 +1,31 @@
+import { describe, expect, it } from "vitest"
+import patternToString from "./patternToString.js"
+import type { Pattern } from "@inlang/sdk2"
+
+describe("patternToString", () => {
+	it("Should transform pattern to string", () => {
+		const pattern: Pattern = [
+			{
+				type: "text",
+				value: "Hello, ",
+			},
+			{
+				type: "expression",
+				arg: {
+					type: "variable",
+					name: "name",
+				},
+			},
+			{
+				type: "text",
+				value: "!",
+			},
+		]
+
+		const text = patternToString({ pattern })
+
+		const correspondingText = "Hello, {{name}}!"
+
+		expect(text).toStrictEqual(correspondingText)
+	})
+})

inlang/source-code/bundle-component/src/helper/patternToString.ts

@@ -0,0 +1,32 @@
+import type { Pattern } from "@inlang/sdk2"
+
+/**
+ * MVP version of the function
+ *
+ * Converts a pattern to a string.
+ * @param props.pattern The pattern to convert to a string.
+ * @returns The pattern as a string.
+ *
+ * @example
+ * patternToString({ pattern: [{ value: "Hello" }, { type: "expression", arg: { type: "variable", name: "name" } }] }) -> "Hello {{name}}"
+ */
+
+const patternToString = (props: { pattern: Pattern }): string => {
+	if (!props.pattern) {
+		return ""
+	}
+	return props.pattern
+		.map((p) => {
+			if ("value" in p) {
+				return p.value
+				// @ts-ignore
+			} else if (p.type === "expression" && p.arg.type === "variable") {
+				// @ts-ignore
+				return `{{${p.arg.name}}}`
+			}
+			return ""
+		})
+		.join("")
+}
+
+export default patternToString

inlang/source-code/bundle-component/src/helper/stringToPattern.test.ts

@@ -0,0 +1,30 @@
+import { describe, expect, it } from "vitest"
+import stringToPattern from "./stringToPattern.js"
+import type { Pattern } from "@inlang/sdk2"
+
+describe("stringToPattern", () => {
+	it("Should transform string to pattern", () => {
+		const text = "Hello, {{name}}!"
+
+		const pattern = stringToPattern({ text })
+
+		const correspondingPattern: Pattern = [
+			{
+				type: "text",
+				value: "Hello, ",
+			},
+			{
+				type: "expression",
+				arg: {
+					type: "variable",
+					name: "name",
+				},
+			},
+			{
+				type: "text",
+				value: "!",
+			},
+		]
+		expect(pattern).toStrictEqual(correspondingPattern)
+	})
+})

inlang/source-code/bundle-component/src/helper/stringToPattern.ts

@@ -0,0 +1,52 @@
+import type { Pattern } from "@inlang/sdk2"
+
+/**
+ * MVP version of the function
+ *
+ * Converts a string to a pattern.
+ * @param props.text The text to convert to a pattern.
+ * @returns The pattern of the text.
+ *
+ * @example
+ * stringToPattern({ text: "Hello {{name}}" }) -> [{ value: "Hello" }, { type: "expression", arg: { type: "variable", name: "name" } }]
+ */
+
+const stringToPattern = (props: { text: string }): Pattern => {
+	const pattern: Pattern = []
+	const regex = /{{(.*?)}}/g
+	let lastIndex = 0
+	let match
+
+	while ((match = regex.exec(props.text)) !== null) {
+		// Add text node for text before the variable
+		if (match.index > lastIndex) {
+			pattern.push({
+				type: "text",
+				value: props.text.slice(lastIndex, match.index),
+			})
+		}
+		// Add variable node
+		if (match[1]) {
+			pattern.push({
+				type: "expression",
+				arg: {
+					type: "variable",
+					name: match[1],
+				},
+			})
+			lastIndex = regex.lastIndex
+		}
+	}
+
+	// Add remaining text node after the last variable
+	if (lastIndex < props.text.length) {
+		pattern.push({
+			type: "text",
+			value: props.text.slice(lastIndex),
+		})
+	}
+
+	return pattern
+}
+
+export default stringToPattern

inlang/source-code/bundle-component/src/index.ts

@@ -0,0 +1,9 @@
+//main components
+export { default as InlangBundle } from "./stories/inlang-bundle.js"
+export { default as InlangMessage } from "./stories/message/inlang-message.js"
+export { default as InlangVariant } from "./stories/variant/inlang-variant.js"
+export { default as InlangPatternEditor } from "./stories/pattern-editor/inlang-pattern-editor.js"
+
+//modals & actions
+export { default as InlangBundleAction } from "./stories/actions/bundle-action/inlang-bundle-action.js"
+export { default as InlangAddSelector } from "./stories/actions/add-selector/inlang-add-selector.js"

inlang/source-code/bundle-component/src/inlang-bundle.mdx

@@ -0,0 +1,4 @@
+import { Meta, Primary, Controls, Story, Canvas, ArgTypes, Source } from '@storybook/blocks';
+import * as InlangBundle from './stories/inlang-bundle.stories';
+
+# Inlang Bundle