@liner-fe/prism 2.1.8 → 2.1.9

package/lib/components/Button/index.d.ts

@@ -2,45 +2,34 @@ import { ButtonHTMLAttributes } from 'react';
 import { VariantProps } from 'class-variance-authority';
 import { IconProps } from '../Icon';
 declare const defaultButtonVariants: (props?: ({
-    level?: "primary" | "secondary" | "tertiary" | "quaternary" | "error" | "inverse" | null | undefined;
+    level?: "primary" | "secondary" | "tertiary" | "quaternary" | "negative" | "static" | "inverse-static" | null | undefined;
     fill?: boolean | null | undefined;
     align?: "center" | "spaceBetween" | null | undefined;
     size?: "m" | "s" | "l" | "cta" | null | undefined;
     width?: "fit-content" | "full" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
-declare const textButtonVariants: (props?: ({
-    level?: "inverse-primary" | "neutral-primary" | "inverse-static-primary" | null | undefined;
-} & import("class-variance-authority/types").ClassProp) | undefined) => string;
-interface CommonButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+export interface CommonButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     as?: 'default' | 'text';
     asChild?: boolean;
 }
 export type FillType = boolean;
-export type FillLevelType = 'primary' | 'secondary' | 'tertiary' | 'quaternary' | 'error' | 'inverse';
+export type FillLevelType = 'primary' | 'secondary' | 'tertiary' | 'quaternary' | 'negative' | 'static' | 'inverse-static';
 export type FillFalseLevelType = 'primary' | 'secondary';
+export type ButtonSizeType = 'cta' | 'l' | 'm' | 's';
 type DefaultLevelType<T> = T extends true ? FillLevelType : FillFalseLevelType;
-type ButtonIconProps = Exclude<IconProps, 'size' | 'thick'>;
+export type ButtonIconProps = Exclude<IconProps, 'size' | 'thick'>;
 export interface DefaultButtonProps<T extends FillType> extends CommonButtonProps, VariantProps<typeof defaultButtonVariants> {
-    as?: 'default';
     asChild?: boolean;
     level?: DefaultLevelType<T>;
     fill?: T;
-    size?: 'cta' | 'l' | 'm' | 's';
+    size?: ButtonSizeType;
     align?: 'center' | 'spaceBetween';
     width?: 'full' | 'fit-content';
     leftIcon?: ButtonIconProps;
     rightIcon?: ButtonIconProps;
+    isLoading?: boolean;
 }
-type TextLevelType = 'inverse-primary' | 'neutral-primary' | 'inverse-static-primary';
-export interface TextButtonProps extends CommonButtonProps, VariantProps<typeof textButtonVariants> {
-    as: 'text';
-    asChild?: boolean;
-    level?: TextLevelType;
-}
-export type ButtonProps = (DefaultButtonProps<FillType> | TextButtonProps) & {
-    elementName?: string;
-};
+export type ButtonProps = DefaultButtonProps<FillType>;
 export declare const DefaultButton: import("react").ForwardRefExoticComponent<DefaultButtonProps<boolean> & import("react").RefAttributes<HTMLButtonElement>>;
-export declare const TextButton: import("react").ForwardRefExoticComponent<TextButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
 export declare const Button: import("react").ForwardRefExoticComponent<ButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
 export {};

package/lib/components/IconButton/index.d.ts

@@ -2,18 +2,19 @@ import { VariantProps } from 'class-variance-authority';
 import { ButtonHTMLAttributes } from 'react';
 import { IconProps } from '../Icon';
 declare const iconButtonVariants: (props?: ({
-    level?: "primary" | "secondary" | "tertiary" | "quaternary" | "negative" | "static" | null | undefined;
+    level?: "primary" | "secondary" | "tertiary" | "quaternary" | "negative" | "static" | "inverse-static" | "inverse" | null | undefined;
     size?: "m" | "s" | "xs" | "l" | null | undefined;
+    fill?: boolean | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
-export type IconLevelType = 'primary' | 'secondary' | 'tertiary' | 'quaternary' | 'negative' | 'static';
+export type IconButtonLevelType = 'primary' | 'secondary' | 'tertiary' | 'quaternary' | 'negative' | 'static' | 'inverse' | 'inverse-static';
 export type IconSizeType = 'l' | 'm' | 's' | 'xs';
 export interface IconButtonProps extends ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof iconButtonVariants> {
     asChild?: boolean;
-    name: IconProps['name'];
-    thick?: IconProps['thick'];
-    fill?: IconProps['fill'];
     size?: 'l' | 'm' | 's' | 'xs';
-    level?: IconLevelType;
+    fill?: boolean;
+    level?: IconButtonLevelType;
+    icon: Omit<IconProps, 'className'>;
+    isLoading?: boolean;
 }
 export declare const IconButton: import("react").ForwardRefExoticComponent<IconButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
 export {};

package/lib/components/Illust/index.d.ts

@@ -10,4 +10,8 @@ interface IProps extends Omit<ImageProps, 'alt' | 'width' | 'height' | 'fill'> {
     alignItems?: Property.AlignItems;
 }
 export declare const Illust: (props: IProps) => import("react/jsx-runtime").JSX.Element;
+export declare const prefetchIllust: ({ name, isDark }: {
+    name: IllustName;
+    isDark?: boolean;
+}) => Promise<Response>;
 export {};

package/lib/components/TextButton/index.d.ts

@@ -0,0 +1,21 @@
+import { ButtonIconProps, ButtonSizeType, CommonButtonProps } from '../../index';
+import { VariantProps } from 'class-variance-authority';
+declare const textButtonVariants: (props?: ({
+    level?: "primary" | "secondary" | "tertiary" | "inverse-static" | "inverse" | null | undefined;
+    size?: "m" | "s" | null | undefined;
+    thick?: boolean | null | undefined;
+    underline?: boolean | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+type TextLevelType = 'primary' | 'secondary' | 'tertiary' | 'inverse' | 'inverse-static';
+type TextButtonSizeType = Extract<ButtonSizeType, 'm' | 's'>;
+export interface TextButtonProps extends CommonButtonProps, VariantProps<typeof textButtonVariants> {
+    asChild?: boolean;
+    level?: TextLevelType;
+    thick?: boolean;
+    underline?: boolean;
+    size?: TextButtonSizeType;
+    leftIcon?: ButtonIconProps;
+    rightIcon?: ButtonIconProps;
+}
+export declare const TextButton: import("react").ForwardRefExoticComponent<TextButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
+export {};

package/lib/components/_ButtonLoading/index.d.ts

@@ -0,0 +1,6 @@
+type ButtonLoadingSizeType = 'm' | 's' | 'xs';
+interface ButtonLoadingProps {
+    size: ButtonLoadingSizeType;
+}
+export declare const ButtonLoading: ({ size }: ButtonLoadingProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/lib/illust.js

@@ -31,7 +31,8 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/illust.ts
 var illust_exports = {};
 __export(illust_exports, {
-  Illust: () => Illust
+  Illust: () => Illust,
+  prefetchIllust: () => prefetchIllust
 });
 module.exports = __toCommonJS(illust_exports);
 
@@ -53,10 +54,12 @@ var Illust = /* @__PURE__ */ __name((props) => {
   const { isDarkMode } = (0, import_design_token.useDarkTheme)();
   const { src, isOnlyLight, width, height, justifyContent = "center", alignItems = "center" } = props;
   const prefixSrc = (() => {
+    const darkModeIllust = `${ILLUST}/dark/`;
+    const lightModeIllust = `${ILLUST}/light/`;
     if (isDarkMode && !isOnlyLight) {
-      return `${ILLUST}/dark/`;
+      return darkModeIllust;
     }
-    return `${ILLUST}/light/`;
+    return lightModeIllust;
   })();
   const aspectRatio = illustSize[src] ? illustSize[src].width / illustSize[src].height : void 0;
   const css = {
@@ -66,10 +69,12 @@ var Illust = /* @__PURE__ */ __name((props) => {
     justifyContent,
     alignItems
   };
+  const source = `${prefixSrc}${src}.webp`;
   if (aspectRatio) {
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: css, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_image.default, { alt: src, ...props, src: `${prefixSrc}${src}.webp`, width, height: width / aspectRatio }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: css, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_image.default, { alt: src, ...props, src: source, width, height: width / aspectRatio }) });
   }
   const size = width > height ? height : width;
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: css, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_image.default, { alt: src, ...props, src: `${prefixSrc}${src}.webp`, width: size, height: size }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: css, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_image.default, { alt: src, ...props, src: source, width: size, height: size }) });
 }, "Illust");
+var prefetchIllust = /* @__PURE__ */ __name(async ({ name, isDark = false }) => await fetch(`${ILLUST}${isDark ? "/dark/" : "/light/"}${name}.webp`), "prefetchIllust");
 //# sourceMappingURL=illust.js.map

package/lib/illust.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../src/illust.ts", "../src/constants/illust/size.ts", "../src/components/Illust/index.tsx"],
-  "sourcesContent": ["export * from './components/Illust';\n", "import { IllustName } from '@/types/illust';\n\nexport const illustSize: Partial<Record<IllustName, { width: number; height: number }>> = {\n  rectangle_standing_with_a_star: { width: 2422, height: 1282 },\n  rectangle_space_work: { width: 2422, height: 1282 },\n  rectangle_searching: { width: 2422, height: 1282 },\n  rectangle_cheerup_01: { width: 2422, height: 1282 },\n  rectangle_cheerup_02: { width: 2422, height: 1282 },\n};\n", "import { illustSize } from '@/constants/illust/size';\nimport { IllustName } from '@/types/illust';\nimport { useDarkTheme } from '@liner-fe/design-token';\nimport { Property } from 'csstype';\nimport Image, { ImageProps } from 'next/image';\nimport { CSSProperties } from 'react';\n\ninterface IProps extends Omit<ImageProps, 'alt' | 'width' | 'height' | 'fill'> {\n  src: IllustName;\n  isOnlyLight?: boolean;\n  width: number;\n  height: number;\n  justifyContent?: Property.JustifyContent;\n  alignItems?: Property.AlignItems;\n}\n\nconst ILLUST = '/illust';\n\nexport const Illust = (props: IProps) => {\n  const { isDarkMode } = useDarkTheme();\n  const { src, isOnlyLight, width, height, justifyContent = 'center', alignItems = 'center' } = props;\n\n  const prefixSrc = (() => {\n    if (isDarkMode && !isOnlyLight) {\n      return `${ILLUST}/dark/`;\n    }\n\n    return `${ILLUST}/light/`;\n  })();\n\n  const aspectRatio = illustSize[src] ? illustSize[src].width / illustSize[src].height : undefined;\n\n  const css: CSSProperties = {\n    width,\n    height,\n    display: 'flex',\n    justifyContent,\n    alignItems,\n  };\n\n  if (aspectRatio) {\n    return (\n      <div style={css}>\n        <Image alt={src} {...props} src={`${prefixSrc}${src}.webp`} width={width} height={width / aspectRatio} />\n      </div>\n    );\n  }\n\n  const size = width > height ? height : width;\n\n  return (\n    <div style={css}>\n      <Image alt={src} {...props} src={`${prefixSrc}${src}.webp`} width={size} height={size} />\n    </div>\n  );\n};\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACEO,IAAM,aAA6E;AAAA,EACxF,gCAAgC,EAAE,OAAO,MAAM,QAAQ,KAAK;AAAA,EAC5D,sBAAsB,EAAE,OAAO,MAAM,QAAQ,KAAK;AAAA,EAClD,qBAAqB,EAAE,OAAO,MAAM,QAAQ,KAAK;AAAA,EACjD,sBAAsB,EAAE,OAAO,MAAM,QAAQ,KAAK;AAAA,EAClD,sBAAsB,EAAE,OAAO,MAAM,QAAQ,KAAK;AACpD;;;ACNA,0BAA6B;AAE7B,mBAAkC;AAuC1B;AA3BR,IAAM,SAAS;AAER,IAAM,SAAS,wBAAC,UAAkB;AACvC,QAAM,EAAE,WAAW,QAAI,kCAAa;AACpC,QAAM,EAAE,KAAK,aAAa,OAAO,QAAQ,iBAAiB,UAAU,aAAa,SAAS,IAAI;AAE9F,QAAM,aAAa,MAAM;AACvB,QAAI,cAAc,CAAC,aAAa;AAC9B,aAAO,GAAG,MAAM;AAAA,IAClB;AAEA,WAAO,GAAG,MAAM;AAAA,EAClB,GAAG;AAEH,QAAM,cAAc,WAAW,GAAG,IAAI,WAAW,GAAG,EAAE,QAAQ,WAAW,GAAG,EAAE,SAAS;AAEvF,QAAM,MAAqB;AAAA,IACzB;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,EACF;AAEA,MAAI,aAAa;AACf,WACE,4CAAC,SAAI,OAAO,KACV,sDAAC,aAAAA,SAAA,EAAM,KAAK,KAAM,GAAG,OAAO,KAAK,GAAG,SAAS,GAAG,GAAG,SAAS,OAAc,QAAQ,QAAQ,aAAa,GACzG;AAAA,EAEJ;AAEA,QAAM,OAAO,QAAQ,SAAS,SAAS;AAEvC,SACE,4CAAC,SAAI,OAAO,KACV,sDAAC,aAAAA,SAAA,EAAM,KAAK,KAAM,GAAG,OAAO,KAAK,GAAG,SAAS,GAAG,GAAG,SAAS,OAAO,MAAM,QAAQ,MAAM,GACzF;AAEJ,GArCsB;",
+  "sourcesContent": ["export * from './components/Illust';\n", "import { IllustName } from '@/types/illust';\n\nexport const illustSize: Partial<Record<IllustName, { width: number; height: number }>> = {\n  rectangle_standing_with_a_star: { width: 2422, height: 1282 },\n  rectangle_space_work: { width: 2422, height: 1282 },\n  rectangle_searching: { width: 2422, height: 1282 },\n  rectangle_cheerup_01: { width: 2422, height: 1282 },\n  rectangle_cheerup_02: { width: 2422, height: 1282 },\n};\n", "import { illustSize } from '@/constants/illust/size';\nimport { IllustName } from '@/types/illust';\nimport { useDarkTheme } from '@liner-fe/design-token';\nimport { Property } from 'csstype';\nimport Image, { ImageProps } from 'next/image';\nimport { CSSProperties } from 'react';\n\ninterface IProps extends Omit<ImageProps, 'alt' | 'width' | 'height' | 'fill'> {\n  src: IllustName;\n  isOnlyLight?: boolean;\n  width: number;\n  height: number;\n  justifyContent?: Property.JustifyContent;\n  alignItems?: Property.AlignItems;\n}\n\nconst ILLUST = '/illust';\n\n// \uB2E4\uD06C\uBAA8\uB4DC \uB9E8 \uCC98\uC74C \uC811\uADFC \uAE5C\uBE61\uC784 \uC774\uC288 \uD574\uACB0\nexport const Illust = (props: IProps) => {\n  const { isDarkMode } = useDarkTheme();\n  const { src, isOnlyLight, width, height, justifyContent = 'center', alignItems = 'center' } = props;\n\n  const prefixSrc = (() => {\n    const darkModeIllust = `${ILLUST}/dark/`;\n    const lightModeIllust = `${ILLUST}/light/`;\n\n    if (isDarkMode && !isOnlyLight) {\n      return darkModeIllust;\n    }\n\n    return lightModeIllust;\n  })();\n\n  const aspectRatio = illustSize[src] ? illustSize[src].width / illustSize[src].height : undefined;\n\n  const css: CSSProperties = {\n    width,\n    height,\n    display: 'flex',\n    justifyContent,\n    alignItems,\n  };\n\n  const source = `${prefixSrc}${src}.webp`;\n\n  if (aspectRatio) {\n    return (\n      <div style={css}>\n        <Image alt={src} {...props} src={source} width={width} height={width / aspectRatio} />\n      </div>\n    );\n  }\n\n  const size = width > height ? height : width;\n\n  return (\n    <div style={css}>\n      <Image alt={src} {...props} src={source} width={size} height={size} />\n    </div>\n  );\n};\n\nexport const prefetchIllust = async ({ name, isDark = false }: { name: IllustName; isDark?: boolean }) =>\n  await fetch(`${ILLUST}${isDark ? '/dark/' : '/light/'}${name}.webp`);\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACEO,IAAM,aAA6E;AAAA,EACxF,gCAAgC,EAAE,OAAO,MAAM,QAAQ,KAAK;AAAA,EAC5D,sBAAsB,EAAE,OAAO,MAAM,QAAQ,KAAK;AAAA,EAClD,qBAAqB,EAAE,OAAO,MAAM,QAAQ,KAAK;AAAA,EACjD,sBAAsB,EAAE,OAAO,MAAM,QAAQ,KAAK;AAAA,EAClD,sBAAsB,EAAE,OAAO,MAAM,QAAQ,KAAK;AACpD;;;ACNA,0BAA6B;AAE7B,mBAAkC;AA6C1B;AAjCR,IAAM,SAAS;AAGR,IAAM,SAAS,wBAAC,UAAkB;AACvC,QAAM,EAAE,WAAW,QAAI,kCAAa;AACpC,QAAM,EAAE,KAAK,aAAa,OAAO,QAAQ,iBAAiB,UAAU,aAAa,SAAS,IAAI;AAE9F,QAAM,aAAa,MAAM;AACvB,UAAM,iBAAiB,GAAG,MAAM;AAChC,UAAM,kBAAkB,GAAG,MAAM;AAEjC,QAAI,cAAc,CAAC,aAAa;AAC9B,aAAO;AAAA,IACT;AAEA,WAAO;AAAA,EACT,GAAG;AAEH,QAAM,cAAc,WAAW,GAAG,IAAI,WAAW,GAAG,EAAE,QAAQ,WAAW,GAAG,EAAE,SAAS;AAEvF,QAAM,MAAqB;AAAA,IACzB;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,EACF;AAEA,QAAM,SAAS,GAAG,SAAS,GAAG,GAAG;AAEjC,MAAI,aAAa;AACf,WACE,4CAAC,SAAI,OAAO,KACV,sDAAC,aAAAA,SAAA,EAAM,KAAK,KAAM,GAAG,OAAO,KAAK,QAAQ,OAAc,QAAQ,QAAQ,aAAa,GACtF;AAAA,EAEJ;AAEA,QAAM,OAAO,QAAQ,SAAS,SAAS;AAEvC,SACE,4CAAC,SAAI,OAAO,KACV,sDAAC,aAAAA,SAAA,EAAM,KAAK,KAAM,GAAG,OAAO,KAAK,QAAQ,OAAO,MAAM,QAAQ,MAAM,GACtE;AAEJ,GA1CsB;AA4Cf,IAAM,iBAAiB,8BAAO,EAAE,MAAM,SAAS,MAAM,MAC1D,MAAM,MAAM,GAAG,MAAM,GAAG,SAAS,WAAW,SAAS,GAAG,IAAI,OAAO,GADvC;",
   "names": ["Image"]
 }