@sit-onyx/icons 1.0.0-beta.2 → 1.0.0-beta.21

package/README.md

@@ -1,9 +1,5 @@
 <div align="center" style="text-align: center">
-  <picture>
-    <source media="(prefers-color-scheme: dark)" type="image/svg+xml" srcset="https://raw.githubusercontent.com/SchwarzIT/onyx/main/.github/onyx-logo-light.svg">
-    <source media="(prefers-color-scheme: light)" type="image/svg+xml" srcset="https://raw.githubusercontent.com/SchwarzIT/onyx/main/.github/onyx-logo-dark.svg">
-    <img alt="onyx logo" src="https://raw.githubusercontent.com/SchwarzIT/onyx/main/.github/onyx-logo-dark.svg" width="160px">
-  </picture>
+  <img alt="onyx logo" src="https://raw.githubusercontent.com/SchwarzIT/onyx/main/.github/onyx-logo.svg" height="96px">
 </div>
 
 <br>
@@ -17,5 +13,4 @@ SVG icons for the onyx design system created by [Schwarz IT](https://it.schwarz)
 If you want to contribute a new icon, please follow the steps below:
 
 1. place the SVG file inside the [`src/assets`](./src/assets/) folder.
-2. run the script `pnpm optimize` to optimize the SVG content
-3. Add an entry inside [`src/metadata.ts`](./src/metadata.ts) to specify the icon category and other metadata
+2. Add an entry inside [`src/metadata.ts`](./src/metadata.ts) to specify the icon category and other metadata

package/dist/index.d.ts

@@ -0,0 +1,25 @@
+import type { IconCategories, IconMetadata } from "./types.js";
+export { 
+/**
+ * Metadata for all available onyx icons.
+ */
+default as ICON_METADATA, } from "./metadata.json";
+/**
+ * Groups all available icon metadata by category.
+ * Categories and icons will be sorted alphabetically.
+ */
+export declare const groupIconsByCategory: (iconMetadata: Record<string, IconMetadata>) => IconCategories;
+/**
+ * Transform an icon name to its corresponding JavaScript import name.
+ *
+ * @example
+ * ```ts
+ * "bell-disabled" => "bellDisabled"
+ * // e.g. used as 'import bellDisabled from "@sit-onyx/icons/bell-disabled.svg?raw"'
+ * ```
+ */
+export declare const getIconImportName: (iconName: string) => string;
+/**
+ * Capitalizes the first character of the given string.
+ */
+export declare const capitalize: (value: string) => string;

package/dist/index.js

@@ -0,0 +1,52 @@
+export { 
+/**
+ * Metadata for all available onyx icons.
+ */
+default as ICON_METADATA, } from "./metadata.json";
+/**
+ * Groups all available icon metadata by category.
+ * Categories and icons will be sorted alphabetically.
+ */
+export const groupIconsByCategory = (iconMetadata) => {
+    const categories = Object.entries(iconMetadata).reduce((categories, [iconName, metadata]) => {
+        const icons = categories[metadata.category] ?? [];
+        icons.push({ iconName, metadata });
+        categories[metadata.category] = icons;
+        return categories;
+    }, {});
+    const sortedCategories = {};
+    Object.keys(categories)
+        .sort()
+        .forEach((category) => {
+        const sortedMetadata = categories[category].slice().sort((a, b) => {
+            return a.iconName.localeCompare(b.iconName);
+        });
+        sortedCategories[category] = sortedMetadata;
+    });
+    return sortedCategories;
+};
+/**
+ * Transform an icon name to its corresponding JavaScript import name.
+ *
+ * @example
+ * ```ts
+ * "bell-disabled" => "bellDisabled"
+ * // e.g. used as 'import bellDisabled from "@sit-onyx/icons/bell-disabled.svg?raw"'
+ * ```
+ */
+export const getIconImportName = (iconName) => {
+    return iconName
+        .split("-")
+        .map((word, index) => {
+        if (index === 0)
+            return word;
+        return capitalize(word);
+    })
+        .join("");
+};
+/**
+ * Capitalizes the first character of the given string.
+ */
+export const capitalize = (value) => {
+    return value.charAt(0).toUpperCase() + value.slice(1);
+};