@liner-fe/prism 2.4.10 → 2.4.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/illust.js +6 -2
- package/lib/illust.js.map +1 -1
- package/lib/index.js +6 -2
- package/lib/index.js.map +1 -1
- package/package.json +1 -1
package/lib/illust.js
CHANGED
|
@@ -37,7 +37,10 @@ __export(illust_exports, {
|
|
|
37
37
|
module.exports = __toCommonJS(illust_exports);
|
|
38
38
|
|
|
39
39
|
// src/constants/illust/size.ts
|
|
40
|
-
var ratio = {
|
|
40
|
+
var ratio = {
|
|
41
|
+
"4:3": { width: 180, height: 135 },
|
|
42
|
+
"1:1": { width: 250, height: 250 }
|
|
43
|
+
};
|
|
41
44
|
var illustSize = {
|
|
42
45
|
"hero-gift": ratio["1:1"],
|
|
43
46
|
"hero-search": ratio["1:1"],
|
|
@@ -61,7 +64,8 @@ var illustSize = {
|
|
|
61
64
|
"spot-search-4": ratio["4:3"],
|
|
62
65
|
"spot-search-5": ratio["4:3"],
|
|
63
66
|
"spot-search": ratio["4:3"],
|
|
64
|
-
"spot-write": ratio["4:3"]
|
|
67
|
+
"spot-write": ratio["4:3"],
|
|
68
|
+
"spot-gift": ratio["4:3"]
|
|
65
69
|
};
|
|
66
70
|
|
|
67
71
|
// src/components/Illust/index.tsx
|
package/lib/illust.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
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 = {
|
|
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 = {\n '4:3': { width: 180, height: 135 },\n '1:1': { width: 250, height: 250 },\n};\n\nexport const illustSize: Partial<Record<IllustType, { width: number; height: number }>> = {\n 'hero-gift': ratio['1:1'],\n 'hero-search': ratio['1:1'],\n 'mini-documents-2': ratio['1:1'],\n 'mini-documents-3': ratio['1:1'],\n 'mini-documents-4': ratio['1:1'],\n 'mini-documents-5': ratio['1:1'],\n 'mini-documents': ratio['1:1'],\n 'mini-egg': ratio['1:1'],\n 'mini-gift': ratio['1:1'],\n 'mini-graduation_hat': ratio['1:1'],\n 'mini-search': ratio['1:1'],\n 'mini-ticket': ratio['1:1'],\n 'mini-window': ratio['1:1'],\n 'spot-catch_star': ratio['4:3'],\n 'spot-clap': ratio['4:3'],\n 'spot-empty': ratio['4:3'],\n 'spot-no_search': ratio['4:3'],\n 'spot-search-2': ratio['4:3'],\n 'spot-search-3': ratio['4:3'],\n 'spot-search-4': ratio['4:3'],\n 'spot-search-5': ratio['4:3'],\n 'spot-search': ratio['4:3'],\n 'spot-write': ratio['4:3'],\n 'spot-gift': 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\nexport interface IllustProps 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: IllustProps) => {\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 {...props}\n alt={currentSourceByColorTheme}\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 ({\n name,\n isDark = false,\n}: {\n name: IllustType;\n isDark?: boolean;\n}) => await fetch(`${ILLUST}${isDark ? '/dark/' : '/light/'}${name}.webp`);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACEA,IAAM,QAAQ;AAAA,EACZ,OAAO,EAAE,OAAO,KAAK,QAAQ,IAAI;AAAA,EACjC,OAAO,EAAE,OAAO,KAAK,QAAQ,IAAI;AACnC;AAEO,IAAM,aAA6E;AAAA,EACxF,aAAa,MAAM,KAAK;AAAA,EACxB,eAAe,MAAM,KAAK;AAAA,EAC1B,oBAAoB,MAAM,KAAK;AAAA,EAC/B,oBAAoB,MAAM,KAAK;AAAA,EAC/B,oBAAoB,MAAM,KAAK;AAAA,EAC/B,oBAAoB,MAAM,KAAK;AAAA,EAC/B,kBAAkB,MAAM,KAAK;AAAA,EAC7B,YAAY,MAAM,KAAK;AAAA,EACvB,aAAa,MAAM,KAAK;AAAA,EACxB,uBAAuB,MAAM,KAAK;AAAA,EAClC,eAAe,MAAM,KAAK;AAAA,EAC1B,eAAe,MAAM,KAAK;AAAA,EAC1B,eAAe,MAAM,KAAK;AAAA,EAC1B,mBAAmB,MAAM,KAAK;AAAA,EAC9B,aAAa,MAAM,KAAK;AAAA,EACxB,cAAc,MAAM,KAAK;AAAA,EACzB,kBAAkB,MAAM,KAAK;AAAA,EAC7B,iBAAiB,MAAM,KAAK;AAAA,EAC5B,iBAAiB,MAAM,KAAK;AAAA,EAC5B,iBAAiB,MAAM,KAAK;AAAA,EAC5B,iBAAiB,MAAM,KAAK;AAAA,EAC5B,eAAe,MAAM,KAAK;AAAA,EAC1B,cAAc,MAAM,KAAK;AAAA,EACzB,aAAa,MAAM,KAAK;AAC1B;;;AC/BA,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,UAAuB;AAC5C,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,MACE,GAAG;AAAA,MACJ,KAAK;AAAA,MACL,KAAK;AAAA,MACL;AAAA,MACA,QAAQ,cAAc,QAAQ,cAAc;AAAA;AAAA,EAC9C,GACF;AAEJ,GA7BsB;;;AGff,IAAM,iBAAiB,8BAAO;AAAA,EACnC;AAAA,EACA,SAAS;AACX,MAGM,MAAM,MAAM,GAAG,MAAM,GAAG,SAAS,WAAW,SAAS,GAAG,IAAI,OAAO,GAN3C;","names":["Image"]}
|
package/lib/index.js
CHANGED
|
@@ -17089,7 +17089,10 @@ var import_cva14 = require("cva");
|
|
|
17089
17089
|
var import_clsx20 = __toESM(require("clsx"));
|
|
17090
17090
|
|
|
17091
17091
|
// src/constants/illust/size.ts
|
|
17092
|
-
var ratio = {
|
|
17092
|
+
var ratio = {
|
|
17093
|
+
"4:3": { width: 180, height: 135 },
|
|
17094
|
+
"1:1": { width: 250, height: 250 }
|
|
17095
|
+
};
|
|
17093
17096
|
var illustSize = {
|
|
17094
17097
|
"hero-gift": ratio["1:1"],
|
|
17095
17098
|
"hero-search": ratio["1:1"],
|
|
@@ -17113,7 +17116,8 @@ var illustSize = {
|
|
|
17113
17116
|
"spot-search-4": ratio["4:3"],
|
|
17114
17117
|
"spot-search-5": ratio["4:3"],
|
|
17115
17118
|
"spot-search": ratio["4:3"],
|
|
17116
|
-
"spot-write": ratio["4:3"]
|
|
17119
|
+
"spot-write": ratio["4:3"],
|
|
17120
|
+
"spot-gift": ratio["4:3"]
|
|
17117
17121
|
};
|
|
17118
17122
|
|
|
17119
17123
|
// src/components/Illust/index.tsx
|