@ohos-ports/emoji-picker-element 1.29.1-beta.0

package/custom-elements.json

@@ -0,0 +1,257 @@
+{
+  "schemaVersion": "1.0.0",
+  "readme": "",
+  "modules": [
+    {
+      "kind": "javascript-module",
+      "path": "picker.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "Lightweight emoji picker distributed as a web component",
+          "name": "Picker",
+          "superclass": {
+            "name": "HTMLElement"
+          },
+          "tagName": "emoji-picker",
+          "customElement": true,
+          "attributes": [
+            {
+              "name": "locale",
+              "description": "Locale string",
+              "type": "string",
+              "default": "\"en\""
+            },
+            {
+              "name": "data-source",
+              "description": "URL to fetch the emoji data from",
+              "type": "string",
+              "default": "\"https://cdn.jsdelivr.net/npm/emoji-picker-element-data@^1/en/emojibase/data.json\""
+            },
+            {
+              "name": "skin-tone-emoji",
+              "description": "The emoji to use for the skin tone picker",
+              "type": "string",
+              "default": "\"🖐\""
+            },
+            {
+              "name": "emoji-version",
+              "description": "Maximum supported emoji version as a number (e.g. `14.0` or `13.1`). Setting this disables the default emoji support detection.",
+              "type": "string",
+              "default": null
+            }
+          ],
+          "members": [
+            {
+              "name": "locale",
+              "description": "Locale string",
+              "kind": "field",
+              "default": "\"en\""
+            },
+            {
+              "name": "dataSource",
+              "description": "URL to fetch the emoji data from",
+              "kind": "field",
+              "default": "\"https://cdn.jsdelivr.net/npm/emoji-picker-element-data@^1/en/emojibase/data.json\""
+            },
+            {
+              "name": "skinToneEmoji",
+              "description": "The emoji to use for the skin tone picker",
+              "kind": "field",
+              "default": "\"🖐\""
+            },
+            {
+              "name": "i18n",
+              "description": "i18n object",
+              "kind": "field"
+            },
+            {
+              "name": "customEmoji",
+              "description": "Array of custom emoji",
+              "kind": "field"
+            },
+            {
+              "name": "customCategorySorting",
+              "description": "Function to sort custom category strings (sorted alphabetically by default)",
+              "kind": "field"
+            },
+            {
+              "name": "emojiVersion",
+              "description": "Maximum supported emoji version as a number (e.g. `14.0` or `13.1`). Setting this disables the default emoji support detection.",
+              "kind": "field"
+            }
+          ],
+          "events": [
+            {
+              "name": "skin-tone-change",
+              "description": "This event is fired whenever the user selects a new skin tone."
+            },
+            {
+              "name": "emoji-click",
+              "description": "The `emoji-click` event is fired when an emoji is selected by the user."
+            },
+            {
+              "name": "emoji-click-sync",
+              "description": "The `emoji-click-sync` event is fired synchronously when an emoji is selected by the user. Use this when copying data to the clipboard using the Clipboard API to work around a Safari bug."
+            }
+          ],
+          "cssProperties": [
+            {
+              "name": "--background",
+              "description": "Background of the entire `<emoji-picker>` (default: `#fff`, dark default: `#222`)",
+              "default": "\"#fff\""
+            },
+            {
+              "name": "--border-color",
+              "description": "(default: `#e0e0e0`, dark default: `#444`)",
+              "default": "\"#e0e0e0\""
+            },
+            {
+              "name": "--border-radius",
+              "description": "Border radius of the entire picker (default: `0`)",
+              "default": "\"0\""
+            },
+            {
+              "name": "--border-size",
+              "description": "Width of border used in most of the picker (default: `1px`)",
+              "default": "\"1px\""
+            },
+            {
+              "name": "--button-active-background",
+              "description": "Background of an active button (default: `#e6e6e6`, dark default: `#555555`)",
+              "default": "\"#e6e6e6\""
+            },
+            {
+              "name": "--button-hover-background",
+              "description": "Background of a hovered button (default: `#d9d9d9`, dark default: `#484848`)",
+              "default": "\"#d9d9d9\""
+            },
+            {
+              "name": "--category-emoji-padding",
+              "description": "Vertical/horizontal padding on category emoji, if you want it to be different from `--emoji-padding` (default: `var(--emoji-padding)`)",
+              "default": "\"var(--emoji-padding)\""
+            },
+            {
+              "name": "--category-emoji-size",
+              "description": "Width/height of category emoji, if you want it to be different from `--emoji-size` (default: `var(--emoji-size)`)",
+              "default": "\"var(--emoji-size)\""
+            },
+            {
+              "name": "--category-font-color",
+              "description": "Font color of custom emoji category headings (default: `#111`, dark default: `#efefef`)",
+              "default": "\"#111\""
+            },
+            {
+              "name": "--category-font-size",
+              "description": "Font size of custom emoji category headings (default: `1rem`)",
+              "default": "\"1rem\""
+            },
+            {
+              "name": "--emoji-font-family",
+              "description": "Font family for a custom emoji font (as opposed to native emoji) (default: `\"Twemoji Mozilla\",\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\",\"EmojiOne Color\",\"Android Emoji\",sans-serif`)",
+              "default": "\"\\\"Twemoji Mozilla\\\",\\\"Apple Color Emoji\\\",\\\"Segoe UI Emoji\\\",\\\"Segoe UI Symbol\\\",\\\"Noto Color Emoji\\\",\\\"EmojiOne Color\\\",\\\"Android Emoji\\\",sans-serif\""
+            },
+            {
+              "name": "--emoji-padding",
+              "description": "Vertical and horizontal padding on emoji (default: `0.5rem`)",
+              "default": "\"0.5rem\""
+            },
+            {
+              "name": "--emoji-size",
+              "description": "Width and height of all emoji (default: `1.375rem`)",
+              "default": "\"1.375rem\""
+            },
+            {
+              "name": "--indicator-color",
+              "description": "Color of the nav indicator (default: `#385ac1`, dark default: `#5373ec`)",
+              "default": "\"#385ac1\""
+            },
+            {
+              "name": "--indicator-height",
+              "description": "Height of the nav indicator (default: `3px`)",
+              "default": "\"3px\""
+            },
+            {
+              "name": "--input-border-color",
+              "description": "(default: `#999`, dark default: `#ccc`)",
+              "default": "\"#999\""
+            },
+            {
+              "name": "--input-border-radius",
+              "description": "(default: `0.5rem`)",
+              "default": "\"0.5rem\""
+            },
+            {
+              "name": "--input-border-size",
+              "description": "(default: `1px`)",
+              "default": "\"1px\""
+            },
+            {
+              "name": "--input-font-color",
+              "description": "(default: `#111`, dark default: `#efefef`)",
+              "default": "\"#111\""
+            },
+            {
+              "name": "--input-font-size",
+              "description": "(default: `1rem`)",
+              "default": "\"1rem\""
+            },
+            {
+              "name": "--input-line-height",
+              "description": "(default: `1.5`)",
+              "default": "\"1.5\""
+            },
+            {
+              "name": "--input-padding",
+              "description": "(default: `0.25rem`)",
+              "default": "\"0.25rem\""
+            },
+            {
+              "name": "--input-placeholder-color",
+              "description": "(default: `#999`, dark default: `#ccc`)",
+              "default": "\"#999\""
+            },
+            {
+              "name": "--num-columns",
+              "description": "How many columns to display in the emoji grid (default: `8`)",
+              "default": "\"8\""
+            },
+            {
+              "name": "--outline-color",
+              "description": "Focus outline color (default: `#999`, dark default: `#fff`)",
+              "default": "\"#999\""
+            },
+            {
+              "name": "--outline-size",
+              "description": "Focus outline width (default: `2px`)",
+              "default": "\"2px\""
+            },
+            {
+              "name": "--skintone-border-radius",
+              "description": "Border radius of the skintone dropdown (default: `1rem`)",
+              "default": "\"1rem\""
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "custom-element-definition",
+          "name": "emoji-picker",
+          "declaration": {
+            "name": "Picker",
+            "module": "picker.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "Picker",
+            "module": "picker.js"
+          }
+        }
+      ]
+    }
+  ]
+}

package/database.d.ts

@@ -0,0 +1,108 @@
+import { Emoji, DatabaseConstructorOptions, SkinTone, CustomEmoji, NativeEmoji } from "./shared.js";
+export default class Database {
+    /**
+     * Create a new Database.
+     *
+     * Note that multiple Databases pointing to the same locale will share the
+     * same underlying IndexedDB connection and database.
+     *
+     * @param dataSource - URL to fetch the emoji data from
+     * @param locale - Locale string
+     * @param customEmoji - Array of custom emoji
+     */
+    constructor({ dataSource, locale, customEmoji }?: DatabaseConstructorOptions);
+    /**
+     * Resolves when the Database is ready, or throws an error if
+     * the Database could not initialize.
+     *
+     * Note that you don't need to do this before calling other APIs – they will
+     * all wait for this promise to resolve before doing anything.
+     */
+    ready(): Promise<void>;
+    /**
+     * Returns all emoji belonging to a group, ordered by `order`. Only returns native emoji;
+     * custom emoji don't belong to a group.
+     *
+     * Non-numbers throw an error.
+     * @param group - the group number
+     */
+    getEmojiByGroup(group: number): Promise<NativeEmoji[]>;
+    /**
+     * Returns all emoji matching the given search query, ordered by `order`.
+     *
+     * Empty/null strings throw an error.
+     *
+     * @param query - search query string
+     */
+    getEmojiBySearchQuery(query: string): Promise<Emoji[]>;
+    /**
+     * Return a single emoji matching the shortcode, or null if not found.
+     *
+     * The colons around the shortcode should not be included when querying, e.g.
+     * use "slight_smile", not ":slight_smile:". Uppercase versus lowercase
+     * does not matter. Empty/null strings throw an error.
+     * @param shortcode
+     */
+    getEmojiByShortcode(shortcode: string): Promise<Emoji | null>;
+    /**
+     * Return a single native emoji matching the unicode string, or
+     * a custom emoji matching the name, or null if not found.
+     *
+     * In the case of native emoji, the unicode string can be either the
+     * main unicode string, or the unicode of one of the skin tone variants.
+     *
+     * Empty/null strings throw an error.
+     * @param unicodeOrName - unicode (native emoji) or name (custom emoji)
+     */
+    getEmojiByUnicodeOrName(unicodeOrName: string): Promise<Emoji | null>;
+    /**
+     * Get the user's preferred skin tone. Returns 0 if not found.
+     */
+    getPreferredSkinTone(): Promise<SkinTone>;
+    /**
+     * Set the user's preferred skin tone. Non-numbers throw an error.
+     *
+     * @param skinTone - preferred skin tone
+     */
+    setPreferredSkinTone(skinTone: SkinTone): Promise<void>;
+    /**
+     * Increment the favorite count for an emoji by one. The unicode string must be non-empty. It should
+     * correspond to the base (non-skin-tone) unicode string from the emoji object, or in the case of
+     * custom emoji, it should be the name.
+     *
+     * @param unicodeOrName - unicode of a native emoji, or name of a custom emoji
+     */
+    incrementFavoriteEmojiCount(unicodeOrName: string): Promise<void>;
+    /**
+     * Get the top favorite emoji in descending order. If there are no favorite emoji yet, returns an empty array.
+     * @param limit - maximum number of results to return
+     */
+    getTopFavoriteEmoji(limit: number): Promise<Emoji[]>;
+    /**
+     * Set the custom emoji for this database. Throws an error if custom emoji are not in the correct format.
+     *
+     *
+     * @param customEmoji
+     */
+    set customEmoji(customEmoji: CustomEmoji[]);
+    /**
+     * Return the custom emoji associated with this Database, or the empty array if none.
+     */
+    get customEmoji(): CustomEmoji[];
+    /**
+     * Closes the underlying IndexedDB connection. The Database is not usable after that (or any other Databases
+     * with the same locale).
+     *
+     * Note that as soon as any other non-close/delete method is called, the database will automatically reopen.
+     *
+     */
+    close(): Promise<void>;
+    /**
+     * Deletes the underlying IndexedDB database. The Database is not usable after that (or any other Databases
+     * with the same locale).
+     *
+     * Note that as soon as any other non-close/delete method is called, the database will be recreated.
+     *
+     */
+    delete(): Promise<void>;
+}