ingred-ui 27.0.5 → 27.1.0

package/dist/components/Badge/Badge.stories.d.ts

@@ -36,4 +36,5 @@ export declare const NormalWithIcon: StoryObj<typeof Badge>;
 export declare const Pill: StoryObj<typeof Badge>;
 export declare const Signal: StoryObj<typeof Badge>;
 export declare const SizesComparison: StoryObj<typeof Badge>;
+export declare const PillColorVariations: StoryObj<typeof Badge>;
 export declare const ColorVariations: StoryObj<typeof Badge>;

package/dist/components/NotificationBadge/NotificationBadge.d.ts

@@ -1,13 +1,34 @@
 import * as React from "react";
-export type NotificationBadgeProps = {
-    variant?: "normal" | "dot";
+import type { BadgeProps } from "../Badge/types";
+/** `layout="inline"` のとき `Badge`（`type="pill"`）へ渡すプロップ（BadgeProps のサブセット。いずれも省略可） */
+export type NotificationBadgePillProps = Partial<Pick<BadgeProps, "color" | "fontSize" | "fontWeight" | "size">>;
+type NotificationBadgeBaseProps = NotificationBadgePillProps & {
     badgeContent?: number | string;
-    position?: "top-right" | "top-left" | "bottom-right" | "bottom-left";
     max?: number;
     showZero?: boolean;
     invisible?: boolean;
-    dotSize?: "small" | "medium" | "large";
     children: React.ReactNode;
 };
+type OverlayNormalProps = NotificationBadgeBaseProps & {
+    layout?: "overlay";
+    variant?: "normal";
+    position?: "top-right" | "top-left" | "bottom-right" | "bottom-left";
+    dotSize?: never;
+};
+type OverlayDotProps = NotificationBadgeBaseProps & {
+    layout?: "overlay";
+    variant: "dot";
+    position?: "top-right" | "top-left" | "bottom-right" | "bottom-left";
+    /** dot variant のサイズ */
+    dotSize?: "small" | "medium" | "large";
+};
+type InlineProps = NotificationBadgeBaseProps & {
+    /** 子と並べて右端に数値 pill を表示 */
+    layout: "inline";
+    variant?: "normal";
+    position?: never;
+    dotSize?: never;
+};
+export type NotificationBadgeProps = OverlayNormalProps | OverlayDotProps | InlineProps;
 declare const NotificationBadge: React.ForwardRefExoticComponent<NotificationBadgeProps & React.RefAttributes<HTMLDivElement>>;
 export default NotificationBadge;

package/dist/components/NotificationBadge/NotificationBadge.stories.d.ts

@@ -9,3 +9,5 @@ export default _default;
 export declare const Number: StoryObj<NotificationBadgeProps>;
 export declare const Text: StoryObj<NotificationBadgeProps>;
 export declare const Dot: StoryObj<NotificationBadgeProps>;
+export declare const InlinePill: StoryObj<NotificationBadgeProps>;
+export declare const InlinePillColors: () => JSX.Element;

package/dist/components/NotificationBadge/index.d.ts

@@ -1,2 +1,2 @@
 export { default } from "./NotificationBadge";
-export type { NotificationBadgeProps } from "./NotificationBadge";
+export type { NotificationBadgePillProps, NotificationBadgeProps, } from "./NotificationBadge";

package/dist/components/NotificationBadge/styled.d.ts

@@ -1,9 +1,12 @@
 export declare const Container: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-type BadgeProps = {
-    variant: "dot" | "normal";
+export declare const InlineContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+type BadgeAnchorProps = {
     position: string;
-    size: string;
     invisible: boolean;
 };
-export declare const Badge: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, BadgeProps, never>;
+export declare const BadgeAnchor: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, BadgeAnchorProps, never>;
+export declare const DotBadge: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {
+    size: string;
+    invisible: boolean;
+}, never>;
 export {};

package/dist/components/Tabs/Tabs.d.ts

@@ -3,6 +3,8 @@ type TabsProps<T> = {
     data: {
         text: string;
         count?: number;
+        /** 省略時は 99。`count` がこれを超えると `99+` 形式で表示 */
+        countMax?: number;
         value: T;
     }[];
     value: T;

package/dist/components/Tabs/Tabs.stories.d.ts

@@ -5,6 +5,7 @@ declare const _default: {
         data: {
             text: string;
             count?: number | undefined;
+            countMax?: number | undefined;
             value: T;
         }[];
         value: T;
@@ -14,6 +15,7 @@ declare const _default: {
         data: {
             text: string;
             count?: number | undefined;
+            countMax?: number | undefined;
             value: unknown;
         }[];
         value: unknown;
@@ -25,3 +27,4 @@ export default _default;
 export declare const Example: () => JSX.Element;
 export declare const WithBadge: () => JSX.Element;
 export declare const FixableBadge: () => JSX.Element;
+export declare const WithBadgeCountMax: () => JSX.Element;

package/dist/components/Tabs/internal/Tab.d.ts

@@ -2,6 +2,7 @@ import * as React from "react";
 type TabProps = {
     text: string;
     count?: number;
+    countMax?: number;
     value: any;
     selected: boolean;
     onChange?: (value: any) => void;