@kanda-libs/ks-component-ts 0.2.254 → 0.2.256-qa

package/app/.yalc/@kanda-libs/ks-design-library/src/hooks/useToast/constants.ts

@@ -0,0 +1,56 @@
+const BASE_PROPS = {
+  showIcon: true,
+  container: {
+    className: 'flex flex-row w-full',
+  },
+  icon: {
+    size: 24,
+    className: 'my-auto mr-3',
+  },
+  span: {
+    className: 'text-style-g-em text-neutral-900 my-auto',
+  },
+};
+
+const INFO_MESSAGE_PROPS = {
+  ...BASE_PROPS,
+  icon: {
+    ...BASE_PROPS.icon,
+    icon: 'info',
+    stroke: 'neutral-600',
+  },
+};
+
+const ERROR_MESSAGE_PROPS = {
+  ...BASE_PROPS,
+  icon: {
+    ...BASE_PROPS.icon,
+    icon: 'error',
+    stroke: 'red-200',
+  },
+};
+
+const SUCCESS_MESSAGE_PROPS = {
+  ...BASE_PROPS,
+  icon: {
+    ...BASE_PROPS.icon,
+    icon: 'check',
+    stroke: 'turquoise-300',
+  },
+};
+
+const WARNING_MESSAGE_PROPS = {
+  ...BASE_PROPS,
+  icon: {
+    ...BASE_PROPS.icon,
+    icon: 'warning',
+    stroke: 'orange-200',
+  },
+};
+
+export const TOAST_MESSAGE_FUNCTION_PROPS = {
+  info: INFO_MESSAGE_PROPS,
+  error: ERROR_MESSAGE_PROPS,
+  success: SUCCESS_MESSAGE_PROPS,
+  warning: WARNING_MESSAGE_PROPS,
+};

package/app/.yalc/@kanda-libs/ks-design-library/src/hooks/useToast/index.tsx

@@ -0,0 +1,49 @@
+import React from 'react';
+import { toast, type ToastOptions } from 'react-toastify';
+import type { ToastContent } from 'react-toastify/dist/types';
+import Message, { type MessageProps } from './Message';
+import { TOAST_MESSAGE_FUNCTION_PROPS } from './constants';
+import type {
+  ToastMessageFunction,
+  ToastMessageFunctionType,
+  ToastId,
+} from './types';
+
+export interface ToastHook {
+  toast: (content: ToastContent, options?: ToastOptions) => ToastId;
+  dismiss: (id: ToastId) => void;
+  showInfo: ToastMessageFunction;
+  showError: ToastMessageFunction;
+  showWarning: ToastMessageFunction;
+  showSuccess: ToastMessageFunction;
+}
+
+export default function useToast(): ToastHook {
+  function createToastMessageFunction(
+    type: ToastMessageFunctionType,
+  ): ToastMessageFunction {
+    return (
+      message: string,
+      messageProps: Omit<MessageProps, 'message'> = {},
+      options: ToastOptions = {},
+    ): ToastId => {
+      const props = {
+        ...TOAST_MESSAGE_FUNCTION_PROPS[type],
+        ...messageProps,
+      };
+
+      return toast[type](<Message message={message} {...props} />, options);
+    };
+  }
+
+  const dismiss = toast.dismiss;
+
+  return {
+    toast,
+    dismiss,
+    showInfo: createToastMessageFunction('info'),
+    showError: createToastMessageFunction('error'),
+    showWarning: createToastMessageFunction('warning'),
+    showSuccess: createToastMessageFunction('success'),
+  };
+}

package/app/.yalc/@kanda-libs/ks-design-library/src/hooks/useToast/types.d.ts

@@ -0,0 +1,14 @@
+import { Id, ToastOptions } from 'react-toastify';
+import { MessageProps } from '~/hooks/useToast/Message';
+import { TOAST_MESSAGE_FUNCTION_PROPS } from '~/hooks/useToast/constants';
+
+export type ToastId = Id;
+
+export type ToastMessageFunction = (
+  message: string,
+  messageProps?: Omit<MessageProps, 'message'>,
+  options?: ToastOptions,
+) => ToastId;
+
+export type ToastMessageFunctionType =
+  keyof typeof TOAST_MESSAGE_FUNCTION_PROPS;

package/app/.yalc/@kanda-libs/ks-design-library/src/hooks/useVariants.ts

@@ -0,0 +1,22 @@
+import { useContext } from 'react';
+import type { Variants } from '~/types';
+import { Context } from '~/components/LoadingProvider/Context';
+import useIsDesktop from '~/hooks/useIsDesktop';
+
+export interface Hook extends Variants {
+  media: 'desktop' | 'mobile';
+  loading: boolean;
+}
+
+export default function useVariants(variants: Variants): Hook {
+  const isDesktop = useIsDesktop();
+  const loading = useContext(Context);
+
+  const media = isDesktop ? 'desktop' : 'mobile';
+
+  return {
+    media,
+    loading,
+    ...variants,
+  };
+}

package/app/.yalc/@kanda-libs/ks-design-library/src/index.ts

@@ -0,0 +1,17 @@
+import Logo from '~/components/Logo';
+
+export * from './components';
+export * from './hooks';
+
+export { Logo };
+
+export type { IconProps } from '~/components/Icon/types';
+
+export type {
+  ButtonTextVariant,
+  ButtonLinkVariant,
+  ButtonIconVariant,
+  ButtonInlineLinkVariant,
+} from '~/components/Button';
+
+export type { FuseHit } from '~/hooks/useFuse';

package/app/.yalc/@kanda-libs/ks-design-library/src/moduleTypes.d.ts

@@ -0,0 +1 @@
+declare module '*.svg';