@agentskillmania/skill-ui-shared 0.1.4 → 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (154) hide show
  1. package/README.md +27 -32
  2. package/README.zh_CN.md +46 -0
  3. package/dist/files/FilePreview.d.ts +4 -0
  4. package/dist/files/FilePreview.d.ts.map +1 -0
  5. package/dist/files/FilePreview.js +50 -0
  6. package/dist/files/FilePreview.js.map +1 -0
  7. package/dist/files/FileTabs.d.ts +3 -0
  8. package/dist/files/FileTabs.d.ts.map +1 -0
  9. package/dist/files/FileTabs.js +88 -0
  10. package/dist/files/FileTabs.js.map +1 -0
  11. package/dist/files/FileTree.d.ts +3 -0
  12. package/dist/files/FileTree.d.ts.map +1 -0
  13. package/dist/files/FileTree.js +64 -0
  14. package/dist/files/FileTree.js.map +1 -0
  15. package/dist/files/FileTypeIcon.d.ts +4 -0
  16. package/dist/files/FileTypeIcon.d.ts.map +1 -0
  17. package/dist/files/FileTypeIcon.js +26 -0
  18. package/dist/files/FileTypeIcon.js.map +1 -0
  19. package/dist/files/file-extensions.d.ts +31 -0
  20. package/dist/files/file-extensions.d.ts.map +1 -0
  21. package/dist/files/file-extensions.js +70 -0
  22. package/dist/files/file-extensions.js.map +1 -0
  23. package/dist/files/types.d.ts +49 -0
  24. package/dist/files/types.d.ts.map +1 -0
  25. package/dist/files/types.js +7 -0
  26. package/dist/files/types.js.map +1 -0
  27. package/dist/index.d.ts +18 -11
  28. package/dist/index.d.ts.map +1 -1
  29. package/dist/index.js +20 -14
  30. package/dist/index.js.map +1 -1
  31. package/dist/locales/en-US.d.ts +4 -5
  32. package/dist/locales/en-US.d.ts.map +1 -1
  33. package/dist/locales/en-US.js +4 -5
  34. package/dist/locales/en-US.js.map +1 -1
  35. package/dist/locales/index.d.ts +8 -10
  36. package/dist/locales/index.d.ts.map +1 -1
  37. package/dist/locales/zh-CN.d.ts +4 -5
  38. package/dist/locales/zh-CN.d.ts.map +1 -1
  39. package/dist/locales/zh-CN.js +4 -5
  40. package/dist/locales/zh-CN.js.map +1 -1
  41. package/dist/tsconfig.tsbuildinfo +1 -1
  42. package/dist/utils/format.d.ts +3 -23
  43. package/dist/utils/format.d.ts.map +1 -1
  44. package/dist/utils/format.js +15 -60
  45. package/dist/utils/format.js.map +1 -1
  46. package/package.json +4 -2
  47. package/dist/components/CollapsibleCard.d.ts +0 -22
  48. package/dist/components/CollapsibleCard.d.ts.map +0 -1
  49. package/dist/components/CollapsibleCard.js +0 -30
  50. package/dist/components/CollapsibleCard.js.map +0 -1
  51. package/dist/components/CopyValue.d.ts +0 -12
  52. package/dist/components/CopyValue.d.ts.map +0 -1
  53. package/dist/components/CopyValue.js +0 -39
  54. package/dist/components/CopyValue.js.map +0 -1
  55. package/dist/components/ExpandableItem.d.ts +0 -29
  56. package/dist/components/ExpandableItem.d.ts.map +0 -1
  57. package/dist/components/ExpandableItem.js +0 -28
  58. package/dist/components/ExpandableItem.js.map +0 -1
  59. package/dist/components/ExpandableRow.d.ts +0 -35
  60. package/dist/components/ExpandableRow.d.ts.map +0 -1
  61. package/dist/components/ExpandableRow.js +0 -69
  62. package/dist/components/ExpandableRow.js.map +0 -1
  63. package/dist/components/InfoRow.d.ts +0 -15
  64. package/dist/components/InfoRow.d.ts.map +0 -1
  65. package/dist/components/InfoRow.js +0 -27
  66. package/dist/components/InfoRow.js.map +0 -1
  67. package/dist/components/MetricTile.d.ts +0 -15
  68. package/dist/components/MetricTile.d.ts.map +0 -1
  69. package/dist/components/MetricTile.js +0 -32
  70. package/dist/components/MetricTile.js.map +0 -1
  71. package/dist/components/PaginationBar.d.ts +0 -17
  72. package/dist/components/PaginationBar.d.ts.map +0 -1
  73. package/dist/components/PaginationBar.js +0 -19
  74. package/dist/components/PaginationBar.js.map +0 -1
  75. package/dist/components/SectionHeader.d.ts +0 -15
  76. package/dist/components/SectionHeader.d.ts.map +0 -1
  77. package/dist/components/SectionHeader.js +0 -34
  78. package/dist/components/SectionHeader.js.map +0 -1
  79. package/dist/components/SectionLabel.d.ts +0 -10
  80. package/dist/components/SectionLabel.d.ts.map +0 -1
  81. package/dist/components/SectionLabel.js +0 -22
  82. package/dist/components/SectionLabel.js.map +0 -1
  83. package/dist/components/SplitDivider.d.ts +0 -13
  84. package/dist/components/SplitDivider.d.ts.map +0 -1
  85. package/dist/components/SplitDivider.js +0 -73
  86. package/dist/components/SplitDivider.js.map +0 -1
  87. package/dist/components/StatusDot.d.ts +0 -11
  88. package/dist/components/StatusDot.d.ts.map +0 -1
  89. package/dist/components/StatusDot.js +0 -21
  90. package/dist/components/StatusDot.js.map +0 -1
  91. package/dist/components/index.d.ts +0 -27
  92. package/dist/components/index.d.ts.map +0 -1
  93. package/dist/components/index.js +0 -14
  94. package/dist/components/index.js.map +0 -1
  95. package/dist/components/sidebar/Sidebar.d.ts +0 -21
  96. package/dist/components/sidebar/Sidebar.d.ts.map +0 -1
  97. package/dist/components/sidebar/Sidebar.js +0 -41
  98. package/dist/components/sidebar/Sidebar.js.map +0 -1
  99. package/dist/components/sidebar/SidebarIcons.d.ts +0 -25
  100. package/dist/components/sidebar/SidebarIcons.d.ts.map +0 -1
  101. package/dist/components/sidebar/SidebarIcons.js +0 -65
  102. package/dist/components/sidebar/SidebarIcons.js.map +0 -1
  103. package/dist/components/sidebar/SidebarPanel.d.ts +0 -13
  104. package/dist/components/sidebar/SidebarPanel.d.ts.map +0 -1
  105. package/dist/components/sidebar/SidebarPanel.js +0 -32
  106. package/dist/components/sidebar/SidebarPanel.js.map +0 -1
  107. package/dist/components/sidebar/index.d.ts +0 -7
  108. package/dist/components/sidebar/index.d.ts.map +0 -1
  109. package/dist/components/sidebar/index.js +0 -4
  110. package/dist/components/sidebar/index.js.map +0 -1
  111. package/dist/hooks/index.d.ts +0 -5
  112. package/dist/hooks/index.d.ts.map +0 -1
  113. package/dist/hooks/index.js +0 -3
  114. package/dist/hooks/index.js.map +0 -1
  115. package/dist/hooks/useResize.d.ts +0 -28
  116. package/dist/hooks/useResize.d.ts.map +0 -1
  117. package/dist/hooks/useResize.js +0 -39
  118. package/dist/hooks/useResize.js.map +0 -1
  119. package/dist/hooks/useToggle.d.ts +0 -17
  120. package/dist/hooks/useToggle.d.ts.map +0 -1
  121. package/dist/hooks/useToggle.js +0 -14
  122. package/dist/hooks/useToggle.js.map +0 -1
  123. package/dist/styles/card.d.ts +0 -12
  124. package/dist/styles/card.d.ts.map +0 -1
  125. package/dist/styles/card.js +0 -39
  126. package/dist/styles/card.js.map +0 -1
  127. package/dist/styles/empty-text.d.ts +0 -7
  128. package/dist/styles/empty-text.d.ts.map +0 -1
  129. package/dist/styles/empty-text.js +0 -13
  130. package/dist/styles/empty-text.js.map +0 -1
  131. package/dist/styles/expandable.d.ts +0 -12
  132. package/dist/styles/expandable.d.ts.map +0 -1
  133. package/dist/styles/expandable.js +0 -34
  134. package/dist/styles/expandable.js.map +0 -1
  135. package/dist/styles/index.d.ts +0 -5
  136. package/dist/styles/index.d.ts.map +0 -1
  137. package/dist/styles/index.js +0 -5
  138. package/dist/styles/index.js.map +0 -1
  139. package/dist/styles/metric.d.ts +0 -12
  140. package/dist/styles/metric.d.ts.map +0 -1
  141. package/dist/styles/metric.js +0 -26
  142. package/dist/styles/metric.js.map +0 -1
  143. package/dist/utils/avatar-color.d.ts +0 -32
  144. package/dist/utils/avatar-color.d.ts.map +0 -1
  145. package/dist/utils/avatar-color.js +0 -31
  146. package/dist/utils/avatar-color.js.map +0 -1
  147. package/dist/utils/fonts.d.ts +0 -6
  148. package/dist/utils/fonts.d.ts.map +0 -1
  149. package/dist/utils/fonts.js +0 -6
  150. package/dist/utils/fonts.js.map +0 -1
  151. package/dist/utils/pagination.d.ts +0 -6
  152. package/dist/utils/pagination.d.ts.map +0 -1
  153. package/dist/utils/pagination.js +0 -6
  154. package/dist/utils/pagination.js.map +0 -1
@@ -1,19 +0,0 @@
1
- import { jsx as _jsx } from "@emotion/react/jsx-runtime";
2
- /** @jsxImportSource @emotion/react */
3
- import { css } from '@emotion/react';
4
- import { Pagination } from 'antd';
5
- const barStyle = css `
6
- margin-top: 24px;
7
- display: flex;
8
- justify-content: flex-end;
9
- `;
10
- /**
11
- * PaginationBar — antd Pagination hidden when total fits within a single page,
12
- * wrapped in a right-aligned container with consistent top spacing.
13
- */
14
- export function PaginationBar({ current, pageSize, total, onChange }) {
15
- if (total <= pageSize)
16
- return null;
17
- return (_jsx("div", { css: barStyle, children: _jsx(Pagination, { current: current, pageSize: pageSize, total: total, onChange: onChange }) }));
18
- }
19
- //# sourceMappingURL=PaginationBar.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"PaginationBar.js","sourceRoot":"","sources":["../../src/components/PaginationBar.tsx"],"names":[],"mappings":";AAAA,sCAAsC;AACtC,OAAO,EAAE,GAAG,EAAE,MAAM,gBAAgB,CAAC;AACrC,OAAO,EAAE,UAAU,EAAE,MAAM,MAAM,CAAC;AAclC,MAAM,QAAQ,GAAG,GAAG,CAAA;;;;CAInB,CAAC;AAEF;;;GAGG;AACH,MAAM,UAAU,aAAa,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAsB;IACtF,IAAI,KAAK,IAAI,QAAQ;QAAE,OAAO,IAAI,CAAC;IACnC,OAAO,CACL,cAAK,GAAG,EAAE,QAAQ,YAChB,KAAC,UAAU,IAAC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,GAAI,GAClF,CACP,CAAC;AACJ,CAAC"}
@@ -1,15 +0,0 @@
1
- import type { LucideIcon } from 'lucide-react';
2
- import type { ReactNode } from 'react';
3
- export interface SectionHeaderProps {
4
- /** Section icon (rendered at 14px). */
5
- icon: LucideIcon;
6
- /** Section label (rendered uppercase via CSS). */
7
- title: string;
8
- /** Right-aligned extra content. */
9
- extra?: ReactNode;
10
- /** Optional explicit icon color. Defaults to inheriting from container (textSecondary). */
11
- iconColor?: string;
12
- }
13
- /** Renders a section header with icon, uppercase title, and optional extra content. */
14
- export declare function SectionHeader({ icon: Icon, title, extra, iconColor }: SectionHeaderProps): import("@emotion/react/jsx-runtime").JSX.Element;
15
- //# sourceMappingURL=SectionHeader.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SectionHeader.d.ts","sourceRoot":"","sources":["../../src/components/SectionHeader.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC/C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,kBAAkB;IACjC,uCAAuC;IACvC,IAAI,EAAE,UAAU,CAAC;IACjB,kDAAkD;IAClD,KAAK,EAAE,MAAM,CAAC;IACd,mCAAmC;IACnC,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,2FAA2F;IAC3F,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,uFAAuF;AACvF,wBAAgB,aAAa,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,kBAAkB,oDAoDxF"}
@@ -1,34 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
2
- import { useTheme } from '@agentskillmania/skill-ui-theme';
3
- import { css } from '@emotion/react';
4
- /** Renders a section header with icon, uppercase title, and optional extra content. */
5
- export function SectionHeader({ icon: Icon, title, extra, iconColor }) {
6
- const theme = useTheme();
7
- return (_jsxs("div", { css: css `
8
- display: flex;
9
- align-items: center;
10
- gap: ${theme.spacing[1]};
11
- padding: ${theme.spacing[1]} 0;
12
- font-size: ${theme.font.size.xs};
13
- font-weight: ${theme.font.weight.bold};
14
- text-transform: uppercase;
15
- letter-spacing: 0.5px;
16
- color: ${theme.color.textSecondary};
17
- `, children: [_jsx(Icon, { size: 14, css: iconColor
18
- ? css `
19
- color: ${iconColor};
20
- flex-shrink: 0;
21
- `
22
- : css `
23
- flex-shrink: 0;
24
- ` }), title, _jsx("div", { css: css `
25
- flex: 1;
26
- height: 1px;
27
- background: ${theme.color.borderSecondary};
28
- ` }), extra && (_jsx("span", { "data-testid": "section-extra", css: css `
29
- margin-left: auto;
30
- font-size: ${theme.font.size.xs};
31
- color: ${theme.color.textTertiary};
32
- `, children: extra }))] }));
33
- }
34
- //# sourceMappingURL=SectionHeader.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SectionHeader.js","sourceRoot":"","sources":["../../src/components/SectionHeader.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAC3D,OAAO,EAAE,GAAG,EAAE,MAAM,gBAAgB,CAAC;AAerC,uFAAuF;AACvF,MAAM,UAAU,aAAa,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAsB;IACvF,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IAEzB,OAAO,CACL,eACE,GAAG,EAAE,GAAG,CAAA;;;eAGC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;mBACZ,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;qBACd,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;uBAChB,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI;;;iBAG5B,KAAK,CAAC,KAAK,CAAC,aAAa;OACnC,aAED,KAAC,IAAI,IACH,IAAI,EAAE,EAAE,EACR,GAAG,EACD,SAAS;oBACP,CAAC,CAAC,GAAG,CAAA;yBACQ,SAAS;;eAEnB;oBACH,CAAC,CAAC,GAAG,CAAA;;eAEF,GAEP,EACD,KAAK,EACN,cACE,GAAG,EAAE,GAAG,CAAA;;;wBAGQ,KAAK,CAAC,KAAK,CAAC,eAAe;SAC1C,GACD,EACD,KAAK,IAAI,CACR,8BACc,eAAe,EAC3B,GAAG,EAAE,GAAG,CAAA;;yBAEO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;qBACtB,KAAK,CAAC,KAAK,CAAC,YAAY;WAClC,YAEA,KAAK,GACD,CACR,IACG,CACP,CAAC;AACJ,CAAC"}
@@ -1,10 +0,0 @@
1
- /** Props for the SectionLabel component. */
2
- export interface SectionLabelProps {
3
- children: React.ReactNode;
4
- }
5
- /**
6
- * SectionLabel — muted uppercase label above a content block.
7
- * Canonical style: xs, semibold, textSecondary, uppercase, 0.3px letter-spacing.
8
- */
9
- export declare function SectionLabel({ children }: SectionLabelProps): import("@emotion/react/jsx-runtime").JSX.Element;
10
- //# sourceMappingURL=SectionLabel.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SectionLabel.d.ts","sourceRoot":"","sources":["../../src/components/SectionLabel.tsx"],"names":[],"mappings":"AAIA,4CAA4C;AAC5C,MAAM,WAAW,iBAAiB;IAChC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAYD;;;GAGG;AACH,wBAAgB,YAAY,CAAC,EAAE,QAAQ,EAAE,EAAE,iBAAiB,oDAG3D"}
@@ -1,22 +0,0 @@
1
- import { jsx as _jsx } from "@emotion/react/jsx-runtime";
2
- /** @jsxImportSource @emotion/react */
3
- import { useTheme } from '@agentskillmania/skill-ui-theme';
4
- import { css } from '@emotion/react';
5
- /** Canonical section label style — uppercase muted label. */
6
- const labelStyle = (theme) => css `
7
- font-size: ${theme.font.size.xs};
8
- font-weight: ${theme.font.weight.semibold};
9
- color: ${theme.color.textSecondary};
10
- text-transform: uppercase;
11
- letter-spacing: 0.3px;
12
- margin-bottom: ${theme.spacing[1]};
13
- `;
14
- /**
15
- * SectionLabel — muted uppercase label above a content block.
16
- * Canonical style: xs, semibold, textSecondary, uppercase, 0.3px letter-spacing.
17
- */
18
- export function SectionLabel({ children }) {
19
- const theme = useTheme();
20
- return _jsx("div", { css: labelStyle(theme), children: children });
21
- }
22
- //# sourceMappingURL=SectionLabel.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SectionLabel.js","sourceRoot":"","sources":["../../src/components/SectionLabel.tsx"],"names":[],"mappings":";AAAA,sCAAsC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAC3D,OAAO,EAAE,GAAG,EAAE,MAAM,gBAAgB,CAAC;AAOrC,6DAA6D;AAC7D,MAAM,UAAU,GAAG,CAAC,KAAkC,EAAE,EAAE,CAAC,GAAG,CAAA;eAC/C,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;iBAChB,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,QAAQ;WAChC,KAAK,CAAC,KAAK,CAAC,aAAa;;;mBAGjB,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;CAClC,CAAC;AAEF;;;GAGG;AACH,MAAM,UAAU,YAAY,CAAC,EAAE,QAAQ,EAAqB;IAC1D,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,OAAO,cAAK,GAAG,EAAE,UAAU,CAAC,KAAK,CAAC,YAAG,QAAQ,GAAO,CAAC;AACvD,CAAC"}
@@ -1,13 +0,0 @@
1
- export interface SplitDividerProps {
2
- /** Called when drag ends with new sidebar width. */
3
- onResize: (width: number) => void;
4
- /** Disable drag interaction. */
5
- disabled?: boolean;
6
- /** Min pane width (default: 160). */
7
- minWidth?: number;
8
- /** Max pane width (default: window.innerWidth * 0.85). */
9
- maxWidth?: number;
10
- }
11
- /** Renders a 4px draggable vertical divider. */
12
- export declare function SplitDivider({ onResize, disabled, minWidth, maxWidth, }: SplitDividerProps): import("@emotion/react/jsx-runtime").JSX.Element;
13
- //# sourceMappingURL=SplitDivider.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SplitDivider.d.ts","sourceRoot":"","sources":["../../src/components/SplitDivider.tsx"],"names":[],"mappings":"AAIA,MAAM,WAAW,iBAAiB;IAChC,oDAAoD;IACpD,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,gCAAgC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,qCAAqC;IACrC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,gDAAgD;AAChD,wBAAgB,YAAY,CAAC,EAC3B,QAAQ,EACR,QAAgB,EAChB,QAAc,EACd,QAA0E,GAC3E,EAAE,iBAAiB,oDAoFnB"}
@@ -1,73 +0,0 @@
1
- import { jsx as _jsx } from "@emotion/react/jsx-runtime";
2
- import { useTheme } from '@agentskillmania/skill-ui-theme';
3
- import { css } from '@emotion/react';
4
- import { useCallback, useEffect, useRef } from 'react';
5
- /** Renders a 4px draggable vertical divider. */
6
- export function SplitDivider({ onResize, disabled = false, minWidth = 160, maxWidth = typeof window !== 'undefined' ? window.innerWidth * 0.85 : 1200, }) {
7
- const theme = useTheme();
8
- // UI12: drag state lives in refs so the effect can read the latest values
9
- // without re-registering listeners on every change. The effect cleanup
10
- // guarantees listeners are removed on unmount even if mouseup never fires.
11
- const dragState = useRef(null);
12
- const handleMouseDown = useCallback((e) => {
13
- if (disabled)
14
- return;
15
- const divider = e.currentTarget;
16
- const sidebar = divider.nextElementSibling;
17
- if (!sidebar)
18
- return;
19
- sidebar.classList.add('dragging');
20
- document.body.style.cursor = 'col-resize';
21
- dragState.current = {
22
- sidebar,
23
- startX: e.clientX,
24
- startWidth: sidebar.offsetWidth,
25
- };
26
- }, [disabled]);
27
- useEffect(() => {
28
- const handleMouseMove = (ev) => {
29
- const ds = dragState.current;
30
- if (!ds?.sidebar)
31
- return;
32
- const delta = ds.startX - ev.clientX;
33
- const newWidth = Math.max(minWidth, Math.min(maxWidth, ds.startWidth + delta));
34
- ds.sidebar.style.width = `${newWidth}px`;
35
- };
36
- const handleMouseUp = () => {
37
- const ds = dragState.current;
38
- if (!ds?.sidebar)
39
- return;
40
- document.body.style.cursor = '';
41
- ds.sidebar.classList.remove('dragging');
42
- onResize(ds.sidebar.offsetWidth);
43
- // 把宽度交还给 React/emotion 驱动:内联样式优先级高于 class,
44
- // 残留会导致折叠(42px class)被永久压制
45
- ds.sidebar.style.width = '';
46
- dragState.current = null;
47
- };
48
- document.addEventListener('mousemove', handleMouseMove);
49
- document.addEventListener('mouseup', handleMouseUp);
50
- return () => {
51
- document.removeEventListener('mousemove', handleMouseMove);
52
- document.removeEventListener('mouseup', handleMouseUp);
53
- // Restore cursor if unmounting mid-drag
54
- if (dragState.current) {
55
- document.body.style.cursor = '';
56
- dragState.current.sidebar?.classList.remove('dragging');
57
- dragState.current = null;
58
- }
59
- };
60
- }, [onResize, minWidth, maxWidth]);
61
- return (_jsx("div", { onMouseDown: handleMouseDown, css: css `
62
- width: 4px;
63
- background: transparent;
64
- cursor: ${disabled ? 'default' : 'col-resize'};
65
- position: relative;
66
- flex-shrink: 0;
67
- transition: background ${theme.motion.duration.fast};
68
- &:hover {
69
- background: ${disabled ? 'transparent' : theme.color.borderHover};
70
- }
71
- ` }));
72
- }
73
- //# sourceMappingURL=SplitDivider.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SplitDivider.js","sourceRoot":"","sources":["../../src/components/SplitDivider.tsx"],"names":[],"mappings":"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"}
@@ -1,11 +0,0 @@
1
- /** Props for the StatusDot component. */
2
- export interface StatusDotProps {
3
- /** Whether the status is active/enabled. Defaults to true. */
4
- enabled?: boolean;
5
- }
6
- /**
7
- * StatusDot — small colored circle indicating enabled/disabled state.
8
- * Green for enabled, muted gray for disabled.
9
- */
10
- export declare function StatusDot({ enabled }: StatusDotProps): import("@emotion/react/jsx-runtime").JSX.Element;
11
- //# sourceMappingURL=StatusDot.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"StatusDot.d.ts","sourceRoot":"","sources":["../../src/components/StatusDot.tsx"],"names":[],"mappings":"AAIA,yCAAyC;AACzC,MAAM,WAAW,cAAc;IAC7B,8DAA8D;IAC9D,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAWD;;;GAGG;AACH,wBAAgB,SAAS,CAAC,EAAE,OAAc,EAAE,EAAE,cAAc,oDAG3D"}
@@ -1,21 +0,0 @@
1
- import { jsx as _jsx } from "@emotion/react/jsx-runtime";
2
- /** @jsxImportSource @emotion/react */
3
- import { useTheme } from '@agentskillmania/skill-ui-theme';
4
- import { css } from '@emotion/react';
5
- /** Status dot style — 5px circle indicating enabled/disabled state. */
6
- const dotStyle = (theme, enabled) => css `
7
- width: 5px;
8
- height: 5px;
9
- border-radius: 50%;
10
- flex-shrink: 0;
11
- background: ${enabled ? theme.color.success : theme.color.textQuaternary};
12
- `;
13
- /**
14
- * StatusDot — small colored circle indicating enabled/disabled state.
15
- * Green for enabled, muted gray for disabled.
16
- */
17
- export function StatusDot({ enabled = true }) {
18
- const theme = useTheme();
19
- return _jsx("div", { css: dotStyle(theme, enabled) });
20
- }
21
- //# sourceMappingURL=StatusDot.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"StatusDot.js","sourceRoot":"","sources":["../../src/components/StatusDot.tsx"],"names":[],"mappings":";AAAA,sCAAsC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAC3D,OAAO,EAAE,GAAG,EAAE,MAAM,gBAAgB,CAAC;AAQrC,uEAAuE;AACvE,MAAM,QAAQ,GAAG,CAAC,KAAkC,EAAE,OAAgB,EAAE,EAAE,CAAC,GAAG,CAAA;;;;;gBAK9D,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,cAAc;CACzE,CAAC;AAEF;;;GAGG;AACH,MAAM,UAAU,SAAS,CAAC,EAAE,OAAO,GAAG,IAAI,EAAkB;IAC1D,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,OAAO,cAAK,GAAG,EAAE,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAC,GAAI,CAAC;AAChD,CAAC"}
@@ -1,27 +0,0 @@
1
- export { SectionHeader } from './SectionHeader.js';
2
- export type { SectionHeaderProps } from './SectionHeader.js';
3
- export { EmptyState } from './EmptyState.js';
4
- export type { EmptyStateProps } from './EmptyState.js';
5
- export { ExpandableItem } from './ExpandableItem.js';
6
- export type { ExpandableItemProps, ExpandableItemContext } from './ExpandableItem.js';
7
- export { CollapsibleCard } from './CollapsibleCard.js';
8
- export type { CollapsibleCardProps } from './CollapsibleCard.js';
9
- export { SplitDivider } from './SplitDivider.js';
10
- export type { SplitDividerProps } from './SplitDivider.js';
11
- export { Sidebar, SidebarPanel, SidebarIcons } from './sidebar/index.js';
12
- export type { SidebarProps, SidebarPanelProps, SidebarIconsProps, SidebarIconItem, } from './sidebar/index.js';
13
- export { MetricTile } from './MetricTile.js';
14
- export type { MetricTileProps } from './MetricTile.js';
15
- export { SectionLabel } from './SectionLabel.js';
16
- export type { SectionLabelProps } from './SectionLabel.js';
17
- export { StatusDot } from './StatusDot.js';
18
- export type { StatusDotProps } from './StatusDot.js';
19
- export { CopyValue } from './CopyValue.js';
20
- export type { CopyValueProps } from './CopyValue.js';
21
- export { InfoRow } from './InfoRow.js';
22
- export type { InfoRowProps } from './InfoRow.js';
23
- export { ExpandableRow } from './ExpandableRow.js';
24
- export type { ExpandableRowProps, DetailVariant } from './ExpandableRow.js';
25
- export { PaginationBar } from './PaginationBar.js';
26
- export type { PaginationBarProps } from './PaginationBar.js';
27
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,YAAY,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAC7D,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,YAAY,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AACvD,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,YAAY,EAAE,mBAAmB,EAAE,qBAAqB,EAAE,MAAM,qBAAqB,CAAC;AACtF,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACvD,YAAY,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,YAAY,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAC3D,OAAO,EAAE,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AACzE,YAAY,EACV,YAAY,EACZ,iBAAiB,EACjB,iBAAiB,EACjB,eAAe,GAChB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,YAAY,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AACvD,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,YAAY,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAC3D,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,YAAY,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AACrD,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,YAAY,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AACrD,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,YAAY,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,YAAY,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAC5E,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,YAAY,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC"}
@@ -1,14 +0,0 @@
1
- export { SectionHeader } from './SectionHeader.js';
2
- export { EmptyState } from './EmptyState.js';
3
- export { ExpandableItem } from './ExpandableItem.js';
4
- export { CollapsibleCard } from './CollapsibleCard.js';
5
- export { SplitDivider } from './SplitDivider.js';
6
- export { Sidebar, SidebarPanel, SidebarIcons } from './sidebar/index.js';
7
- export { MetricTile } from './MetricTile.js';
8
- export { SectionLabel } from './SectionLabel.js';
9
- export { StatusDot } from './StatusDot.js';
10
- export { CopyValue } from './CopyValue.js';
11
- export { InfoRow } from './InfoRow.js';
12
- export { ExpandableRow } from './ExpandableRow.js';
13
- export { PaginationBar } from './PaginationBar.js';
14
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAEnD,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE7C,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAErD,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAEvD,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjD,OAAO,EAAE,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAOzE,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE7C,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjD,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAE3C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAE3C,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAEnD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC"}
@@ -1,21 +0,0 @@
1
- import type { ReactNode } from 'react';
2
- import type { SidebarIconItem } from './SidebarIcons.js';
3
- export interface SidebarProps {
4
- /** Sidebar width in pixels (ignored when collapsed). */
5
- width: number;
6
- /** Whether sidebar is collapsed to icon-only. */
7
- isCollapsed: boolean;
8
- /** Currently active panel key. */
9
- activePanel: string;
10
- /** Icon items for the icon bar. */
11
- items?: SidebarIconItem[];
12
- /** Toggle collapse/expand. */
13
- onToggleCollapse: () => void;
14
- /** Switch active panel. */
15
- onSwitchPanel: (panel: string) => void;
16
- /** Panel content (wrapped in SidebarPanel). */
17
- children: ReactNode;
18
- }
19
- /** Renders a right-side collapsible sidebar with panel content and icon bar. */
20
- export declare const Sidebar: import("react").NamedExoticComponent<SidebarProps>;
21
- //# sourceMappingURL=Sidebar.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Sidebar.d.ts","sourceRoot":"","sources":["../../../src/components/sidebar/Sidebar.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEzD,MAAM,WAAW,YAAY;IAC3B,wDAAwD;IACxD,KAAK,EAAE,MAAM,CAAC;IACd,iDAAiD;IACjD,WAAW,EAAE,OAAO,CAAC;IACrB,kCAAkC;IAClC,WAAW,EAAE,MAAM,CAAC;IACpB,mCAAmC;IACnC,KAAK,CAAC,EAAE,eAAe,EAAE,CAAC;IAC1B,8BAA8B;IAC9B,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,2BAA2B;IAC3B,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,+CAA+C;IAC/C,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,gFAAgF;AAChF,eAAO,MAAM,OAAO,oDA+DlB,CAAC"}
@@ -1,41 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
2
- import { useTheme } from '@agentskillmania/skill-ui-theme';
3
- import { css } from '@emotion/react';
4
- import { memo } from 'react';
5
- import { SidebarIcons } from './SidebarIcons.js';
6
- /** Renders a right-side collapsible sidebar with panel content and icon bar. */
7
- export const Sidebar = memo(function Sidebar({ width, isCollapsed, activePanel, items = [], onToggleCollapse, onSwitchPanel, children, }) {
8
- const theme = useTheme();
9
- return (_jsxs("div", { className: isCollapsed ? 'collapsed' : '', css: css `
10
- display: flex;
11
- border-left: 1px solid ${theme.color.border};
12
- background: ${theme.color.bgBase};
13
- overflow: hidden;
14
- width: ${isCollapsed ? '42px' : `${width}px`};
15
- min-width: ${isCollapsed ? '42px' : '160px'};
16
- transition: width ${theme.motion.duration.normal} ${theme.motion.easing.out};
17
- &.dragging {
18
- transition: none;
19
- }
20
- `, children: [_jsx("div", { css: css `
21
- flex: 1;
22
- display: flex;
23
- flex-direction: column;
24
- overflow: hidden;
25
- transition:
26
- opacity ${theme.motion.duration.fast} ${theme.motion.easing.out},
27
- transform ${theme.motion.duration.fast} ${theme.motion.easing.out};
28
- ${isCollapsed
29
- ? css `
30
- opacity: 0;
31
- transform: translateX(${theme.spacing[3]});
32
- pointer-events: none;
33
- width: 0;
34
- `
35
- : css `
36
- opacity: 1;
37
- transform: translateX(0);
38
- `}
39
- `, children: children }), _jsx(SidebarIcons, { items: items, activeId: activePanel, isCollapsed: isCollapsed, onToggleCollapse: onToggleCollapse, onSwitchPanel: onSwitchPanel })] }));
40
- });
41
- //# sourceMappingURL=Sidebar.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Sidebar.js","sourceRoot":"","sources":["../../../src/components/sidebar/Sidebar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAC3D,OAAO,EAAE,GAAG,EAAE,MAAM,gBAAgB,CAAC;AACrC,OAAO,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AAG7B,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAoBjD,gFAAgF;AAChF,MAAM,CAAC,MAAM,OAAO,GAAG,IAAI,CAAC,SAAS,OAAO,CAAC,EAC3C,KAAK,EACL,WAAW,EACX,WAAW,EACX,KAAK,GAAG,EAAE,EACV,gBAAgB,EAChB,aAAa,EACb,QAAQ,GACK;IACb,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IAEzB,OAAO,CACL,eACE,SAAS,EAAE,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,EACzC,GAAG,EAAE,GAAG,CAAA;;iCAEmB,KAAK,CAAC,KAAK,CAAC,MAAM;sBAC7B,KAAK,CAAC,KAAK,CAAC,MAAM;;iBAEvB,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,KAAK,IAAI;qBAC/B,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO;4BACvB,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,IAAI,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,GAAG;;;;OAI5E,aAGD,cACE,GAAG,EAAE,GAAG,CAAA;;;;;;sBAMM,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,IAAI,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,GAAG;wBACnD,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,IAAI,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,GAAG;YACjE,WAAW;oBACX,CAAC,CAAC,GAAG,CAAA;;wCAEuB,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;;;eAGzC;oBACH,CAAC,CAAC,GAAG,CAAA;;;eAGF;SACN,YAEA,QAAQ,GACL,EAGN,KAAC,YAAY,IACX,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,WAAW,EACrB,WAAW,EAAE,WAAW,EACxB,gBAAgB,EAAE,gBAAgB,EAClC,aAAa,EAAE,aAAa,GAC5B,IACE,CACP,CAAC;AACJ,CAAC,CAAC,CAAC"}
@@ -1,25 +0,0 @@
1
- import type { LucideIcon } from 'lucide-react';
2
- /** Configuration for a single icon button in the bar. */
3
- export interface SidebarIconItem {
4
- /** Unique panel identifier. */
5
- id: string;
6
- /** Icon component to render. */
7
- icon: LucideIcon;
8
- /** Accessible label / tooltip text. */
9
- label: string;
10
- }
11
- export interface SidebarIconsProps {
12
- /** Icon items to display (excluding collapse button). */
13
- items: SidebarIconItem[];
14
- /** Currently active panel key. */
15
- activeId: string;
16
- /** Whether sidebar is collapsed. */
17
- isCollapsed: boolean;
18
- /** Toggle collapse/expand. */
19
- onToggleCollapse: () => void;
20
- /** Switch active panel. */
21
- onSwitchPanel: (id: string) => void;
22
- }
23
- /** Renders a vertical icon bar with collapse toggle and panel switch buttons. */
24
- export declare const SidebarIcons: import("react").NamedExoticComponent<SidebarIconsProps>;
25
- //# sourceMappingURL=SidebarIcons.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SidebarIcons.d.ts","sourceRoot":"","sources":["../../../src/components/sidebar/SidebarIcons.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAM/C,yDAAyD;AACzD,MAAM,WAAW,eAAe;IAC9B,+BAA+B;IAC/B,EAAE,EAAE,MAAM,CAAC;IACX,gCAAgC;IAChC,IAAI,EAAE,UAAU,CAAC;IACjB,uCAAuC;IACvC,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,iBAAiB;IAChC,yDAAyD;IACzD,KAAK,EAAE,eAAe,EAAE,CAAC;IACzB,kCAAkC;IAClC,QAAQ,EAAE,MAAM,CAAC;IACjB,oCAAoC;IACpC,WAAW,EAAE,OAAO,CAAC;IACrB,8BAA8B;IAC9B,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,2BAA2B;IAC3B,aAAa,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACrC;AAED,iFAAiF;AACjF,eAAO,MAAM,YAAY,yDAqFvB,CAAC"}
@@ -1,65 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
2
- import { useTheme } from '@agentskillmania/skill-ui-theme';
3
- import { css } from '@emotion/react';
4
- import { Tooltip } from 'antd';
5
- import { ChevronLeft, ChevronRight } from 'lucide-react';
6
- import { memo } from 'react';
7
- import { useTranslation } from 'react-i18next';
8
- import { NAMESPACE } from '../../locales/index.js';
9
- /** Renders a vertical icon bar with collapse toggle and panel switch buttons. */
10
- export const SidebarIcons = memo(function SidebarIcons({ items, activeId, isCollapsed, onToggleCollapse, onSwitchPanel, }) {
11
- const theme = useTheme();
12
- const { t } = useTranslation(NAMESPACE);
13
- const CollapseIcon = isCollapsed ? ChevronRight : ChevronLeft;
14
- return (_jsxs("div", { css: css `
15
- display: flex;
16
- flex-direction: column;
17
- align-items: center;
18
- padding: ${theme.spacing[2]} ${theme.spacing[1]};
19
- gap: ${theme.spacing[1]};
20
- border-left: 1px solid ${theme.color.border};
21
- background: ${theme.color.fillSecondary};
22
- flex-shrink: 0;
23
- `, children: [_jsx(Tooltip, { title: isCollapsed ? t('sidebar.expand') : t('sidebar.collapse'), placement: "left", children: _jsx("button", { onClick: onToggleCollapse, css: css `
24
- width: 32px;
25
- height: 32px;
26
- border-radius: ${theme.radius.md};
27
- display: flex;
28
- align-items: center;
29
- justify-content: center;
30
- cursor: pointer;
31
- background: transparent;
32
- color: ${theme.color.textSecondary};
33
- border: none;
34
- transition:
35
- background ${theme.motion.duration.fast},
36
- color ${theme.motion.duration.fast};
37
- &:hover {
38
- background: ${theme.color.fillTertiary};
39
- color: ${theme.color.text};
40
- }
41
- `, children: _jsx(CollapseIcon, { size: 18 }) }) }), items.map((item) => {
42
- const isActive = item.id === activeId && !isCollapsed;
43
- const Icon = item.icon;
44
- return (_jsx(Tooltip, { title: item.label, placement: "left", children: _jsx("button", { onClick: () => onSwitchPanel(item.id), css: css `
45
- width: 32px;
46
- height: 32px;
47
- border-radius: ${theme.radius.md};
48
- display: flex;
49
- align-items: center;
50
- justify-content: center;
51
- cursor: pointer;
52
- background: ${isActive ? theme.color.primaryBg : 'transparent'};
53
- color: ${isActive ? theme.color.primary : theme.color.textSecondary};
54
- border: none;
55
- transition:
56
- background ${theme.motion.duration.fast},
57
- color ${theme.motion.duration.fast};
58
- &:hover {
59
- background: ${theme.color.fillTertiary};
60
- color: ${theme.color.text};
61
- }
62
- `, children: _jsx(Icon, { size: 18 }) }) }, item.id));
63
- })] }));
64
- });
65
- //# sourceMappingURL=SidebarIcons.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SidebarIcons.js","sourceRoot":"","sources":["../../../src/components/sidebar/SidebarIcons.tsx"],"names":[],"mappings":"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"}
@@ -1,13 +0,0 @@
1
- import type { LucideIcon } from 'lucide-react';
2
- import type { ReactNode } from 'react';
3
- export interface SidebarPanelProps {
4
- /** Panel title (rendered uppercase via CSS). */
5
- title: string;
6
- /** Panel icon. */
7
- icon: LucideIcon;
8
- /** Scrollable panel content. */
9
- children: ReactNode;
10
- }
11
- /** Renders a panel with icon + uppercase title header and scrollable body. */
12
- export declare const SidebarPanel: import("react").NamedExoticComponent<SidebarPanelProps>;
13
- //# sourceMappingURL=SidebarPanel.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SidebarPanel.d.ts","sourceRoot":"","sources":["../../../src/components/sidebar/SidebarPanel.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE/C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,iBAAiB;IAChC,gDAAgD;IAChD,KAAK,EAAE,MAAM,CAAC;IACd,kBAAkB;IAClB,IAAI,EAAE,UAAU,CAAC;IACjB,gCAAgC;IAChC,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,8EAA8E;AAC9E,eAAO,MAAM,YAAY,yDAiDvB,CAAC"}
@@ -1,32 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
2
- import { useTheme } from '@agentskillmania/skill-ui-theme';
3
- import { css } from '@emotion/react';
4
- import { memo } from 'react';
5
- /** Renders a panel with icon + uppercase title header and scrollable body. */
6
- export const SidebarPanel = memo(function SidebarPanel({ title, icon: Icon, children, }) {
7
- const theme = useTheme();
8
- return (_jsxs("div", { css: css `
9
- display: flex;
10
- flex-direction: column;
11
- height: 100%;
12
- overflow: hidden;
13
- `, children: [_jsxs("div", { css: css `
14
- display: flex;
15
- align-items: center;
16
- gap: ${theme.spacing[2]};
17
- height: ${theme.spacing[10]};
18
- padding: 0 ${theme.spacing[3]};
19
- border-bottom: 1px solid ${theme.color.border};
20
- flex-shrink: 0;
21
- font-size: ${theme.font.size.sm};
22
- font-weight: ${theme.font.weight.semibold};
23
- color: ${theme.color.text};
24
- text-transform: uppercase;
25
- letter-spacing: 0.5px;
26
- `, children: [_jsx(Icon, { size: 16 }), _jsx("span", { children: title })] }), _jsx("div", { css: css `
27
- flex: 1;
28
- overflow: auto;
29
- padding: ${theme.spacing[3]};
30
- `, children: children })] }));
31
- });
32
- //# sourceMappingURL=SidebarPanel.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SidebarPanel.js","sourceRoot":"","sources":["../../../src/components/sidebar/SidebarPanel.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAC3D,OAAO,EAAE,GAAG,EAAE,MAAM,gBAAgB,CAAC;AAErC,OAAO,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AAY7B,8EAA8E;AAC9E,MAAM,CAAC,MAAM,YAAY,GAAG,IAAI,CAAC,SAAS,YAAY,CAAC,EACrD,KAAK,EACL,IAAI,EAAE,IAAI,EACV,QAAQ,GACU;IAClB,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IAEzB,OAAO,CACL,eACE,GAAG,EAAE,GAAG,CAAA;;;;;OAKP,aAGD,eACE,GAAG,EAAE,GAAG,CAAA;;;iBAGC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;oBACb,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC;uBACd,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;qCACF,KAAK,CAAC,KAAK,CAAC,MAAM;;uBAEhC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;yBAChB,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,QAAQ;mBAChC,KAAK,CAAC,KAAK,CAAC,IAAI;;;SAG1B,aAED,KAAC,IAAI,IAAC,IAAI,EAAE,EAAE,GAAI,EAClB,yBAAO,KAAK,GAAQ,IAChB,EAGN,cACE,GAAG,EAAE,GAAG,CAAA;;;qBAGK,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;SAC5B,YAEA,QAAQ,GACL,IACF,CACP,CAAC;AACJ,CAAC,CAAC,CAAC"}
@@ -1,7 +0,0 @@
1
- export { Sidebar } from './Sidebar.js';
2
- export type { SidebarProps } from './Sidebar.js';
3
- export { SidebarPanel } from './SidebarPanel.js';
4
- export type { SidebarPanelProps } from './SidebarPanel.js';
5
- export { SidebarIcons } from './SidebarIcons.js';
6
- export type { SidebarIconsProps, SidebarIconItem } from './SidebarIcons.js';
7
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/sidebar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,YAAY,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AACjD,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,YAAY,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAC3D,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,YAAY,EAAE,iBAAiB,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC"}
@@ -1,4 +0,0 @@
1
- export { Sidebar } from './Sidebar.js';
2
- export { SidebarPanel } from './SidebarPanel.js';
3
- export { SidebarIcons } from './SidebarIcons.js';
4
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/sidebar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjD,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC"}
@@ -1,5 +0,0 @@
1
- export { useToggle } from './useToggle.js';
2
- export type { UseToggleReturn } from './useToggle.js';
3
- export { useResize } from './useResize.js';
4
- export type { UseResizeOptions, UseResizeReturn } from './useResize.js';
5
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,YAAY,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AACtD,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,YAAY,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC"}
@@ -1,3 +0,0 @@
1
- export { useToggle } from './useToggle.js';
2
- export { useResize } from './useResize.js';
3
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAE3C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC"}