@liner-fe/prism 2.1.57 → 2.1.59

package/lib/illust.cjs

@@ -0,0 +1,121 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/illust.ts
+var illust_exports = {};
+__export(illust_exports, {
+  Illust: () => Illust,
+  prefetchIllust: () => prefetchIllust
+});
+module.exports = __toCommonJS(illust_exports);
+
+// src/constants/illust/size.ts
+var ratio = { "16:9": { width: 1344, height: 756 }, "4:3": { width: 1008, height: 756 } };
+var illustSize = {
+  "object-pencil_paper-16_9": ratio["16:9"],
+  "object-smoke-16_9": ratio["16:9"],
+  "person-standing_with_a_star-16_9": ratio["16:9"],
+  "person-searching-16_9": ratio["16:9"],
+  "person-cheerup-16_9": ratio["16:9"],
+  "object-graduation_cap_pencil-4_3": ratio["4:3"],
+  "object-book_pencil-4_3": ratio["4:3"],
+  "object-puzzle-4_3": ratio["4:3"],
+  "object-magnifying_glass-4_3": ratio["4:3"],
+  "object-lock-4_3": ratio["4:3"],
+  "object-empty_box-4_3": ratio["4:3"],
+  "person-working_01-4_3": ratio["4:3"],
+  "person-searching_01-4_3": ratio["4:3"],
+  "person-worried_01-4_3": ratio["4:3"],
+  "person-worried_02-4_3": ratio["4:3"],
+  "person-worried_03-4_3": ratio["4:3"],
+  "person-worried_04-4_3": ratio["4:3"],
+  "person-working_02-4_3": ratio["4:3"],
+  "person-bye-4_3": ratio["4:3"],
+  "person-space_in_work-4_3": ratio["4:3"],
+  "person-cheerup-4_3": ratio["4:3"]
+};
+
+// src/components/Illust/index.tsx
+var import_image = __toESM(require("next/image"), 1);
+
+// src/constants/illust/path.ts
+var ILLUST = "/illust";
+var DARK_MODE_ILLUST_PREFIX = `${ILLUST}/dark/`;
+var LIGHT_MODE_ILLUST_PREFIX = `${ILLUST}/light/`;
+
+// src/hooks/useIllust.ts
+var import_design_token = require("@liner-fe/design-token");
+var useIllust = /* @__PURE__ */ __name(({ darkSrc, src }) => {
+  const { isDarkMode } = (0, import_design_token.useDarkTheme)();
+  const sourcePrefix = (() => {
+    if (isDarkMode) {
+      if (darkSrc?.inverse) {
+        return LIGHT_MODE_ILLUST_PREFIX;
+      }
+      return DARK_MODE_ILLUST_PREFIX;
+    }
+    if (src.inverse === false) {
+      return DARK_MODE_ILLUST_PREFIX;
+    }
+    return LIGHT_MODE_ILLUST_PREFIX;
+  })();
+  const currentSourceByColorTheme = isDarkMode ? darkSrc?.name || src.name : src.name;
+  return { sourcePrefix, currentSourceByColorTheme, isDarkMode };
+}, "useIllust");
+
+// src/components/Illust/index.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var Illust = /* @__PURE__ */ __name((props) => {
+  const { src, width, margin } = props;
+  const { sourcePrefix, currentSourceByColorTheme } = useIllust({
+    darkSrc: src.dark,
+    src: src.light
+  });
+  const aspectRatio = illustSize[currentSourceByColorTheme] ? illustSize[currentSourceByColorTheme].width / illustSize[currentSourceByColorTheme].height : void 0;
+  const css = {
+    width,
+    margin
+  };
+  const source = `${sourcePrefix}${currentSourceByColorTheme}.webp`;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: css, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_image.default,
+    {
+      alt: currentSourceByColorTheme,
+      ...props,
+      src: source,
+      width,
+      height: aspectRatio ? width / aspectRatio : width
+    }
+  ) });
+}, "Illust");
+
+// src/utils/illust.ts
+var prefetchIllust = /* @__PURE__ */ __name(async ({ name, isDark = false }) => await fetch(`${ILLUST}${isDark ? "/dark/" : "/light/"}${name}.webp`), "prefetchIllust");
+//# sourceMappingURL=illust.cjs.map

package/lib/illust.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/illust.ts","../src/constants/illust/size.ts","../src/components/Illust/index.tsx","../src/constants/illust/path.ts","../src/hooks/useIllust.ts","../src/utils/illust.ts"],"sourcesContent":["export * from './components/Illust';\nexport * from './utils/illust';\n","import { IllustType } from '@/types/illust';\n\nconst ratio = { '16:9': { width: 1344, height: 756 }, '4:3': { width: 1008, height: 756 } };\n\nexport const illustSize: Partial<Record<IllustType, { width: number; height: number }>> = {\n  'object-pencil_paper-16_9': ratio['16:9'],\n  'object-smoke-16_9': ratio['16:9'],\n  'person-standing_with_a_star-16_9': ratio['16:9'],\n  'person-searching-16_9': ratio['16:9'],\n  'person-cheerup-16_9': ratio['16:9'],\n  'object-graduation_cap_pencil-4_3': ratio['4:3'],\n  'object-book_pencil-4_3': ratio['4:3'],\n  'object-puzzle-4_3': ratio['4:3'],\n  'object-magnifying_glass-4_3': ratio['4:3'],\n  'object-lock-4_3': ratio['4:3'],\n  'object-empty_box-4_3': ratio['4:3'],\n  'person-working_01-4_3': ratio['4:3'],\n  'person-searching_01-4_3': ratio['4:3'],\n  'person-worried_01-4_3': ratio['4:3'],\n  'person-worried_02-4_3': ratio['4:3'],\n  'person-worried_03-4_3': ratio['4:3'],\n  'person-worried_04-4_3': ratio['4:3'],\n  'person-working_02-4_3': ratio['4:3'],\n  'person-bye-4_3': ratio['4:3'],\n  'person-space_in_work-4_3': ratio['4:3'],\n  'person-cheerup-4_3': ratio['4:3'],\n};\n","import { illustSize } from '@/constants/illust/size';\nimport Image, { ImageProps } from 'next/image';\nimport { CSSProperties } from 'react';\nimport { useIllust } from '@/hooks/useIllust';\nimport { IllustType } from '@/types/illust';\nimport { Property } from 'csstype';\n\nexport interface Source<T extends false | true = true> {\n  name: IllustType;\n  inverse?: T;\n}\n\ninterface IProps extends Omit<ImageProps, 'alt' | 'width' | 'height' | 'fill' | 'src'> {\n  width: number;\n  src: { light: Source<false>; dark?: Source };\n  margin?: Property.Margin<string>;\n}\n\nexport const Illust = (props: IProps) => {\n  const { src, width, margin } = props;\n  const { sourcePrefix, currentSourceByColorTheme } = useIllust({\n    darkSrc: src.dark,\n    src: src.light,\n  });\n\n  const aspectRatio = illustSize[currentSourceByColorTheme]\n    ? illustSize[currentSourceByColorTheme].width / illustSize[currentSourceByColorTheme].height\n    : undefined;\n\n  const css: CSSProperties = {\n    width,\n    margin,\n  };\n\n  const source = `${sourcePrefix}${currentSourceByColorTheme}.webp`;\n\n  return (\n    <div style={css}>\n      <Image\n        alt={currentSourceByColorTheme}\n        {...props}\n        src={source}\n        width={width}\n        height={aspectRatio ? width / aspectRatio : width}\n      />\n    </div>\n  );\n};\n","export const ILLUST = '/illust';\n\nexport const DARK_MODE_ILLUST_PREFIX = `${ILLUST}/dark/`;\nexport const LIGHT_MODE_ILLUST_PREFIX = `${ILLUST}/light/`;\n","import { Source } from '@/components/Illust';\nimport { DARK_MODE_ILLUST_PREFIX, LIGHT_MODE_ILLUST_PREFIX } from '@/constants/illust/path';\nimport { useDarkTheme } from '@liner-fe/design-token';\n\nexport const useIllust = ({ darkSrc, src }: { darkSrc?: Source; src: Source<false> }) => {\n  const { isDarkMode } = useDarkTheme();\n\n  const sourcePrefix = (() => {\n    if (isDarkMode) {\n      if (darkSrc?.inverse) {\n        return LIGHT_MODE_ILLUST_PREFIX;\n      }\n\n      return DARK_MODE_ILLUST_PREFIX;\n    }\n\n    if (src.inverse === false) {\n      return DARK_MODE_ILLUST_PREFIX;\n    }\n\n    return LIGHT_MODE_ILLUST_PREFIX;\n  })();\n\n  const currentSourceByColorTheme = isDarkMode ? darkSrc?.name || src.name : src.name;\n\n  return { sourcePrefix, currentSourceByColorTheme, isDarkMode };\n};\n","import { ILLUST } from '@/constants/illust/path';\nimport { IllustType } from '@/types/illust';\n\nexport const prefetchIllust = async ({ name, isDark = false }: { name: IllustType; isDark?: boolean }) =>\n  await fetch(`${ILLUST}${isDark ? '/dark/' : '/light/'}${name}.webp`);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACEA,IAAM,QAAQ,EAAE,QAAQ,EAAE,OAAO,MAAM,QAAQ,IAAI,GAAG,OAAO,EAAE,OAAO,MAAM,QAAQ,IAAI,EAAE;AAEnF,IAAM,aAA6E;AAAA,EACxF,4BAA4B,MAAM,MAAM;AAAA,EACxC,qBAAqB,MAAM,MAAM;AAAA,EACjC,oCAAoC,MAAM,MAAM;AAAA,EAChD,yBAAyB,MAAM,MAAM;AAAA,EACrC,uBAAuB,MAAM,MAAM;AAAA,EACnC,oCAAoC,MAAM,KAAK;AAAA,EAC/C,0BAA0B,MAAM,KAAK;AAAA,EACrC,qBAAqB,MAAM,KAAK;AAAA,EAChC,+BAA+B,MAAM,KAAK;AAAA,EAC1C,mBAAmB,MAAM,KAAK;AAAA,EAC9B,wBAAwB,MAAM,KAAK;AAAA,EACnC,yBAAyB,MAAM,KAAK;AAAA,EACpC,2BAA2B,MAAM,KAAK;AAAA,EACtC,yBAAyB,MAAM,KAAK;AAAA,EACpC,yBAAyB,MAAM,KAAK;AAAA,EACpC,yBAAyB,MAAM,KAAK;AAAA,EACpC,yBAAyB,MAAM,KAAK;AAAA,EACpC,yBAAyB,MAAM,KAAK;AAAA,EACpC,kBAAkB,MAAM,KAAK;AAAA,EAC7B,4BAA4B,MAAM,KAAK;AAAA,EACvC,sBAAsB,MAAM,KAAK;AACnC;;;ACzBA,mBAAkC;;;ACD3B,IAAM,SAAS;AAEf,IAAM,0BAA0B,GAAG,MAAM;AACzC,IAAM,2BAA2B,GAAG,MAAM;;;ACDjD,0BAA6B;AAEtB,IAAM,YAAY,wBAAC,EAAE,SAAS,IAAI,MAAgD;AACvF,QAAM,EAAE,WAAW,QAAI,kCAAa;AAEpC,QAAM,gBAAgB,MAAM;AAC1B,QAAI,YAAY;AACd,UAAI,SAAS,SAAS;AACpB,eAAO;AAAA,MACT;AAEA,aAAO;AAAA,IACT;AAEA,QAAI,IAAI,YAAY,OAAO;AACzB,aAAO;AAAA,IACT;AAEA,WAAO;AAAA,EACT,GAAG;AAEH,QAAM,4BAA4B,aAAa,SAAS,QAAQ,IAAI,OAAO,IAAI;AAE/E,SAAO,EAAE,cAAc,2BAA2B,WAAW;AAC/D,GAtByB;;;AFkCnB;AApBC,IAAM,SAAS,wBAAC,UAAkB;AACvC,QAAM,EAAE,KAAK,OAAO,OAAO,IAAI;AAC/B,QAAM,EAAE,cAAc,0BAA0B,IAAI,UAAU;AAAA,IAC5D,SAAS,IAAI;AAAA,IACb,KAAK,IAAI;AAAA,EACX,CAAC;AAED,QAAM,cAAc,WAAW,yBAAyB,IACpD,WAAW,yBAAyB,EAAE,QAAQ,WAAW,yBAAyB,EAAE,SACpF;AAEJ,QAAM,MAAqB;AAAA,IACzB;AAAA,IACA;AAAA,EACF;AAEA,QAAM,SAAS,GAAG,YAAY,GAAG,yBAAyB;AAE1D,SACE,4CAAC,SAAI,OAAO,KACV;AAAA,IAAC,aAAAA;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACJ,GAAG;AAAA,MACJ,KAAK;AAAA,MACL;AAAA,MACA,QAAQ,cAAc,QAAQ,cAAc;AAAA;AAAA,EAC9C,GACF;AAEJ,GA7BsB;;;AGff,IAAM,iBAAiB,8BAAO,EAAE,MAAM,SAAS,MAAM,MAC1D,MAAM,MAAM,GAAG,MAAM,GAAG,SAAS,WAAW,SAAS,GAAG,IAAI,OAAO,GADvC;","names":["Image"]}

package/lib/illust.d.cts

@@ -0,0 +1,28 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ImageProps } from 'next/image';
+import { Property } from 'csstype';
+
+type LightIllustType = "decoration-airplane-1_1" | "decoration-bulb-1_1" | "decoration-car-1_1" | "decoration-coffee-1_1" | "decoration-english-1_1" | "decoration-flag-1_1" | "decoration-hourglass-1_1" | "decoration-money-1_1" | "decoration-palm-1_1" | "decoration-rocket-1_1" | "decoration-shake_hands-1_1" | "decoration-star_01-1_1" | "decoration-star_02-1_1" | "decoration-star_03-1_1" | "decoration-star_04-1_1" | "decoration-star_05-1_1" | "decoration-star_06-1_1" | "decoration-star_07-1_1" | "decoration-star_08-1_1" | "decoration-star_09-1_1" | "decoration-star_10-1_1" | "decoration-star_11-1_1" | "decoration-tennis-1_1" | "object-bomb-1_1" | "object-book_pencil-4_3" | "object-brain-1_1" | "object-clap-1_1" | "object-documents_02-1_1" | "object-empty_box-1_1" | "object-empty_box-4_3" | "object-feather_pen-1_1" | "object-folder_01-1_1" | "object-folder_02-1_1" | "object-free_ticket-1_1" | "object-gift-1_1" | "object-give_gift-1_1" | "object-graduation_cap_pencil-4_3" | "object-lock-4_3" | "object-magnifying_glass-1_1" | "object-magnifying_glass-4_3" | "object-megaphone-1_1" | "object-paper-1_1" | "object-pencil_paper-16_9" | "object-puzzle-4_3" | "object-smoke-16_9" | "object-university_01-1_1" | "object-university_02-1_1" | "object_documents_01-1_1" | "object_find_man-1_1" | "person-ai_writing-1_1" | "person-bye-4_3" | "person-cheerup-16_9" | "person-cheerup-4_3" | "person-holding_a_book-1_1" | "person-introduce-1_1" | "person-introduce-pro-1_1" | "person-make_profile-1_1" | "person-raining-1_1" | "person-searching-16_9" | "person-searching_01-1_1" | "person-searching_01-4_3" | "person-searching_02-1_1" | "person-space_in_work-4_3" | "person-standing_with_a_star-16_9" | "person-time_out_01-1_1" | "person-time_out_02-1_1" | "person-time_out_03-1_1" | "person-time_out_04-1_1" | "person-time_out_05-1_1" | "person-understand-1_1" | "person-working_01-4_3" | "person-working_02-4_3" | "person-worried-1_1" | "person-worried_01-4_3" | "person-worried_02-4_3" | "person-worried_03-4_3" | "person-worried_04-4_3" | "person-writing_01-1_1" | "person-writing_02-1_1";
+type DarkIllustType = "decoration-airplane-1_1" | "decoration-bulb-1_1" | "decoration-car-1_1" | "decoration-flag-1_1" | "decoration-hourglass-1_1" | "decoration-rocket-1_1" | "decoration-star_01-1_1" | "decoration-star_02-1_1" | "decoration-star_03-1_1" | "decoration-star_04-1_1" | "decoration-star_05-1_1" | "decoration-star_06-1_1" | "decoration-star_07-1_1" | "decoration-star_08-1_1" | "decoration-star_09-1_1" | "decoration-star_10-1_1" | "decoration-star_11-1_1" | "object-bomb-1_1" | "object-brain-1_1" | "object-clap-1_1" | "object-documents_02-1_1" | "object-empty_box-1_1" | "object-empty_box-4_3" | "object-folder_01-1_1" | "object-folder_02-1_1" | "object-free_ticket-1_1" | "object-gift-1_1" | "object-give_gift-1_1" | "object-graduation_cap_pencil-4_3" | "object-lock-4_3" | "object-magnifying_glass-1_1" | "object-magnifying_glass-4_3" | "object-megaphone-1_1" | "object-paper-1_1" | "object-pencil_paper-16_9" | "object-puzzle-4_3" | "object-smoke-16_9" | "object_documents_01-1_1" | "object_find_man-1_1" | "person-bye-4_3" | "person-holding_a_book-1_1" | "person-introduce-1_1" | "person-introduce-pro-1_1" | "person-make_profile-1_1" | "person-raining-1_1" | "person-searching-16_9" | "person-searching_01-1_1" | "person-searching_01-4_3" | "person-searching_02-1_1" | "person-space_in_work-4_3" | "person-standing_with_a_star-16_9" | "person-time_out_01-1_1" | "person-time_out_02-1_1" | "person-time_out_03-1_1" | "person-time_out_04-1_1" | "person-time_out_05-1_1" | "person-working_01-4_3" | "person-worried-1_1" | "person-worried_01-4_3" | "person-worried_02-4_3" | "person-worried_03-4_3" | "person-worried_04-4_3" | "person-writing_01-1_1";
+type IllustType = DarkIllustType | LightIllustType;
+
+interface Source<T extends false | true = true> {
+    name: IllustType;
+    inverse?: T;
+}
+interface IProps extends Omit<ImageProps, 'alt' | 'width' | 'height' | 'fill' | 'src'> {
+    width: number;
+    src: {
+        light: Source<false>;
+        dark?: Source;
+    };
+    margin?: Property.Margin<string>;
+}
+declare const Illust: (props: IProps) => react_jsx_runtime.JSX.Element;
+
+declare const prefetchIllust: ({ name, isDark }: {
+    name: IllustType;
+    isDark?: boolean;
+}) => Promise<Response>;
+
+export { Illust, type Source, prefetchIllust };