eidos-ui 3.6.2 → 3.7.0
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/README.md +1 -0
- package/dist/Chip.types-B6y3Wifa.d.cts +24 -0
- package/dist/Chip.types-COQfx2Ru.d.ts +24 -0
- package/dist/chip/index.d.cts +5 -23
- package/dist/chip/index.d.ts +5 -23
- package/dist/chunk-L7I5NEGI.js +82 -0
- package/dist/chunk-L7I5NEGI.js.map +1 -0
- package/dist/{chunk-X3BVQBXD.cjs → chunk-O2BECFXJ.cjs} +4 -3
- package/dist/chunk-O2BECFXJ.cjs.map +1 -0
- package/dist/chunk-PCTHJZRO.cjs +82 -0
- package/dist/chunk-PCTHJZRO.cjs.map +1 -0
- package/dist/{chunk-2JW3WSBF.js → chunk-SNRRF64M.js} +4 -3
- package/dist/{chunk-2JW3WSBF.js.map → chunk-SNRRF64M.js.map} +1 -1
- package/dist/conversation/index.cjs +2 -2
- package/dist/conversation/index.js +1 -1
- package/dist/index.cjs +8 -4
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +79 -28
- package/dist/index.d.cts +3 -1
- package/dist/index.d.ts +3 -1
- package/dist/index.js +8 -4
- package/dist/split-chip/index.cjs +11 -0
- package/dist/split-chip/index.cjs.map +1 -0
- package/dist/split-chip/index.d.cts +67 -0
- package/dist/split-chip/index.d.ts +67 -0
- package/dist/split-chip/index.js +11 -0
- package/dist/split-chip/index.js.map +1 -0
- package/package.json +1 -1
- package/dist/chunk-X3BVQBXD.cjs.map +0 -1
package/README.md
CHANGED
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { I as IconType } from './renderIcon-C2lEMMzb.cjs';
|
|
2
|
+
import { C as ComponentSizeProps } from './sizes-DM6Rrrgq.cjs';
|
|
3
|
+
|
|
4
|
+
type ChipVariantProps = 'filled' | 'outlined' | 'text';
|
|
5
|
+
type ChipColorProps = 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info';
|
|
6
|
+
interface BaseChipProps extends Omit<React.HTMLAttributes<HTMLElement>, 'onClick'> {
|
|
7
|
+
variant?: ChipVariantProps;
|
|
8
|
+
color?: ChipColorProps;
|
|
9
|
+
size?: ComponentSizeProps;
|
|
10
|
+
fullWidth?: boolean;
|
|
11
|
+
disabled?: boolean;
|
|
12
|
+
tooltip?: string;
|
|
13
|
+
className?: string;
|
|
14
|
+
onClick?: () => void;
|
|
15
|
+
onRemove?: () => void;
|
|
16
|
+
}
|
|
17
|
+
interface TextChipProps extends BaseChipProps {
|
|
18
|
+
children: React.ReactNode;
|
|
19
|
+
preIcon?: IconType;
|
|
20
|
+
posIcon?: IconType;
|
|
21
|
+
}
|
|
22
|
+
type ChipProps = TextChipProps;
|
|
23
|
+
|
|
24
|
+
export type { ChipColorProps as C, TextChipProps as T, ChipProps as a, ChipVariantProps as b };
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { I as IconType } from './renderIcon-C2lEMMzb.js';
|
|
2
|
+
import { C as ComponentSizeProps } from './sizes-DM6Rrrgq.js';
|
|
3
|
+
|
|
4
|
+
type ChipVariantProps = 'filled' | 'outlined' | 'text';
|
|
5
|
+
type ChipColorProps = 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info';
|
|
6
|
+
interface BaseChipProps extends Omit<React.HTMLAttributes<HTMLElement>, 'onClick'> {
|
|
7
|
+
variant?: ChipVariantProps;
|
|
8
|
+
color?: ChipColorProps;
|
|
9
|
+
size?: ComponentSizeProps;
|
|
10
|
+
fullWidth?: boolean;
|
|
11
|
+
disabled?: boolean;
|
|
12
|
+
tooltip?: string;
|
|
13
|
+
className?: string;
|
|
14
|
+
onClick?: () => void;
|
|
15
|
+
onRemove?: () => void;
|
|
16
|
+
}
|
|
17
|
+
interface TextChipProps extends BaseChipProps {
|
|
18
|
+
children: React.ReactNode;
|
|
19
|
+
preIcon?: IconType;
|
|
20
|
+
posIcon?: IconType;
|
|
21
|
+
}
|
|
22
|
+
type ChipProps = TextChipProps;
|
|
23
|
+
|
|
24
|
+
export type { ChipColorProps as C, TextChipProps as T, ChipProps as a, ChipVariantProps as b };
|
package/dist/chip/index.d.cts
CHANGED
|
@@ -1,27 +1,9 @@
|
|
|
1
1
|
import React__default from 'react';
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
type ChipColorProps = 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info';
|
|
7
|
-
interface BaseChipProps extends Omit<React.HTMLAttributes<HTMLElement>, 'onClick'> {
|
|
8
|
-
variant?: ChipVariantProps;
|
|
9
|
-
color?: ChipColorProps;
|
|
10
|
-
size?: ComponentSizeProps;
|
|
11
|
-
fullWidth?: boolean;
|
|
12
|
-
disabled?: boolean;
|
|
13
|
-
tooltip?: string;
|
|
14
|
-
className?: string;
|
|
15
|
-
onClick?: () => void;
|
|
16
|
-
onRemove?: () => void;
|
|
17
|
-
}
|
|
18
|
-
interface TextChipProps extends BaseChipProps {
|
|
19
|
-
children: React.ReactNode;
|
|
20
|
-
preIcon?: IconType;
|
|
21
|
-
posIcon?: IconType;
|
|
22
|
-
}
|
|
23
|
-
type ChipProps = TextChipProps;
|
|
2
|
+
import { a as ChipProps } from '../Chip.types-B6y3Wifa.cjs';
|
|
3
|
+
export { C as ChipColorProps, b as ChipVariantProps, T as TextChipProps } from '../Chip.types-B6y3Wifa.cjs';
|
|
4
|
+
import '../renderIcon-C2lEMMzb.cjs';
|
|
5
|
+
import '../sizes-DM6Rrrgq.cjs';
|
|
24
6
|
|
|
25
7
|
declare const Chip: React__default.FC<ChipProps>;
|
|
26
8
|
|
|
27
|
-
export { Chip,
|
|
9
|
+
export { Chip, ChipProps };
|
package/dist/chip/index.d.ts
CHANGED
|
@@ -1,27 +1,9 @@
|
|
|
1
1
|
import React__default from 'react';
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
type ChipColorProps = 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info';
|
|
7
|
-
interface BaseChipProps extends Omit<React.HTMLAttributes<HTMLElement>, 'onClick'> {
|
|
8
|
-
variant?: ChipVariantProps;
|
|
9
|
-
color?: ChipColorProps;
|
|
10
|
-
size?: ComponentSizeProps;
|
|
11
|
-
fullWidth?: boolean;
|
|
12
|
-
disabled?: boolean;
|
|
13
|
-
tooltip?: string;
|
|
14
|
-
className?: string;
|
|
15
|
-
onClick?: () => void;
|
|
16
|
-
onRemove?: () => void;
|
|
17
|
-
}
|
|
18
|
-
interface TextChipProps extends BaseChipProps {
|
|
19
|
-
children: React.ReactNode;
|
|
20
|
-
preIcon?: IconType;
|
|
21
|
-
posIcon?: IconType;
|
|
22
|
-
}
|
|
23
|
-
type ChipProps = TextChipProps;
|
|
2
|
+
import { a as ChipProps } from '../Chip.types-COQfx2Ru.js';
|
|
3
|
+
export { C as ChipColorProps, b as ChipVariantProps, T as TextChipProps } from '../Chip.types-COQfx2Ru.js';
|
|
4
|
+
import '../renderIcon-C2lEMMzb.js';
|
|
5
|
+
import '../sizes-DM6Rrrgq.js';
|
|
24
6
|
|
|
25
7
|
declare const Chip: React__default.FC<ChipProps>;
|
|
26
8
|
|
|
27
|
-
export { Chip,
|
|
9
|
+
export { Chip, ChipProps };
|
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
import {
|
|
2
|
+
Chip
|
|
3
|
+
} from "./chunk-GWHZFX2H.js";
|
|
4
|
+
|
|
5
|
+
// src/components/SplitChip/SplitChip.utils.ts
|
|
6
|
+
var hasVisibleBorder = (segment) => segment.variant === "outlined" || segment.disabled;
|
|
7
|
+
var resolveSegmentEdges = (segments, showDividers) => {
|
|
8
|
+
const edges = segments.map(() => ({ joinedStart: false, joinedEnd: false, divided: false }));
|
|
9
|
+
for (let i = 0; i < segments.length - 1; i++) {
|
|
10
|
+
const a = hasVisibleBorder(segments[i]);
|
|
11
|
+
const b = hasVisibleBorder(segments[i + 1]);
|
|
12
|
+
const sameOutline = segments[i].disabled === segments[i + 1].disabled;
|
|
13
|
+
if (a && b) {
|
|
14
|
+
edges[i].joinedEnd = !showDividers && sameOutline;
|
|
15
|
+
edges[i + 1].joinedStart = true;
|
|
16
|
+
} else if (a) {
|
|
17
|
+
edges[i + 1].joinedStart = true;
|
|
18
|
+
} else if (b) {
|
|
19
|
+
edges[i].joinedEnd = true;
|
|
20
|
+
} else {
|
|
21
|
+
edges[i].joinedEnd = true;
|
|
22
|
+
edges[i + 1].joinedStart = !showDividers;
|
|
23
|
+
edges[i + 1].divided = showDividers;
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
return edges;
|
|
27
|
+
};
|
|
28
|
+
|
|
29
|
+
// src/components/SplitChip/SplitChip.component.tsx
|
|
30
|
+
import { jsx } from "react/jsx-runtime";
|
|
31
|
+
var SplitChip = ({
|
|
32
|
+
segments,
|
|
33
|
+
variant = "filled",
|
|
34
|
+
color = "primary",
|
|
35
|
+
size = "md",
|
|
36
|
+
disabled = false,
|
|
37
|
+
showDividers = false,
|
|
38
|
+
className = "",
|
|
39
|
+
...rest
|
|
40
|
+
}) => {
|
|
41
|
+
const classes = [
|
|
42
|
+
"eidos-split-chip",
|
|
43
|
+
`eidos-split-chip--${size}`,
|
|
44
|
+
showDividers && "eidos-split-chip--dividers",
|
|
45
|
+
disabled && "eidos-split-chip--disabled",
|
|
46
|
+
className
|
|
47
|
+
].filter(Boolean).join(" ");
|
|
48
|
+
const lastIndex = segments.length - 1;
|
|
49
|
+
const resolved = segments.map((segment) => ({
|
|
50
|
+
variant: segment.variant ?? variant,
|
|
51
|
+
disabled: disabled || !!segment.disabled
|
|
52
|
+
}));
|
|
53
|
+
const edges = resolveSegmentEdges(resolved, showDividers);
|
|
54
|
+
return /* @__PURE__ */ jsx("div", { className: classes, ...rest, children: segments.map((segment, index) => /* @__PURE__ */ jsx(
|
|
55
|
+
Chip,
|
|
56
|
+
{
|
|
57
|
+
variant: resolved[index].variant,
|
|
58
|
+
color: segment.color ?? color,
|
|
59
|
+
size,
|
|
60
|
+
disabled: resolved[index].disabled,
|
|
61
|
+
onClick: segment.onClick,
|
|
62
|
+
tooltip: segment.tooltip,
|
|
63
|
+
preIcon: segment.preIcon,
|
|
64
|
+
posIcon: segment.posIcon,
|
|
65
|
+
className: [
|
|
66
|
+
"eidos-split-chip__segment",
|
|
67
|
+
index === 0 && "eidos-split-chip__segment--first",
|
|
68
|
+
index === lastIndex && "eidos-split-chip__segment--last",
|
|
69
|
+
edges[index].joinedStart && "eidos-split-chip__segment--joined-start",
|
|
70
|
+
edges[index].joinedEnd && "eidos-split-chip__segment--joined-end",
|
|
71
|
+
edges[index].divided && "eidos-split-chip__segment--divided"
|
|
72
|
+
].filter(Boolean).join(" "),
|
|
73
|
+
children: segment.label
|
|
74
|
+
},
|
|
75
|
+
segment.id
|
|
76
|
+
)) });
|
|
77
|
+
};
|
|
78
|
+
|
|
79
|
+
export {
|
|
80
|
+
SplitChip
|
|
81
|
+
};
|
|
82
|
+
//# sourceMappingURL=chunk-L7I5NEGI.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/SplitChip/SplitChip.utils.ts","../src/components/SplitChip/SplitChip.component.tsx"],"sourcesContent":["import type { ChipVariantProps } from '../Chip/Chip.types';\n\nexport interface SeamSegment {\n variant: ChipVariantProps;\n disabled: boolean;\n}\n\nexport interface SegmentEdges {\n /** Drop the leading (left) border. */\n joinedStart: boolean;\n /** Drop the trailing (right) border. */\n joinedEnd: boolean;\n /** Draw a divider as the leading border, in the segment's own colour. */\n divided: boolean;\n}\n\n/**\n * A segment \"owns\" a visible border when it is `outlined`, or when it is\n * disabled - the disabled Chip style paints a grey border on every variant.\n * `filled` and `text` borders are transparent.\n */\nconst hasVisibleBorder = (segment: SeamSegment) =>\n segment.variant === 'outlined' || segment.disabled;\n\n/**\n * Decides, per seam, which of the two neighbouring edges survives.\n *\n * Each seam is resolved from **both** sides at once. The first version decided\n * each edge from one side only (\"drop it if the neighbour is not `text`\"),\n * which broke two ways: an `outlined` segment beside a disabled one dropped\n * its edge while the disabled segment dropped its own too, leaving the seam\n * open; and with dividers, an `outlined` segment gave up its own border to a\n * divider drawn in the *neighbour's* colour.\n *\n * The rules, for a seam between A (left) and B (right):\n *\n * - Both have visible borders: if they are the same kind (both enabled\n * `outlined`, or both disabled), seamless by default - both edges drop, so\n * the run reads as one outline. With dividers, or when the kinds differ,\n * A's own edge is the seam and B's drops.\n * - Only one has a visible border: that edge is the seam; the other drops, so\n * there is never a double line and never an open side.\n * - Neither has one: both drop; with dividers, B draws one in its own colour.\n */\nexport const resolveSegmentEdges = (\n segments: SeamSegment[],\n showDividers: boolean,\n): SegmentEdges[] => {\n const edges = segments.map(() => ({ joinedStart: false, joinedEnd: false, divided: false }));\n\n for (let i = 0; i < segments.length - 1; i++) {\n const a = hasVisibleBorder(segments[i]);\n const b = hasVisibleBorder(segments[i + 1]);\n // Two borders only merge into one outline when they are the same kind:\n // both enabled `outlined`, or both disabled. An outlined segment beside a\n // disabled one would otherwise lose the seam against a near-white surface.\n const sameOutline = segments[i].disabled === segments[i + 1].disabled;\n\n if (a && b) {\n edges[i].joinedEnd = !showDividers && sameOutline;\n edges[i + 1].joinedStart = true;\n } else if (a) {\n edges[i + 1].joinedStart = true;\n } else if (b) {\n edges[i].joinedEnd = true;\n } else {\n edges[i].joinedEnd = true;\n edges[i + 1].joinedStart = !showDividers;\n edges[i + 1].divided = showDividers;\n }\n }\n\n return edges;\n};\n","import React from 'react';\nimport { Chip } from '../Chip/Chip.component';\nimport type { SplitChipProps } from './SplitChip.types';\nimport { resolveSegmentEdges } from './SplitChip.utils';\n\n/**\n * SplitChip - one chip split into independent segments, each with its own\n * label, variant, colour and optional click handler.\n *\n * Every segment is a real `Chip`, the same way `SplitButton` is built from\n * `Button`, so variants, sizes, icons, tooltips, disabled styling and the\n * \"hover only when clickable\" rule cannot drift between the two. This\n * component only adds the join: collapsed inner borders, radii on the outer\n * ends, and optional dividers.\n *\n * @example\n * ```tsx\n * <SplitChip\n * segments={[\n * { id: 'label', label: 'Status', variant: 'outlined' },\n * { id: 'value', label: 'Open', color: 'success', onClick: openFilter },\n * ]}\n * />\n * ```\n */\nexport const SplitChip: React.FC<SplitChipProps> = ({\n segments,\n variant = 'filled',\n color = 'primary',\n size = 'md',\n disabled = false,\n showDividers = false,\n className = '',\n ...rest\n}) => {\n const classes = [\n 'eidos-split-chip',\n `eidos-split-chip--${size}`,\n showDividers && 'eidos-split-chip--dividers',\n disabled && 'eidos-split-chip--disabled',\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n const lastIndex = segments.length - 1;\n const resolved = segments.map((segment) => ({\n variant: segment.variant ?? variant,\n disabled: disabled || !!segment.disabled,\n }));\n const edges = resolveSegmentEdges(resolved, showDividers);\n\n return (\n <div className={classes} {...rest}>\n {segments.map((segment, index) => (\n <Chip\n key={segment.id}\n variant={resolved[index].variant}\n color={segment.color ?? color}\n size={size}\n disabled={resolved[index].disabled}\n onClick={segment.onClick}\n tooltip={segment.tooltip}\n preIcon={segment.preIcon}\n posIcon={segment.posIcon}\n // Position comes from the index, not `:first-child`/`:last-child`:\n // a segment with a `tooltip` is wrapped in the Tooltip's trigger\n // `div`, so the chip is no longer a direct child of this container\n // and structural pseudo-classes would round the wrong corners.\n className={[\n 'eidos-split-chip__segment',\n index === 0 && 'eidos-split-chip__segment--first',\n index === lastIndex && 'eidos-split-chip__segment--last',\n edges[index].joinedStart && 'eidos-split-chip__segment--joined-start',\n edges[index].joinedEnd && 'eidos-split-chip__segment--joined-end',\n edges[index].divided && 'eidos-split-chip__segment--divided',\n ]\n .filter(Boolean)\n .join(' ')}\n >\n {segment.label}\n </Chip>\n ))}\n </div>\n );\n};\n"],"mappings":";;;;;AAqBA,IAAM,mBAAmB,CAAC,YACxB,QAAQ,YAAY,cAAc,QAAQ;AAsBrC,IAAM,sBAAsB,CACjC,UACA,iBACmB;AACnB,QAAM,QAAQ,SAAS,IAAI,OAAO,EAAE,aAAa,OAAO,WAAW,OAAO,SAAS,MAAM,EAAE;AAE3F,WAAS,IAAI,GAAG,IAAI,SAAS,SAAS,GAAG,KAAK;AAC5C,UAAM,IAAI,iBAAiB,SAAS,CAAC,CAAC;AACtC,UAAM,IAAI,iBAAiB,SAAS,IAAI,CAAC,CAAC;AAI1C,UAAM,cAAc,SAAS,CAAC,EAAE,aAAa,SAAS,IAAI,CAAC,EAAE;AAE7D,QAAI,KAAK,GAAG;AACV,YAAM,CAAC,EAAE,YAAY,CAAC,gBAAgB;AACtC,YAAM,IAAI,CAAC,EAAE,cAAc;AAAA,IAC7B,WAAW,GAAG;AACZ,YAAM,IAAI,CAAC,EAAE,cAAc;AAAA,IAC7B,WAAW,GAAG;AACZ,YAAM,CAAC,EAAE,YAAY;AAAA,IACvB,OAAO;AACL,YAAM,CAAC,EAAE,YAAY;AACrB,YAAM,IAAI,CAAC,EAAE,cAAc,CAAC;AAC5B,YAAM,IAAI,CAAC,EAAE,UAAU;AAAA,IACzB;AAAA,EACF;AAEA,SAAO;AACT;;;AClBQ;AA9BD,IAAM,YAAsC,CAAC;AAAA,EAClD;AAAA,EACA,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,WAAW;AAAA,EACX,eAAe;AAAA,EACf,YAAY;AAAA,EACZ,GAAG;AACL,MAAM;AACJ,QAAM,UAAU;AAAA,IACd;AAAA,IACA,qBAAqB,IAAI;AAAA,IACzB,gBAAgB;AAAA,IAChB,YAAY;AAAA,IACZ;AAAA,EACF,EACG,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,QAAM,YAAY,SAAS,SAAS;AACpC,QAAM,WAAW,SAAS,IAAI,CAAC,aAAa;AAAA,IAC1C,SAAS,QAAQ,WAAW;AAAA,IAC5B,UAAU,YAAY,CAAC,CAAC,QAAQ;AAAA,EAClC,EAAE;AACF,QAAM,QAAQ,oBAAoB,UAAU,YAAY;AAExD,SACE,oBAAC,SAAI,WAAW,SAAU,GAAG,MAC1B,mBAAS,IAAI,CAAC,SAAS,UACtB;AAAA,IAAC;AAAA;AAAA,MAEC,SAAS,SAAS,KAAK,EAAE;AAAA,MACzB,OAAO,QAAQ,SAAS;AAAA,MACxB;AAAA,MACA,UAAU,SAAS,KAAK,EAAE;AAAA,MAC1B,SAAS,QAAQ;AAAA,MACjB,SAAS,QAAQ;AAAA,MACjB,SAAS,QAAQ;AAAA,MACjB,SAAS,QAAQ;AAAA,MAKjB,WAAW;AAAA,QACT;AAAA,QACA,UAAU,KAAK;AAAA,QACf,UAAU,aAAa;AAAA,QACvB,MAAM,KAAK,EAAE,eAAe;AAAA,QAC5B,MAAM,KAAK,EAAE,aAAa;AAAA,QAC1B,MAAM,KAAK,EAAE,WAAW;AAAA,MAC1B,EACG,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,MAEV,kBAAQ;AAAA;AAAA,IAxBJ,QAAQ;AAAA,EAyBf,CACD,GACH;AAEJ;","names":[]}
|
|
@@ -480,6 +480,7 @@ var MessageItem = ({
|
|
|
480
480
|
const { author, status = "sent" } = message;
|
|
481
481
|
const timestamp = formatTimestamp ? formatTimestamp(message.sentAt) : formatMessageTime(message.sentAt);
|
|
482
482
|
const hasActions = Boolean(actions && actions.length > 0);
|
|
483
|
+
const timeInBubble = layout === "chat";
|
|
483
484
|
return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
|
|
484
485
|
"li",
|
|
485
486
|
{
|
|
@@ -506,7 +507,7 @@ var MessageItem = ({
|
|
|
506
507
|
!grouped && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "eidos-message-header", children: [
|
|
507
508
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "eidos-message-author", children: author.name }),
|
|
508
509
|
author.role && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkEQ6BNPTLcjs.Pill, { size: "sm", variant: "outlined", color: "secondary", children: author.role }),
|
|
509
|
-
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, "time", { className: "eidos-message-time", dateTime: message.sentAt, children: timestamp }),
|
|
510
|
+
!timeInBubble && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "time", { className: "eidos-message-time", dateTime: message.sentAt, children: timestamp }),
|
|
510
511
|
message.edited && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "eidos-message-edited", children: "edited" })
|
|
511
512
|
] }),
|
|
512
513
|
/* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "eidos-message-bubble", children: [
|
|
@@ -520,7 +521,7 @@ var MessageItem = ({
|
|
|
520
521
|
] }),
|
|
521
522
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "eidos-message-body", children: _nullishCoalesce(body, () => ( message.body)) }),
|
|
522
523
|
message.attachments && message.attachments.length > 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AttachmentList, { attachments: message.attachments }),
|
|
523
|
-
grouped && /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
524
|
+
(timeInBubble || grouped) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
524
525
|
"time",
|
|
525
526
|
{
|
|
526
527
|
className: "eidos-message-time eidos-message-time--inline",
|
|
@@ -885,4 +886,4 @@ CommentThread.displayName = "CommentThread";
|
|
|
885
886
|
|
|
886
887
|
|
|
887
888
|
exports.MessageComposer = MessageComposer; exports.Chat = Chat; exports.CommentThread = CommentThread;
|
|
888
|
-
//# sourceMappingURL=chunk-
|
|
889
|
+
//# sourceMappingURL=chunk-O2BECFXJ.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/eidos-ui/eidos-ui/dist/chunk-O2BECFXJ.cjs","../src/components/Conversation/Chat.component.tsx","../src/components/Conversation/MessageComposer.component.tsx","../src/components/Conversation/Conversation.hooks.ts","../src/components/Conversation/Conversation.utils.ts","../src/components/Conversation/MessageItem.component.tsx","../src/components/Conversation/CommentThread.component.tsx"],"names":["useRef","useCallback","Fragment","Paperclip","jsx","jsxs"],"mappings":"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","file":"/home/runner/work/eidos-ui/eidos-ui/dist/chunk-O2BECFXJ.cjs","sourcesContent":[null,"import React, { useCallback, useMemo } from 'react';\nimport { ArrowDown, MessagesSquare } from 'lucide-react';\nimport { Button } from '../Button';\nimport { EmptyState } from '../EmptyState';\nimport { Skeleton } from '../Skeleton';\nimport { Spinner } from '../Spinner';\nimport { MessageComposer } from './MessageComposer.component';\nimport { MessageItem } from './MessageItem.component';\nimport type { ChatProps, ConversationMessage } from './Conversation.types';\nimport {\n useLoadMoreOnScrollTop,\n useNewMessageIds,\n useScrollAnchor,\n useStickToBottom,\n} from './Conversation.hooks';\nimport { classNames, continuesRun, formatDateSeparator, isSameDay } from './Conversation.utils';\n\nconst ChatSkeleton: React.FC = () => (\n <div className=\"eidos-chat-skeleton\" aria-hidden=\"true\">\n {[0, 1, 2, 3].map((row) => (\n <div\n key={row}\n className={classNames(\n 'eidos-chat-skeleton-row',\n row % 2 === 1 && 'eidos-chat-skeleton-row--own',\n )}\n >\n <Skeleton variant=\"circular\" width={28} height={28} />\n <Skeleton variant=\"rounded\" height={48} />\n </div>\n ))}\n </div>\n);\n\n/**\n * A bottom-anchored message thread with a composer.\n *\n * Controlled and transport-agnostic: it renders the `messages` it is given and\n * reports intent through `onSend` / `onLoadMore`. It never fetches, so the\n * same array can be persisted and replayed verbatim.\n */\nexport const Chat: React.FC<ChatProps> = ({\n messages,\n currentUserId,\n onSend,\n onRetry,\n readOnly = false,\n readOnlyMessage,\n renderBody,\n messageActions,\n renderMessageFooter,\n loading = false,\n emptyContent,\n hasMore = false,\n loadingMore = false,\n onLoadMore,\n groupConsecutive = true,\n groupWindowMinutes = 5,\n showDateSeparators = true,\n formatTimestamp,\n animateNewMessages = true,\n allowAttachments = false,\n attachmentAccept,\n typing,\n unreadFromId,\n placeholder = 'Write a message...',\n sendOnEnter = true,\n ariaLabel = 'Conversation',\n className = '',\n}) => {\n const { scrollRef, atBottom, scrollToBottom, handleScroll } = useStickToBottom(messages);\n const newIds = useNewMessageIds(messages, animateNewMessages);\n useScrollAnchor(scrollRef, messages);\n\n const loadMoreOnScroll = useLoadMoreOnScrollTop(scrollRef, { hasMore, loadingMore, onLoadMore });\n\n const onScroll = useCallback(() => {\n handleScroll();\n loadMoreOnScroll();\n }, [handleScroll, loadMoreOnScroll]);\n\n const byId = useMemo(() => new Map(messages.map((message) => [message.id, message])), [messages]);\n\n // An id that isn't in the current page must not draw a divider above\n // nothing - it would float at the top of whatever happens to be loaded.\n const unreadIndex = useMemo(() => {\n if (!unreadFromId) return -1;\n return messages.findIndex((message) => message.id === unreadFromId);\n }, [messages, unreadFromId]);\n\n const showComposer = !readOnly && Boolean(onSend);\n const isEmpty = !loading && messages.length === 0;\n\n const renderMessage = (message: ConversationMessage, index: number) => {\n const previous = messages[index - 1];\n const actions = readOnly ? undefined : messageActions?.(message);\n const quoted = message.parentId ? byId.get(message.parentId) : undefined;\n\n const nodes: React.ReactNode[] = [];\n\n if (showDateSeparators && (!previous || !isSameDay(previous.sentAt, message.sentAt))) {\n nodes.push(\n <li key={`date-${message.id}`} className=\"eidos-conversation-separator\">\n <span>{formatDateSeparator(message.sentAt)}</span>\n </li>,\n );\n }\n\n if (index === unreadIndex) {\n nodes.push(\n <li\n key={`unread-${message.id}`}\n className=\"eidos-conversation-separator eidos-conversation-separator--unread\"\n >\n <span>Unread messages</span>\n </li>,\n );\n }\n\n // A separator breaks a run: the message under it needs its own header.\n const grouped =\n groupConsecutive &&\n index !== unreadIndex &&\n nodes.length === 0 &&\n continuesRun(previous, message, groupWindowMinutes);\n\n nodes.push(\n <MessageItem\n key={message.id}\n message={message}\n layout=\"chat\"\n isOwn={Boolean(currentUserId) && message.author.id === currentUserId}\n grouped={grouped}\n isNew={newIds.has(message.id)}\n actions={actions}\n footer={renderMessageFooter?.(message)}\n body={renderBody?.(message)}\n onRetry={!readOnly && onRetry ? () => onRetry(message) : undefined}\n quoted={quoted}\n formatTimestamp={formatTimestamp}\n />,\n );\n\n return nodes;\n };\n\n return (\n <div className={classNames('eidos-chat', className)}>\n <div\n ref={scrollRef}\n className=\"eidos-chat-scroll\"\n onScroll={onScroll}\n role=\"log\"\n aria-live=\"polite\"\n aria-relevant=\"additions\"\n aria-busy={loading}\n aria-label={ariaLabel}\n tabIndex={0}\n >\n {hasMore && (\n <div className=\"eidos-chat-load-more\">\n {loadingMore ? (\n <span className=\"eidos-chat-loading-more\">\n <Spinner size=\"sm\" color=\"secondary\" />\n Loading earlier messages…\n </span>\n ) : (\n <Button variant=\"text\" color=\"secondary\" size=\"sm\" onClick={onLoadMore}>\n Load earlier messages\n </Button>\n )}\n </div>\n )}\n\n {loading && <ChatSkeleton />}\n\n {isEmpty &&\n (emptyContent ?? (\n <EmptyState\n icon={<MessagesSquare />}\n title=\"No messages yet\"\n description={\n showComposer ? 'Send the first message to start the conversation.' : undefined\n }\n size=\"sm\"\n />\n ))}\n\n {!loading && messages.length > 0 && (\n <ol className=\"eidos-conversation-list\">{messages.map(renderMessage)}</ol>\n )}\n\n {typing && typing.length > 0 && (\n <div className=\"eidos-chat-typing\" aria-live=\"polite\">\n <span className=\"eidos-chat-typing-dots\" aria-hidden=\"true\">\n <i />\n <i />\n <i />\n </span>\n {typing.length === 1\n ? `${typing[0].name} is typing…`\n : `${typing.length} people are typing…`}\n </div>\n )}\n </div>\n\n {!atBottom && messages.length > 0 && (\n <div className=\"eidos-chat-jump\">\n <Button\n size=\"sm\"\n variant=\"filled\"\n color=\"secondary\"\n preIcon={ArrowDown}\n onClick={() => scrollToBottom('smooth')}\n >\n Latest\n </Button>\n </div>\n )}\n\n {showComposer && (\n <div className=\"eidos-chat-composer\">\n <MessageComposer\n onSubmit={onSend as NonNullable<typeof onSend>}\n placeholder={placeholder}\n sendOnEnter={sendOnEnter}\n allowAttachments={allowAttachments}\n attachmentAccept={attachmentAccept}\n />\n </div>\n )}\n\n {readOnly && readOnlyMessage && (\n <p className=\"eidos-conversation-readonly\">{readOnlyMessage}</p>\n )}\n </div>\n );\n};\n\nChat.displayName = 'Chat';\n","import React, { useCallback, useId, useRef, useState } from 'react';\nimport { Paperclip, Send, X } from 'lucide-react';\nimport { Avatar } from '../Avatar';\nimport { Button } from '../Button';\nimport { Chip } from '../Chip';\nimport type { MessageComposerProps } from './Conversation.types';\nimport { useAutoGrow } from './Conversation.hooks';\nimport { classNames, formatFileSize } from './Conversation.utils';\n\n/**\n * The authoring half of a conversation - a growing text field, optional\n * attachments, and a submit control.\n *\n * Exported on its own so a consumer building a bespoke list can still reuse\n * the input, and used internally by both `Chat` and `CommentThread`.\n */\nexport const MessageComposer: React.FC<MessageComposerProps> = ({\n value,\n onChange,\n onSubmit,\n onCancel,\n placeholder = 'Write a message...',\n submitLabel = 'Send',\n sendOnEnter = false,\n parentId,\n replyingTo,\n allowAttachments = false,\n attachmentAccept,\n author,\n disabled = false,\n requireBody = true,\n autoFocus = false,\n maxLength,\n className = '',\n}) => {\n const [internalBody, setInternalBody] = useState('');\n const [attachments, setAttachments] = useState<File[]>([]);\n const [pending, setPending] = useState(false);\n\n const textareaRef = useRef<HTMLTextAreaElement>(null);\n const fileInputRef = useRef<HTMLInputElement>(null);\n const fileInputId = useId();\n\n const isControlled = value !== undefined;\n const body = isControlled ? value : internalBody;\n\n useAutoGrow(textareaRef, body);\n\n const setBody = useCallback(\n (next: string) => {\n if (!isControlled) setInternalBody(next);\n onChange?.(next);\n },\n [isControlled, onChange],\n );\n\n const canSubmit = !disabled && !pending && (!requireBody || body.trim().length > 0);\n\n const submit = useCallback(async () => {\n if (!canSubmit) return;\n\n const draft = { body: body.trim(), attachments, parentId };\n const result = onSubmit(draft);\n\n // A synchronous handler clears immediately; an async one keeps the draft\n // until it resolves, so a rejected send never loses what was typed.\n if (!(result instanceof Promise)) {\n setBody('');\n setAttachments([]);\n return;\n }\n\n setPending(true);\n try {\n await result;\n setBody('');\n setAttachments([]);\n } catch {\n // Intentionally swallowed: the draft stays put and the consumer owns\n // error reporting (a Snackbar, an Alert, ...). Rethrowing here would\n // surface as an unhandled rejection from a keystroke.\n } finally {\n setPending(false);\n }\n }, [canSubmit, body, attachments, parentId, onSubmit, setBody]);\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLTextAreaElement>) => {\n if (!sendOnEnter) return;\n // Shift+Enter always inserts a newline; the modifier check also leaves\n // IME composition (which fires Enter to commit) alone.\n if (event.key !== 'Enter' || event.shiftKey || event.nativeEvent.isComposing) return;\n event.preventDefault();\n void submit();\n };\n\n const addFiles = (list: FileList | null) => {\n if (!list?.length) return;\n setAttachments((current) => [...current, ...Array.from(list)]);\n // Reset so selecting the same file twice in a row still fires `change`.\n if (fileInputRef.current) fileInputRef.current.value = '';\n };\n\n const removeAttachment = (index: number) =>\n setAttachments((current) => current.filter((_, i) => i !== index));\n\n return (\n <form\n className={classNames('eidos-message-composer', className)}\n onSubmit={(event) => {\n event.preventDefault();\n void submit();\n }}\n >\n {replyingTo && (\n <div className=\"eidos-composer-reply-hint\">\n <span>\n Replying to <strong>{replyingTo}</strong>\n </span>\n {onCancel && (\n <Button\n variant=\"text\"\n color=\"secondary\"\n size=\"sm\"\n icon={X}\n onClick={onCancel}\n tooltip=\"Cancel reply\"\n aria-label=\"Cancel reply\"\n />\n )}\n </div>\n )}\n\n <div className=\"eidos-composer-row\">\n {author && (\n <div className=\"eidos-composer-avatar\">\n <Avatar\n src={author.avatarSrc}\n name={author.name}\n size=\"sm\"\n color={author.avatarColor ?? 'gray'}\n />\n </div>\n )}\n\n <div className=\"eidos-composer-field\">\n <textarea\n ref={textareaRef}\n className=\"eidos-composer-input\"\n value={body}\n onChange={(event) => setBody(event.target.value)}\n onKeyDown={handleKeyDown}\n placeholder={placeholder}\n disabled={disabled || pending}\n rows={1}\n maxLength={maxLength}\n // Opt-in and off by default. Only the reply composer sets it, where\n // the field appears in direct response to the user pressing Reply -\n // moving focus there is the expected outcome, not a hijack.\n autoFocus={autoFocus}\n aria-label={placeholder}\n />\n\n {attachments.length > 0 && (\n <ul className=\"eidos-composer-attachments\">\n {attachments.map((file, index) => (\n <li key={`${file.name}-${file.size}-${index}`}>\n <Chip\n size=\"sm\"\n variant=\"outlined\"\n color=\"secondary\"\n preIcon={Paperclip}\n onRemove={() => removeAttachment(index)}\n >\n {file.name}\n {file.size > 0 && ` (${formatFileSize(file.size)})`}\n </Chip>\n </li>\n ))}\n </ul>\n )}\n </div>\n </div>\n\n <div className=\"eidos-composer-actions\">\n <div className=\"eidos-composer-actions-start\">\n {allowAttachments && (\n <>\n <input\n ref={fileInputRef}\n id={fileInputId}\n type=\"file\"\n multiple\n accept={attachmentAccept}\n // Hidden from both the tab order and the accessibility\n // tree. It is a proxy: the visible button above opens the\n // file dialog via `.click()`, so this input is an\n // implementation detail, not a control.\n //\n // `visually-hidden` keeps an element *focusable* - that is\n // the point of it, for skip links and screen-reader-only\n // text - so a keyboard user landed on an invisible control\n // and met the same \"Attach files\" action twice. `FileUpload`\n // already gets this right with `display: none` +\n // `tabIndex={-1}`; these two had drifted from it.\n //\n // `aria-hidden` is safe here only *because* of the\n // `tabIndex={-1}` beside it - hiding a focusable element is\n // its own violation.\n className=\"eidos-composer-file-input\"\n tabIndex={-1}\n aria-hidden=\"true\"\n onChange={(event) => addFiles(event.target.files)}\n disabled={disabled || pending}\n />\n <Button\n variant=\"text\"\n color=\"secondary\"\n size=\"sm\"\n icon={Paperclip}\n tooltip=\"Attach files\"\n aria-label=\"Attach files\"\n disabled={disabled || pending}\n onClick={() => fileInputRef.current?.click()}\n />\n </>\n )}\n {sendOnEnter && (\n <span className=\"eidos-composer-hint\">\n <kbd>Enter</kbd> to send · <kbd>Shift</kbd>+<kbd>Enter</kbd> for a new line\n </span>\n )}\n </div>\n\n <div className=\"eidos-composer-actions-end\">\n {onCancel && !replyingTo && (\n <Button\n variant=\"text\"\n color=\"secondary\"\n size=\"sm\"\n onClick={onCancel}\n disabled={pending}\n >\n Cancel\n </Button>\n )}\n <Button\n type=\"submit\"\n size=\"sm\"\n color=\"primary\"\n preIcon={Send}\n loading={pending}\n disabled={!canSubmit}\n >\n {submitLabel}\n </Button>\n </div>\n </div>\n </form>\n );\n};\n\nMessageComposer.displayName = 'MessageComposer';\n","import { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';\nimport type { ConversationMessage } from './Conversation.types';\n\n/**\n * Ids that arrived *after* the first render.\n *\n * Seeded from the first commit so an initial page of history is never\n * animated - otherwise opening a thread fades forty messages in at once,\n * which reads as a glitch rather than as feedback. Only genuinely new ids get\n * the entrance class, and each one only once.\n */\nexport const useNewMessageIds = (\n messages: ConversationMessage[],\n enabled: boolean,\n): Set<string> => {\n const seen = useRef<Set<string> | null>(null);\n const [fresh, setFresh] = useState<Set<string>>(() => new Set());\n\n useEffect(() => {\n // First commit: everything already on screen counts as pre-existing.\n if (seen.current === null) {\n seen.current = new Set(messages.map((message) => message.id));\n return;\n }\n\n if (!enabled) {\n for (const message of messages) seen.current.add(message.id);\n return;\n }\n\n const added = messages.filter((message) => !seen.current?.has(message.id));\n if (!added.length) return;\n\n for (const message of added) seen.current.add(message.id);\n setFresh(new Set(added.map((message) => message.id)));\n }, [messages, enabled]);\n\n return fresh;\n};\n\ninterface StickToBottom {\n scrollRef: React.RefObject<HTMLDivElement | null>;\n /** The viewport is at (or near) the newest message. */\n atBottom: boolean;\n scrollToBottom: (behavior?: ScrollBehavior) => void;\n handleScroll: () => void;\n}\n\n/** Distance from the bottom still counted as \"reading the newest message\". */\nconst BOTTOM_THRESHOLD_PX = 48;\n\n/**\n * Keeps a bottom-anchored list pinned to the newest message - but only while\n * the reader is already there.\n *\n * Scrolling someone back down while they are reading scrollback is the single\n * most common defect in chat UIs, so arrival of a new message only forces a\n * scroll when `atBottom` was already true. Otherwise the caller surfaces a\n * jump-to-latest affordance and leaves the viewport alone.\n */\nexport const useStickToBottom = (messages: ConversationMessage[]): StickToBottom => {\n const scrollRef = useRef<HTMLDivElement>(null);\n const [atBottom, setAtBottom] = useState(true);\n // Read during a layout effect, so it must not be state - it has to be\n // correct for the commit that is happening right now, not the next render.\n const atBottomRef = useRef(true);\n const lastCount = useRef(messages.length);\n\n const scrollToBottom = useCallback((behavior: ScrollBehavior = 'smooth') => {\n const node = scrollRef.current;\n if (!node) return;\n node.scrollTo({ top: node.scrollHeight, behavior });\n }, []);\n\n const handleScroll = useCallback(() => {\n const node = scrollRef.current;\n if (!node) return;\n const distance = node.scrollHeight - node.scrollTop - node.clientHeight;\n const next = distance <= BOTTOM_THRESHOLD_PX;\n atBottomRef.current = next;\n setAtBottom((current) => (current === next ? current : next));\n }, []);\n\n // Jump (not animate) to the bottom on first paint so a thread opens on its\n // newest message instead of visibly scrolling there.\n useLayoutEffect(() => {\n scrollToBottom('auto');\n // eslint-disable-next-line react-hooks/exhaustive-deps -- mount only\n }, []);\n\n useLayoutEffect(() => {\n if (messages.length > lastCount.current && atBottomRef.current) {\n scrollToBottom('smooth');\n }\n lastCount.current = messages.length;\n }, [messages.length, scrollToBottom]);\n\n return { scrollRef, atBottom, scrollToBottom, handleScroll };\n};\n\n/**\n * Preserves the reader's position when older messages are prepended.\n *\n * Without this, inserting a page above the viewport pushes the content the\n * user was reading down by the height of everything added, which reads as the\n * list jumping to a random place. Capturing `scrollHeight` before the DOM\n * mutation and restoring the delta in a *layout* effect corrects it before the\n * browser paints, so there is no visible shift.\n */\nexport const useScrollAnchor = (\n scrollRef: React.RefObject<HTMLDivElement | null>,\n messages: ConversationMessage[],\n): void => {\n const previous = useRef({ height: 0, firstId: '', count: 0 });\n\n useLayoutEffect(() => {\n const node = scrollRef.current;\n if (!node) return;\n\n const firstId = messages[0]?.id ?? '';\n const before = previous.current;\n // A prepend is the only case where the first id changes while the list\n // grows - an append leaves it untouched, and a replacement shrinks it.\n const prepended =\n before.firstId !== '' && before.firstId !== firstId && messages.length > before.count;\n\n if (prepended) {\n node.scrollTop += node.scrollHeight - before.height;\n }\n\n previous.current = { height: node.scrollHeight, firstId, count: messages.length };\n }, [messages, scrollRef]);\n};\n\n/**\n * Fires `onLoadMore` once the reader approaches the top of the history.\n *\n * Latched on the way in and released only after they scroll back out of the\n * trigger zone, so a single pause near the top can't queue a dozen fetches.\n */\nexport const useLoadMoreOnScrollTop = (\n scrollRef: React.RefObject<HTMLDivElement | null>,\n {\n hasMore,\n loadingMore,\n onLoadMore,\n }: {\n hasMore?: boolean;\n loadingMore?: boolean;\n onLoadMore?: () => void;\n },\n thresholdPx = 80,\n): (() => void) => {\n const armed = useRef(true);\n\n return useCallback(() => {\n const node = scrollRef.current;\n if (!node) return;\n\n if (node.scrollTop > thresholdPx) {\n armed.current = true;\n return;\n }\n\n if (!armed.current || !hasMore || loadingMore || !onLoadMore) return;\n armed.current = false;\n onLoadMore();\n }, [scrollRef, hasMore, loadingMore, onLoadMore, thresholdPx]);\n};\n\n/**\n * Grows a textarea to fit its content, up to `maxHeight`.\n *\n * Height is written to `style.height` directly rather than through a React\n * inline style: it is measured from the live DOM after every keystroke, so it\n * cannot be expressed as a class, and routing it through state would add a\n * render per character. Assigning the property imperatively also keeps it out\n * of the server-rendered `style` attribute that CSP's `style-src-attr` gates.\n */\nexport const useAutoGrow = (\n ref: React.RefObject<HTMLTextAreaElement | null>,\n value: string,\n maxHeight = 200,\n): void => {\n useLayoutEffect(() => {\n const node = ref.current;\n if (!node) return;\n\n node.style.height = 'auto';\n const next = Math.min(node.scrollHeight, maxHeight);\n node.style.height = `${next}px`;\n node.style.overflowY = node.scrollHeight > maxHeight ? 'auto' : 'hidden';\n }, [ref, value, maxHeight]);\n};\n","import type { ConversationMessage } from './Conversation.types';\n\n/**\n * Timestamp formatting goes through `Intl` rather than a date library on\n * purpose: `dayjs` is currently bundled only into the `DatePicker` chunk, and\n * pulling it in here would add it to every consumer importing a conversation.\n * `Intl` is built in and already locale-aware.\n */\n\nconst timeFormat = new Intl.DateTimeFormat(undefined, {\n hour: '2-digit',\n minute: '2-digit',\n});\n\nconst dateFormat = new Intl.DateTimeFormat(undefined, {\n day: 'numeric',\n month: 'long',\n year: 'numeric',\n});\n\nconst dateFormatSameYear = new Intl.DateTimeFormat(undefined, {\n day: 'numeric',\n month: 'long',\n});\n\n/** Parses an ISO string, returning null rather than an `Invalid Date`. */\nexport const parseDate = (iso: string): Date | null => {\n const date = new Date(iso);\n return Number.isNaN(date.getTime()) ? null : date;\n};\n\nexport const formatMessageTime = (iso: string): string => {\n const date = parseDate(iso);\n return date ? timeFormat.format(date) : iso;\n};\n\nconst startOfDay = (date: Date): number =>\n new Date(date.getFullYear(), date.getMonth(), date.getDate()).getTime();\n\nexport const isSameDay = (a: string, b: string): boolean => {\n const first = parseDate(a);\n const second = parseDate(b);\n if (!first || !second) return false;\n return startOfDay(first) === startOfDay(second);\n};\n\n/** `Today` / `Yesterday` / a full date, for the divider between days. */\nexport const formatDateSeparator = (iso: string): string => {\n const date = parseDate(iso);\n if (!date) return iso;\n\n const now = new Date();\n const dayDelta = Math.round((startOfDay(now) - startOfDay(date)) / 86_400_000);\n\n if (dayDelta === 0) return 'Today';\n if (dayDelta === 1) return 'Yesterday';\n return date.getFullYear() === now.getFullYear()\n ? dateFormatSameYear.format(date)\n : dateFormat.format(date);\n};\n\nconst FILE_UNITS = ['B', 'KB', 'MB', 'GB', 'TB'];\n\nexport const formatFileSize = (bytes: number): string => {\n if (!Number.isFinite(bytes) || bytes < 0) return '';\n if (bytes < 1024) return `${bytes} B`;\n\n let value = bytes;\n let unit = 0;\n while (value >= 1024 && unit < FILE_UNITS.length - 1) {\n value /= 1024;\n unit += 1;\n }\n // One decimal below 10 (9.4 MB), none above it (24 MB) - the extra digit\n // stops carrying information once the integer part is two digits.\n return `${value < 10 ? value.toFixed(1) : Math.round(value)} ${FILE_UNITS[unit]}`;\n};\n\n/**\n * Whether `message` continues a run started by `previous` - same author, same\n * day, and within the grouping window. A grouped message hides its avatar and\n * author line.\n */\nexport const continuesRun = (\n previous: ConversationMessage | undefined,\n message: ConversationMessage,\n windowMinutes: number,\n): boolean => {\n if (!previous) return false;\n if (previous.author.id !== message.author.id) return false;\n if (!isSameDay(previous.sentAt, message.sentAt)) return false;\n\n const before = parseDate(previous.sentAt);\n const after = parseDate(message.sentAt);\n if (!before || !after) return false;\n\n return Math.abs(after.getTime() - before.getTime()) <= windowMinutes * 60_000;\n};\n\nexport const sortBySentAt = (messages: ConversationMessage[]): ConversationMessage[] =>\n [...messages].sort((a, b) => {\n const first = parseDate(a.sentAt)?.getTime() ?? 0;\n const second = parseDate(b.sentAt)?.getTime() ?? 0;\n return first - second;\n });\n\nexport interface ThreadNode {\n message: ConversationMessage;\n replies: ConversationMessage[];\n}\n\n/**\n * Collapses a flat list into one level of nesting.\n *\n * Deeper chains are flattened onto the nearest **top-level** ancestor rather\n * than being dropped or nested further: indentation past one level is\n * unreadable on a phone, and silently discarding a reply-to-a-reply would lose\n * data the consumer stored. `replyingToName` on the rendered reply is what\n * preserves who was actually answered.\n *\n * A `parentId` pointing at a message that isn't present (paged out, deleted)\n * is treated as top-level, so nothing ever disappears from the list.\n */\nexport const buildThread = (messages: ConversationMessage[]): ThreadNode[] => {\n const byId = new Map(messages.map((message) => [message.id, message]));\n\n /** Walks up to the outermost ancestor, guarding against a parentId cycle. */\n const rootIdOf = (message: ConversationMessage): string => {\n const seen = new Set<string>([message.id]);\n let current = message;\n\n while (current.parentId) {\n const parent = byId.get(current.parentId);\n if (!parent || seen.has(parent.id)) break;\n seen.add(parent.id);\n current = parent;\n }\n\n return current.id;\n };\n\n const nodes = new Map<string, ThreadNode>();\n const roots: ThreadNode[] = [];\n\n for (const message of messages) {\n if (message.parentId && byId.has(message.parentId)) continue;\n const node: ThreadNode = { message, replies: [] };\n nodes.set(message.id, node);\n roots.push(node);\n }\n\n for (const message of messages) {\n if (!message.parentId || !byId.has(message.parentId)) continue;\n nodes.get(rootIdOf(message))?.replies.push(message);\n }\n\n for (const node of nodes.values()) {\n node.replies = sortBySentAt(node.replies);\n }\n\n return roots;\n};\n\n/** Name of the author a reply was addressed to, when it isn't its own parent. */\nexport const replyTargetName = (\n message: ConversationMessage,\n byId: Map<string, ConversationMessage>,\n rootId: string,\n): string | undefined => {\n if (!message.parentId || message.parentId === rootId) return undefined;\n return byId.get(message.parentId)?.author.name;\n};\n\n/** Trims a quoted excerpt so a long parent message can't dominate the reply. */\nexport const excerpt = (body: string, maxLength = 120): string => {\n const flat = body.replace(/\\s+/g, ' ').trim();\n return flat.length > maxLength ? `${flat.slice(0, maxLength - 1)}…` : flat;\n};\n\nexport const classNames = (...values: Array<string | false | null | undefined>): string =>\n values.filter(Boolean).join(' ');\n","import React from 'react';\nimport { AlertCircle, MoreHorizontal, Paperclip, RotateCw } from 'lucide-react';\nimport { Avatar } from '../Avatar';\nimport { Button } from '../Button';\nimport { Menu } from '../Menu';\nimport { Pill } from '../Pill';\nimport { Spinner } from '../Spinner';\nimport type { ConversationMessage, MessageAttachment } from './Conversation.types';\nimport type { MenuItemType } from '../Menu';\nimport { classNames, excerpt, formatFileSize, formatMessageTime } from './Conversation.utils';\n\nexport interface MessageItemProps {\n message: ConversationMessage;\n /** 'chat' right-aligns own messages into bubbles; 'comment' renders a flat card. */\n layout: 'chat' | 'comment';\n isOwn: boolean;\n /** Continues a run from the same author - hides the avatar and author line. */\n grouped: boolean;\n /** Plays the entrance animation. */\n isNew: boolean;\n actions?: MenuItemType[];\n footer?: React.ReactNode;\n body?: React.ReactNode;\n onRetry?: () => void;\n /** Author of the message being answered, for a flattened deep reply. */\n replyingToName?: string;\n /** Quoted parent, rendered above the body in chat layout. */\n quoted?: ConversationMessage;\n /** Reply affordance; omitted entirely when the viewer may not reply. */\n onReply?: () => void;\n formatTimestamp?: (iso: string) => string;\n}\n\nconst AttachmentList: React.FC<{ attachments: MessageAttachment[] }> = ({ attachments }) => (\n <ul className=\"eidos-message-attachments\">\n {attachments.map((attachment) => {\n const label = (\n <>\n <Paperclip aria-hidden=\"true\" />\n <span className=\"eidos-message-attachment-name\">{attachment.name}</span>\n {attachment.size !== undefined && (\n <span className=\"eidos-message-attachment-size\">{formatFileSize(attachment.size)}</span>\n )}\n </>\n );\n\n return (\n <li key={attachment.id} className=\"eidos-message-attachment\">\n {attachment.url ? (\n <a\n href={attachment.url}\n className=\"eidos-message-attachment-link\"\n target=\"_blank\"\n rel=\"noreferrer\"\n download={attachment.name}\n >\n {label}\n </a>\n ) : (\n <span className=\"eidos-message-attachment-link\">{label}</span>\n )}\n </li>\n );\n })}\n </ul>\n);\n\nexport const MessageItem: React.FC<MessageItemProps> = ({\n message,\n layout,\n isOwn,\n grouped,\n isNew,\n actions,\n footer,\n body,\n onRetry,\n replyingToName,\n quoted,\n onReply,\n formatTimestamp,\n}) => {\n const { author, status = 'sent' } = message;\n const timestamp = formatTimestamp\n ? formatTimestamp(message.sentAt)\n : formatMessageTime(message.sentAt);\n // An empty action list must not leave a dead trigger behind - see the\n // permissions note in Conversation.types.ts.\n const hasActions = Boolean(actions && actions.length > 0);\n\n // One placement per layout, rather than one per message.\n //\n // `chat` puts the time at the foot of the bubble, where a grouped message\n // already had it; it used to appear in the header for the first message of a\n // group and inside the bubble for the rest, so a single thread showed the\n // same fact in two places. `comment` keeps it in the header, where the row is\n // full width and has space for it.\n const timeInBubble = layout === 'chat';\n\n return (\n <li\n className={classNames(\n 'eidos-message',\n `eidos-message--${layout}`,\n isOwn && 'eidos-message--own',\n grouped && 'eidos-message--grouped',\n status !== 'sent' && `eidos-message--${status}`,\n isNew && 'eidos-message--enter',\n )}\n data-message-id={message.id}\n >\n <div className=\"eidos-message-avatar\">\n {!grouped && (\n <Avatar\n src={author.avatarSrc}\n name={author.name}\n size=\"sm\"\n color={author.avatarColor ?? 'gray'}\n />\n )}\n </div>\n\n <div className=\"eidos-message-main\">\n {!grouped && (\n <div className=\"eidos-message-header\">\n <span className=\"eidos-message-author\">{author.name}</span>\n {author.role && (\n <Pill size=\"sm\" variant=\"outlined\" color=\"secondary\">\n {author.role}\n </Pill>\n )}\n {!timeInBubble && (\n <time className=\"eidos-message-time\" dateTime={message.sentAt}>\n {timestamp}\n </time>\n )}\n {message.edited && <span className=\"eidos-message-edited\">edited</span>}\n </div>\n )}\n\n <div className=\"eidos-message-bubble\">\n {quoted && (\n <blockquote className=\"eidos-message-quote\">\n <span className=\"eidos-message-quote-author\">{quoted.author.name}</span>\n <span className=\"eidos-message-quote-body\">{excerpt(quoted.body)}</span>\n </blockquote>\n )}\n\n {replyingToName && (\n <span className=\"eidos-message-reply-target\">Replying to {replyingToName}</span>\n )}\n\n <div className=\"eidos-message-body\">{body ?? message.body}</div>\n\n {message.attachments && message.attachments.length > 0 && (\n <AttachmentList attachments={message.attachments} />\n )}\n\n {(timeInBubble || grouped) && (\n <time\n className=\"eidos-message-time eidos-message-time--inline\"\n dateTime={message.sentAt}\n >\n {timestamp}\n </time>\n )}\n </div>\n\n {status === 'sending' && (\n <span className=\"eidos-message-status\">\n <Spinner size=\"sm\" color=\"secondary\" />\n Sending…\n </span>\n )}\n\n {status === 'failed' && (\n <span className=\"eidos-message-status eidos-message-status--failed\">\n <AlertCircle aria-hidden=\"true\" />\n Not sent\n {onRetry && (\n <Button variant=\"text\" color=\"danger\" size=\"sm\" preIcon={RotateCw} onClick={onRetry}>\n Retry\n </Button>\n )}\n </span>\n )}\n\n {footer && <div className=\"eidos-message-footer\">{footer}</div>}\n\n {onReply && (\n <div className=\"eidos-message-reply\">\n <Button variant=\"text\" color=\"secondary\" size=\"sm\" onClick={onReply}>\n Reply\n </Button>\n </div>\n )}\n </div>\n\n {hasActions && (\n <div className=\"eidos-message-actions\">\n <Menu\n items={actions ?? []}\n trigger={\n <Button\n variant=\"text\"\n color=\"secondary\"\n size=\"sm\"\n icon={MoreHorizontal}\n aria-label={`Actions for ${author.name}'s message`}\n />\n }\n />\n </div>\n )}\n </li>\n );\n};\n\nMessageItem.displayName = 'MessageItem';\n","import React, { useCallback, useMemo, useState } from 'react';\nimport { MessageSquare } from 'lucide-react';\nimport { Button } from '../Button';\nimport { EmptyState } from '../EmptyState';\nimport { Skeleton } from '../Skeleton';\nimport { Spinner } from '../Spinner';\nimport { MessageComposer } from './MessageComposer.component';\nimport { MessageItem } from './MessageItem.component';\nimport type { CommentThreadProps, ConversationMessage, MessageDraft } from './Conversation.types';\nimport { useNewMessageIds } from './Conversation.hooks';\nimport {\n buildThread,\n classNames,\n continuesRun,\n replyTargetName,\n sortBySentAt,\n} from './Conversation.utils';\n\nconst CommentSkeleton: React.FC = () => (\n <div className=\"eidos-comment-thread-skeleton\" aria-hidden=\"true\">\n {[0, 1, 2].map((row) => (\n <div key={row} className=\"eidos-comment-thread-skeleton-row\">\n <Skeleton variant=\"circular\" width={28} height={28} />\n <Skeleton variant=\"text\" lines={2} />\n </div>\n ))}\n </div>\n);\n\n/**\n * A comment section: document flow, no internal scroll container, one level of\n * nesting.\n *\n * Shares its data model and message rendering with `Chat`, so history captured\n * in one can be displayed in the other. Unlike `Chat` it has no scroll region\n * of its own - it grows with the page and pages *downward* via `onLoadMore`.\n */\nexport const CommentThread: React.FC<CommentThreadProps> = ({\n messages,\n currentUserId,\n onSend,\n onReply,\n onRetry,\n readOnly = false,\n readOnlyMessage,\n renderBody,\n messageActions,\n renderMessageFooter,\n loading = false,\n emptyContent,\n hasMore = false,\n loadingMore = false,\n onLoadMore,\n groupConsecutive = true,\n groupWindowMinutes = 5,\n formatTimestamp,\n animateNewMessages = true,\n allowAttachments = false,\n attachmentAccept,\n order = 'oldest-first',\n composerPosition = 'bottom',\n placeholder = 'Add a comment...',\n sendOnEnter = false,\n title,\n ariaLabel = 'Comments',\n className = '',\n}) => {\n const [replyingToId, setReplyingToId] = useState<string | null>(null);\n const newIds = useNewMessageIds(messages, animateNewMessages);\n\n const byId = useMemo(() => new Map(messages.map((message) => [message.id, message])), [messages]);\n\n const roots = useMemo(() => {\n const thread = buildThread(messages);\n const sorted = sortBySentAt(thread.map((node) => node.message));\n const ordered = order === 'newest-first' ? [...sorted].reverse() : sorted;\n const nodeById = new Map(thread.map((node) => [node.message.id, node]));\n // Replies always read oldest-first, even when roots are reversed - a\n // conversation under a single comment is chronological by nature.\n return ordered.map((message) => nodeById.get(message.id)!);\n }, [messages, order]);\n\n const canReply = !readOnly && Boolean(onReply);\n const showComposer = !readOnly && Boolean(onSend);\n const isEmpty = !loading && messages.length === 0;\n const total = messages.length;\n\n const handleReply = useCallback(\n async (draft: MessageDraft) => {\n await onReply?.(draft);\n setReplyingToId(null);\n },\n [onReply],\n );\n\n const renderComment = (\n message: ConversationMessage,\n options: { rootId: string; previous?: ConversationMessage; isReply: boolean },\n ) => {\n const actions = readOnly ? undefined : messageActions?.(message);\n\n return (\n <MessageItem\n key={message.id}\n message={message}\n layout=\"comment\"\n isOwn={Boolean(currentUserId) && message.author.id === currentUserId}\n grouped={groupConsecutive && continuesRun(options.previous, message, groupWindowMinutes)}\n isNew={newIds.has(message.id)}\n actions={actions}\n footer={renderMessageFooter?.(message)}\n body={renderBody?.(message)}\n onRetry={!readOnly && onRetry ? () => onRetry(message) : undefined}\n replyingToName={\n options.isReply ? replyTargetName(message, byId, options.rootId) : undefined\n }\n onReply={canReply ? () => setReplyingToId(message.id) : undefined}\n formatTimestamp={formatTimestamp}\n />\n );\n };\n\n const composer = showComposer && (\n <MessageComposer\n onSubmit={onSend as NonNullable<typeof onSend>}\n placeholder={placeholder}\n submitLabel=\"Comment\"\n sendOnEnter={sendOnEnter}\n allowAttachments={allowAttachments}\n attachmentAccept={attachmentAccept}\n className=\"eidos-comment-thread-composer\"\n />\n );\n\n return (\n <section className={classNames('eidos-comment-thread', className)} aria-label={ariaLabel}>\n {(title || total > 0) && (\n <header className=\"eidos-comment-thread-header\">\n {title && <h3 className=\"eidos-comment-thread-title\">{title}</h3>}\n {total > 0 && (\n <span className=\"eidos-comment-thread-count\">\n {total} {total === 1 ? 'comment' : 'comments'}\n </span>\n )}\n </header>\n )}\n\n {composerPosition === 'top' && composer}\n\n {loading && <CommentSkeleton />}\n\n {isEmpty &&\n (emptyContent ?? (\n <EmptyState\n icon={<MessageSquare />}\n title=\"No comments yet\"\n description={showComposer ? 'Start the discussion by leaving a comment.' : undefined}\n size=\"sm\"\n />\n ))}\n\n {!loading && roots.length > 0 && (\n <ol className=\"eidos-conversation-list eidos-comment-thread-list\" aria-busy={loadingMore}>\n {roots.map((node) => (\n <li key={node.message.id} className=\"eidos-comment-thread-node\">\n <ol className=\"eidos-conversation-list\">\n {renderComment(node.message, { rootId: node.message.id, isReply: false })}\n </ol>\n\n {node.replies.length > 0 && (\n <ol className=\"eidos-conversation-list eidos-comment-thread-replies\">\n {node.replies.map((reply, index) =>\n renderComment(reply, {\n rootId: node.message.id,\n previous: node.replies[index - 1],\n isReply: true,\n }),\n )}\n </ol>\n )}\n\n {replyingToId &&\n (replyingToId === node.message.id ||\n node.replies.some((reply) => reply.id === replyingToId)) && (\n <div className=\"eidos-comment-thread-reply-composer\">\n <MessageComposer\n onSubmit={handleReply}\n onCancel={() => setReplyingToId(null)}\n parentId={replyingToId}\n replyingTo={byId.get(replyingToId)?.author.name}\n placeholder=\"Write a reply...\"\n submitLabel=\"Reply\"\n sendOnEnter={sendOnEnter}\n allowAttachments={allowAttachments}\n attachmentAccept={attachmentAccept}\n autoFocus\n />\n </div>\n )}\n </li>\n ))}\n </ol>\n )}\n\n {hasMore && (\n <div className=\"eidos-comment-thread-load-more\">\n {loadingMore ? (\n <span className=\"eidos-comment-thread-loading-more\">\n <Spinner size=\"sm\" color=\"secondary\" />\n Loading more comments…\n </span>\n ) : (\n <Button variant=\"outlined\" color=\"secondary\" size=\"sm\" onClick={onLoadMore}>\n Load more comments\n </Button>\n )}\n </div>\n )}\n\n {composerPosition === 'bottom' && composer}\n\n {readOnly && readOnlyMessage && (\n <p className=\"eidos-conversation-readonly\">{readOnlyMessage}</p>\n )}\n </section>\n );\n};\n\nCommentThread.displayName = 'CommentThread';\n"]}
|
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }
|
|
2
|
+
|
|
3
|
+
var _chunkTTLFY76Jcjs = require('./chunk-TTLFY76J.cjs');
|
|
4
|
+
|
|
5
|
+
// src/components/SplitChip/SplitChip.utils.ts
|
|
6
|
+
var hasVisibleBorder = (segment) => segment.variant === "outlined" || segment.disabled;
|
|
7
|
+
var resolveSegmentEdges = (segments, showDividers) => {
|
|
8
|
+
const edges = segments.map(() => ({ joinedStart: false, joinedEnd: false, divided: false }));
|
|
9
|
+
for (let i = 0; i < segments.length - 1; i++) {
|
|
10
|
+
const a = hasVisibleBorder(segments[i]);
|
|
11
|
+
const b = hasVisibleBorder(segments[i + 1]);
|
|
12
|
+
const sameOutline = segments[i].disabled === segments[i + 1].disabled;
|
|
13
|
+
if (a && b) {
|
|
14
|
+
edges[i].joinedEnd = !showDividers && sameOutline;
|
|
15
|
+
edges[i + 1].joinedStart = true;
|
|
16
|
+
} else if (a) {
|
|
17
|
+
edges[i + 1].joinedStart = true;
|
|
18
|
+
} else if (b) {
|
|
19
|
+
edges[i].joinedEnd = true;
|
|
20
|
+
} else {
|
|
21
|
+
edges[i].joinedEnd = true;
|
|
22
|
+
edges[i + 1].joinedStart = !showDividers;
|
|
23
|
+
edges[i + 1].divided = showDividers;
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
return edges;
|
|
27
|
+
};
|
|
28
|
+
|
|
29
|
+
// src/components/SplitChip/SplitChip.component.tsx
|
|
30
|
+
var _jsxruntime = require('react/jsx-runtime');
|
|
31
|
+
var SplitChip = ({
|
|
32
|
+
segments,
|
|
33
|
+
variant = "filled",
|
|
34
|
+
color = "primary",
|
|
35
|
+
size = "md",
|
|
36
|
+
disabled = false,
|
|
37
|
+
showDividers = false,
|
|
38
|
+
className = "",
|
|
39
|
+
...rest
|
|
40
|
+
}) => {
|
|
41
|
+
const classes = [
|
|
42
|
+
"eidos-split-chip",
|
|
43
|
+
`eidos-split-chip--${size}`,
|
|
44
|
+
showDividers && "eidos-split-chip--dividers",
|
|
45
|
+
disabled && "eidos-split-chip--disabled",
|
|
46
|
+
className
|
|
47
|
+
].filter(Boolean).join(" ");
|
|
48
|
+
const lastIndex = segments.length - 1;
|
|
49
|
+
const resolved = segments.map((segment) => ({
|
|
50
|
+
variant: _nullishCoalesce(segment.variant, () => ( variant)),
|
|
51
|
+
disabled: disabled || !!segment.disabled
|
|
52
|
+
}));
|
|
53
|
+
const edges = resolveSegmentEdges(resolved, showDividers);
|
|
54
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: classes, ...rest, children: segments.map((segment, index) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
55
|
+
_chunkTTLFY76Jcjs.Chip,
|
|
56
|
+
{
|
|
57
|
+
variant: resolved[index].variant,
|
|
58
|
+
color: _nullishCoalesce(segment.color, () => ( color)),
|
|
59
|
+
size,
|
|
60
|
+
disabled: resolved[index].disabled,
|
|
61
|
+
onClick: segment.onClick,
|
|
62
|
+
tooltip: segment.tooltip,
|
|
63
|
+
preIcon: segment.preIcon,
|
|
64
|
+
posIcon: segment.posIcon,
|
|
65
|
+
className: [
|
|
66
|
+
"eidos-split-chip__segment",
|
|
67
|
+
index === 0 && "eidos-split-chip__segment--first",
|
|
68
|
+
index === lastIndex && "eidos-split-chip__segment--last",
|
|
69
|
+
edges[index].joinedStart && "eidos-split-chip__segment--joined-start",
|
|
70
|
+
edges[index].joinedEnd && "eidos-split-chip__segment--joined-end",
|
|
71
|
+
edges[index].divided && "eidos-split-chip__segment--divided"
|
|
72
|
+
].filter(Boolean).join(" "),
|
|
73
|
+
children: segment.label
|
|
74
|
+
},
|
|
75
|
+
segment.id
|
|
76
|
+
)) });
|
|
77
|
+
};
|
|
78
|
+
|
|
79
|
+
|
|
80
|
+
|
|
81
|
+
exports.SplitChip = SplitChip;
|
|
82
|
+
//# sourceMappingURL=chunk-PCTHJZRO.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/eidos-ui/eidos-ui/dist/chunk-PCTHJZRO.cjs","../src/components/SplitChip/SplitChip.utils.ts","../src/components/SplitChip/SplitChip.component.tsx"],"names":[],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACA;ACiBA,IAAM,iBAAA,EAAmB,CAAC,OAAA,EAAA,GACxB,OAAA,CAAQ,QAAA,IAAY,WAAA,GAAc,OAAA,CAAQ,QAAA;AAsBrC,IAAM,oBAAA,EAAsB,CACjC,QAAA,EACA,YAAA,EAAA,GACmB;AACnB,EAAA,MAAM,MAAA,EAAQ,QAAA,CAAS,GAAA,CAAI,CAAA,EAAA,GAAA,CAAO,EAAE,WAAA,EAAa,KAAA,EAAO,SAAA,EAAW,KAAA,EAAO,OAAA,EAAS,MAAM,CAAA,CAAE,CAAA;AAE3F,EAAA,IAAA,CAAA,IAAS,EAAA,EAAI,CAAA,EAAG,EAAA,EAAI,QAAA,CAAS,OAAA,EAAS,CAAA,EAAG,CAAA,EAAA,EAAK;AAC5C,IAAA,MAAM,EAAA,EAAI,gBAAA,CAAiB,QAAA,CAAS,CAAC,CAAC,CAAA;AACtC,IAAA,MAAM,EAAA,EAAI,gBAAA,CAAiB,QAAA,CAAS,EAAA,EAAI,CAAC,CAAC,CAAA;AAI1C,IAAA,MAAM,YAAA,EAAc,QAAA,CAAS,CAAC,CAAA,CAAE,SAAA,IAAa,QAAA,CAAS,EAAA,EAAI,CAAC,CAAA,CAAE,QAAA;AAE7D,IAAA,GAAA,CAAI,EAAA,GAAK,CAAA,EAAG;AACV,MAAA,KAAA,CAAM,CAAC,CAAA,CAAE,UAAA,EAAY,CAAC,aAAA,GAAgB,WAAA;AACtC,MAAA,KAAA,CAAM,EAAA,EAAI,CAAC,CAAA,CAAE,YAAA,EAAc,IAAA;AAAA,IAC7B,EAAA,KAAA,GAAA,CAAW,CAAA,EAAG;AACZ,MAAA,KAAA,CAAM,EAAA,EAAI,CAAC,CAAA,CAAE,YAAA,EAAc,IAAA;AAAA,IAC7B,EAAA,KAAA,GAAA,CAAW,CAAA,EAAG;AACZ,MAAA,KAAA,CAAM,CAAC,CAAA,CAAE,UAAA,EAAY,IAAA;AAAA,IACvB,EAAA,KAAO;AACL,MAAA,KAAA,CAAM,CAAC,CAAA,CAAE,UAAA,EAAY,IAAA;AACrB,MAAA,KAAA,CAAM,EAAA,EAAI,CAAC,CAAA,CAAE,YAAA,EAAc,CAAC,YAAA;AAC5B,MAAA,KAAA,CAAM,EAAA,EAAI,CAAC,CAAA,CAAE,QAAA,EAAU,YAAA;AAAA,IACzB;AAAA,EACF;AAEA,EAAA,OAAO,KAAA;AACT,CAAA;AD9CA;AACA;AE2BQ,+CAAA;AA9BD,IAAM,UAAA,EAAsC,CAAC;AAAA,EAClD,QAAA;AAAA,EACA,QAAA,EAAU,QAAA;AAAA,EACV,MAAA,EAAQ,SAAA;AAAA,EACR,KAAA,EAAO,IAAA;AAAA,EACP,SAAA,EAAW,KAAA;AAAA,EACX,aAAA,EAAe,KAAA;AAAA,EACf,UAAA,EAAY,EAAA;AAAA,EACZ,GAAG;AACL,CAAA,EAAA,GAAM;AACJ,EAAA,MAAM,QAAA,EAAU;AAAA,IACd,kBAAA;AAAA,IACA,CAAA,kBAAA,EAAqB,IAAI,CAAA,CAAA;AACT,IAAA;AACJ,IAAA;AACZ,IAAA;AAGS,EAAA;AAEgB,EAAA;AACD,EAAA;AACP,IAAA;AACO,IAAA;AACxB,EAAA;AACY,EAAA;AAGX,EAAA;AAEI,IAAA;AAAA,IAAA;AAEwB,MAAA;AACC,MAAA;AACxB,MAAA;AACwB,MAAA;AACP,MAAA;AACA,MAAA;AACA,MAAA;AACA,MAAA;AAKN,MAAA;AACT,QAAA;AACe,QAAA;AACL,QAAA;AACG,QAAA;AACA,QAAA;AACA,QAAA;AAGP,MAAA;AAEC,MAAA;AAAA,IAAA;AAxBI,IAAA;AA2BnB,EAAA;AAEJ;AFR8B;AACA;AACA;AACA","file":"/home/runner/work/eidos-ui/eidos-ui/dist/chunk-PCTHJZRO.cjs","sourcesContent":[null,"import type { ChipVariantProps } from '../Chip/Chip.types';\n\nexport interface SeamSegment {\n variant: ChipVariantProps;\n disabled: boolean;\n}\n\nexport interface SegmentEdges {\n /** Drop the leading (left) border. */\n joinedStart: boolean;\n /** Drop the trailing (right) border. */\n joinedEnd: boolean;\n /** Draw a divider as the leading border, in the segment's own colour. */\n divided: boolean;\n}\n\n/**\n * A segment \"owns\" a visible border when it is `outlined`, or when it is\n * disabled - the disabled Chip style paints a grey border on every variant.\n * `filled` and `text` borders are transparent.\n */\nconst hasVisibleBorder = (segment: SeamSegment) =>\n segment.variant === 'outlined' || segment.disabled;\n\n/**\n * Decides, per seam, which of the two neighbouring edges survives.\n *\n * Each seam is resolved from **both** sides at once. The first version decided\n * each edge from one side only (\"drop it if the neighbour is not `text`\"),\n * which broke two ways: an `outlined` segment beside a disabled one dropped\n * its edge while the disabled segment dropped its own too, leaving the seam\n * open; and with dividers, an `outlined` segment gave up its own border to a\n * divider drawn in the *neighbour's* colour.\n *\n * The rules, for a seam between A (left) and B (right):\n *\n * - Both have visible borders: if they are the same kind (both enabled\n * `outlined`, or both disabled), seamless by default - both edges drop, so\n * the run reads as one outline. With dividers, or when the kinds differ,\n * A's own edge is the seam and B's drops.\n * - Only one has a visible border: that edge is the seam; the other drops, so\n * there is never a double line and never an open side.\n * - Neither has one: both drop; with dividers, B draws one in its own colour.\n */\nexport const resolveSegmentEdges = (\n segments: SeamSegment[],\n showDividers: boolean,\n): SegmentEdges[] => {\n const edges = segments.map(() => ({ joinedStart: false, joinedEnd: false, divided: false }));\n\n for (let i = 0; i < segments.length - 1; i++) {\n const a = hasVisibleBorder(segments[i]);\n const b = hasVisibleBorder(segments[i + 1]);\n // Two borders only merge into one outline when they are the same kind:\n // both enabled `outlined`, or both disabled. An outlined segment beside a\n // disabled one would otherwise lose the seam against a near-white surface.\n const sameOutline = segments[i].disabled === segments[i + 1].disabled;\n\n if (a && b) {\n edges[i].joinedEnd = !showDividers && sameOutline;\n edges[i + 1].joinedStart = true;\n } else if (a) {\n edges[i + 1].joinedStart = true;\n } else if (b) {\n edges[i].joinedEnd = true;\n } else {\n edges[i].joinedEnd = true;\n edges[i + 1].joinedStart = !showDividers;\n edges[i + 1].divided = showDividers;\n }\n }\n\n return edges;\n};\n","import React from 'react';\nimport { Chip } from '../Chip/Chip.component';\nimport type { SplitChipProps } from './SplitChip.types';\nimport { resolveSegmentEdges } from './SplitChip.utils';\n\n/**\n * SplitChip - one chip split into independent segments, each with its own\n * label, variant, colour and optional click handler.\n *\n * Every segment is a real `Chip`, the same way `SplitButton` is built from\n * `Button`, so variants, sizes, icons, tooltips, disabled styling and the\n * \"hover only when clickable\" rule cannot drift between the two. This\n * component only adds the join: collapsed inner borders, radii on the outer\n * ends, and optional dividers.\n *\n * @example\n * ```tsx\n * <SplitChip\n * segments={[\n * { id: 'label', label: 'Status', variant: 'outlined' },\n * { id: 'value', label: 'Open', color: 'success', onClick: openFilter },\n * ]}\n * />\n * ```\n */\nexport const SplitChip: React.FC<SplitChipProps> = ({\n segments,\n variant = 'filled',\n color = 'primary',\n size = 'md',\n disabled = false,\n showDividers = false,\n className = '',\n ...rest\n}) => {\n const classes = [\n 'eidos-split-chip',\n `eidos-split-chip--${size}`,\n showDividers && 'eidos-split-chip--dividers',\n disabled && 'eidos-split-chip--disabled',\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n const lastIndex = segments.length - 1;\n const resolved = segments.map((segment) => ({\n variant: segment.variant ?? variant,\n disabled: disabled || !!segment.disabled,\n }));\n const edges = resolveSegmentEdges(resolved, showDividers);\n\n return (\n <div className={classes} {...rest}>\n {segments.map((segment, index) => (\n <Chip\n key={segment.id}\n variant={resolved[index].variant}\n color={segment.color ?? color}\n size={size}\n disabled={resolved[index].disabled}\n onClick={segment.onClick}\n tooltip={segment.tooltip}\n preIcon={segment.preIcon}\n posIcon={segment.posIcon}\n // Position comes from the index, not `:first-child`/`:last-child`:\n // a segment with a `tooltip` is wrapped in the Tooltip's trigger\n // `div`, so the chip is no longer a direct child of this container\n // and structural pseudo-classes would round the wrong corners.\n className={[\n 'eidos-split-chip__segment',\n index === 0 && 'eidos-split-chip__segment--first',\n index === lastIndex && 'eidos-split-chip__segment--last',\n edges[index].joinedStart && 'eidos-split-chip__segment--joined-start',\n edges[index].joinedEnd && 'eidos-split-chip__segment--joined-end',\n edges[index].divided && 'eidos-split-chip__segment--divided',\n ]\n .filter(Boolean)\n .join(' ')}\n >\n {segment.label}\n </Chip>\n ))}\n </div>\n );\n};\n"]}
|
|
@@ -480,6 +480,7 @@ var MessageItem = ({
|
|
|
480
480
|
const { author, status = "sent" } = message;
|
|
481
481
|
const timestamp = formatTimestamp ? formatTimestamp(message.sentAt) : formatMessageTime(message.sentAt);
|
|
482
482
|
const hasActions = Boolean(actions && actions.length > 0);
|
|
483
|
+
const timeInBubble = layout === "chat";
|
|
483
484
|
return /* @__PURE__ */ jsxs2(
|
|
484
485
|
"li",
|
|
485
486
|
{
|
|
@@ -506,7 +507,7 @@ var MessageItem = ({
|
|
|
506
507
|
!grouped && /* @__PURE__ */ jsxs2("div", { className: "eidos-message-header", children: [
|
|
507
508
|
/* @__PURE__ */ jsx2("span", { className: "eidos-message-author", children: author.name }),
|
|
508
509
|
author.role && /* @__PURE__ */ jsx2(Pill, { size: "sm", variant: "outlined", color: "secondary", children: author.role }),
|
|
509
|
-
/* @__PURE__ */ jsx2("time", { className: "eidos-message-time", dateTime: message.sentAt, children: timestamp }),
|
|
510
|
+
!timeInBubble && /* @__PURE__ */ jsx2("time", { className: "eidos-message-time", dateTime: message.sentAt, children: timestamp }),
|
|
510
511
|
message.edited && /* @__PURE__ */ jsx2("span", { className: "eidos-message-edited", children: "edited" })
|
|
511
512
|
] }),
|
|
512
513
|
/* @__PURE__ */ jsxs2("div", { className: "eidos-message-bubble", children: [
|
|
@@ -520,7 +521,7 @@ var MessageItem = ({
|
|
|
520
521
|
] }),
|
|
521
522
|
/* @__PURE__ */ jsx2("div", { className: "eidos-message-body", children: body ?? message.body }),
|
|
522
523
|
message.attachments && message.attachments.length > 0 && /* @__PURE__ */ jsx2(AttachmentList, { attachments: message.attachments }),
|
|
523
|
-
grouped && /* @__PURE__ */ jsx2(
|
|
524
|
+
(timeInBubble || grouped) && /* @__PURE__ */ jsx2(
|
|
524
525
|
"time",
|
|
525
526
|
{
|
|
526
527
|
className: "eidos-message-time eidos-message-time--inline",
|
|
@@ -885,4 +886,4 @@ export {
|
|
|
885
886
|
Chat,
|
|
886
887
|
CommentThread
|
|
887
888
|
};
|
|
888
|
-
//# sourceMappingURL=chunk-
|
|
889
|
+
//# sourceMappingURL=chunk-SNRRF64M.js.map
|