@qoretechnologies/reqore 0.70.9 → 0.70.11
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/.claude/CLAUDE.md +21 -0
- package/dist/components/Bubble/index.d.ts +45 -4
- package/dist/components/Bubble/index.d.ts.map +1 -1
- package/dist/components/Bubble/index.js +106 -19
- package/dist/components/Bubble/index.js.map +1 -1
- package/dist/components/DescriptionList/index.d.ts +30 -0
- package/dist/components/DescriptionList/index.d.ts.map +1 -1
- package/dist/components/DescriptionList/index.js +18 -6
- package/dist/components/DescriptionList/index.js.map +1 -1
- package/dist/components/EntityRow/index.d.ts +12 -0
- package/dist/components/EntityRow/index.d.ts.map +1 -1
- package/dist/components/EntityRow/index.js +24 -3
- package/dist/components/EntityRow/index.js.map +1 -1
- package/dist/components/Tabs/index.d.ts +16 -1
- package/dist/components/Tabs/index.d.ts.map +1 -1
- package/dist/components/Tabs/index.js +3 -3
- package/dist/components/Tabs/index.js.map +1 -1
- package/dist/components/Tabs/item.d.ts +6 -1
- package/dist/components/Tabs/item.d.ts.map +1 -1
- package/dist/components/Tabs/item.js +24 -8
- package/dist/components/Tabs/item.js.map +1 -1
- package/dist/components/Tabs/list.d.ts +1 -1
- package/dist/components/Tabs/list.d.ts.map +1 -1
- package/dist/components/Tabs/list.js +19 -5
- package/dist/components/Tabs/list.js.map +1 -1
- package/dist/components/Timeline/index.d.ts +34 -2
- package/dist/components/Timeline/index.d.ts.map +1 -1
- package/dist/components/Timeline/index.js +133 -20
- package/dist/components/Timeline/index.js.map +1 -1
- package/dist/constants/sizes.d.ts +36 -0
- package/dist/constants/sizes.d.ts.map +1 -1
- package/dist/constants/sizes.js +37 -1
- package/dist/constants/sizes.js.map +1 -1
- package/package.json +2 -2
- package/tests.json +1 -1
- package/vitest.config.ts +3 -4
package/.claude/CLAUDE.md
CHANGED
|
@@ -147,6 +147,27 @@ Every PR to `develop` MUST bump `package.json`'s `version` field before it merge
|
|
|
147
147
|
- **Pattern:** ArgTypes for props, canvas controls, visual testing via Chromatic
|
|
148
148
|
- **Command:** `yarn build-storybook` builds static site
|
|
149
149
|
|
|
150
|
+
### Verifying a visual fix locally with Qlip (IMPORTANT)
|
|
151
|
+
|
|
152
|
+
Before claiming a Qlip-flagged snapshot is fixed, **capture the story locally with Qlip and Read the PNG**. Text-based "the code says X" reasoning has repeatedly missed cases where the code change didn't actually reach the pixels (a prop that turned out to be a no-op, a rule beaten on specificity, a styled override the component ignored). The reviewer has ~870 snapshots per build to review; do not waste that time on "fixed" claims that didn't actually change the render.
|
|
153
|
+
|
|
154
|
+
**How to capture one story locally without triggering upload:**
|
|
155
|
+
|
|
156
|
+
```bash
|
|
157
|
+
yarn test:stories src/stories/Tabs/Tabs.stories.tsx > /tmp/qlip-verify.log 2>&1
|
|
158
|
+
```
|
|
159
|
+
|
|
160
|
+
Then `Read` the specific PNG under `qlip/screenshots/<timestamp>/stories/auto/<Story__Id>.png` and inspect it as an image (Read supports PNGs). To prove the fix actually moved the pixels, compare the `md5` of that PNG against the same story in the previous capture directory — identical hashes mean the render did not change, whatever the diff says.
|
|
161
|
+
|
|
162
|
+
**Rules of the road (violate these and you'll publish local screenshots to the shared review dashboard or mislead yourself with a stale capture):**
|
|
163
|
+
|
|
164
|
+
- **NEVER set `QLIP_UPLOAD_TOKEN` locally.** `vitest.config.ts` attaches qlip's `upload` block only when that variable is present, and CI supplies it from the repository secret in `.github/workflows/tests.yml`. With it set, **every** `yarn test:stories` publishes a build the whole team then sees in review. This is not hypothetical: the token was hardcoded here until July 2026 and local runs posted four unwanted builds in a single session.
|
|
165
|
+
- **Check for the upload line.** qlip prints `[qlip] uploaded build <id> … → https://qlip.qoretechnologies.com` when it publishes. If a local run prints that, the gate is broken — stop and fix it before continuing.
|
|
166
|
+
- **NEVER run `yarn vitest run` with no `--project`** — it includes the storybook project and captures the whole ~870-snapshot suite, which will slow the machine to a crawl (and upload it, if the gate is broken). For unit tests use `yarn test` (`--project unit`), which captures nothing; for stories, one story file at a time.
|
|
167
|
+
- **Delete the previous capture directory BEFORE you re-capture.** Qlip's file naming is `<StoryId>.png` — a re-capture overwrites, but a story that no longer exists (renamed, deleted, skipped) leaves its old PNG behind and will mislead you into reviewing a render that is no longer produced.
|
|
168
|
+
|
|
169
|
+
Attempts that don't include a Qlip capture + PNG read are "I *think* I fixed it" — not "I fixed it". For visual reviews, the render is the source of truth.
|
|
170
|
+
|
|
150
171
|
## Code Patterns & Conventions
|
|
151
172
|
|
|
152
173
|
### Component Prop Interfaces
|
|
@@ -1,8 +1,21 @@
|
|
|
1
1
|
import { type HTMLAttributes, type ReactElement, type ReactNode } from 'react';
|
|
2
|
+
import { TSizes } from '../../constants/sizes';
|
|
2
3
|
import { IReqoreIntent, IWithReqoreCustomTheme, IWithReqoreEffect, IWithReqoreFlat, IWithReqoreMinimal, IWithReqoreSize } from '../../types/global';
|
|
4
|
+
import { IReqoreIconName } from '../../types/icons';
|
|
3
5
|
import { IReqoreEffect } from '../Effect';
|
|
4
6
|
export type TReqoreBubbleAlign = 'left' | 'right';
|
|
5
7
|
export type TReqoreBubbleGroupPosition = 'single' | 'first' | 'middle' | 'last';
|
|
8
|
+
export interface IReqoreBubbleAvatar {
|
|
9
|
+
/** Icon glyph shown in the avatar. Ignored when `image` is set. */
|
|
10
|
+
icon?: IReqoreIconName;
|
|
11
|
+
/** Image shown in the avatar — a user photo, an app logo, … */
|
|
12
|
+
image?: string;
|
|
13
|
+
/**
|
|
14
|
+
* Render the avatar as a circle instead of the default squircle. Conventional
|
|
15
|
+
* for people — a photo or initials — where the squircle reads as an app tile.
|
|
16
|
+
*/
|
|
17
|
+
circle?: boolean;
|
|
18
|
+
}
|
|
6
19
|
export interface IReqoreBubbleProps extends Omit<HTMLAttributes<HTMLDivElement>, 'color'>, IWithReqoreCustomTheme, IWithReqoreEffect, IWithReqoreSize, IWithReqoreMinimal, IWithReqoreFlat, IReqoreIntent {
|
|
7
20
|
/** Side the bubble hugs within its container. Defaults to `'left'`. */
|
|
8
21
|
align?: TReqoreBubbleAlign;
|
|
@@ -10,6 +23,12 @@ export interface IReqoreBubbleProps extends Omit<HTMLAttributes<HTMLDivElement>,
|
|
|
10
23
|
maxWidth?: string;
|
|
11
24
|
/** Whether the bubble has rounded corners. Defaults to `true`. */
|
|
12
25
|
rounded?: boolean;
|
|
26
|
+
/**
|
|
27
|
+
* Opts the corners onto the pronounced `radiusSize` scale instead of deriving
|
|
28
|
+
* them from `size` — for both the bubble and its `avatar`. Ignored when
|
|
29
|
+
* `rounded={false}`.
|
|
30
|
+
*/
|
|
31
|
+
radiusSize?: TSizes;
|
|
13
32
|
/**
|
|
14
33
|
* Position within a run of same-side bubbles — controls which corners are
|
|
15
34
|
* tightened so a group reads as one cluster. Usually set automatically by
|
|
@@ -21,7 +40,22 @@ export interface IReqoreBubbleProps extends Omit<HTMLAttributes<HTMLDivElement>,
|
|
|
21
40
|
* Applied only on a borderless (`flat`), non-`intent` bubble.
|
|
22
41
|
*/
|
|
23
42
|
raised?: boolean;
|
|
24
|
-
/**
|
|
43
|
+
/**
|
|
44
|
+
* Avatar rendered *outside* the bubble, on the side the bubble hugs, tinted
|
|
45
|
+
* with the bubble's own colour and top-aligned with it. Give it an `icon` or
|
|
46
|
+
* an `image`. Adding one wraps the bubble in a row that takes over the
|
|
47
|
+
* alignment, so the avatar and the bubble travel to the aligned side together.
|
|
48
|
+
*/
|
|
49
|
+
avatar?: IReqoreBubbleAvatar;
|
|
50
|
+
/** Bold lead-in on the bubble's first line — typically the author's name. */
|
|
51
|
+
label?: ReactNode;
|
|
52
|
+
/** Effect applied to `label` — merged over its bold default. */
|
|
53
|
+
labelEffect?: IReqoreEffect;
|
|
54
|
+
/**
|
|
55
|
+
* Muted timestamp rendered *below* the bubble, hugging the same side. Inside a
|
|
56
|
+
* `ReqoreBubbleGroup` only the last bubble of a same-side run renders it, so a
|
|
57
|
+
* cluster of messages reads as one moment rather than repeating the time.
|
|
58
|
+
*/
|
|
25
59
|
timestamp?: ReactNode;
|
|
26
60
|
/** Effect applied to the bubble's content (e.g. gradient or coloured text). */
|
|
27
61
|
contentEffect?: IReqoreEffect;
|
|
@@ -30,14 +64,21 @@ export interface IReqoreBubbleProps extends Omit<HTMLAttributes<HTMLDivElement>,
|
|
|
30
64
|
children?: ReactNode;
|
|
31
65
|
}
|
|
32
66
|
export declare const StyledBubble: any;
|
|
67
|
+
export declare const StyledBubbleAvatar: any;
|
|
33
68
|
/**
|
|
34
69
|
* A lightweight, themeable chat-style bubble. It sizes to its content (capped
|
|
35
70
|
* by `maxWidth`) and hugs the left or right edge of its container via `align`.
|
|
36
71
|
*
|
|
37
72
|
* Like other Reqore surfaces it accepts `intent`, `customTheme`, `effect`
|
|
38
|
-
* (including gradients), `flat`, `minimal` and `raised
|
|
39
|
-
*
|
|
40
|
-
*
|
|
73
|
+
* (including gradients), `flat`, `minimal` and `raised`. Stack a column of these
|
|
74
|
+
* (see `ReqoreBubbleGroup`) for a chat transcript.
|
|
75
|
+
*
|
|
76
|
+
* An optional `avatar` sits outside the bubble on the aligned side and an optional
|
|
77
|
+
* `label` reads as a bold lead-in — enough for a comment feed without reaching for
|
|
78
|
+
* `ReqoreComment`, which is a full-width panel with room for actions rather than an
|
|
79
|
+
* aligned, content-width bubble. A `timestamp` prints below the bubble, and inside
|
|
80
|
+
* a `ReqoreBubbleGroup` only the last bubble of a same-side run shows one, so a
|
|
81
|
+
* cluster reads as a single moment.
|
|
41
82
|
*/
|
|
42
83
|
export declare const ReqoreBubble: import("react").MemoExoticComponent<(props: IReqoreBubbleProps & import("react").RefAttributes<HTMLDivElement>) => ReactElement | null>;
|
|
43
84
|
export interface IReqoreBubbleGroupProps extends HTMLAttributes<HTMLDivElement> {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Bubble/index.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Bubble/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAQL,KAAK,cAAc,EACnB,KAAK,YAAY,EACjB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,EASL,MAAM,EACP,MAAM,uBAAuB,CAAC;AAM/B,OAAO,EACL,aAAa,EACb,sBAAsB,EACtB,iBAAiB,EACjB,eAAe,EACf,kBAAkB,EAClB,eAAe,EAChB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEpD,OAAO,EAAE,aAAa,EAA8B,MAAM,WAAW,CAAC;AAQtE,MAAM,MAAM,kBAAkB,GAAG,MAAM,GAAG,OAAO,CAAC;AAClD,MAAM,MAAM,0BAA0B,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;AAEhF,MAAM,WAAW,mBAAmB;IAClC,mEAAmE;IACnE,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,+DAA+D;IAC/D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,kBACf,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC,EACnD,sBAAsB,EACtB,iBAAiB,EACjB,eAAe,EACf,kBAAkB,EAClB,eAAe,EACf,aAAa;IACf,uEAAuE;IACvE,KAAK,CAAC,EAAE,kBAAkB,CAAC;IAC3B,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,kEAAkE;IAClE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;;OAIG;IACH,aAAa,CAAC,EAAE,0BAA0B,CAAC;IAC3C;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,mBAAmB,CAAC;IAC7B,6EAA6E;IAC7E,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,gEAAgE;IAChE,WAAW,CAAC,EAAE,aAAa,CAAC;IAC5B;;;;OAIG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,+EAA+E;IAC/E,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,sEAAsE;IACtE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IAC5D,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AA+CD,eAAO,MAAM,YAAY,KAgExB,CAAC;AAIF,eAAO,MAAM,kBAAkB,KAqB9B,CAAC;AAkBF;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,YAAY,yIAqLxB,CAAC;AAIF,MAAM,WAAW,uBAAwB,SAAQ,cAAc,CAAC,cAAc,CAAC;IAC7E,gEAAgE;IAChE,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,+EAA+E;IAC/E,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAOD;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,GAAI,sCAK/B,uBAAuB,4CA+BzB,CAAC;AAEF,eAAe,YAAY,CAAC"}
|
|
@@ -58,17 +58,27 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
58
58
|
}
|
|
59
59
|
return t;
|
|
60
60
|
};
|
|
61
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
62
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
63
|
+
};
|
|
61
64
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
62
|
-
exports.ReqoreBubbleGroup = exports.ReqoreBubble = exports.StyledBubble = void 0;
|
|
65
|
+
exports.ReqoreBubbleGroup = exports.ReqoreBubble = exports.StyledBubbleAvatar = exports.StyledBubble = void 0;
|
|
63
66
|
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
64
67
|
var react_1 = require("react");
|
|
65
68
|
var polished_1 = require("polished");
|
|
66
69
|
var styled_components_1 = __importStar(require("styled-components"));
|
|
67
70
|
var sizes_1 = require("../../constants/sizes");
|
|
68
71
|
var colors_1 = require("../../helpers/colors");
|
|
72
|
+
var utils_1 = require("../../helpers/utils");
|
|
69
73
|
var useTheme_1 = require("../../hooks/useTheme");
|
|
70
74
|
var styles_1 = require("../../styles");
|
|
75
|
+
var ControlGroup_1 = __importDefault(require("../ControlGroup"));
|
|
71
76
|
var Effect_1 = require("../Effect");
|
|
77
|
+
var Icon_1 = __importDefault(require("../Icon"));
|
|
78
|
+
var Span_1 = require("../Span");
|
|
79
|
+
// Hoisted so the memoised timestamp span keeps a stable `effect` identity.
|
|
80
|
+
// 0.35 matches Qonsole's timestamp — fainter than the label, clearly secondary.
|
|
81
|
+
var TIMESTAMP_EFFECT = { opacity: 0.35 };
|
|
72
82
|
// Border radius per group position: a run of same-side bubbles tightens the
|
|
73
83
|
// corners that face the neighbour so the cluster reads as one — the pattern
|
|
74
84
|
// Qonsole uses for its chat transcript.
|
|
@@ -91,15 +101,15 @@ function groupRadius(position, align, round, tight) {
|
|
|
91
101
|
return "".concat(t, " ").concat(r, " ").concat(r, " ").concat(t);
|
|
92
102
|
return "".concat(t, " ").concat(r, " ").concat(r, " ").concat(r);
|
|
93
103
|
}
|
|
94
|
-
exports.StyledBubble = (0, styled_components_1.default)(Effect_1.StyledEffect)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n display: block;\n width: fit-content;\n max-width: ", ";\n margin-left: ", ";\n margin-right: ", ";\n padding: ", ";\n font-size: ", "px;\n line-height: 1.5;\n word-break: break-word;\n cursor: ", ";\n transition: background-color 0.15s ease-out, filter 0.15s ease-out;\n border-radius: ", ";\n\n ", "\n\n ", "\n\n ", "\n"], ["\n display: block;\n width: fit-content;\n max-width: ", ";\n margin-left: ", ";\n margin-right: ", ";\n padding: ", ";\n font-size: ", "px;\n line-height: 1.5;\n word-break: break-word;\n cursor: ", ";\n transition: background-color 0.15s ease-out, filter 0.15s ease-out;\n border-radius: ", ";\n\n ", "\n\n ", "\n\n ", "\n"])), function (_a) {
|
|
95
|
-
var $maxWidth = _a.$maxWidth;
|
|
96
|
-
return $maxWidth;
|
|
104
|
+
exports.StyledBubble = (0, styled_components_1.default)(Effect_1.StyledEffect)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n display: block;\n width: fit-content;\n /* Inside a timestamp stack the wrapper carries the cap and the bubble fills it;\n standalone (or directly in the avatar row) the bubble carries it. */\n max-width: ", ";\n /* Standalone, the bubble aligns itself; once wrapped, the wrapper does. */\n margin-left: ", ";\n margin-right: ", ";\n padding: ", ";\n font-size: ", "px;\n line-height: 1.5;\n word-break: break-word;\n cursor: ", ";\n transition: background-color 0.15s ease-out, filter 0.15s ease-out;\n border-radius: ", ";\n\n ", "\n\n ", "\n\n ", "\n"], ["\n display: block;\n width: fit-content;\n /* Inside a timestamp stack the wrapper carries the cap and the bubble fills it;\n standalone (or directly in the avatar row) the bubble carries it. */\n max-width: ", ";\n /* Standalone, the bubble aligns itself; once wrapped, the wrapper does. */\n margin-left: ", ";\n margin-right: ", ";\n padding: ", ";\n font-size: ", "px;\n line-height: 1.5;\n word-break: break-word;\n cursor: ", ";\n transition: background-color 0.15s ease-out, filter 0.15s ease-out;\n border-radius: ", ";\n\n ", "\n\n ", "\n\n ", "\n"])), function (_a) {
|
|
105
|
+
var $stacked = _a.$stacked, $maxWidth = _a.$maxWidth;
|
|
106
|
+
return ($stacked ? '100%' : $maxWidth);
|
|
97
107
|
}, function (_a) {
|
|
98
|
-
var $align = _a.$align;
|
|
99
|
-
return ($align === 'right' ? 'auto' : 0);
|
|
108
|
+
var $align = _a.$align, $wrapped = _a.$wrapped;
|
|
109
|
+
return (!$wrapped && $align === 'right' ? 'auto' : 0);
|
|
100
110
|
}, function (_a) {
|
|
101
|
-
var $align = _a.$align;
|
|
102
|
-
return ($align === 'left' ? 'auto' : 0);
|
|
111
|
+
var $align = _a.$align, $wrapped = _a.$wrapped;
|
|
112
|
+
return (!$wrapped && $align === 'left' ? 'auto' : 0);
|
|
103
113
|
}, function (_a) {
|
|
104
114
|
var $size = _a.$size;
|
|
105
115
|
return "".concat(Math.round(sizes_1.PADDING_FROM_SIZE[$size] * 1.3), "px ").concat(Math.round(sizes_1.PADDING_FROM_SIZE[$size] * 1.85), "px");
|
|
@@ -110,10 +120,13 @@ exports.StyledBubble = (0, styled_components_1.default)(Effect_1.StyledEffect)(t
|
|
|
110
120
|
var $clickable = _a.$clickable;
|
|
111
121
|
return ($clickable ? 'pointer' : 'default');
|
|
112
122
|
}, function (_a) {
|
|
113
|
-
var $size = _a.$size, $rounded = _a.$rounded, $groupPosition = _a.$groupPosition, $align = _a.$align;
|
|
123
|
+
var $size = _a.$size, $rounded = _a.$rounded, $radiusSize = _a.$radiusSize, $groupPosition = _a.$groupPosition, $align = _a.$align;
|
|
114
124
|
return $rounded === false
|
|
115
125
|
? 0
|
|
116
|
-
: groupRadius($groupPosition, $align, sizes_1.
|
|
126
|
+
: groupRadius($groupPosition, $align, (0, sizes_1.resolveRadius)($size, $radiusSize, sizes_1.BUBBLE_RADIUS_FROM_SIZE, sizes_1.BUBBLE_RADIUS_FROM_RADIUS_SIZE),
|
|
127
|
+
// the seam a cluster tightens to stays small whatever the outer curve —
|
|
128
|
+
// that contrast is what makes a run read as one bubble.
|
|
129
|
+
sizes_1.RADIUS_FROM_SIZE[$size]);
|
|
117
130
|
}, function (_a) {
|
|
118
131
|
var theme = _a.theme, $minimal = _a.$minimal, $flat = _a.$flat, $coloured = _a.$coloured, $hasGradient = _a.$hasGradient;
|
|
119
132
|
// A coloured bubble (intent / customTheme) tints its own colour; a plain one
|
|
@@ -137,28 +150,102 @@ exports.StyledBubble = (0, styled_components_1.default)(Effect_1.StyledEffect)(t
|
|
|
137
150
|
var $clickable = _a.$clickable;
|
|
138
151
|
return $clickable && (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n &:hover {\n filter: brightness(1.12);\n }\n "], ["\n &:hover {\n filter: brightness(1.12);\n }\n "])));
|
|
139
152
|
});
|
|
140
|
-
|
|
153
|
+
// The avatar echoes the bubble's own colour at the same strength a `minimal`
|
|
154
|
+
// bubble uses, so the pair reads as one object whatever the bubble is themed to.
|
|
155
|
+
exports.StyledBubbleAvatar = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n justify-content: center;\n overflow: hidden;\n width: ", "px;\n height: ", "px;\n border-radius: ", ";\n background-color: ", ";\n color: ", ";\n"], ["\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n justify-content: center;\n overflow: hidden;\n width: ", "px;\n height: ", "px;\n border-radius: ", ";\n background-color: ", ";\n color: ", ";\n"])), function (_a) {
|
|
156
|
+
var $size = _a.$size;
|
|
157
|
+
return sizes_1.SIZE_TO_PX[$size];
|
|
158
|
+
}, function (_a) {
|
|
141
159
|
var $size = _a.$size;
|
|
142
|
-
return
|
|
160
|
+
return sizes_1.SIZE_TO_PX[$size];
|
|
161
|
+
}, function (_a) {
|
|
162
|
+
var $size = _a.$size, $radiusSize = _a.$radiusSize, $circle = _a.$circle;
|
|
163
|
+
return $circle
|
|
164
|
+
? '9999px'
|
|
165
|
+
: "".concat((0, sizes_1.resolveRadius)($size, $radiusSize, sizes_1.BUBBLE_AVATAR_RADIUS_FROM_SIZE), "px");
|
|
166
|
+
}, function (_a) {
|
|
167
|
+
var theme = _a.theme, $coloured = _a.$coloured;
|
|
168
|
+
return $coloured ? (0, polished_1.rgba)(theme.main, 0.16) : (0, polished_1.rgba)((0, colors_1.changeLightness)(theme.main, 0.5), 0.1);
|
|
169
|
+
}, function (_a) {
|
|
170
|
+
var theme = _a.theme;
|
|
171
|
+
return (0, colors_1.getReadableColor)(theme);
|
|
143
172
|
});
|
|
173
|
+
var StyledBubbleHeader = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n display: flex;\n align-items: baseline;\n gap: ", "px;\n margin-bottom: 4px;\n"], ["\n display: flex;\n align-items: baseline;\n gap: ", "px;\n margin-bottom: 4px;\n"])), function (_a) {
|
|
174
|
+
var $size = _a.$size;
|
|
175
|
+
return sizes_1.PADDING_FROM_SIZE[$size];
|
|
176
|
+
});
|
|
177
|
+
// The below-bubble timestamp, styled the way Qonsole treats its own: a small
|
|
178
|
+
// inset so it doesn't sit hard against the bubble's edge, and non-selectable so
|
|
179
|
+
// dragging across the transcript skips the clock. `padding`/`user-select` aren't
|
|
180
|
+
// ReqoreSpan props, which is why this is a styled wrapper rather than props.
|
|
181
|
+
var StyledBubbleTimestamp = (0, styled_components_1.default)(Span_1.ReqoreSpan)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n padding: 2px 4px;\n user-select: none;\n"], ["\n padding: 2px 4px;\n user-select: none;\n"])));
|
|
144
182
|
/**
|
|
145
183
|
* A lightweight, themeable chat-style bubble. It sizes to its content (capped
|
|
146
184
|
* by `maxWidth`) and hugs the left or right edge of its container via `align`.
|
|
147
185
|
*
|
|
148
186
|
* Like other Reqore surfaces it accepts `intent`, `customTheme`, `effect`
|
|
149
|
-
* (including gradients), `flat`, `minimal` and `raised
|
|
150
|
-
*
|
|
151
|
-
*
|
|
187
|
+
* (including gradients), `flat`, `minimal` and `raised`. Stack a column of these
|
|
188
|
+
* (see `ReqoreBubbleGroup`) for a chat transcript.
|
|
189
|
+
*
|
|
190
|
+
* An optional `avatar` sits outside the bubble on the aligned side and an optional
|
|
191
|
+
* `label` reads as a bold lead-in — enough for a comment feed without reaching for
|
|
192
|
+
* `ReqoreComment`, which is a full-width panel with room for actions rather than an
|
|
193
|
+
* aligned, content-width bubble. A `timestamp` prints below the bubble, and inside
|
|
194
|
+
* a `ReqoreBubbleGroup` only the last bubble of a same-side run shows one, so a
|
|
195
|
+
* cluster reads as a single moment.
|
|
152
196
|
*/
|
|
153
197
|
exports.ReqoreBubble = (0, react_1.memo)((0, react_1.forwardRef)(function (_a, ref) {
|
|
154
|
-
var _b = _a.align, align = _b === void 0 ? 'left' : _b, _c = _a.maxWidth, maxWidth = _c === void 0 ? '85%' : _c, intent = _a.intent, customTheme = _a.customTheme, inheritCustomTheme = _a.inheritCustomTheme, minimal = _a.minimal, _d = _a.flat, flat = _d === void 0 ? true : _d, _e = _a.rounded, rounded = _e === void 0 ? true : _e, _f = _a.groupPosition, groupPosition = _f === void 0 ? 'single' : _f, raised = _a.raised, timestamp = _a.timestamp, _g = _a.size, size = _g === void 0 ? 'normal' : _g, effect = _a.effect, contentEffect = _a.contentEffect, onClick = _a.onClick, className = _a.className, children = _a.children, rest = __rest(_a, ["align", "maxWidth", "intent", "customTheme", "inheritCustomTheme", "minimal", "flat", "rounded", "groupPosition", "raised", "timestamp", "size", "effect", "contentEffect", "onClick", "className", "children"]);
|
|
198
|
+
var _b = _a.align, align = _b === void 0 ? 'left' : _b, _c = _a.maxWidth, maxWidth = _c === void 0 ? '85%' : _c, intent = _a.intent, customTheme = _a.customTheme, inheritCustomTheme = _a.inheritCustomTheme, minimal = _a.minimal, _d = _a.flat, flat = _d === void 0 ? true : _d, _e = _a.rounded, rounded = _e === void 0 ? true : _e, radiusSize = _a.radiusSize, _f = _a.groupPosition, groupPosition = _f === void 0 ? 'single' : _f, raised = _a.raised, avatar = _a.avatar, label = _a.label, labelEffect = _a.labelEffect, timestamp = _a.timestamp, _g = _a.size, size = _g === void 0 ? 'normal' : _g, effect = _a.effect, contentEffect = _a.contentEffect, onClick = _a.onClick, className = _a.className, style = _a.style, children = _a.children, rest = __rest(_a, ["align", "maxWidth", "intent", "customTheme", "inheritCustomTheme", "minimal", "flat", "rounded", "radiusSize", "groupPosition", "raised", "avatar", "label", "labelEffect", "timestamp", "size", "effect", "contentEffect", "onClick", "className", "style", "children"]);
|
|
155
199
|
var theme = (0, useTheme_1.useReqoreTheme)('main', customTheme, intent, undefined, inheritCustomTheme);
|
|
156
200
|
var showRaised = !!raised && flat !== false && !intent;
|
|
201
|
+
var coloured = !!intent || !!customTheme;
|
|
202
|
+
var isSet = function (value) { return value != null && value !== ''; };
|
|
203
|
+
// A run of same-side bubbles shares one time, printed under its last one —
|
|
204
|
+
// the way conversational UIs read a cluster as a single moment.
|
|
205
|
+
var showTimestamp = isSet(timestamp) && (groupPosition === 'single' || groupPosition === 'last');
|
|
206
|
+
// Only the timestamp needs the bubble stacked under something; an avatar
|
|
207
|
+
// needs it beside one. Either way a wrapper owns the alignment from here.
|
|
208
|
+
var wrapped = !!avatar || showTimestamp;
|
|
157
209
|
var bubbleEffect = onClick || effect ? __assign({ interactive: !!onClick }, effect) : undefined;
|
|
158
|
-
|
|
210
|
+
// The label is a memoised component, so its merged effect has to keep its
|
|
211
|
+
// identity between renders — a fresh literal would re-render it on every
|
|
212
|
+
// parent render. The caller's effect still wins on conflicts.
|
|
213
|
+
var resolvedLabelEffect = (0, react_1.useMemo)(function () { return (__assign({ weight: 'bold' }, labelEffect)); }, [labelEffect]);
|
|
214
|
+
// The wrappers are memoised ControlGroups, so their `style` has to keep a
|
|
215
|
+
// stable identity between renders. The stack carries the width cap (and can
|
|
216
|
+
// shrink); the row just lets its children shrink past the aligned edge.
|
|
217
|
+
var stackStyle = (0, react_1.useMemo)(function () { return (__assign({ minWidth: 0, maxWidth: maxWidth }, (avatar
|
|
218
|
+
? undefined
|
|
219
|
+
: __assign({ alignSelf: align === 'right' ? 'flex-end' : 'flex-start' }, style)))); }, [maxWidth, avatar, align, style]);
|
|
220
|
+
var rowStyle = (0, react_1.useMemo)(function () { return (__assign({ minWidth: 0 }, style)); }, [style]);
|
|
221
|
+
var bubble = ((0, jsx_runtime_1.jsxs)(exports.StyledBubble, __assign({}, rest, { as: 'div', ref: ref, onClick: onClick, theme: theme, effect: bubbleEffect,
|
|
222
|
+
// Standalone, the bubble carries the caller's style; once wrapped, the
|
|
223
|
+
// wrapper carries it, so a group's spacing offsets the whole unit
|
|
224
|
+
// rather than sliding the bubble out of line with its avatar or time.
|
|
225
|
+
style: wrapped ? undefined : style, "$size": size, "$align": align, "$maxWidth": maxWidth, "$groupPosition": groupPosition, "$minimal": minimal, "$flat": flat, "$rounded": rounded, "$radiusSize": radiusSize, "$raised": showRaised, "$clickable": !!onClick, "$coloured": coloured, "$hasGradient": !!(effect === null || effect === void 0 ? void 0 : effect.gradient), "$wrapped": wrapped, "$stacked": showTimestamp, className: "".concat(className || '', " reqore-bubble").trim(), children: [isSet(label) && ((0, jsx_runtime_1.jsx)(StyledBubbleHeader, { "$size": size, className: 'reqore-bubble-header', children: (0, jsx_runtime_1.jsx)(Span_1.ReqoreSpan, { className: 'reqore-bubble-label', size: size, effect: resolvedLabelEffect, children: label }) })), contentEffect ? (0, jsx_runtime_1.jsx)(Effect_1.ReqoreEffect, { effect: contentEffect, children: children }) : children] })));
|
|
226
|
+
var timestampNode = showTimestamp ? ((0, jsx_runtime_1.jsx)(StyledBubbleTimestamp, { className: 'reqore-bubble-timestamp', size: (0, utils_1.getOneLessSize)(size), effect: TIMESTAMP_EFFECT, children: timestamp })) : null;
|
|
227
|
+
// Nothing to hang off the bubble — render it bare, exactly as it did before
|
|
228
|
+
// `avatar` and the below-bubble timestamp existed.
|
|
229
|
+
if (!wrapped) {
|
|
230
|
+
return bubble;
|
|
231
|
+
}
|
|
232
|
+
var avatarNode = avatar ? ((0, jsx_runtime_1.jsx)(exports.StyledBubbleAvatar, { theme: theme, "$size": size, "$radiusSize": radiusSize, "$coloured": coloured, "$circle": avatar.circle, className: 'reqore-bubble-avatar', children: (0, jsx_runtime_1.jsx)(Icon_1.default, { icon: avatar.icon, image: avatar.image, size: size,
|
|
233
|
+
// an image fills the avatar box; a glyph keeps its natural size, centred
|
|
234
|
+
wrapperSize: avatar.image ? "".concat(sizes_1.SIZE_TO_PX[size], "px") : undefined }) })) : null;
|
|
235
|
+
// The time hangs off the bubble, not off the row — otherwise it lines up
|
|
236
|
+
// under the avatar instead of under the message it belongs to. The stack
|
|
237
|
+
// carries the width cap (the bubble fills it at 100%) and can shrink
|
|
238
|
+
// (`min-width: 0`), so a capped bubble still wraps rather than overflowing.
|
|
239
|
+
var stack = showTimestamp ? ((0, jsx_runtime_1.jsxs)(ControlGroup_1.default, { vertical: true, gapSize: 'tiny', horizontalAlign: align === 'right' ? 'flex-end' : 'flex-start', style: stackStyle, className: 'reqore-bubble-stack', children: [bubble, timestampNode] })) : (bubble);
|
|
240
|
+
if (!avatar) {
|
|
241
|
+
return stack;
|
|
242
|
+
}
|
|
243
|
+
return ((0, jsx_runtime_1.jsxs)(ControlGroup_1.default, { verticalAlign: 'flex-start', gapSize: size,
|
|
244
|
+
// let the stack/bubble shrink instead of pushing off the aligned edge
|
|
245
|
+
style: rowStyle, horizontalAlign: align === 'right' ? 'flex-end' : 'flex-start', className: 'reqore-bubble-row', children: [align === 'left' && avatarNode, stack, align === 'right' && avatarNode] }));
|
|
159
246
|
}));
|
|
160
247
|
exports.ReqoreBubble.displayName = 'ReqoreBubble';
|
|
161
|
-
var StyledBubbleGroup = styled_components_1.default.div(
|
|
248
|
+
var StyledBubbleGroup = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
|
|
162
249
|
/**
|
|
163
250
|
* Lays out a column of `ReqoreBubble`s and assigns each one a `groupPosition`
|
|
164
251
|
* based on consecutive `align` values, so runs of same-side bubbles render as
|
|
@@ -190,5 +277,5 @@ var ReqoreBubbleGroup = function (_a) {
|
|
|
190
277
|
};
|
|
191
278
|
exports.ReqoreBubbleGroup = ReqoreBubbleGroup;
|
|
192
279
|
exports.default = exports.ReqoreBubble;
|
|
193
|
-
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
|
|
280
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;
|
|
194
281
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Bubble/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Bubble/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -73,6 +73,36 @@ export interface IReqoreDescriptionListProps extends Omit<IReqorePanelProps, 'ch
|
|
|
73
73
|
* to the wrapping `ReqorePanel`. Defaults to `'normal'`.
|
|
74
74
|
*/
|
|
75
75
|
size?: TSizes;
|
|
76
|
+
/**
|
|
77
|
+
* Size the content column for CONTROLS rather than for text.
|
|
78
|
+
*
|
|
79
|
+
* Every row then reserves a control of this size's height, and any content that
|
|
80
|
+
* isn't itself a control is inset by that size's horizontal padding — so a list
|
|
81
|
+
* mixing plain values with buttons, dropdowns and tags keeps one left edge and one
|
|
82
|
+
* row rhythm. Omitted (the default) leaves each row sized by its own content, which
|
|
83
|
+
* is what an all-text list wants.
|
|
84
|
+
*/
|
|
85
|
+
contentSize?: TSizes;
|
|
86
|
+
/**
|
|
87
|
+
* Size the LABEL column's text independently of the content.
|
|
88
|
+
*
|
|
89
|
+
* Labels are reference furniture — a list can want them quieter and smaller than
|
|
90
|
+
* the values they name, and a fixed `labelWidth` has to fit them. Defaults to
|
|
91
|
+
* `size`, so a list that doesn't ask keeps both columns at one scale.
|
|
92
|
+
*
|
|
93
|
+
* Named `labelTextSize`, not `labelSize`: the panel this extends already has a
|
|
94
|
+
* `labelSize`, and it means the heading LEVEL of the panel's own label. Different
|
|
95
|
+
* thing, and worth keeping.
|
|
96
|
+
*/
|
|
97
|
+
labelTextSize?: TSizes;
|
|
98
|
+
/**
|
|
99
|
+
* Vertical padding on each row, from the size scale — the list's density.
|
|
100
|
+
*
|
|
101
|
+
* Omitted, rows keep the padding they have always had. Set it when the list has to
|
|
102
|
+
* sit on a rhythm something else is measured against (a tab strip below it, a
|
|
103
|
+
* sibling list), where the row height has to be predictable rather than comfortable.
|
|
104
|
+
*/
|
|
105
|
+
rowPadding?: TSizes;
|
|
76
106
|
}
|
|
77
107
|
/**
|
|
78
108
|
* Read-only description list — a `<dl>`-style key/value layout
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DescriptionList/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAoB,SAAS,EAAW,MAAM,OAAO,CAAC;AAE7D,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DescriptionList/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAoB,SAAS,EAAW,MAAM,OAAO,CAAC;AAE7D,OAAO,EAIL,MAAM,EACP,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAgB,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAGpE,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEpD,OAAO,EAAE,iBAAiB,EAAe,MAAM,UAAU,CAAC;AAG1D;;;;;GAKG;AACH,eAAO,MAAM,oCAAoC,EAAE,eAA8B,CAAC;AAElF,MAAM,WAAW,yBAAyB;IACxC,qDAAqD;IACrD,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,iDAAiD;IACjD,OAAO,EAAE,SAAS,CAAC;IACnB;;;;;;;;;;OAUG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB,4EAA4E;IAC5E,UAAU,CAAC,EAAE,eAAe,CAAC;IAC7B,kFAAkF;IAClF,WAAW,CAAC,EAAE,aAAa,CAAC;IAC5B,oFAAoF;IACpF,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B;;;;;OAKG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAUD,MAAM,WAAW,2BAA4B,SAAQ,IAAI,CAAC,iBAAiB,EAAE,UAAU,CAAC;IACtF,oCAAoC;IACpC,KAAK,EAAE,yBAAyB,EAAE,CAAC;IACnC;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;;;OAKG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;;;;;OAQG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;;;;;;;OAUG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAkHD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AACH,eAAO,MAAM,qBAAqB,kKAoGjC,CAAC"}
|
|
@@ -67,6 +67,7 @@ var jsx_runtime_1 = require("react/jsx-runtime");
|
|
|
67
67
|
var polished_1 = require("polished");
|
|
68
68
|
var react_1 = require("react");
|
|
69
69
|
var styled_components_1 = __importStar(require("styled-components"));
|
|
70
|
+
var sizes_1 = require("../../constants/sizes");
|
|
70
71
|
var colors_1 = require("../../helpers/colors");
|
|
71
72
|
var utils_1 = require("../../helpers/utils");
|
|
72
73
|
var Icon_1 = __importDefault(require("../Icon"));
|
|
@@ -79,11 +80,17 @@ var Paragraph_1 = require("../Paragraph");
|
|
|
79
80
|
* Callers can swap the glyph per-row via `intentIcon`.
|
|
80
81
|
*/
|
|
81
82
|
exports.DESCRIPTION_LIST_DEFAULT_INTENT_ICON = 'CircleFill';
|
|
83
|
+
/** The vertical padding rows have always had. Kept as the default so existing lists
|
|
84
|
+
* are untouched — `rowPadding` opts into the size scale instead. */
|
|
85
|
+
var DEFAULT_ROW_PADDING = 10;
|
|
82
86
|
var StyledList = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n flex-flow: column;\n width: 100%;\n"], ["\n display: flex;\n flex-flow: column;\n width: 100%;\n"])));
|
|
83
|
-
var StyledRow = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n gap: 8px;\n padding:
|
|
87
|
+
var StyledRow = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n gap: 8px;\n padding: ", "px 0;\n\n /*\n * The separator is drawn, not laid out. As a border it added its 1px to the row's\n * box, so every row except the last stood 1px taller and a list whose rows should\n * read as one rhythm was measurably ragged \u2014 which matters as soon as anything is\n * aligned to a row's height. An inset shadow paints the same hairline without\n * participating in layout.\n */\n ", "\n"], ["\n display: flex;\n align-items: center;\n gap: 8px;\n padding: ", "px 0;\n\n /*\n * The separator is drawn, not laid out. As a border it added its 1px to the row's\n * box, so every row except the last stood 1px taller and a list whose rows should\n * read as one rhythm was measurably ragged \u2014 which matters as soon as anything is\n * aligned to a row's height. An inset shadow paints the same hairline without\n * participating in layout.\n */\n ", "\n"])), function (_a) {
|
|
88
|
+
var $rowPadding = _a.$rowPadding;
|
|
89
|
+
return $rowPadding;
|
|
90
|
+
}, function (_a) {
|
|
84
91
|
var $isLast = _a.$isLast, $separatorOpacity = _a.$separatorOpacity, theme = _a.theme;
|
|
85
92
|
return !$isLast &&
|
|
86
|
-
$separatorOpacity > 0 && (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n
|
|
93
|
+
$separatorOpacity > 0 && (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n box-shadow: inset 0 -1px 0\n ", ";\n "], ["\n box-shadow: inset 0 -1px 0\n ", ";\n "])), (0, polished_1.rgba)((0, colors_1.changeLightness)((0, colors_1.getMainBackgroundColor)(theme), 0.16), $separatorOpacity));
|
|
87
94
|
});
|
|
88
95
|
/**
|
|
89
96
|
* Fixed-width slot for the leading intent icon. Reserves space even
|
|
@@ -104,7 +111,10 @@ var StyledLabel = styled_components_1.default.div(templateObject_6 || (templateO
|
|
|
104
111
|
var $uppercase = _a.$uppercase;
|
|
105
112
|
return $uppercase && (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n text-transform: uppercase;\n letter-spacing: 0.06em;\n font-weight: 600;\n opacity: 0.55;\n "], ["\n text-transform: uppercase;\n letter-spacing: 0.06em;\n font-weight: 600;\n opacity: 0.55;\n "])));
|
|
106
113
|
});
|
|
107
|
-
var StyledContent = styled_components_1.default.div(
|
|
114
|
+
var StyledContent = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n flex: 1 1 auto;\n min-width: 0;\n display: flex;\n align-items: center;\n gap: 8px;\n font-variant-numeric: tabular-nums;\n\n ", "\n"], ["\n flex: 1 1 auto;\n min-width: 0;\n display: flex;\n align-items: center;\n gap: 8px;\n font-variant-numeric: tabular-nums;\n\n ", "\n"])), function (_a) {
|
|
115
|
+
var $controlSize = _a.$controlSize;
|
|
116
|
+
return $controlSize && (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n /*\n * Reserve a control's height on every row, whether or not the row holds one:\n * a row of buttons is 32px while a row of text is 14-18px, so left to their\n * content the rows differ by half their height and the list reads as ragged\n * rather than tabular.\n */\n min-height: ", "px;\n\n /*\n * And give bare content the inset a control applies to its own. A control\n * insets its content by its horizontal padding, so a button's label sits ~12px\n * into the column while plain text starts at 0, and the two columns of values\n * never line up. Handing the inset to whatever ISN'T a control means a new\n * plain value cannot be added misaligned.\n *\n * Both shapes of control are excluded: Reqore renders the button AS the value\n * (ReqoreButton, ReqoreDropdown with a string label) or nests one inside a\n * wrapper, and matching only the nested case leaves the root-button rows\n * picking up this inset on top of their own.\n */\n > *:not(.reqore-button):not(:has(.reqore-button)) {\n padding-left: ", "px;\n }\n "], ["\n /*\n * Reserve a control's height on every row, whether or not the row holds one:\n * a row of buttons is 32px while a row of text is 14-18px, so left to their\n * content the rows differ by half their height and the list reads as ragged\n * rather than tabular.\n */\n min-height: ", "px;\n\n /*\n * And give bare content the inset a control applies to its own. A control\n * insets its content by its horizontal padding, so a button's label sits ~12px\n * into the column while plain text starts at 0, and the two columns of values\n * never line up. Handing the inset to whatever ISN'T a control means a new\n * plain value cannot be added misaligned.\n *\n * Both shapes of control are excluded: Reqore renders the button AS the value\n * (ReqoreButton, ReqoreDropdown with a string label) or nests one inside a\n * wrapper, and matching only the nested case leaves the root-button rows\n * picking up this inset on top of their own.\n */\n > *:not(.reqore-button):not(:has(.reqore-button)) {\n padding-left: ", "px;\n }\n "])), sizes_1.SIZE_TO_PX[$controlSize], sizes_1.CONTROL_HORIZONTAL_PADDING_FROM_SIZE[$controlSize]);
|
|
117
|
+
});
|
|
108
118
|
/**
|
|
109
119
|
* Read-only description list — a `<dl>`-style key/value layout
|
|
110
120
|
* rendered inside a `ReqorePanel`. Distinct from `ReqoreKeyValueTable`:
|
|
@@ -147,7 +157,7 @@ var StyledContent = styled_components_1.default.div(templateObject_7 || (templat
|
|
|
147
157
|
* ```
|
|
148
158
|
*/
|
|
149
159
|
exports.ReqoreDescriptionList = (0, react_1.memo)((0, react_1.forwardRef)(function (_a, ref) {
|
|
150
|
-
var items = _a.items, _b = _a.labelWidth, labelWidth = _b === void 0 ? '160px' : _b, _c = _a.uppercaseLabels, uppercaseLabels = _c === void 0 ? true : _c, _d = _a.separatorOpacity, separatorOpacity = _d === void 0 ? 0.06 : _d, _e = _a.size, size = _e === void 0 ? 'normal' : _e, padded = _a.padded, className = _a.className, panelRest = __rest(_a, ["items", "labelWidth", "uppercaseLabels", "separatorOpacity", "size", "padded", "className"]);
|
|
160
|
+
var items = _a.items, _b = _a.labelWidth, labelWidth = _b === void 0 ? '160px' : _b, _c = _a.uppercaseLabels, uppercaseLabels = _c === void 0 ? true : _c, _d = _a.separatorOpacity, separatorOpacity = _d === void 0 ? 0.06 : _d, _e = _a.size, size = _e === void 0 ? 'normal' : _e, contentSize = _a.contentSize, labelTextSize = _a.labelTextSize, rowPadding = _a.rowPadding, padded = _a.padded, className = _a.className, panelRest = __rest(_a, ["items", "labelWidth", "uppercaseLabels", "separatorOpacity", "size", "contentSize", "labelTextSize", "rowPadding", "padded", "className"]);
|
|
151
161
|
// Default the panel's padding one size up from the list's text
|
|
152
162
|
// size — gives the rows visible breathing room from the panel
|
|
153
163
|
// edge without callers having to size it manually. The caller
|
|
@@ -157,6 +167,8 @@ exports.ReqoreDescriptionList = (0, react_1.memo)((0, react_1.forwardRef)(functi
|
|
|
157
167
|
// gutter so the label column stays vertically aligned across
|
|
158
168
|
// rows with and without an intent.
|
|
159
169
|
var anyRowHasIntent = (0, react_1.useMemo)(function () { return items.some(function (row) { return Boolean(row.intent); }); }, [items]);
|
|
170
|
+
var resolvedRowPadding = rowPadding ? sizes_1.PADDING_FROM_SIZE[rowPadding] : DEFAULT_ROW_PADDING;
|
|
171
|
+
var resolvedLabelSize = labelTextSize !== null && labelTextSize !== void 0 ? labelTextSize : size;
|
|
160
172
|
return ((0, jsx_runtime_1.jsx)(Panel_1.ReqorePanel, __assign({}, panelRest, { size: size, padded: resolvedPadded, ref: ref, className: "".concat(className || '', " reqore-description-list"), children: (0, jsx_runtime_1.jsx)(StyledList, { className: 'reqore-description-list-body', children: items.map(function (row, index) {
|
|
161
173
|
var _a, _b;
|
|
162
174
|
var isLast = index === items.length - 1;
|
|
@@ -164,8 +176,8 @@ exports.ReqoreDescriptionList = (0, react_1.memo)((0, react_1.forwardRef)(functi
|
|
|
164
176
|
var iconName = row.intent
|
|
165
177
|
? (_b = row.intentIcon) !== null && _b !== void 0 ? _b : exports.DESCRIPTION_LIST_DEFAULT_INTENT_ICON
|
|
166
178
|
: undefined;
|
|
167
|
-
return ((0, jsx_runtime_1.jsxs)(StyledRow, { "$separatorOpacity": separatorOpacity, "$isLast": isLast, className: 'reqore-description-list-row', "data-key": row.key, children: [row.label !== undefined ? ((0, jsx_runtime_1.jsxs)(StyledLabel, { "$width": labelWidth, "$uppercase": labelUppercase, className: 'reqore-description-list-label', children: [anyRowHasIntent ? ((0, jsx_runtime_1.jsx)(StyledIconSlot, { "$visible": Boolean(iconName), className: 'reqore-description-list-intent-icon', "aria-hidden": !iconName, children: iconName ? ((0, jsx_runtime_1.jsx)(Icon_1.default, { icon: iconName, intent: row.intent, size: (0, utils_1.getOneLessSize)((0, utils_1.getOneLessSize)(size)), margin: 'right' })) : null })) : null, (0, jsx_runtime_1.jsx)(Paragraph_1.ReqoreP, { size:
|
|
179
|
+
return ((0, jsx_runtime_1.jsxs)(StyledRow, { "$separatorOpacity": separatorOpacity, "$isLast": isLast, "$rowPadding": resolvedRowPadding, className: 'reqore-description-list-row', "data-key": row.key, children: [row.label !== undefined ? ((0, jsx_runtime_1.jsxs)(StyledLabel, { "$width": labelWidth, "$uppercase": labelUppercase, className: 'reqore-description-list-label', children: [anyRowHasIntent ? ((0, jsx_runtime_1.jsx)(StyledIconSlot, { "$visible": Boolean(iconName), className: 'reqore-description-list-intent-icon', "aria-hidden": !iconName, children: iconName ? ((0, jsx_runtime_1.jsx)(Icon_1.default, { icon: iconName, intent: row.intent, size: (0, utils_1.getOneLessSize)((0, utils_1.getOneLessSize)(size)), margin: 'right' })) : null })) : null, (0, jsx_runtime_1.jsx)(Paragraph_1.ReqoreP, { size: resolvedLabelSize, intent: row.labelIntent, children: row.label })] })) : null, (0, jsx_runtime_1.jsx)(StyledContent, { "$controlSize": contentSize, className: 'reqore-description-list-content', children: typeof row.content === 'string' || typeof row.content === 'number' ? ((0, jsx_runtime_1.jsx)(Paragraph_1.ReqoreP, { size: size, intent: row.contentIntent, children: row.content })) : (row.content) })] }, row.key));
|
|
168
180
|
}) }) })));
|
|
169
181
|
}));
|
|
170
|
-
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
|
|
182
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;
|
|
171
183
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/DescriptionList/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,qCAAgC;AAChC,+BAA6D;AAC7D,qEAAgD;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/DescriptionList/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -3,11 +3,23 @@ import { TReqorePadded } from '../../helpers/utils';
|
|
|
3
3
|
import { IReqoreDisabled, IReqoreIntent, IWithReqoreCustomTheme, IWithReqoreEffect, IWithReqoreFlat, IWithReqoreFluid, IWithReqoreSize, IWithReqoreTooltip } from '../../types/global';
|
|
4
4
|
import { IReqoreIconName } from '../../types/icons';
|
|
5
5
|
import { IReqoreButtonProps, TReqoreBadge } from '../Button';
|
|
6
|
+
import { IReqoreDropdownProps } from '../Dropdown';
|
|
6
7
|
import { IReqoreEffect, TReqoreEffectColor } from '../Effect';
|
|
7
8
|
import { IReqoreIconProps } from '../Icon';
|
|
9
|
+
import { IReqorePanelSubAction } from '../Panel';
|
|
8
10
|
export interface IReqoreEntityRowAction extends Omit<IReqoreButtonProps, 'children'> {
|
|
9
11
|
/** Visible button label. */
|
|
10
12
|
label?: string;
|
|
13
|
+
/**
|
|
14
|
+
* Turns this action into an overflow menu instead of a plain button — the row
|
|
15
|
+
* equivalent of `IReqorePanelAction.actions`, and named to match it.
|
|
16
|
+
*
|
|
17
|
+
* Typical use is a "three dots" menu: `{ icon: 'More2Line', actions: [...] }`.
|
|
18
|
+
* Entries with `show: false` are dropped.
|
|
19
|
+
*/
|
|
20
|
+
actions?: IReqorePanelSubAction[];
|
|
21
|
+
/** Extra props for the dropdown rendered when `actions` is set. */
|
|
22
|
+
actionsProps?: IReqoreDropdownProps;
|
|
11
23
|
}
|
|
12
24
|
export interface IReqoreEntityRowProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'>, IReqoreDisabled, IReqoreIntent, IWithReqoreCustomTheme, IWithReqoreEffect, IWithReqoreFlat, IWithReqoreFluid, IWithReqoreSize, IWithReqoreTooltip {
|
|
13
25
|
/** Primary text — e.g. the Qog name. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/EntityRow/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAuC,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAGpF,OAAO,EAAkC,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAGpF,OAAO,EACL,eAAe,EACf,aAAa,EACb,sBAAsB,EACtB,iBAAiB,EACjB,eAAe,EACf,gBAAgB,EAChB,eAAe,EACf,kBAAkB,EACnB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAqB,EAAe,kBAAkB,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAExF,OAAO,EAAE,aAAa,EAAgB,kBAAkB,EAAE,MAAM,WAAW,CAAC;AAC5E,OAAmB,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/EntityRow/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAuC,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAGpF,OAAO,EAAkC,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAGpF,OAAO,EACL,eAAe,EACf,aAAa,EACb,sBAAsB,EACtB,iBAAiB,EACjB,eAAe,EACf,gBAAgB,EAChB,eAAe,EACf,kBAAkB,EACnB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAqB,EAAe,kBAAkB,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAExF,OAAuB,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC;AACnE,OAAO,EAAE,aAAa,EAAgB,kBAAkB,EAAE,MAAM,WAAW,CAAC;AAC5E,OAAmB,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AACvD,OAAO,EAAE,qBAAqB,EAAE,MAAM,UAAU,CAAC;AAKjD,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,kBAAkB,EAAE,UAAU,CAAC;IAClF,4BAA4B;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,qBAAqB,EAAE,CAAC;IAClC,mEAAmE;IACnE,YAAY,CAAC,EAAE,oBAAoB,CAAC;CACrC;AAeD,MAAM,WAAW,qBACf,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC,EACzD,eAAe,EACf,aAAa,EACb,sBAAsB,EACtB,iBAAiB,EACjB,eAAe,EACf,gBAAgB,EAChB,eAAe,EACf,kBAAkB;IACpB,wCAAwC;IACxC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,yDAAyD;IACzD,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,sEAAsE;IACtE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,8EAA8E;IAC9E,KAAK,CAAC,EAAE,YAAY,GAAG,YAAY,EAAE,CAAC;IACtC,2CAA2C;IAC3C,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,kFAAkF;IAClF,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gFAAgF;IAChF,SAAS,CAAC,EAAE,kBAAkB,CAAC;IAC/B,yDAAyD;IACzD,SAAS,CAAC,EAAE,OAAO,CAAC,gBAAgB,CAAC,CAAC;IACtC,mCAAmC;IACnC,OAAO,CAAC,EAAE,sBAAsB,EAAE,CAAC;IACnC,oFAAoF;IACpF,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,6CAA6C;IAC7C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kFAAkF;IAClF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;;;;OAOG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B;;;;;;OAMG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,wCAAwC;IACxC,WAAW,CAAC,EAAE,aAAa,CAAC;IAC5B,8CAA8C;IAC9C,iBAAiB,CAAC,EAAE,aAAa,CAAC;IAClC,2CAA2C;IAC3C,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AA2ID,QAAA,MAAM,eAAe,4JA4KpB,CAAC;AAEF,eAAe,eAAe,CAAC"}
|