@atlaskit/lozenge 13.5.0 → 13.5.2
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/CHANGELOG.md +12 -0
- package/lozenge.docs.tsx +49 -0
- package/package.json +6 -5
package/CHANGELOG.md
CHANGED
package/lozenge.docs.tsx
ADDED
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import path from 'path';
|
|
2
|
+
|
|
3
|
+
import type { ComponentStructuredContentSource } from '@atlassian/structured-docs-types';
|
|
4
|
+
|
|
5
|
+
const documentation: ComponentStructuredContentSource[] = [
|
|
6
|
+
{
|
|
7
|
+
name: 'Lozenge',
|
|
8
|
+
description:
|
|
9
|
+
'A lozenge is a small visual indicator used to show status, category, or other short text labels.',
|
|
10
|
+
status: 'general-availability',
|
|
11
|
+
import: {
|
|
12
|
+
name: 'Lozenge',
|
|
13
|
+
package: '@atlaskit/lozenge',
|
|
14
|
+
type: 'default',
|
|
15
|
+
packagePath: path.resolve(__dirname),
|
|
16
|
+
packageJson: require('./package.json'),
|
|
17
|
+
},
|
|
18
|
+
usageGuidelines: [
|
|
19
|
+
'Subtle (default): for long tables and general use',
|
|
20
|
+
'Bold: use sparingly (e.g. Pipeline/Jira status)',
|
|
21
|
+
'Always combine color with a concise, accurate label',
|
|
22
|
+
'Use Badge for tallies/counts; use Tag for labels',
|
|
23
|
+
],
|
|
24
|
+
contentGuidelines: [
|
|
25
|
+
'Use clear, concise text; use accurate labels (e.g. "Error", "Warning")',
|
|
26
|
+
'Do not use for long text—lozenge is not focusable and truncation at ~200px is not accessible',
|
|
27
|
+
'Ensure text is meaningful and descriptive',
|
|
28
|
+
'Use consistent terminology across lozenges',
|
|
29
|
+
],
|
|
30
|
+
accessibilityGuidelines: [
|
|
31
|
+
'Do not rely on color alone; always pair with an accurate text label',
|
|
32
|
+
'Ensure sufficient color contrast for text readability',
|
|
33
|
+
'Do not use for long text—truncation is not accessible and lozenge is not focusable',
|
|
34
|
+
'Provide appropriate labels for screen readers',
|
|
35
|
+
'Consider color-blind users when choosing colors',
|
|
36
|
+
],
|
|
37
|
+
examples: [
|
|
38
|
+
{
|
|
39
|
+
name: 'Lozenge',
|
|
40
|
+
description: 'Lozenge example',
|
|
41
|
+
source: path.resolve(__dirname, './examples/ai/lozenge.tsx'),
|
|
42
|
+
},
|
|
43
|
+
],
|
|
44
|
+
keywords: ['lozenge', 'badge', 'label', 'status', 'indicator', 'pill'],
|
|
45
|
+
categories: ['status-indicators'],
|
|
46
|
+
},
|
|
47
|
+
];
|
|
48
|
+
|
|
49
|
+
export default documentation;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/lozenge",
|
|
3
|
-
"version": "13.5.
|
|
3
|
+
"version": "13.5.2",
|
|
4
4
|
"description": "A lozenge is a visual indicator used to highlight an item's status for quick recognition.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -53,8 +53,8 @@
|
|
|
53
53
|
"@atlaskit/analytics-next": "^11.1.0",
|
|
54
54
|
"@atlaskit/badge": "^18.4.0",
|
|
55
55
|
"@atlaskit/css": "^0.19.0",
|
|
56
|
-
"@atlaskit/ds-lib": "^
|
|
57
|
-
"@atlaskit/icon": "^
|
|
56
|
+
"@atlaskit/ds-lib": "^6.0.0",
|
|
57
|
+
"@atlaskit/icon": "^33.0.0",
|
|
58
58
|
"@atlaskit/platform-feature-flags": "^1.1.0",
|
|
59
59
|
"@atlaskit/primitives": "^18.0.0",
|
|
60
60
|
"@atlaskit/spinner": "^19.0.0",
|
|
@@ -69,13 +69,14 @@
|
|
|
69
69
|
"@af/accessibility-testing": "workspace:^",
|
|
70
70
|
"@af/integration-testing": "workspace:^",
|
|
71
71
|
"@af/visual-regression": "workspace:^",
|
|
72
|
-
"@atlaskit/docs": "^11.
|
|
73
|
-
"@atlaskit/dropdown-menu": "^16.
|
|
72
|
+
"@atlaskit/docs": "^11.7.0",
|
|
73
|
+
"@atlaskit/dropdown-menu": "^16.7.0",
|
|
74
74
|
"@atlaskit/heading": "^5.3.0",
|
|
75
75
|
"@atlaskit/link": "^3.3.0",
|
|
76
76
|
"@atlaskit/section-message": "^8.12.0",
|
|
77
77
|
"@atlassian/feature-flags-test-utils": "^1.0.0",
|
|
78
78
|
"@atlassian/ssr-tests": "workspace:^",
|
|
79
|
+
"@atlassian/structured-docs-types": "workspace:^",
|
|
79
80
|
"@testing-library/react": "^16.3.0",
|
|
80
81
|
"jscodeshift": "^17.0.0",
|
|
81
82
|
"react-dom": "^18.2.0"
|