@ntbjs/react-components 3.0.0-rc.1 → 3.0.0-rc.3
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 +34 -0
- package/build/data/Alert/Alert.js.map +1 -1
- package/build/data/Alert/Alert.styled.js.map +1 -1
- package/build/data/Badge/Badge.js.map +1 -1
- package/build/data/Badge/Badge.styled.js.map +1 -1
- package/build/data/Popover/Popover.js.map +1 -1
- package/build/data/Popover/Popover.styled.js.map +1 -1
- package/build/data/SeverityBadge/SeverityBadge.js.map +1 -1
- package/build/data/Tab/Tab.js.map +1 -1
- package/build/data/Tab/Tab.styled.js.map +1 -1
- package/build/data/Tabs/Tabs.js.map +1 -1
- package/build/data/Tabs/Tabs.styled.js.map +1 -1
- package/build/data/Tooltip/Tooltip.js.map +1 -1
- package/build/data/Tooltip/Tooltip.styled.js.map +1 -1
- package/build/data/VerificationStatusIcon/VerificationStatusIcon.js.map +1 -1
- package/build/data/VerificationStatusIcon/VerificationStatusIcon.styled.js.map +1 -1
- package/build/data/_shared/FloatingArrow.styled.js.map +1 -1
- package/build/hooks/useEventListner.js.map +1 -1
- package/build/hooks/useFloatingPopover.js.map +1 -1
- package/build/hooks/useIsomorphicLayoutEffect.js.map +1 -1
- package/build/hooks/useOnClickOutside.js.map +1 -1
- package/build/hooks/useTooltipAutoShow.js.map +1 -1
- package/build/inputs/ActionButton/ActionButton.js.map +1 -1
- package/build/inputs/ActionButton/ActionButton.styled.js.map +1 -1
- package/build/inputs/Button/Button.js.map +1 -1
- package/build/inputs/Button/Button.styled.js.map +1 -1
- package/build/inputs/Checkbox/Checkbox.js.map +1 -1
- package/build/inputs/Checkbox/Checkbox.styled.js.map +1 -1
- package/build/inputs/CompactAutocompleteSelect/CompactAutocompleteSelect.js.map +1 -1
- package/build/inputs/CompactAutocompleteSelect/CompactAutocompleteSelect.styled.js.map +1 -1
- package/build/inputs/CompactStarRating/CompactStarRating.js.map +1 -1
- package/build/inputs/CompactStarRating/CompactStarRating.styled.js.map +1 -1
- package/build/inputs/CompactTextInput/CompactTextInput.js.map +1 -1
- package/build/inputs/CompactTextInput/CompactTextInput.styled.js.map +1 -1
- package/build/inputs/MultiLevelCheckbox/MultiLevelCheckbox.js.map +1 -1
- package/build/inputs/MultiLevelCheckbox/MultiLevelCheckbox.styled.js.map +1 -1
- package/build/inputs/MultiLevelCheckbox/types.js.map +1 -1
- package/build/inputs/MultiLevelCheckboxSelect/MultiLevelCheckboxSelect.js.map +1 -1
- package/build/inputs/MultiLevelCheckboxSelect/MultiLevelCheckboxSelect.styled.js.map +1 -1
- package/build/inputs/MultiSelect/MultiSelect.js.map +1 -1
- package/build/inputs/MultiSelect/MultiSelect.styled.js.map +1 -1
- package/build/inputs/Radio/Radio.js.map +1 -1
- package/build/inputs/Radio/Radio.styled.js.map +1 -1
- package/build/inputs/Switch/Switch.styled.js.map +1 -1
- package/build/inputs/TextArea/TextArea.js.map +1 -1
- package/build/inputs/TextArea/TextArea.styled.js.map +1 -1
- package/build/inputs/TextInput/TextInput.js.map +1 -1
- package/build/inputs/TextInput/TextInput.styled.js.map +1 -1
- package/build/layout/InputGroup/InputGroup.js.map +1 -1
- package/build/layout/InputGroup/InputGroup.styled.js.map +1 -1
- package/build/layout/SectionSeparator/SectionSeparator.js.map +1 -1
- package/build/layout/SectionSeparator/SectionSeparator.styled.js.map +1 -1
- package/build/styles/utils/colors-export.d.ts +6 -25
- package/build/utils/dateTime.js.map +1 -1
- package/build/utils/defaultTheme.js.map +1 -1
- package/build/utils/getElementRef.js.map +1 -1
- package/build/utils/parseTrigger.js.map +1 -1
- package/build/widgets/AssetAction/AssetAction.js.map +1 -1
- package/build/widgets/AssetAction/AssetAction.styled.js.map +1 -1
- package/build/widgets/AssetActionsBase/AssetActionsBase.js.map +1 -1
- package/build/widgets/AssetActionsBase/AssetActionsBase.styled.js.map +1 -1
- package/build/widgets/AssetGallery/AssetGallery.js.map +1 -1
- package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryBase.js.map +1 -1
- package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryBase.styled.js.map +1 -1
- package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryCompactCard/AssetGalleryCompactCard.js.map +1 -1
- package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryCompactCard/AssetGalleryCompactCard.styled.js.map +1 -1
- package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryGridCard/AssetGalleryGridCard.js.map +1 -1
- package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryGridCard/AssetGalleryGridCard.styled.js.map +1 -1
- package/build/widgets/AssetPreview/AssetPreviewTopBar/AssetPreviewTopBar.js.map +1 -1
- package/build/widgets/AssetPreview/AssetPreviewTopBar/AssetPreviewTopBar.styled.js.map +1 -1
- package/build/widgets/ContextMenu/ContextMenu.js.map +1 -1
- package/build/widgets/ContextMenu/ContextMenu.styled.js.map +1 -1
- package/build/widgets/ContextMenu/ContextMenuItem/ContextMenuItem.js.map +1 -1
- package/build/widgets/ContextMenu/ContextMenuItem/ContextMenuItem.styled.js.map +1 -1
- package/build/widgets/ContextMenu/ContextMenuItemsGroup/ContextMenuItemsGroup.js.map +1 -1
- package/build/widgets/ContextMenu/ContextMenuItemsGroup/ContextMenuItemsGroup.styled.js.map +1 -1
- package/build/widgets/InfoCard/InfoCard.js.map +1 -1
- package/build/widgets/InfoCard/InfoCard.styled.js.map +1 -1
- package/build/widgets/InstructionSeverityDisplay/InstructionSeverityDisplay.js.map +1 -1
- package/build/widgets/InstructionSeverityDisplay/InstructionSeverityDisplay.styled.js.map +1 -1
- package/build/widgets/Instructions/Instructions.js.map +1 -1
- package/build/widgets/Instructions/Instructions.styled.js.map +1 -1
- package/build/widgets/ProgressBar/ProgressBar.js.map +1 -1
- package/build/widgets/ProgressBar/ProgressBar.styled.js.map +1 -1
- package/build/widgets/SummaryCard/SummaryCard.js.map +1 -1
- package/build/widgets/SummaryCard/SummaryCard.styled.js.map +1 -1
- package/package.json +8 -1
- package/styles/utils/colors-export.d.ts +6 -25
- package/types/components/data/Alert/Alert.styled.d.ts +6 -37
- package/types/components/data/Badge/Badge.d.ts +1 -9
- package/types/components/data/Badge/Badge.styled.d.ts +0 -99
- package/types/components/data/Popover/Popover.d.ts +11 -100
- package/types/components/data/Tab/Tab.d.ts +1 -14
- package/types/components/data/Tabs/Tabs.styled.d.ts +1 -17
- package/types/components/data/Tooltip/Tooltip.d.ts +4 -50
- package/types/components/data/VerificationStatusIcon/VerificationStatusIcon.styled.d.ts +3 -22
- package/types/components/data/_shared/FloatingArrow.styled.d.ts +1 -101
- package/types/components/inputs/ActionButton/ActionButton.styled.d.ts +2 -20
- package/types/components/inputs/Button/Button.styled.d.ts +0 -42
- package/types/components/inputs/Checkbox/Checkbox.d.ts +0 -9
- package/types/components/inputs/Checkbox/Checkbox.styled.d.ts +6 -10
- package/types/components/inputs/CompactAutocompleteSelect/CompactAutocompleteSelect.styled.d.ts +4 -57
- package/types/components/inputs/CompactStarRating/CompactStarRating.styled.d.ts +3 -55
- package/types/components/inputs/CompactTextInput/CompactTextInput.styled.d.ts +4 -32
- package/types/components/inputs/MultiLevelCheckbox/MultiLevelCheckbox.styled.d.ts +2 -10
- package/types/components/inputs/MultiLevelCheckbox/types.d.ts +3 -46
- package/types/components/inputs/MultiSelect/MultiSelect.d.ts +0 -57
- package/types/components/inputs/MultiSelect/MultiSelect.styled.d.ts +0 -65
- package/types/components/inputs/Radio/Radio.styled.d.ts +3 -3
- package/types/components/inputs/Switch/Switch.styled.d.ts +3 -7
- package/types/components/inputs/TextArea/TextArea.d.ts +0 -4
- package/types/components/inputs/TextArea/TextArea.styled.d.ts +5 -7
- package/types/components/inputs/TextInput/TextInput.styled.d.ts +1 -1
- package/types/components/layout/SectionSeparator/SectionSeparator.styled.d.ts +2 -9
- package/types/components/widgets/AssetAction/AssetAction.styled.d.ts +2 -7
- package/types/components/widgets/AssetGallery/AssetGalleryBase/AssetGalleryBase.d.ts +0 -12
- package/types/components/widgets/AssetGallery/AssetGalleryBase/AssetGalleryCompactCard/AssetGalleryCompactCard.styled.d.ts +7 -55
- package/types/components/widgets/AssetGallery/AssetGalleryBase/AssetGalleryGridCard/AssetGalleryGridCard.styled.d.ts +7 -43
- package/types/components/widgets/AssetGallery/asset.types.d.ts +31 -148
- package/types/components/widgets/AssetPreview/AssetPreviewTopBar/AssetPreviewTopBar.styled.d.ts +6 -20
- package/types/components/widgets/ContextMenu/ContextMenu.d.ts +1 -17
- package/types/components/widgets/ContextMenu/ContextMenuItem/ContextMenuItem.styled.d.ts +5 -13
- package/types/components/widgets/ContextMenu/ContextMenuItemsGroup/ContextMenuItemsGroup.d.ts +0 -18
- package/types/components/widgets/InfoCard/InfoCard.styled.d.ts +2 -19
- package/types/components/widgets/InstructionSeverityDisplay/InstructionSeverityDisplay.styled.d.ts +9 -19
- package/types/components/widgets/Instructions/Instructions.styled.d.ts +2 -14
- package/types/components/widgets/ProgressBar/ProgressBar.styled.d.ts +6 -43
- package/types/components/widgets/SummaryCard/SummaryCard.styled.d.ts +7 -46
- package/types/hooks/useElementSize.d.ts +3 -14
- package/types/hooks/useEventListner.d.ts +6 -38
- package/types/hooks/useFloatingPopover.d.ts +9 -90
- package/types/hooks/useIsomorphicLayoutEffect.d.ts +0 -23
- package/types/hooks/useOnClickOutside.d.ts +5 -23
- package/types/hooks/useTooltipAutoShow.d.ts +8 -57
- package/types/styles/utils/colors-export.d.ts +6 -25
- package/types/utils/dateTime.d.ts +2 -7
- package/types/utils/defaultTheme.d.ts +13 -92
- package/types/utils/getElementRef.d.ts +0 -19
- package/types/utils/parseTrigger.d.ts +8 -78
|
@@ -1,62 +1,19 @@
|
|
|
1
1
|
import PropTypes from 'prop-types';
|
|
2
2
|
import type { DragEvent, MouseEvent as ReactMouseEvent, ReactElement, ReactNode } from 'react';
|
|
3
3
|
/**
|
|
4
|
-
* The asset contract —
|
|
5
|
-
* consumer builds objects *for* rather than passing props *to*.
|
|
4
|
+
* The asset contract — consumers build these objects rather than passing them as props.
|
|
6
5
|
*
|
|
7
|
-
*
|
|
8
|
-
*
|
|
9
|
-
*
|
|
10
|
-
*
|
|
11
|
-
*
|
|
12
|
-
*
|
|
13
|
-
*
|
|
14
|
-
* for when they go and what to do then.
|
|
15
|
-
*
|
|
16
|
-
* 2. THIRTEEN MEMBERS HERE WERE NEVER DECLARED BY THE propTypes, AND EVERY ONE
|
|
17
|
-
* OF THEM IS READ AT RUNTIME. They are marked `@recovered` with the read
|
|
18
|
-
* site. This is why this file was hand-written instead of codemodded: a
|
|
19
|
-
* codemod can only reproduce what the propTypes said, and what the propTypes
|
|
20
|
-
* said was missing a third of the API. Generated prop types are CLOSED, so an
|
|
21
|
-
* omission converts silently from "undocumented" into "compile error at the
|
|
22
|
-
* consumer's call site". Before adding a member, grep for `asset.<name>`.
|
|
23
|
-
*
|
|
24
|
-
* 3. THE NESTED SHAPES ARE NAMED, EXPORTED INTERFACES, NOT INLINE OBJECT TYPES.
|
|
25
|
-
* A consumer keeping its own asset list needs to name the pieces
|
|
26
|
-
* (`AssetAction[]`, `AssetSummary`) in order to build them; inlining forces
|
|
27
|
-
* it to re-declare them or to reach for `any`. `Asset` is also meant to be
|
|
28
|
-
* EXTENDED — the gallery hands each asset object straight back to
|
|
29
|
-
* `component(asset, children)` and to every `onClick`, so consumer-only
|
|
30
|
-
* fields travel through the library untouched:
|
|
31
|
-
*
|
|
32
|
-
* interface MyAsset extends Asset { credit: string }
|
|
33
|
-
*
|
|
34
|
-
* Note that `AssetAction` (the interface below) and `AssetAction` (the
|
|
35
|
-
* component exported from `@ntbjs/react-components/widgets`) are different
|
|
36
|
-
* things with the same name. They never meet today, because this module is
|
|
37
|
-
* not re-exported from the widgets barrel. If you ever add it there, rename
|
|
38
|
-
* one of them.
|
|
39
|
-
* ============================================================================
|
|
40
|
-
*/
|
|
41
|
-
/**
|
|
42
|
-
* An asset's identity, and one of its two required members.
|
|
43
|
-
*
|
|
44
|
-
* `AssetGalleryBase` drops any asset without one and warns; the value is also
|
|
45
|
-
* used as a React `key`, which is why the union is `string | number` rather than
|
|
46
|
-
* `unknown` — `PropTypes.oneOfType([string, number])`, verbatim.
|
|
6
|
+
* The interfaces are the source of truth; the propTypes at the bottom are legacy but still
|
|
7
|
+
* evaluated at runtime on React 16, so they cannot be deleted yet. Members marked `@recovered`
|
|
8
|
+
* were never declared by the propTypes but are read at runtime — grep `asset.<name>` before
|
|
9
|
+
* adding one, since a missing member becomes a compile error at the consumer's call site.
|
|
10
|
+
* `Asset` is meant to be extended (`interface MyAsset extends Asset { credit: string }`).
|
|
11
|
+
* The `AssetAction` interface here is unrelated to the `AssetAction` component in the widgets
|
|
12
|
+
* barrel; they never meet because this module is not re-exported there.
|
|
47
13
|
*/
|
|
14
|
+
/** Identity and React key; must be `string | number`. */
|
|
48
15
|
export type AssetKey = string | number;
|
|
49
|
-
/**
|
|
50
|
-
* What kind of file this asset is. Only `'video'` and `'audio'` change what the
|
|
51
|
-
* cards render (a `<video>`, or a headset glyph); the other three fall through
|
|
52
|
-
* to the lazily-loaded still image.
|
|
53
|
-
*
|
|
54
|
-
* Both cards branch on `asset.fileType?.toLowerCase()`, so a consumer passing
|
|
55
|
-
* `'VIDEO'` gets the video preview while `renderMediaBadge` — which compares
|
|
56
|
-
* `=== 'video'` without lowercasing — does not show the play badge. The union is
|
|
57
|
-
* lowercase because that is what the propTypes always declared; widening it to
|
|
58
|
-
* `string` would bless that inconsistency instead of exposing it.
|
|
59
|
-
*/
|
|
16
|
+
/** Cards lowercase before checking; `renderMediaBadge` does not, causing inconsistency. */
|
|
60
17
|
export type AssetFileType = 'image' | 'video' | 'pdf' | 'file' | 'audio';
|
|
61
18
|
/**
|
|
62
19
|
* Declared corner for the file-type glyph.
|
|
@@ -66,11 +23,7 @@ export type AssetFileType = 'image' | 'video' | 'pdf' | 'file' | 'audio';
|
|
|
66
23
|
* removing it is a deliberate API change and belongs in its own commit.
|
|
67
24
|
*/
|
|
68
25
|
export type AssetFileTypeIconPosition = 'top-left' | 'top-right';
|
|
69
|
-
/**
|
|
70
|
-
* Usage-restriction level, 1 (info) to 5 (highly restricted). Passed through to
|
|
71
|
-
* `InstructionSeverityDisplay` and `SummaryCard`, which key their badge label
|
|
72
|
-
* and colour off it. `PropTypes.oneOf([1, 2, 3, 4, 5])`, verbatim.
|
|
73
|
-
*/
|
|
26
|
+
/** Usage-restriction level (1=info, 5=highly restricted); controls badge styling. */
|
|
74
27
|
export type AssetInstructionSeverity = 1 | 2 | 3 | 4 | 5;
|
|
75
28
|
/**
|
|
76
29
|
* Which of the two things a computed row entry is: a real asset card, or the
|
|
@@ -215,13 +168,7 @@ export interface AssetLayout {
|
|
|
215
168
|
type: AssetLayoutType;
|
|
216
169
|
/** Whether the source asset declared both a width and a height. Compact view only. */
|
|
217
170
|
hasHeightAndWidth?: boolean;
|
|
218
|
-
/**
|
|
219
|
-
* Scroll-virtualisation flag: `false` unmounts the card.
|
|
220
|
-
*
|
|
221
|
-
* @recovered `AssetGalleryBase.tsx` both writes it (`calculateVisibility`) and
|
|
222
|
-
* reads it (the render map, and the arrow-key navigation). The propTypes
|
|
223
|
-
* never declared it.
|
|
224
|
-
*/
|
|
171
|
+
/** Scroll-virtualisation flag: `false` unmounts the card. */
|
|
225
172
|
show?: boolean;
|
|
226
173
|
}
|
|
227
174
|
/**
|
|
@@ -236,115 +183,51 @@ export interface Asset {
|
|
|
236
183
|
key: AssetKey;
|
|
237
184
|
/** Required. Selects the preview branch — see {@link AssetFileType}. */
|
|
238
185
|
fileType: AssetFileType;
|
|
239
|
-
/** Image, video or audio source for the thumbnail. */
|
|
240
186
|
previewUrl?: string;
|
|
241
|
-
/**
|
|
187
|
+
/** Card title and `<img alt>`. */
|
|
242
188
|
title?: string;
|
|
243
|
-
/**
|
|
189
|
+
/** Pixel width; drives compact view row aspect ratio (falls back to 1920). */
|
|
244
190
|
width?: number;
|
|
245
|
-
/**
|
|
191
|
+
/** Pixel height; drives compact view row aspect ratio (falls back to 1080). */
|
|
246
192
|
height?: number;
|
|
247
193
|
note?: AssetNote;
|
|
248
|
-
/** Consecutive assets sharing
|
|
194
|
+
/** Consecutive assets sharing this get one heading row above the first. */
|
|
249
195
|
group?: string;
|
|
250
196
|
actions?: AssetAction[];
|
|
251
|
-
/** Top-right glyph on the thumbnail
|
|
197
|
+
/** Top-right glyph on the thumbnail; suppresses the note glyph when set. */
|
|
252
198
|
statusIcon?: ReactElement<any>;
|
|
253
|
-
/** Rendered over everything else on the card;
|
|
199
|
+
/** Rendered over everything else on the card; consumer owns positioning. */
|
|
254
200
|
overlay?: ReactElement<any>;
|
|
255
|
-
/** Draws the "completed" veil over the compact card. */
|
|
256
201
|
completed?: boolean;
|
|
257
|
-
/** Draws the "error" veil over the compact card. */
|
|
258
202
|
hasError?: boolean;
|
|
259
|
-
/** Dims the card
|
|
203
|
+
/** Dims the card but does not prevent click handlers. */
|
|
260
204
|
disabled?: boolean;
|
|
261
|
-
/** Declared corner for the file-type glyph. Read by nothing — see the type. */
|
|
262
205
|
fileTypeIconPosition?: AssetFileTypeIconPosition;
|
|
263
|
-
/** Severity of `imageRights`, shown as a badge on the card and in the summary. */
|
|
264
206
|
instructionSeverity?: AssetInstructionSeverity;
|
|
265
207
|
summary?: AssetSummary;
|
|
266
|
-
/**
|
|
267
|
-
* Called with the React click event AND the asset. Not called while the
|
|
268
|
-
* gallery is in extended-select mode, where a click selects instead.
|
|
269
|
-
*/
|
|
208
|
+
/** Called with event + asset; skipped in extended-select mode (click selects instead). */
|
|
270
209
|
onClick?: (event: ReactMouseEvent<HTMLElement>, asset: Asset) => void;
|
|
271
|
-
/**
|
|
272
|
-
* Called with the React mouse event AND the asset, after the card has started
|
|
273
|
-
* playing a video preview.
|
|
274
|
-
*/
|
|
210
|
+
/** Called with event + asset after video preview starts playing. */
|
|
275
211
|
onMouseEnter?: (event: ReactMouseEvent<HTMLElement>, asset: Asset) => void;
|
|
276
|
-
/**
|
|
277
|
-
* Called with the NATIVE event, not a React one: both cards attach this with
|
|
278
|
-
* `addEventListener('contextmenu', …)` on the card element. The card
|
|
279
|
-
* default-prevents it before calling.
|
|
280
|
-
*/
|
|
212
|
+
/** Called with native event (not React event); card prevents default before calling. */
|
|
281
213
|
onContextMenu?: (event: MouseEvent) => void;
|
|
282
|
-
/**
|
|
283
|
-
* Duration in MILLISECONDS. Rendered as `h:mm:ss` in the media badge by
|
|
284
|
-
* `convertMsToHMS`, so seconds here are wrong by a factor of 1000.
|
|
285
|
-
*
|
|
286
|
-
* @recovered both cards read `asset.duration`.
|
|
287
|
-
*/
|
|
214
|
+
/** Duration in MILLISECONDS (not seconds). */
|
|
288
215
|
duration?: number;
|
|
289
|
-
/**
|
|
290
|
-
* Body text under the title on the grid card, and in the summary card.
|
|
291
|
-
*
|
|
292
|
-
* @recovered both cards read `asset.description`, and both list it in their
|
|
293
|
-
* `React.memo` comparator, so it is one of the fields that re-renders them.
|
|
294
|
-
*/
|
|
216
|
+
/** Body text under title on grid card and summary card. */
|
|
295
217
|
description?: string;
|
|
296
|
-
/**
|
|
297
|
-
* The usage-restriction text. Its presence is what makes the grid card render
|
|
298
|
-
* an `InstructionSeverityDisplay` at all.
|
|
299
|
-
*
|
|
300
|
-
* @recovered both cards read `asset.imageRights`.
|
|
301
|
-
*/
|
|
218
|
+
/** Usage-restriction text; its presence gates InstructionSeverityDisplay. */
|
|
302
219
|
imageRights?: string;
|
|
303
|
-
/**
|
|
304
|
-
* Severity level → translated label, e.g. `{ 1: 'Info', 5: 'Svært begrenset' }`.
|
|
305
|
-
*
|
|
306
|
-
* `Record<string, string>` rather than a keyed-by-severity mapped type,
|
|
307
|
-
* because that is `PropTypes.objectOf(PropTypes.string)` on both components
|
|
308
|
-
* that consume it (`InstructionSeverityDisplay`, `SummaryCard`) and it stays
|
|
309
|
-
* assignable in both directions once those are typed.
|
|
310
|
-
*
|
|
311
|
-
* @recovered both cards forward `asset.instructionLabels`.
|
|
312
|
-
*/
|
|
220
|
+
/** Severity level → label map, e.g. `{ 1: 'Info', 5: 'Svært begrenset' }`. */
|
|
313
221
|
instructionLabels?: Record<string, string>;
|
|
314
|
-
/**
|
|
315
|
-
* Number of versions, shown in the layers badge.
|
|
316
|
-
*
|
|
317
|
-
* @recovered both cards read `asset.versions`.
|
|
318
|
-
*/
|
|
222
|
+
/** Number of versions, shown in layers badge. */
|
|
319
223
|
versions?: number;
|
|
320
|
-
/**
|
|
321
|
-
* A pre-rendered verification badge. A NODE, not a status string — the compact
|
|
322
|
-
* card returns it as-is from `renderVerificationBadge`, so the consumer owns
|
|
323
|
-
* the markup.
|
|
324
|
-
*
|
|
325
|
-
* @recovered `AssetGalleryCompactCard.tsx` reads `asset.verifications` for
|
|
326
|
-
* both `displayIcon: 'verifications'` and `displayIcon: 'dynamic'`.
|
|
327
|
-
*/
|
|
224
|
+
/** Pre-rendered verification badge (ReactNode, not string); consumer owns markup. */
|
|
328
225
|
verifications?: ReactNode;
|
|
329
|
-
/**
|
|
330
|
-
* Per-asset override of the gallery's `selectable` prop. `AssetGalleryBase`
|
|
331
|
-
* tests `'selectable' in asset`, so `false` here beats `true` there.
|
|
332
|
-
*
|
|
333
|
-
* @recovered `AssetGalleryBase.tsx`.
|
|
334
|
-
*/
|
|
226
|
+
/** Per-asset override of gallery's `selectable` prop; `false` here beats `true` there. */
|
|
335
227
|
selectable?: boolean;
|
|
336
|
-
/**
|
|
337
|
-
* Sets the DOM `draggable` attribute on the card root.
|
|
338
|
-
*
|
|
339
|
-
* @recovered both cards pass `asset.draggable`.
|
|
340
|
-
*/
|
|
228
|
+
/** Sets DOM `draggable` attribute on card root. */
|
|
341
229
|
draggable?: boolean;
|
|
342
|
-
/**
|
|
343
|
-
* Called with the NATIVE drag event: both cards attach this with
|
|
344
|
-
* `addEventListener('dragstart', …)`. Pair it with `draggable: true`.
|
|
345
|
-
*
|
|
346
|
-
* @recovered both cards read `asset.onDragstart`.
|
|
347
|
-
*/
|
|
230
|
+
/** Called with native drag event; pair with `draggable: true`. */
|
|
348
231
|
onDragstart?: (event: DragEvent) => void;
|
|
349
232
|
}
|
|
350
233
|
/**
|
package/types/components/widgets/AssetPreview/AssetPreviewTopBar/AssetPreviewTopBar.styled.d.ts
CHANGED
|
@@ -1,30 +1,16 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* `disabled` —
|
|
3
|
-
*
|
|
4
|
-
* NO `$`, AND THAT IS A DEFECT THAT IS ALREADY IN THE RENDER BASELINE. React recognises
|
|
5
|
-
* `disabled` and renders it as a bare boolean attribute on any element, so
|
|
6
|
-
* `widgets/AssetPreviewTopBar#disabled` in `scripts/r19-harness/baseline.json` records
|
|
7
|
-
* `<div disabled="">` AND `<a disabled="">`. Renaming it `$disabled` removes both
|
|
8
|
-
* attributes and therefore MOVES the baseline — C10 work, §E.4.
|
|
9
|
-
*
|
|
10
|
-
* Note it also has to be DECLARED to be read at all: `disabled` is a member of neither
|
|
11
|
-
* `HTMLAttributes<HTMLDivElement>` nor `AnchorHTMLAttributes<HTMLAnchorElement>`. That is
|
|
12
|
-
* the same asymmetry §J.9 records for `CompactTextInput` — there the identical read on an
|
|
13
|
-
* `<input>` needs no declaration, because `InputHTMLAttributes` really does have it.
|
|
14
|
-
*
|
|
15
|
-
* Hosts: `AssetPreviewTopBar` and `BackButtonContainer`.
|
|
2
|
+
* `disabled` — greys out the back button. Not transient; present in baseline as bare boolean attribute.
|
|
16
3
|
*/
|
|
17
4
|
interface AssetPreviewTopBarDisabledStyleProps {
|
|
18
5
|
disabled?: boolean;
|
|
19
6
|
}
|
|
20
|
-
/**
|
|
7
|
+
/**
|
|
8
|
+
* Props passed by `AssetPreviewTopBar.tsx` to `<S.AssetPreviewTopBar>`.
|
|
9
|
+
*/
|
|
21
10
|
export interface AssetPreviewTopBarStyleProps extends AssetPreviewTopBarDisabledStyleProps {
|
|
22
|
-
/**
|
|
11
|
+
/** Swaps `border-bottom` between `1px solid` and `none`. */
|
|
23
12
|
$border?: boolean;
|
|
24
|
-
/**
|
|
25
|
-
* which evaluates to `false | RuleSet` — a valid `Interpolation`. A BARE
|
|
26
|
-
* `${props => props.$shadow}` would not be: `Interpolation` accepts `Falsy` but not
|
|
27
|
-
* `true`, so it would be TS2345 even with the prop correctly typed `boolean`. §J.5. */
|
|
13
|
+
/** Shadow; evaluated as `props.$shadow && props.theme.themeProp(…)` to produce valid Interpolation. */
|
|
28
14
|
$shadow?: boolean;
|
|
29
15
|
}
|
|
30
16
|
export declare const AssetPreviewTopBar: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, AssetPreviewTopBarStyleProps>, never>> & string;
|
|
@@ -5,23 +5,7 @@ type ContextMenuOwnProps = {
|
|
|
5
5
|
*/
|
|
6
6
|
children?: any;
|
|
7
7
|
/**
|
|
8
|
-
* Marks this menu as the sublevel/submenu of another context menu.
|
|
9
|
-
*
|
|
10
|
-
* NOT DECLARED BY THE OLD propTypes, so the codemod could not emit it; the widening
|
|
11
|
-
* pass reported it as a `(dynamic key)` undeclared read but cannot type it, because
|
|
12
|
-
* `S.ContextMenu` is a `styled.div` and `sublevel` is not an HTML attribute. Declared
|
|
13
|
-
* by hand so the documented usage in this file's own JSDoc and in
|
|
14
|
-
* `ContextMenu.stories.tsx:103` keeps compiling.
|
|
15
|
-
*
|
|
16
|
-
* PRE-EXISTING FINDING, DELIBERATELY NOT FIXED HERE: nothing reads it. The component
|
|
17
|
-
* strips it out of the spread —
|
|
18
|
-
* `Object.entries(props).filter(([key]) => key !== 'sublevel')` — so it reaches
|
|
19
|
-
* neither the DOM nor `ContextMenu.styled.ts`, which reads no prop at all. The
|
|
20
|
-
* sublevel placement it appears to request is actually driven by the *`Popover`*'s
|
|
21
|
-
* `contextMenuSublevel`, which the stories set on the same element. So this is a
|
|
22
|
-
* documented public prop that is a no-op. Removing it is an API break and belongs in
|
|
23
|
-
* its own commit with its own decision; keeping the declaration records the API as it
|
|
24
|
-
* is published today rather than as we wish it were.
|
|
8
|
+
* Marks this menu as the sublevel/submenu of another context menu. This is a documented public prop that is currently a no-op; removing it is an API break.
|
|
25
9
|
*/
|
|
26
10
|
sublevel?: boolean;
|
|
27
11
|
};
|
|
@@ -1,23 +1,15 @@
|
|
|
1
1
|
import type { ReactElement } from 'react';
|
|
2
2
|
/**
|
|
3
|
-
*
|
|
4
|
-
* `<S.ContextMenuItem>`: `$icon`, `$hoverColors`, `$hoverBackgroundColors` and
|
|
5
|
-
* `$openssublevel`. Value types from that file's propTypes; all optional per §J.5.
|
|
3
|
+
* Props passed by `ContextMenuItem.tsx` to `<S.ContextMenuItem>`.
|
|
6
4
|
*/
|
|
7
5
|
export interface ContextMenuItemStyleProps {
|
|
8
|
-
/**
|
|
9
|
-
* as `!props.$icon`, i.e. for presence. */
|
|
6
|
+
/** React element, read for presence only. */
|
|
10
7
|
$icon?: ReactElement<any>;
|
|
11
|
-
/**
|
|
12
|
-
* sublevel item has its own chevron in that space. Lower-case by existing convention
|
|
13
|
-
* at both ends; renaming it would be a two-file change for no type benefit. */
|
|
8
|
+
/** Selects right-hand padding (sublevel items have their own chevron). */
|
|
14
9
|
$openssublevel?: boolean;
|
|
15
|
-
/** `
|
|
16
|
-
* `[darkModeColor, lightModeColor]` hex strings. `string[]` and not
|
|
17
|
-
* `[string, string]`: the propTypes say an array of any length, which is why the
|
|
18
|
-
* template guards the array's presence and then `[0]` and `[1]` individually. */
|
|
10
|
+
/** `[darkModeColor, lightModeColor]` hex strings. */
|
|
19
11
|
$hoverColors?: string[];
|
|
20
|
-
/**
|
|
12
|
+
/** Same shape as `$hoverColors`. */
|
|
21
13
|
$hoverBackgroundColors?: string[];
|
|
22
14
|
}
|
|
23
15
|
export declare const ContextMenuItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>, ContextMenuItemStyleProps>, never>> & string;
|
package/types/components/widgets/ContextMenu/ContextMenuItemsGroup/ContextMenuItemsGroup.d.ts
CHANGED
|
@@ -2,24 +2,6 @@ import React from 'react';
|
|
|
2
2
|
type ContextMenuItemsGroupOwnProps = {
|
|
3
3
|
/**
|
|
4
4
|
* Nodes of the `ContextMenuItem` component — one, or an array.
|
|
5
|
-
*
|
|
6
|
-
* DEFECT FIXED, NOT TRANSCRIBED. The propTypes said
|
|
7
|
-
* `children: PropTypes.arrayOf(PropTypes.node)`, and the codemod faithfully rendered
|
|
8
|
-
* that as `React.ReactNode[]` — which REJECTS A SINGLE JSX CHILD, because React does not
|
|
9
|
-
* wrap one child in an array:
|
|
10
|
-
*
|
|
11
|
-
* <ContextMenuItemsGroup><ContextMenuItem title="Edit" /></ContextMenuItemsGroup>
|
|
12
|
-
*
|
|
13
|
-
* gives `children` as one element. On React 16 this was a dev-time propTypes warning
|
|
14
|
-
* only, which is how it survived — the React 16 gate is what surfaced it. Under the
|
|
15
|
-
* generated closed type it became a hard COMPILE error at every such call site, in the
|
|
16
|
-
* consumer as well as here, so faithfully reproducing the propTypes would have shipped a
|
|
17
|
-
* type that forbids the component's most obvious usage.
|
|
18
|
-
*
|
|
19
|
-
* `React.ReactNode` is the accurate type and it still admits the array form, since
|
|
20
|
-
* `ReactNode` includes `Iterable<ReactNode>`. The component only forwards `children` to
|
|
21
|
-
* `S.ContextMenuItemsGroup`, so nothing here depends on it being an array. Zero runtime
|
|
22
|
-
* change: the propTypes this replaces were already deleted by the codemod.
|
|
23
5
|
*/
|
|
24
6
|
children?: React.ReactNode;
|
|
25
7
|
};
|
|
@@ -1,28 +1,11 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* `height`
|
|
3
|
-
* fallback. `number` and not `number | string`: a string here would already render
|
|
4
|
-
* `height: 60pxpx`.
|
|
5
|
-
*
|
|
6
|
-
* NO `$`, AND THAT IS A DEFECT THAT IS ALREADY IN THE RENDER BASELINE. `height` is not a
|
|
7
|
-
* member of `HTMLAttributes<HTMLDivElement>` (which is why the read needs this
|
|
8
|
-
* declaration at all) but React DOES recognise it and renders it, so `widgets/InfoCard`
|
|
9
|
-
* in `scripts/r19-harness/baseline.json` opens with `<div height="60" class="…">`.
|
|
10
|
-
* Renaming it `$height` removes that attribute and therefore MOVES the baseline — C10
|
|
11
|
-
* work, §E.4.
|
|
2
|
+
* `height` as number (px); NO `$` prefix to preserve existing DOM baseline (already in r19-harness).
|
|
12
3
|
*/
|
|
13
4
|
export interface InfoCardContainerStyleProps {
|
|
14
5
|
height?: number;
|
|
15
6
|
}
|
|
16
7
|
/**
|
|
17
|
-
* `$isHovered`
|
|
18
|
-
* genuinely `boolean` and not derived from any prop.
|
|
19
|
-
*
|
|
20
|
-
* NOT COVERABLE BY THE RENDER GATE, and the fixture says so: it comes from `useState`, so
|
|
21
|
-
* it is `false` in every static render whatever props are passed. Both of its hosts
|
|
22
|
-
* therefore have rule blocks the baseline can never exercise — which is exactly why the
|
|
23
|
-
* type matters here more than it would on a prop a fixture pins.
|
|
24
|
-
*
|
|
25
|
-
* Hosts: `ButtonLink` and `StyledArrowIcon`.
|
|
8
|
+
* `$isHovered` from useState; not coverable by render gate (always false at baseline).
|
|
26
9
|
*/
|
|
27
10
|
interface InfoCardHoverStyleProps {
|
|
28
11
|
$isHovered?: boolean;
|
package/types/components/widgets/InstructionSeverityDisplay/InstructionSeverityDisplay.styled.d.ts
CHANGED
|
@@ -1,35 +1,25 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* Card's props
|
|
3
|
-
* Value types from that file's propTypes; all optional per §J.5.
|
|
2
|
+
* Card's props — what `InstructionSeverityDisplay.tsx` passes to `S.Card`; all optional.
|
|
4
3
|
*/
|
|
5
4
|
export interface CardStyleProps {
|
|
6
|
-
/**
|
|
7
|
-
* compares `=== 5`, and a comparison against a value outside the union is TS2367
|
|
8
|
-
* rather than a branch that never fires. */
|
|
5
|
+
/** Severity level 1-5; closed to allow === 5 comparison without TS2367. */
|
|
9
6
|
$severity?: 1 | 2 | 3 | 4 | 5;
|
|
10
|
-
/**
|
|
11
|
-
* COMPONENT is not a default here, so this stays optional. */
|
|
7
|
+
/** Show card styling; optional here even though component defaults to true. */
|
|
12
8
|
$showCard?: boolean;
|
|
13
|
-
/**
|
|
14
|
-
* `number`: the template uses it raw (`padding: ${props.$padding}`) with a
|
|
15
|
-
* `'14px 10px'` fallback, so a number would emit a unitless `padding: 8`. */
|
|
9
|
+
/** CSS padding shorthand as string, e.g. `'8px 6px'`; fallback `'14px 10px'`. */
|
|
16
10
|
$padding?: string;
|
|
17
|
-
/**
|
|
11
|
+
/** CSS colour under `body.light-theme`. */
|
|
18
12
|
$bgLight?: string;
|
|
19
|
-
/**
|
|
13
|
+
/** CSS colour under `body.dark-theme`. */
|
|
20
14
|
$bgDark?: string;
|
|
21
|
-
/** Derived
|
|
22
|
-
* and not the `string` the `thumbnail` prop is. */
|
|
15
|
+
/** Derived as `thumbnail !== undefined`; boolean not string. */
|
|
23
16
|
$hasThumbnail?: boolean;
|
|
24
17
|
}
|
|
25
18
|
/** InstructionText's props. */
|
|
26
19
|
interface InstructionTextStyleProps {
|
|
27
|
-
/**
|
|
28
|
-
* `string` for the same reason as `$padding`: it is interpolated raw. */
|
|
20
|
+
/** Font-size as string with unit, e.g. `'12px'`, `'0.875rem'`; interpolated raw. */
|
|
29
21
|
$fontSize?: string;
|
|
30
|
-
/**
|
|
31
|
-
* behind `props.$maxLines &&`, which is what keeps it valid when
|
|
32
|
-
* `strictNullChecks` is eventually turned on. */
|
|
22
|
+
/** Line-clamp count for `-webkit-line-clamp`; used only behind `props.$maxLines &&`. */
|
|
33
23
|
$maxLines?: number;
|
|
34
24
|
}
|
|
35
25
|
export declare const Card: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, CardStyleProps>, never>> & string;
|
|
@@ -1,21 +1,9 @@
|
|
|
1
1
|
/**
|
|
2
|
-
*
|
|
2
|
+
* TopBarContainer — the only component in this file that reads a prop.
|
|
3
3
|
*/
|
|
4
4
|
interface InstructionsTopBarStyleProps {
|
|
5
5
|
/**
|
|
6
|
-
*
|
|
7
|
-
* derived from any prop. Transient, so it never reaches the DOM.
|
|
8
|
-
*
|
|
9
|
-
* READ, PASSED, AND NEVERTHELESS INERT — recorded, not fixed. The rule it guards is
|
|
10
|
-
* `themeProp('background', '#634E01', getColor('signal-yellow-400'))`, character for
|
|
11
|
-
* character the same declaration as the UNCONDITIONAL one three lines above it. So
|
|
12
|
-
* whichever way `$initialHover` goes, the emitted background is identical and the
|
|
13
|
-
* conditional only ever adds a duplicate of the rule that precedes it.
|
|
14
|
-
*
|
|
15
|
-
* Deleting it is the fix, and it is not a type-only change: removing the block removes a
|
|
16
|
-
* duplicate declaration from the generated CSS and therefore moves the render baseline
|
|
17
|
-
* (§J.8). Whether the intent was a DIFFERENT hover colour is a question for whoever owns
|
|
18
|
-
* the design, not for this commit.
|
|
6
|
+
* `$initialHover` is inert: its conditional rule duplicates the unconditional one above it.
|
|
19
7
|
*/
|
|
20
8
|
$initialHover?: boolean;
|
|
21
9
|
}
|
|
@@ -1,58 +1,21 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* `height` — `PropTypes.number`, px, interpolated as `${props.height}px` with a `50px`
|
|
3
|
-
* fallback, so `number` and not `number | string`.
|
|
4
|
-
*
|
|
5
|
-
* NO `$`, AND THAT IS A DEFECT THAT IS ALREADY IN THE RENDER BASELINE. `height` is not a
|
|
6
|
-
* member of `HTMLAttributes<HTMLDivElement>` — hence the declaration — but React does
|
|
7
|
-
* recognise it and renders it, so `widgets/ProgressBar` in
|
|
8
|
-
* `scripts/r19-harness/baseline.json` opens with `<div height="50" class="…">`. Renaming
|
|
9
|
-
* it `$height` removes that attribute and MOVES the baseline — C10, §E.4.
|
|
10
|
-
*/
|
|
11
1
|
interface ProgressBarContainerStyleProps {
|
|
2
|
+
/** `height` — px, so `number`. No `$` but defect in baseline. */
|
|
12
3
|
height?: number;
|
|
13
4
|
}
|
|
14
|
-
/**
|
|
15
|
-
* `$hasLink` — `Boolean(linkText)`, so genuinely boolean and not `linkText`'s `string`.
|
|
16
|
-
*
|
|
17
|
-
* Declared for `MetricsContainer` only. `ProgressBar.tsx` also passes `$hasLink` to
|
|
18
|
-
* `PercentageIndicator`, WHICH NEVER READS IT — so per rule 2 (declare only what is
|
|
19
|
-
* actually consumed) that component gets no generic, and the pass is recorded here as the
|
|
20
|
-
* dead prop it is. It is transient, so it does not reach the DOM either way.
|
|
21
|
-
*/
|
|
22
5
|
interface ProgressBarMetricsStyleProps {
|
|
6
|
+
/** `$hasLink` — declared for MetricsContainer only; PercentageIndicator never reads it. */
|
|
23
7
|
$hasLink?: boolean;
|
|
24
8
|
}
|
|
25
|
-
/** `ProgressBarFill`, the one component here whose props are read from two places. */
|
|
26
9
|
interface ProgressBarFillStyleProps {
|
|
27
|
-
/**
|
|
28
|
-
* `type` — `PropTypes.string`, selecting a row of `colorMap`. Left as `string` rather
|
|
29
|
-
* than narrowed to the five `colorMap` keys, because `string` is what the published
|
|
30
|
-
* propTypes say; narrowing it here would invent a contract the component does not have
|
|
31
|
-
* (§E.1 rule 2). The `|| colorMap.default` fallback is what makes that safe.
|
|
32
|
-
*
|
|
33
|
-
* NO `$`, AND THAT IS A DEFECT ALREADY IN THE RENDER BASELINE — but on OTHER components.
|
|
34
|
-
* `ProgressBar.tsx` passes `type` to `InnerContainer`, `Completed` and `ProgressBarFill`
|
|
35
|
-
* alike; the first two never read it, and a string-valued `type` renders on a `<div>`,
|
|
36
|
-
* so `widgets/ProgressBar` records `<div type="success">` twice. Renaming it removes
|
|
37
|
-
* those attributes — C10, §E.4.
|
|
38
|
-
*/
|
|
10
|
+
/** `type` — left as `string` to match propTypes contract; has `colorMap.default` fallback. */
|
|
39
11
|
type?: string;
|
|
40
|
-
/** `barColor` —
|
|
41
|
-
* entirely. NO `$` either, and it is unread by any other component, so it leaks only
|
|
42
|
-
* from this one and only when a consumer passes it — no fixture does. */
|
|
12
|
+
/** `barColor` — whole CSS colour that short-circuits `colorMap`. */
|
|
43
13
|
barColor?: string;
|
|
44
|
-
/** `(completedAssets / totalAssets) * 100`, interpolated as
|
|
45
|
-
* `number`. Not rounded — the rounding is only for the label text. */
|
|
14
|
+
/** `(completedAssets / totalAssets) * 100`, interpolated as `%`. */
|
|
46
15
|
$percentage?: number;
|
|
47
16
|
}
|
|
48
|
-
/**
|
|
49
|
-
* `$isHovered` — the `Link`'s hover state from `ProgressBar.tsx`'s `useState`, so
|
|
50
|
-
* genuinely `boolean`. Like `InfoCard`'s, it is `false` in every static render, so the
|
|
51
|
-
* rule blocks it guards are unreachable from the render gate.
|
|
52
|
-
*
|
|
53
|
-
* Hosts: `ButtonLink` and `StyledArrowIcon`.
|
|
54
|
-
*/
|
|
55
17
|
interface ProgressBarHoverStyleProps {
|
|
18
|
+
/** `$isHovered` — hover state from `useState`. Hosts: `ButtonLink` and `StyledArrowIcon`. */
|
|
56
19
|
$isHovered?: boolean;
|
|
57
20
|
}
|
|
58
21
|
export declare const ProgressBar: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>>, never>, never>> & string;
|
|
@@ -1,56 +1,17 @@
|
|
|
1
|
-
/**
|
|
1
|
+
/** Card root props; what `SummaryCard.tsx` passes to `<S.SummaryCard>`. */
|
|
2
2
|
export interface SummaryCardStyleProps {
|
|
3
|
-
/**
|
|
4
|
-
* `view` — `PropTypes.string`. The template tests `=== 'compact'` twice and treats every
|
|
5
|
-
* other value as the grid view. Left as `string` rather than narrowed to
|
|
6
|
-
* `'compact' | 'grid'`: that is what the published propTypes say, and narrowing it here
|
|
7
|
-
* would invent a contract the component does not have (§E.1 rule 2). Note the asymmetry
|
|
8
|
-
* with `AssetGalleryCompactCard`'s `type`, which IS narrowed — there the propTypes
|
|
9
|
-
* really do declare a closed set.
|
|
10
|
-
*
|
|
11
|
-
* NO `$`, AND THAT IS A DEFECT ALREADY IN THE RENDER BASELINE. A string-valued `view`
|
|
12
|
-
* renders on a `<div>`, so `widgets/SummaryCard` records `<div width="300" view="grid">`
|
|
13
|
-
* and its `#compact` variant records `view="compact"`. Renaming it removes that
|
|
14
|
-
* attribute and MOVES the baseline — C10, §E.4.
|
|
15
|
-
*/
|
|
3
|
+
/** `view` as string (not narrowed to 'compact'|'grid'); NO `$` to preserve existing DOM baseline. */
|
|
16
4
|
view?: string;
|
|
17
|
-
/**
|
|
18
|
-
* `width` — `PropTypes.number`, px, interpolated as `${props.width}px` with a `100%`
|
|
19
|
-
* fallback, so `number` and not `number | string`.
|
|
20
|
-
*
|
|
21
|
-
* NO `$`, AND ALSO ALREADY IN THE BASELINE: `<div width="300" …>` on the same element.
|
|
22
|
-
* `width` is not a member of `HTMLAttributes<HTMLDivElement>` — hence the declaration —
|
|
23
|
-
* but React recognises and renders it. C10, §E.4.
|
|
24
|
-
*/
|
|
5
|
+
/** `width` as number (px); NO `$` to preserve existing DOM baseline. */
|
|
25
6
|
width?: number;
|
|
26
|
-
/** `useBorder` —
|
|
27
|
-
* default HERE (nothing but `theme` is injected by `applyDefaultTheme`), so it stays
|
|
28
|
-
* optional per §J.5. */
|
|
7
|
+
/** `useBorder` — optional here even though component defaults to false. */
|
|
29
8
|
$useBorder?: boolean;
|
|
30
9
|
}
|
|
31
|
-
/**
|
|
32
|
-
* `Gutter`, the spacer component. `SummaryCard.tsx` renders it seven times and passes
|
|
33
|
-
* `$gutter` every time.
|
|
34
|
-
*/
|
|
10
|
+
/** Gutter spacer component; rendered seven times by `SummaryCard.tsx`. */
|
|
35
11
|
interface SummaryCardGutterStyleProps {
|
|
36
|
-
/** `$gutter` —
|
|
37
|
-
* `number`. The `|| 8` fallback is unreachable from inside this library. */
|
|
12
|
+
/** `$gutter` — always a literal (4, 8, or 16) at the call sites; number. */
|
|
38
13
|
$gutter?: number;
|
|
39
|
-
/**
|
|
40
|
-
* `renderAsMargin` IS READ AND NEVER PASSED — DECLARED, NOT FIXED.
|
|
41
|
-
*
|
|
42
|
-
* None of the seven `<S.Gutter>` sites passes it and nothing else in `src` constructs
|
|
43
|
-
* this component, so the `if` branch below never runs: `margin-bottom` is never emitted
|
|
44
|
-
* and the `else` branch is what always applies. And the `else` branch is REDUNDANT with
|
|
45
|
-
* the unconditional `padding-bottom` on the line after the block, which emits the same
|
|
46
|
-
* declaration a second time — so today the whole conditional contributes nothing at all.
|
|
47
|
-
*
|
|
48
|
-
* Two separate things to fix, neither of them here: wiring up `renderAsMargin` is a
|
|
49
|
-
* feature, and deleting the dead conditional REMOVES a duplicate declaration from the
|
|
50
|
-
* generated CSS and therefore moves the baseline (§J.8). It also has NO `$`, though
|
|
51
|
-
* that part is harmless: React drops an unrecognised camelCase prop whose value is
|
|
52
|
-
* `true`, so it could not reach the DOM even if it were passed.
|
|
53
|
-
*/
|
|
14
|
+
/** `renderAsMargin` — read but never passed; conditional here is dead code. */
|
|
54
15
|
renderAsMargin?: boolean;
|
|
55
16
|
}
|
|
56
17
|
export declare const SummaryCard: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, SummaryCardStyleProps>, never>> & string;
|
|
@@ -1,25 +1,14 @@
|
|
|
1
1
|
import type { RefObject } from 'react';
|
|
2
|
-
/** The layout box this hook reports: `offsetWidth` / `offsetHeight`, in px. */
|
|
3
2
|
export interface ElementSize {
|
|
4
3
|
width: number;
|
|
5
4
|
height: number;
|
|
6
5
|
}
|
|
7
6
|
/**
|
|
8
|
-
* Tracks
|
|
7
|
+
* Tracks element offsetWidth and offsetHeight across window resizes.
|
|
9
8
|
*
|
|
10
|
-
*
|
|
11
|
-
* without a guard — passing `null` throws. The type records the existing
|
|
12
|
-
* contract rather than papering over it; adding `?.` would be a behaviour
|
|
13
|
-
* change, and this commit is type-only.
|
|
14
|
-
*
|
|
15
|
-
* NOTE FOR WHOEVER TOUCHES THIS NEXT: this hook has zero importers in `src`, is
|
|
16
|
-
* not reachable through `package.json#exports` (there is no `./hooks` entry),
|
|
17
|
-
* and a grep of the `ntb-dam` consumer finds no use of it. Playbook §A.2/C8
|
|
18
|
-
* schedules it for deletion for exactly that reason. It is typed here rather
|
|
19
|
-
* than deleted because deletion is a separate, labelled commit — but do not
|
|
20
|
-
* invest further in it before checking whether it should exist at all.
|
|
9
|
+
* Ref is required (not nullable) — the body reads ref.current without a guard.
|
|
21
10
|
*
|
|
22
11
|
* @param ref element to measure
|
|
23
|
-
* @param delayWindowResizeUpdate debounce window for the
|
|
12
|
+
* @param delayWindowResizeUpdate debounce window for the resize handler, in ms
|
|
24
13
|
*/
|
|
25
14
|
export declare function useElementSize<T extends HTMLElement = HTMLElement>(ref: RefObject<T | null>, delayWindowResizeUpdate?: number): ElementSize;
|