@apify/ui-library 1.148.0 → 1.148.1-featuremigrateapifyuilibrary-48563e.13

package/dist/components/badge/badge.js

@@ -0,0 +1,131 @@
+import { theme as e } from "../../design_system/theme.js";
+import { Box as t } from "../box/box.js";
+import { TextShared as n } from "../text/text_shared.js";
+import r, { css as i } from "styled-components";
+import { forwardRef as a } from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+//#region src/components/badge/badge.tsx
+var c = [
+	"large",
+	"regular",
+	"small",
+	"extra_small"
+], l = {
+	large: "16",
+	regular: "12",
+	small: "12",
+	extra_small: "12"
+}, u = {
+	large: "regular",
+	regular: "small",
+	small: "small",
+	extra_small: "small"
+}, d = [
+	"neutral",
+	"neutral_muted",
+	"neutral_subtle",
+	"primary_black",
+	"primary_blue",
+	"success",
+	"warning",
+	"danger"
+], f = {
+	large: i`
+        padding: ${e.space.space4} ${e.space.space8};
+        border-radius: ${e.radius.radius6};
+    `,
+	regular: i`
+        padding: ${e.space.space4} ${e.space.space6};
+        border-radius: ${e.radius.radius4};
+    `,
+	small: i`
+        padding: ${e.space.space2} ${e.space.space6};
+        border-radius: ${e.radius.radius4};
+    `,
+	extra_small: i`
+        height: ${e.space.space16};
+        padding: 0 ${e.space.space4};
+        border-radius: ${e.radius.radius4};
+    `
+}, p = {
+	neutral: i`
+        color: ${e.color.neutral.text};
+        fill: ${e.color.neutral.text};
+        background: ${e.color.neutral.background};
+        box-shadow: inset 0 0 0 1px ${e.color.neutral.border};
+    `,
+	neutral_muted: i`
+        color: ${e.color.neutral.text};
+        fill: ${e.color.neutral.text};
+        background: ${e.color.neutral.chipBackground};
+    `,
+	neutral_subtle: i`
+        color: ${e.color.neutral.text};
+        fill: ${e.color.neutral.textSubtle};
+        background: ${e.color.neutral.backgroundSubtle};
+    `,
+	primary_black: i`
+        color: ${e.color.primaryBlack.chipText};
+        fill: ${e.color.primaryBlack.chipText};
+        background: ${e.color.primaryBlack.background};
+    `,
+	primary_blue: i`
+        color: ${e.color.primary.chipText};
+        fill: ${e.color.primaryBlack.chipText};
+        background: ${e.color.primary.background};
+    `,
+	success: i`
+        color: ${e.color.success.chipText};
+        fill: ${e.color.success.chipText};
+        background: ${e.color.success.background};
+    `,
+	warning: i`
+        color: ${e.color.warning.chipText};
+        fill: ${e.color.warning.chipText};
+        background: ${e.color.warning.background};
+    `,
+	danger: i`
+        color: ${e.color.danger.chipText};
+        fill: ${e.color.danger.chipText};
+        background: ${e.color.danger.background};
+    `
+}, m = r(t)`
+    ${({ $size: e }) => f[e]};
+    ${({ $variant: e }) => p[e]};
+
+    /* Static styles */
+    width: fit-content;
+    border: none;
+    outline: none;
+    display: ${({ $inline: e }) => e ? "inline-flex" : "flex"};
+    flex-direction: row;
+    justify-content: center;
+    align-items: center;
+    white-space: nowrap;
+    gap: ${e.space.space4};
+
+    svg {
+        flex-shrink: 0;
+    }
+`, h = a(({ size: e = "small", type: t = "body", variant: r = "neutral", inline: i = !1, LeadingIcon: a, TrailingIcon: c, children: d, ...f }, p) => /* @__PURE__ */ s(m, {
+	ref: p,
+	$size: e,
+	$variant: r,
+	$inline: i,
+	forwardedAs: "span",
+	...f,
+	children: [
+		a && /* @__PURE__ */ o(a, { size: l[e] }),
+		d && /* @__PURE__ */ o(n, {
+			size: u[e],
+			type: t,
+			weight: "medium",
+			as: "span",
+			children: d
+		}),
+		c && /* @__PURE__ */ o(c, { size: l[e] })
+	]
+}));
+h.displayName = "Badge";
+//#endregion
+export { c as BADGE_SIZES, d as BADGE_VARIANTS, h as Badge };

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

@@ -0,0 +1,2 @@
+export * from './badge';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/badge/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/badge/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC"}

package/dist/components/banner/banner.d.ts

@@ -0,0 +1,11 @@
+import { default as React } from 'react';
+interface BannerProps {
+    background?: string;
+    useGradientBackground?: boolean;
+    width?: string;
+    className?: string;
+    children: React.ReactNode;
+}
+export declare const Banner: React.FC<BannerProps>;
+export {};
+//# sourceMappingURL=banner.d.ts.map

package/dist/components/banner/banner.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"banner.d.ts","sourceRoot":"","sources":["../../../src/components/banner/banner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAoD/B,UAAU,WAAW;IACjB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC7B;AAuBD,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CASxC,CAAC"}

package/dist/components/banner/banner.js

@@ -0,0 +1,26 @@
+import { theme as e } from "../../design_system/theme.js";
+import t, { css as n } from "styled-components";
+import { jsx as r } from "react/jsx-runtime";
+//#region src/components/banner/banner.tsx
+var i = "<svg width=\"1200\" height=\"148\" viewBox=\"0 0 1200 148\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <g clip-path=\"url(#clip0_2285_34756)\">\n    <g filter=\"url(#filter0_f_2285_34756)\">\n    <path d=\"M-39.7702 191.085C-55.0622 193.205 -68.8864 201.311 -78.2029 213.621C-87.5194 225.932 -91.5654 241.438 -89.4512 256.731L-55.0077 502.652L89.8852 173L-39.7702 191.085Z\" fill=\"url(#paint0_linear_2285_34756)\"/>\n    </g>\n    <g filter=\"url(#filter1_f_2285_34756)\">\n    <path d=\"M1267.53 398.062L1253.99 209.002C1252.85 193.626 1245.67 179.327 1234.01 169.234C1222.36 159.14 1207.18 154.073 1191.8 155.14C1190.5 155.19 1189.2 155.331 1187.92 155.564L1132 163.289L1254.84 438.685C1264.05 427.236 1268.59 412.721 1267.53 398.062Z\" fill=\"url(#paint1_linear_2285_34756)\"/>\n    </g>\n    <g filter=\"url(#filter2_f_2285_34756)\">\n    <path d=\"M561 29.7691C570.917 30.4746 580.956 29.5571 590.142 27.1057L801.075 -28.7862L700.682 -170L561 29.7691Z\" fill=\"url(#paint2_linear_2285_34756)\"/>\n    </g>\n    </g>\n    <defs>\n    <filter id=\"filter0_f_2285_34756\" x=\"-170\" y=\"93\" width=\"339.885\" height=\"489.652\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\n    <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\"/>\n    <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"BackgroundImageFix\" result=\"shape\"/>\n    <feGaussianBlur stdDeviation=\"40\" result=\"effect1_foregroundBlur_2285_34756\"/>\n    </filter>\n    <filter id=\"filter1_f_2285_34756\" x=\"1052\" y=\"75\" width=\"295.683\" height=\"443.686\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\n    <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\"/>\n    <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"BackgroundImageFix\" result=\"shape\"/>\n    <feGaussianBlur stdDeviation=\"40\" result=\"effect1_foregroundBlur_2285_34756\"/>\n    </filter>\n    <filter id=\"filter2_f_2285_34756\" x=\"481\" y=\"-250\" width=\"400.074\" height=\"360\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\n    <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\"/>\n    <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"BackgroundImageFix\" result=\"shape\"/>\n    <feGaussianBlur stdDeviation=\"40\" result=\"effect1_foregroundBlur_2285_34756\"/>\n    </filter>\n    <linearGradient id=\"paint0_linear_2285_34756\" x1=\"-0.0574112\" y1=\"173\" x2=\"-0.0574112\" y2=\"502.652\" gradientUnits=\"userSpaceOnUse\">\n    <stop stop-color=\"#00FF85\"/>\n    <stop offset=\"1\" stop-color=\"#00FF47\" stop-opacity=\"0\"/>\n    </linearGradient>\n    <linearGradient id=\"paint1_linear_2285_34756\" x1=\"1146.02\" y1=\"174.549\" x2=\"1333.1\" y2=\"293.915\" gradientUnits=\"userSpaceOnUse\">\n    <stop stop-color=\"#00FFF0\"/>\n    <stop offset=\"1\" stop-color=\"#1672EB\"/>\n    </linearGradient>\n    <linearGradient id=\"paint2_linear_2285_34756\" x1=\"681.037\" y1=\"-170\" x2=\"681.037\" y2=\"30\" gradientUnits=\"userSpaceOnUse\">\n    <stop stop-color=\"#F5B315\"/>\n    <stop offset=\"1\" stop-color=\"#FF2CC4\"/>\n    </linearGradient>\n    <clipPath id=\"clip0_2285_34756\">\n    <rect width=\"1200\" height=\"1791.08\" rx=\"16\" fill=\"white\"/>\n    </clipPath>\n    </defs>\n</svg>\n", a = (t, r) => n`
+        background-color: ${t || e.color.neutral.backgroundSubtle};
+        ${r && `
+            background-image: url("data:image/svg+xml,${encodeURIComponent(i)}");
+            background-position: center;
+            background-repeat: no-repeat;
+            background-size: cover;
+            `}
+    `, o = t.div`
+    width: ${(e) => e.width || "100%"};
+    padding: ${e.space.space40} ${e.space.space80};
+    border-radius: ${e.radius.radius16};
+
+    ${({ $background: e, $useGradientBackground: t }) => a(e, t)};
+`, s = ({ useGradientBackground: e = !0, background: t, children: n, ...i }) => /* @__PURE__ */ r(o, {
+	$background: t,
+	$useGradientBackground: e,
+	...i,
+	children: n
+});
+//#endregion
+export { s as Banner };

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

@@ -0,0 +1,2 @@
+export * from './banner';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/banner/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/banner/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC"}

package/dist/components/blog_article/blog_article.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+interface BlogArticleProps {
+    imageNode: React.ReactNode;
+    title: string;
+    ctaTitle?: string;
+}
+export declare function BlogArticle({ imageNode, title, ctaTitle }: BlogArticleProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=blog_article.d.ts.map

package/dist/components/blog_article/blog_article.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"blog_article.d.ts","sourceRoot":"","sources":["../../../src/components/blog_article/blog_article.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAqE/B,UAAU,gBAAgB;IACtB,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,wBAAgB,WAAW,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,QAAsB,EAAE,EAAE,gBAAgB,2CAWzF"}

package/dist/components/blog_article/blog_article.js

@@ -0,0 +1,86 @@
+import { theme as e } from "../../design_system/theme.js";
+import t from "styled-components";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { ArrowRightIcon as i } from "@apify/ui-icons";
+//#region src/components/blog_article/blog_article.tsx
+var a = {
+	IMAGE_WRAPPER: "ImageWrapper",
+	TEXT: "Text",
+	READ_POST: "ReadPost"
+}, o = t.div`
+    display: flex;
+    flex-direction: column;
+
+    &:hover {
+        .${a.READ_POST} {
+            color: ${e.color.primary.action};
+        }
+    }
+
+    .${a.IMAGE_WRAPPER} {
+        margin-bottom: ${e.space.space16};
+        border-radius: ${e.radius.radius12};
+        border: 1px solid ${e.color.neutral.backgroundSubtle};
+        aspect-ratio: 16/9;
+    }
+
+    .${a.TEXT} {
+        padding-bottom: ${e.space.space16};
+        color: ${e.color.neutral.text};
+        ${e.typography.shared.mobile.titleL}
+
+        @media (min-width: ${e.layout.tablet}) {
+            ${e.typography.shared.tablet.titleL}
+        }
+
+        @media (min-width: ${e.layout.desktop}) {
+            ${e.typography.shared.desktop.titleL}
+        }
+    }
+
+    .${a.READ_POST} {
+        display: flex;
+        align-items: center;
+        gap: ${e.space.space4};
+        color: ${e.color.neutral.textMuted};
+        ${e.typography.shared.mobile.titleM}
+
+        @media (min-width: ${e.layout.tablet}) {
+            ${e.typography.shared.tablet.titleM}
+        }
+
+        @media (min-width: ${e.layout.desktop}) {
+            ${e.typography.shared.desktop.titleM}
+        }
+
+        svg {
+            transition: margin-right 0.5s;
+        }
+
+        &:hover svg {
+            margin-right: ${e.space.space4};
+        }
+    }
+`;
+function s({ imageNode: e, title: t, ctaTitle: s = "Read more" }) {
+	return /* @__PURE__ */ r(o, { children: [
+		/* @__PURE__ */ n("div", {
+			className: a.IMAGE_WRAPPER,
+			children: e
+		}),
+		/* @__PURE__ */ n("div", {
+			className: a.TEXT,
+			children: t
+		}),
+		/* @__PURE__ */ r("div", {
+			className: a.READ_POST,
+			children: [s, /* @__PURE__ */ n(i, {
+				size: "16",
+				title: "",
+				titleId: ""
+			})]
+		})
+	] });
+}
+//#endregion
+export { s as BlogArticle };

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

@@ -0,0 +1,2 @@
+export * from './blog_article';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/blog_article/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/blog_article/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC"}

package/dist/components/box/box.d.ts

@@ -0,0 +1,43 @@
+import { default as React } from 'react';
+import { Size } from '../../design_system/tokens';
+import { ResponsiveValue } from '../../utils/css_utils';
+type ExtendedSize = Size | 'none' | 'auto';
+export interface MarginSpacingProps {
+    m?: ResponsiveValue<ExtendedSize>;
+    mt?: ResponsiveValue<ExtendedSize>;
+    mb?: ResponsiveValue<ExtendedSize>;
+    ml?: ResponsiveValue<ExtendedSize>;
+    mr?: ResponsiveValue<ExtendedSize>;
+    mx?: ResponsiveValue<ExtendedSize>;
+    my?: ResponsiveValue<ExtendedSize>;
+}
+export interface PaddingSpacingProps {
+    p?: ResponsiveValue<ExtendedSize>;
+    pt?: ResponsiveValue<ExtendedSize>;
+    pb?: ResponsiveValue<ExtendedSize>;
+    pl?: ResponsiveValue<ExtendedSize>;
+    pr?: ResponsiveValue<ExtendedSize>;
+    px?: ResponsiveValue<ExtendedSize>;
+    py?: ResponsiveValue<ExtendedSize>;
+}
+type SharedBoxProps = {
+    children?: React.ReactNode;
+    className?: string;
+    style?: React.CSSProperties;
+    onClick?: (e: React.MouseEvent) => void;
+    id?: string;
+    title?: string;
+};
+export type RegularBoxProps = SharedBoxProps & {
+    as?: React.ElementType;
+};
+type OlBoxProps = SharedBoxProps & {
+    as: 'ol';
+    start?: number;
+};
+/** Combines together RegularBoxProps and props for specific elements. */
+type AnyBoxProps = RegularBoxProps | OlBoxProps;
+export type BoxProps = MarginSpacingProps & PaddingSpacingProps & AnyBoxProps;
+export declare const Box: React.ForwardRefExoticComponent<BoxProps & React.RefAttributes<HTMLElement>>;
+export {};
+//# sourceMappingURL=box.d.ts.map

package/dist/components/box/box.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"box.d.ts","sourceRoot":"","sources":["../../../src/components/box/box.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;AAEvD,OAAO,EAAuB,KAAK,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAElF,KAAK,YAAY,GAAG,IAAI,GAAG,MAAM,GAAG,MAAM,CAAC;AAE3C,MAAM,WAAW,kBAAkB;IAC/B,CAAC,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IAClC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IACnC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IACnC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IACnC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IACnC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IACnC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;CACtC;AAED,MAAM,WAAW,mBAAmB;IAChC,CAAC,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IAClC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IACnC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IACnC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IACnC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IACnC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IACnC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;CACtC;AAED,KAAK,cAAc,GAAG;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAGF,MAAM,MAAM,eAAe,GAAG,cAAc,GAAG;IAAE,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;CAAE,CAAC;AAE1E,KAAK,UAAU,GAAG,cAAc,GAAG;IAAE,EAAE,EAAE,IAAI,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAEhE,yEAAyE;AACzE,KAAK,WAAW,GAAG,eAAe,GAAG,UAAU,CAAC;AAEhD,MAAM,MAAM,QAAQ,GAAG,kBAAkB,GAAG,mBAAmB,GAAG,WAAW,CAAC;AA4B9E,eAAO,MAAM,GAAG,8EAsBf,CAAC"}

package/dist/components/box/box.js

@@ -0,0 +1,43 @@
+import { theme as e } from "../../design_system/theme.js";
+import { getResponsiveStyles as t } from "../../utils/css_utils.js";
+import n from "styled-components";
+import { forwardRef as r } from "react";
+import { jsx as i } from "react/jsx-runtime";
+//#region src/components/box/box.tsx
+var a = (t) => !t || t === "none" ? 0 : t === "auto" ? "auto" : e.space[t] || 0, o = n.div`
+    ${({ $mt: e, $my: n, $m: r }) => t("margin-top", a, e, [n, r])}
+
+    ${({ $mb: e, $my: n, $m: r }) => t("margin-bottom", a, e, [n, r])}
+
+    ${({ $mr: e, $mx: n, $m: r }) => t("margin-right", a, e, [n, r])}
+
+    ${({ $ml: e, $mx: n, $m: r }) => t("margin-left", a, e, [n, r])}
+
+    ${({ $pt: e, $py: n, $p: r }) => t("padding-top", a, e, [n, r])}
+
+    ${({ $pb: e, $py: n, $p: r }) => t("padding-bottom", a, e, [n, r])}
+
+    ${({ $pr: e, $px: n, $p: r }) => t("padding-right", a, e, [n, r])}
+
+    ${({ $pl: e, $px: n, $p: r }) => t("padding-left", a, e, [n, r])}
+`, s = r(({ m: e, mt: t, mb: n, ml: r, mr: a, mx: s, my: c, p: l, pt: u, pb: d, pl: f, pr: p, px: m, py: h, as: g, ..._ }, v) => /* @__PURE__ */ i(o, {
+	$m: e,
+	$mt: t,
+	$mb: n,
+	$ml: r,
+	$mr: a,
+	$mx: s,
+	$my: c,
+	$p: l,
+	$pt: u,
+	$pb: d,
+	$pl: f,
+	$pr: p,
+	$px: m,
+	$py: h,
+	as: g,
+	ref: v,
+	..._
+}));
+//#endregion
+export { s as Box };

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

@@ -0,0 +1,2 @@
+export * from './box';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/box/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/box/index.ts"],"names":[],"mappings":"AAAA,cAAc,OAAO,CAAC"}

package/dist/components/breadcrumb/breadcrumb.d.ts

@@ -0,0 +1,17 @@
+import { default as React } from 'react';
+export declare const breadcrumbClassNames: {
+    readonly WRAPPER: "Breadcrumbs__Wrapper";
+    readonly SEPARATOR: "Breadcrumbs__Separator";
+    readonly ITEM: "Breadcrumbs__Item";
+    readonly ITEM_ACTIVE: "Breadcrumbs__Item--active";
+};
+export type BreadcrumbItem = {
+    label: string;
+    url?: string;
+};
+export type BreadcrumbsProps = {
+    items: BreadcrumbItem[];
+    className?: string;
+};
+export declare const Breadcrumbs: React.FC<BreadcrumbsProps>;
+//# sourceMappingURL=breadcrumb.d.ts.map

package/dist/components/breadcrumb/breadcrumb.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"breadcrumb.d.ts","sourceRoot":"","sources":["../../../src/components/breadcrumb/breadcrumb.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B,eAAO,MAAM,oBAAoB;;;;;CAKvB,CAAC;AA4BX,MAAM,MAAM,cAAc,GAAG;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC3B,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAsClD,CAAC"}

package/dist/components/breadcrumb/breadcrumb.js

@@ -0,0 +1,66 @@
+import { theme as e } from "../../design_system/theme.js";
+import { Box as t } from "../box/box.js";
+import { TextShared as n } from "../text/text_shared.js";
+import { Link as r } from "../link/link.js";
+import i from "styled-components";
+import a from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import c from "clsx";
+//#region src/components/breadcrumb/breadcrumb.tsx
+var l = {
+	WRAPPER: "Breadcrumbs__Wrapper",
+	SEPARATOR: "Breadcrumbs__Separator",
+	ITEM: "Breadcrumbs__Item",
+	ITEM_ACTIVE: "Breadcrumbs__Item--active"
+}, u = i(t)`
+    display: flex;
+    align-items: center;
+    gap: ${e.space.space8};
+`, d = i(r)`
+    text-decoration: none;
+    padding: ${e.space.space2} ${e.space.space4};
+    border-radius: ${e.radius.radius6};
+    color: ${e.color.neutral.textSubtle};
+
+    &:hover {
+        color: ${e.color.neutral.textMuted};
+        span {
+            /* TODO: (typography-partial) font-weight override without paired font-size/line-height — revisit to confirm intended typography token. */
+            font-weight: 500;
+        }
+    }
+`, f = i(n)`
+    padding: ${e.space.space2} ${e.space.space4};
+    white-space: nowrap;
+`, p = ({ items: t, className: r }) => /* @__PURE__ */ o(u, {
+	className: c(l.WRAPPER, r),
+	children: t.map((r, i) => {
+		let u = i === t.length - 1;
+		return /* @__PURE__ */ s(a.Fragment, { children: [i > 0 && /* @__PURE__ */ o(n, {
+			as: "span",
+			size: "small",
+			weight: "medium",
+			color: e.color.neutral.textSubtle,
+			className: l.SEPARATOR,
+			children: "/"
+		}), /* @__PURE__ */ o("span", {
+			className: c(l.ITEM, u && l.ITEM_ACTIVE),
+			children: !u && r.url ? /* @__PURE__ */ o(d, {
+				to: r.url,
+				children: /* @__PURE__ */ o(n, {
+					as: "span",
+					size: "small",
+					weight: "normal",
+					children: r.label
+				})
+			}) : /* @__PURE__ */ o(f, {
+				size: "small",
+				weight: u ? "bold" : "normal",
+				color: u ? e.color.neutral.text : e.color.neutral.textSubtle,
+				children: r.label
+			})
+		})] }, r.label);
+	})
+});
+//#endregion
+export { p as Breadcrumbs, l as breadcrumbClassNames };

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

@@ -0,0 +1,2 @@
+export * from './breadcrumb';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/breadcrumb/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/breadcrumb/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}

package/dist/components/browser_window/browser_window.d.ts

@@ -0,0 +1,20 @@
+import { ReactNode } from 'react';
+declare const classNames: {
+    readonly ROOT: "browser-window";
+    readonly HEADER: "browser-window__header";
+    readonly DOTS: "browser-window__dots";
+    readonly DOT: "browser-window__dot";
+    readonly URL: "browser-window__url";
+    readonly TITLE: "browser-window__title";
+    readonly CONTAINER: "browser-window__container";
+    readonly CONTENT: "browser-window__content";
+};
+export { classNames as browserWindowClassNames };
+type Props = {
+    title: string;
+    url?: ReactNode;
+    children: ReactNode;
+    className?: string;
+};
+export declare const BrowserWindow: ({ title, url, children, className }: Props) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=browser_window.d.ts.map

package/dist/components/browser_window/browser_window.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"browser_window.d.ts","sourceRoot":"","sources":["../../../src/components/browser_window/browser_window.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAMvC,QAAA,MAAM,UAAU;;;;;;;;;CASN,CAAC;AAEX,OAAO,EAAE,UAAU,IAAI,uBAAuB,EAAE,CAAC;AAuDjD,KAAK,KAAK,GAAG;IACT,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,SAAS,CAAC;IAChB,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,qCAAqC,KAAK,4CA8BvE,CAAC"}

package/dist/components/browser_window/browser_window.js

@@ -0,0 +1,98 @@
+import { theme as e } from "../../design_system/theme.js";
+import { Badge as t } from "../badge/badge.js";
+import n from "styled-components";
+import { Fragment as r, jsx as i, jsxs as a } from "react/jsx-runtime";
+import o from "clsx";
+//#region src/components/browser_window/browser_window.tsx
+var s = {
+	ROOT: "browser-window",
+	HEADER: "browser-window__header",
+	DOTS: "browser-window__dots",
+	DOT: "browser-window__dot",
+	URL: "browser-window__url",
+	TITLE: "browser-window__title",
+	CONTAINER: "browser-window__container",
+	CONTENT: "browser-window__content"
+}, c = n.div`
+    border: 1px solid ${e.color.neutral.separatorSubtle};
+    border-radius: ${e.radius.radius12};
+    background-color: ${e.color.neutral.background};
+    overflow: hidden;
+
+    .${s.HEADER} {
+        display: flex;
+        align-items: center;
+        gap: ${e.space.space8};
+        padding: ${e.space.space6} ${e.space.space8};
+        border-bottom: 1px solid ${e.color.neutral.separatorSubtle};
+        background-color: ${e.color.neutral.backgroundMuted};
+    }
+
+    .${s.DOTS} {
+        display: flex;
+        gap: 0.3rem;
+        flex-shrink: 0;
+    }
+
+    .${s.DOT} {
+        width: 0.6rem;
+        height: 0.6rem;
+        border-radius: 50%;
+        background-color: ${e.color.neutral.separatorSubtle};
+    }
+
+    .${s.URL} {
+        width: 100%;
+        min-width: 0;
+        justify-content: flex-start;
+        color: ${e.color.neutral.textSubtle};
+
+        span {
+            min-width: 0;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+            overflow: hidden;
+        }
+    }
+
+    .${s.TITLE} {
+        margin-left: auto;
+        flex-shrink: 0;
+    }
+
+    .${s.CONTAINER} {
+        min-width: 0;
+        overflow-x: auto;
+    }
+`, l = ({ title: e, url: n, children: l, className: u }) => /* @__PURE__ */ a(c, {
+	className: o(s.ROOT, u),
+	children: [/* @__PURE__ */ a("div", {
+		className: s.HEADER,
+		children: [n && /* @__PURE__ */ a(r, { children: [/* @__PURE__ */ a("div", {
+			className: s.DOTS,
+			children: [
+				/* @__PURE__ */ i("span", { className: s.DOT }),
+				/* @__PURE__ */ i("span", { className: s.DOT }),
+				/* @__PURE__ */ i("span", { className: s.DOT })
+			]
+		}), /* @__PURE__ */ i(t, {
+			size: "extra_small",
+			variant: "neutral_subtle",
+			className: s.URL,
+			"data-visual-test": "transparent",
+			children: n
+		})] }), /* @__PURE__ */ i(t, {
+			size: "extra_small",
+			className: s.TITLE,
+			children: e
+		})]
+	}), /* @__PURE__ */ i("div", {
+		className: s.CONTAINER,
+		children: /* @__PURE__ */ i("div", {
+			className: s.CONTENT,
+			children: l
+		})
+	})]
+});
+//#endregion
+export { l as BrowserWindow, s as classNames };

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

@@ -0,0 +1,2 @@
+export * from './browser_window';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/browser_window/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/browser_window/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC"}