pds-dev-kit-web-test 0.2.37 → 0.2.38

package/dist/src/sub/GoogleFontkit/api/getGoogleFontCss.js

@@ -0,0 +1,53 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var GOOGLE_FONTS_CSS_BASE_URL = 'https://fonts.googleapis.com/css2';
+function getGoogleFontCss(searchParamsObj) {
+    return __awaiter(this, void 0, void 0, function () {
+        var url;
+        return __generator(this, function (_a) {
+            url = new URL(GOOGLE_FONTS_CSS_BASE_URL);
+            Object.entries(searchParamsObj).forEach(function (param) {
+                var key = param[0], value = param[1];
+                url.searchParams.append(key, value);
+            });
+            return [2 /*return*/, fetch(url.href).then(function (res) { return res.text(); })];
+        });
+    });
+}
+exports.default = getGoogleFontCss;

package/dist/src/sub/GoogleFontkit/api/getGoogleFontDefaultText.d.ts

@@ -0,0 +1,2 @@
+declare function getGoogleFontDefaultText(family: string): Promise<any>;
+export default getGoogleFontDefaultText;

package/dist/src/sub/GoogleFontkit/api/getGoogleFontDefaultText.js

@@ -0,0 +1,55 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var GOOGLE_SAMPLE_TEXT_BASE_URL = 'https://fonts.google.com/sampletext';
+function getGoogleFontDefaultText(family) {
+    return __awaiter(this, void 0, void 0, function () {
+        var url;
+        return __generator(this, function (_a) {
+            url = new URL(GOOGLE_SAMPLE_TEXT_BASE_URL);
+            url.searchParams.append('family', family);
+            return [2 /*return*/, fetch(url.href).then(function (res) {
+                    return res.text().then(function (text) {
+                        var testTexts = JSON.parse(text.substring(5));
+                        return testTexts;
+                    });
+                })];
+        });
+    });
+}
+exports.default = getGoogleFontDefaultText;

package/dist/src/sub/GoogleFontkit/api/getGoogleWebFonts.d.ts

@@ -0,0 +1,10 @@
+type Props = {
+    key: string;
+    family?: string;
+    sort?: string;
+    subset?: string;
+    category?: string;
+    classification?: string;
+};
+declare function getGoogleWebFonts(searchParamsObj: Props): Promise<any>;
+export default getGoogleWebFonts;

package/dist/src/sub/GoogleFontkit/api/getGoogleWebFonts.js

@@ -0,0 +1,53 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var GOOGLE_WEBFONTS_BASE_URL = 'https://www.googleapis.com/webfonts/v1/webfonts';
+function getGoogleWebFonts(searchParamsObj) {
+    return __awaiter(this, void 0, void 0, function () {
+        var url;
+        return __generator(this, function (_a) {
+            url = new URL(GOOGLE_WEBFONTS_BASE_URL);
+            Object.entries(searchParamsObj).forEach(function (param) {
+                var key = param[0], value = param[1];
+                url.searchParams.append(key, value);
+            });
+            return [2 /*return*/, fetch(url.href).then(function (res) { return res.json(); })];
+        });
+    });
+}
+exports.default = getGoogleWebFonts;

package/dist/src/sub/GoogleFontkit/constants.d.ts

@@ -0,0 +1,7 @@
+import type { Category, SortOption, Subset } from './types';
+export declare const FONT_FACE_REGEX: RegExp;
+export declare const FONT_FAMILY_REGEX: RegExp;
+export declare const PREVIEW_ATTRIBUTE_NAME = "data-is-preview";
+export declare const CATEGORIES: Category[];
+export declare const SORTS: SortOption[];
+export declare const SUBSETS: Subset[];

package/dist/src/sub/GoogleFontkit/constants.js

@@ -0,0 +1,42 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SUBSETS = exports.SORTS = exports.CATEGORIES = exports.PREVIEW_ATTRIBUTE_NAME = exports.FONT_FAMILY_REGEX = exports.FONT_FACE_REGEX = void 0;
+exports.FONT_FACE_REGEX = /@font-face {([\s\S]*?)}/gm;
+exports.FONT_FAMILY_REGEX = /font-family: ['"](.*?)['"]/gm;
+exports.PREVIEW_ATTRIBUTE_NAME = 'data-is-preview';
+exports.CATEGORIES = [
+    'serif',
+    'sans-serif',
+    'display',
+    'handwriting',
+    'monospace'
+];
+exports.SORTS = ['alpha', 'date', 'popularity', 'trending'];
+exports.SUBSETS = [
+    'arabic',
+    'bengali',
+    'chinese-simplified',
+    'chinese-traditional',
+    'cyrillic',
+    'cyrillic-ext',
+    'devanagari',
+    'greek',
+    'greek-ext',
+    'gujarati',
+    'gurmukhi',
+    'hebrew',
+    'japanese',
+    'kannada',
+    'khmer',
+    'korean',
+    'latin',
+    'latin-ext',
+    'malayalam',
+    'myanmar',
+    'oriya',
+    'sinhala',
+    'tamil',
+    '​telugu',
+    'thai',
+    'vietnamese'
+];

package/dist/src/sub/GoogleFontkit/headless/GoogleFontItem.d.ts

@@ -0,0 +1,13 @@
+import { LegacyRef } from 'react';
+import type { Font } from '../types';
+type HeadlessProps = {
+    isLoading: boolean;
+    isVisible: boolean;
+    ref: LegacyRef<HTMLElement>;
+};
+type Props = {
+    font: Font;
+    children: (args: HeadlessProps) => JSX.Element;
+};
+declare function GoogleFontItem({ font, children }: Props): JSX.Element;
+export default GoogleFontItem;

package/dist/src/sub/GoogleFontkit/headless/GoogleFontItem.js

@@ -0,0 +1,107 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = require("react");
+var getGoogleFontCss_1 = __importDefault(require("../api/getGoogleFontCss"));
+var useIntersectionObserver_1 = __importDefault(require("../hooks/useIntersectionObserver"));
+var applyActiveFont_1 = __importDefault(require("../utils/applyActiveFont"));
+var createStyleSheet_1 = __importDefault(require("../utils/createStyleSheet"));
+var extractFontStyles_1 = __importDefault(require("../utils/extractFontStyles"));
+var fillStyleSheet_1 = __importDefault(require("../utils/fillStyleSheet"));
+var isStyleSheetExists_1 = __importDefault(require("../utils/isStyleSheetExists"));
+var parseFontVariants_1 = __importDefault(require("../utils/parseFontVariants"));
+var setStyleSheetType_1 = __importDefault(require("../utils/setStyleSheetType"));
+function GoogleFontItem(_a) {
+    var font = _a.font, children = _a.children;
+    var _b = (0, react_1.useState)(false), isLoading = _b[0], setIsLoading = _b[1];
+    var ref = (0, react_1.useRef)(null);
+    var entry = (0, useIntersectionObserver_1.default)(ref, {});
+    var isVisible = !!(entry === null || entry === void 0 ? void 0 : entry.isIntersecting);
+    (0, react_1.useEffect)(function () {
+        if (!isVisible) {
+            return;
+        }
+        function getCss() {
+            return __awaiter(this, void 0, void 0, function () {
+                var css, fontStyles;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0:
+                            setIsLoading(true);
+                            return [4 /*yield*/, (0, getGoogleFontCss_1.default)({
+                                    family: "".concat(font.family).concat((0, parseFontVariants_1.default)(font.variants, {
+                                        prefix: ':wght@',
+                                        separator: ';'
+                                    })),
+                                    'font-display': 'swap'
+                                })];
+                        case 1:
+                            css = _a.sent();
+                            fontStyles = (0, extractFontStyles_1.default)(css);
+                            (0, fillStyleSheet_1.default)(font.id, fontStyles[font.id]);
+                            setIsLoading(false);
+                            return [2 /*return*/];
+                    }
+                });
+            });
+        }
+        if ((0, isStyleSheetExists_1.default)(font.id, false)) {
+            // Add CSS declaration to apply the new active font
+            (0, applyActiveFont_1.default)(font, '', '');
+            setIsLoading(false);
+        }
+        else if ((0, isStyleSheetExists_1.default)(font.id, true)) {
+            // Update the stylesheet's "data-is-preview" attribute to "false"
+            (0, setStyleSheetType_1.default)(font.id, false);
+            setIsLoading(false);
+        }
+        else {
+            // Create stylesheet for the font to be fetched (this prevents other font pickers from loading
+            // the font as well)
+            // eslint-disable-next-line no-console
+            console.log('create sheet');
+            (0, createStyleSheet_1.default)(font.id, false);
+            getCss();
+        }
+    }, [font, isVisible]);
+    return children({ isLoading: isLoading, isVisible: isVisible, ref: ref });
+}
+exports.default = GoogleFontItem;

package/dist/src/sub/GoogleFontkit/headless/GoogleFontsList.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+import type { Font, SortOption, FilterOptionType, ChangeFilterOptionHandler } from '../types';
+type HeadlessProps = {
+    isLoading: boolean;
+    fonts: Font[];
+    filteredFonts: Font[];
+    filterOptions: FilterOptionType;
+    changeSort: (sortOption: SortOption) => void;
+    changeFilterOption: ChangeFilterOptionHandler;
+};
+type Props = {
+    apiKey: string;
+    sort: SortOption;
+    children: (args: HeadlessProps) => JSX.Element;
+};
+declare function GoogleFontsList({ apiKey, sort, children }: Props): JSX.Element;
+export default GoogleFontsList;

package/dist/src/sub/GoogleFontkit/headless/GoogleFontsList.js

@@ -0,0 +1,145 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = require("react");
+var getGoogleWebFonts_1 = __importDefault(require("../api/getGoogleWebFonts"));
+var getFontId_1 = __importDefault(require("../utils/getFontId"));
+var DEFAULT_CATEGORIES = [
+    'serif',
+    'sans-serif',
+    'display',
+    'handwriting',
+    'monospace'
+];
+function GoogleFontsList(_a) {
+    var apiKey = _a.apiKey, sort = _a.sort, children = _a.children;
+    var _b = (0, react_1.useState)(false), isLoading = _b[0], setIsLoading = _b[1];
+    var _c = (0, react_1.useState)([]), fonts = _c[0], setFonts = _c[1];
+    var _d = (0, react_1.useState)({
+        searchQuery: '',
+        categories: DEFAULT_CATEGORIES,
+        subsets: []
+    }), filterOptions = _d[0], setFilterOptions = _d[1];
+    (0, react_1.useEffect)(function () {
+        function call() {
+            return __awaiter(this, void 0, void 0, function () {
+                var items;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0:
+                            setIsLoading(true);
+                            return [4 /*yield*/, (0, getGoogleWebFonts_1.default)({
+                                    key: apiKey,
+                                    sort: sort
+                                })];
+                        case 1:
+                            items = (_a.sent()).items;
+                            setFonts(items.map(function (item) { return (__assign(__assign({}, item), { id: (0, getFontId_1.default)(item.family) })); }));
+                            setIsLoading(false);
+                            return [2 /*return*/];
+                    }
+                });
+            });
+        }
+        call();
+    }, [apiKey, sort]);
+    function changeSort(sortOption) {
+        return __awaiter(this, void 0, void 0, function () {
+            var items;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        setIsLoading(true);
+                        return [4 /*yield*/, (0, getGoogleWebFonts_1.default)({
+                                key: apiKey,
+                                sort: sortOption
+                            })];
+                    case 1:
+                        items = (_a.sent()).items;
+                        setFonts(items.map(function (item) { return (__assign(__assign({}, item), { id: (0, getFontId_1.default)(item.family) })); }));
+                        setIsLoading(false);
+                        return [2 /*return*/];
+                }
+            });
+        });
+    }
+    function changeFilterOption(arg) {
+        var name = arg.name, value = arg.value;
+        setFilterOptions(function (prev) {
+            var _a;
+            return (__assign(__assign({}, prev), (_a = {}, _a[name] = value, _a)));
+        });
+    }
+    var filteredFonts = fonts.filter(function (font) {
+        var categories = filterOptions.categories, searchQuery = filterOptions.searchQuery, subsets = filterOptions.subsets;
+        var isSelectedCategory = categories.includes(font.category);
+        var query = searchQuery.toLocaleLowerCase().trim();
+        var matchSearchQuery = font.family.toLocaleLowerCase().includes(query);
+        if (!matchSearchQuery) {
+            return false;
+        }
+        var hasSomeScript = subsets.length > 0 ? font.subsets.some(function (subset) { return subsets.includes(subset); }) : true;
+        if (isSelectedCategory && hasSomeScript) {
+            return true;
+        }
+        return false;
+    });
+    return children({
+        isLoading: isLoading,
+        fonts: fonts,
+        filteredFonts: filteredFonts,
+        filterOptions: filterOptions,
+        changeSort: changeSort,
+        changeFilterOption: changeFilterOption
+    });
+}
+exports.default = GoogleFontsList;

package/dist/src/sub/GoogleFontkit/hooks/useDebounce.d.ts

@@ -0,0 +1 @@
+export default function useDebounce<T>(value: T, delay?: number): T;

package/dist/src/sub/GoogleFontkit/hooks/useDebounce.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = require("react");
+function useDebounce(value, delay) {
+    var _a = (0, react_1.useState)(value), debouncedValue = _a[0], setDebouncedValue = _a[1];
+    (0, react_1.useEffect)(function () {
+        var timer = setTimeout(function () { return setDebouncedValue(value); }, delay || 500);
+        return function () {
+            clearTimeout(timer);
+        };
+    }, [value, delay]);
+    return debouncedValue;
+}
+exports.default = useDebounce;

package/dist/src/sub/GoogleFontkit/hooks/useIntersectionObserver.d.ts

@@ -0,0 +1,6 @@
+import { RefObject } from 'react';
+interface Args extends IntersectionObserverInit {
+    freezeOnceVisible?: boolean;
+}
+declare function useIntersectionObserver(elementRef: RefObject<Element>, { threshold, root, rootMargin, freezeOnceVisible }: Args): IntersectionObserverEntry | undefined;
+export default useIntersectionObserver;

package/dist/src/sub/GoogleFontkit/hooks/useIntersectionObserver.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = require("react");
+function useIntersectionObserver(elementRef, _a) {
+    var _b = _a.threshold, threshold = _b === void 0 ? 0 : _b, _c = _a.root, root = _c === void 0 ? null : _c, _d = _a.rootMargin, rootMargin = _d === void 0 ? '0%' : _d, _e = _a.freezeOnceVisible, freezeOnceVisible = _e === void 0 ? false : _e;
+    var _f = (0, react_1.useState)(), entry = _f[0], setEntry = _f[1];
+    var frozen = (entry === null || entry === void 0 ? void 0 : entry.isIntersecting) && freezeOnceVisible;
+    // eslint-disable-next-line @typescript-eslint/no-shadow
+    var updateEntry = function (_a) {
+        var entry = _a[0];
+        setEntry(entry);
+    };
+    (0, react_1.useEffect)(function () {
+        var node = elementRef === null || elementRef === void 0 ? void 0 : elementRef.current; // DOM Ref
+        var hasIOSupport = !!window.IntersectionObserver;
+        if (!hasIOSupport || frozen || !node)
+            return;
+        var observerParams = { threshold: threshold, root: root, rootMargin: rootMargin };
+        var observer = new IntersectionObserver(updateEntry, observerParams);
+        observer.observe(node);
+        // eslint-disable-next-line consistent-return
+        return function () {
+            observer.disconnect();
+        };
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [elementRef === null || elementRef === void 0 ? void 0 : elementRef.current, threshold, root, rootMargin, frozen]);
+    return entry;
+}
+exports.default = useIntersectionObserver;

package/dist/src/sub/GoogleFontkit/index.d.ts

@@ -0,0 +1,2 @@
+export { default as GoogleFontsList } from './headless/GoogleFontsList';
+export { default as Example } from './GoogleFontsListExample';

package/dist/src/sub/GoogleFontkit/index.js

@@ -0,0 +1,10 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Example = exports.GoogleFontsList = void 0;
+var GoogleFontsList_1 = require("./headless/GoogleFontsList");
+Object.defineProperty(exports, "GoogleFontsList", { enumerable: true, get: function () { return __importDefault(GoogleFontsList_1).default; } });
+var GoogleFontsListExample_1 = require("./GoogleFontsListExample");
+Object.defineProperty(exports, "Example", { enumerable: true, get: function () { return __importDefault(GoogleFontsListExample_1).default; } });

package/dist/src/sub/GoogleFontkit/types.d.ts

@@ -0,0 +1,44 @@
+export type Category = 'sans-serif' | 'serif' | 'display' | 'handwriting' | 'monospace';
+export type Subset = 'arabic' | 'bengali' | 'chinese-simplified' | 'chinese-traditional' | 'cyrillic' | 'cyrillic-ext' | 'devanagari' | 'greek' | 'greek-ext' | 'gujarati' | 'gurmukhi' | 'hebrew' | 'japanese' | 'kannada' | 'khmer' | 'korean' | 'latin' | 'latin-ext' | 'malayalam' | 'myanmar' | 'oriya' | 'sinhala' | 'tamil' | '​telugu' | 'thai' | 'vietnamese';
+export type SortOption = 'alpha' | 'popularity' | 'date' | 'trending';
+export type Variant = '100' | '100italic' | '200' | '200italic' | '300' | '300italic' | 'regular' | 'italic' | '500' | '500italic' | '600' | '600italic' | '700' | '700italic' | '800' | '800italic' | '900' | '900italic';
+export interface Font {
+    family: string;
+    id: string;
+    category: Category;
+    subsets: Subset[];
+    variants: Variant[];
+    kind?: string;
+    version?: string;
+    lastModified?: string;
+    files?: Record<Variant, string>;
+}
+export declare const FONT_FAMILY_DEFAULT = "Open Sans";
+export type FontList = Map<string, Font>;
+export interface Options {
+    pickerId: string;
+    families: string[];
+    categories: Category[];
+    scripts: Subset[];
+    variants: Variant[];
+    filter: (font: Font) => boolean;
+    limit: number;
+    sort: SortOption;
+}
+export declare const OPTIONS_DEFAULTS: Options;
+export type FilterOptionHandlerArgType = {
+    name: 'searchQuery';
+    value: string;
+} | {
+    name: 'categories';
+    value: Category[];
+} | {
+    name: 'subsets';
+    value: Subset[];
+};
+export type ChangeFilterOptionHandler = (arg: FilterOptionHandlerArgType) => void;
+export type FilterOptionType = {
+    searchQuery: string;
+    categories: Category[];
+    subsets: Subset[];
+};

package/dist/src/sub/GoogleFontkit/types.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.OPTIONS_DEFAULTS = exports.FONT_FAMILY_DEFAULT = void 0;
+exports.FONT_FAMILY_DEFAULT = 'Open Sans';
+exports.OPTIONS_DEFAULTS = {
+    pickerId: '',
+    families: [],
+    categories: [],
+    scripts: ['latin'],
+    variants: ['regular'],
+    filter: function () { return true; },
+    limit: 50,
+    sort: 'alpha'
+};