@atelier-ui/react 0.1.12 → 0.2.1
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 +30 -0
- package/README.md +3 -3
- package/package.json +1 -1
- package/src/index.d.ts +29 -29
- package/src/index.js +29 -29
- package/src/index.js.map +1 -1
- package/src/lib/accordion/{llm-accordion.css → atl-accordion.css} +8 -8
- package/src/lib/accordion/{llm-accordion.d.ts → atl-accordion.d.ts} +12 -12
- package/src/lib/accordion/{llm-accordion.d.ts.map → atl-accordion.d.ts.map} +1 -1
- package/src/lib/accordion/{llm-accordion.js → atl-accordion.js} +9 -9
- package/src/lib/accordion/{llm-accordion.js.map → atl-accordion.js.map} +1 -1
- package/src/lib/alert/{llm-alert.css → atl-alert.css} +10 -10
- package/src/lib/alert/{llm-alert.d.ts → atl-alert.d.ts} +8 -8
- package/src/lib/alert/{llm-alert.d.ts.map → atl-alert.d.ts.map} +1 -1
- package/src/lib/alert/{llm-alert.js → atl-alert.js} +4 -4
- package/src/lib/alert/{llm-alert.js.map → atl-alert.js.map} +1 -1
- package/src/lib/avatar/{llm-avatar.css → atl-avatar.css} +20 -20
- package/src/lib/avatar/{llm-avatar.d.ts → atl-avatar.d.ts} +10 -10
- package/src/lib/avatar/{llm-avatar.d.ts.map → atl-avatar.d.ts.map} +1 -1
- package/src/lib/avatar/{llm-avatar.js → atl-avatar.js} +6 -6
- package/src/lib/avatar/{llm-avatar.js.map → atl-avatar.js.map} +1 -1
- package/src/lib/badge/{llm-badge.css → atl-badge.css} +9 -9
- package/src/lib/badge/atl-badge.d.ts +27 -0
- package/src/lib/badge/{llm-badge.d.ts.map → atl-badge.d.ts.map} +1 -1
- package/src/lib/badge/{llm-badge.js → atl-badge.js} +4 -4
- package/src/lib/badge/{llm-badge.js.map → atl-badge.js.map} +1 -1
- package/src/lib/breadcrumbs/{llm-breadcrumbs.css → atl-breadcrumbs.css} +11 -11
- package/src/lib/breadcrumbs/atl-breadcrumbs.d.ts +38 -0
- package/src/lib/breadcrumbs/{llm-breadcrumbs.d.ts.map → atl-breadcrumbs.d.ts.map} +1 -1
- package/src/lib/breadcrumbs/{llm-breadcrumbs.js → atl-breadcrumbs.js} +7 -7
- package/src/lib/breadcrumbs/{llm-breadcrumbs.js.map → atl-breadcrumbs.js.map} +1 -1
- package/src/lib/button/{llm-button.css → atl-button.css} +20 -20
- package/src/lib/button/{llm-button.d.ts → atl-button.d.ts} +7 -7
- package/src/lib/button/{llm-button.d.ts.map → atl-button.d.ts.map} +1 -1
- package/src/lib/button/{llm-button.js → atl-button.js} +4 -4
- package/src/lib/button/{llm-button.js.map → atl-button.js.map} +1 -1
- package/src/lib/card/{llm-card.css → atl-card.css} +20 -20
- package/src/lib/card/{llm-card.d.ts → atl-card.d.ts} +13 -13
- package/src/lib/card/{llm-card.d.ts.map → atl-card.d.ts.map} +1 -1
- package/src/lib/card/atl-card.js +30 -0
- package/src/lib/card/{llm-card.js.map → atl-card.js.map} +1 -1
- package/src/lib/chat/{llm-chat.css → atl-chat.css} +55 -55
- package/src/lib/chat/{llm-chat.d.ts → atl-chat.d.ts} +26 -26
- package/src/lib/chat/{llm-chat.d.ts.map → atl-chat.d.ts.map} +1 -1
- package/src/lib/chat/{llm-chat.js → atl-chat.js} +21 -21
- package/src/lib/chat/{llm-chat.js.map → atl-chat.js.map} +1 -1
- package/src/lib/checkbox/{llm-checkbox.css → atl-checkbox.css} +19 -19
- package/src/lib/checkbox/{llm-checkbox.d.ts → atl-checkbox.d.ts} +6 -6
- package/src/lib/checkbox/{llm-checkbox.d.ts.map → atl-checkbox.d.ts.map} +1 -1
- package/src/lib/checkbox/{llm-checkbox.js → atl-checkbox.js} +4 -4
- package/src/lib/checkbox/{llm-checkbox.js.map → atl-checkbox.js.map} +1 -1
- package/src/lib/code-block/{llm-code-block.css → atl-code-block.css} +2 -2
- package/src/lib/code-block/{llm-code-block.d.ts → atl-code-block.d.ts} +4 -4
- package/src/lib/code-block/{llm-code-block.d.ts.map → atl-code-block.d.ts.map} +1 -1
- package/src/lib/code-block/{llm-code-block.js → atl-code-block.js} +4 -4
- package/src/lib/code-block/{llm-code-block.js.map → atl-code-block.js.map} +1 -1
- package/src/lib/combobox/{llm-combobox.css → atl-combobox.css} +24 -24
- package/src/lib/combobox/{llm-combobox.d.ts → atl-combobox.d.ts} +7 -7
- package/src/lib/combobox/{llm-combobox.d.ts.map → atl-combobox.d.ts.map} +1 -1
- package/src/lib/combobox/{llm-combobox.js → atl-combobox.js} +8 -8
- package/src/lib/combobox/{llm-combobox.js.map → atl-combobox.js.map} +1 -1
- package/src/lib/dialog/{llm-dialog.css → atl-dialog.css} +18 -18
- package/src/lib/dialog/{llm-dialog.d.ts → atl-dialog.d.ts} +12 -12
- package/src/lib/dialog/{llm-dialog.d.ts.map → atl-dialog.d.ts.map} +1 -1
- package/src/lib/dialog/{llm-dialog.js → atl-dialog.js} +13 -13
- package/src/lib/dialog/{llm-dialog.js.map → atl-dialog.js.map} +1 -1
- package/src/lib/drawer/{llm-drawer.css → atl-drawer.css} +35 -35
- package/src/lib/drawer/{llm-drawer.d.ts → atl-drawer.d.ts} +12 -12
- package/src/lib/drawer/{llm-drawer.d.ts.map → atl-drawer.d.ts.map} +1 -1
- package/src/lib/drawer/{llm-drawer.js → atl-drawer.js} +13 -13
- package/src/lib/drawer/{llm-drawer.js.map → atl-drawer.js.map} +1 -1
- package/src/lib/icon/{llm-icon.css → atl-icon.css} +4 -4
- package/src/lib/icon/atl-icon.d.ts +24 -0
- package/src/lib/icon/{llm-icon.d.ts.map → atl-icon.d.ts.map} +1 -1
- package/src/lib/icon/{llm-icon.js → atl-icon.js} +5 -5
- package/src/lib/icon/{llm-icon.js.map → atl-icon.js.map} +1 -1
- package/src/lib/input/{llm-input.css → atl-input.css} +14 -14
- package/src/lib/input/{llm-input.d.ts → atl-input.d.ts} +6 -6
- package/src/lib/input/{llm-input.d.ts.map → atl-input.d.ts.map} +1 -1
- package/src/lib/input/{llm-input.js → atl-input.js} +4 -4
- package/src/lib/input/{llm-input.js.map → atl-input.js.map} +1 -1
- package/src/lib/menu/{llm-menu.css → atl-menu.css} +11 -11
- package/src/lib/menu/{llm-menu.d.ts → atl-menu.d.ts} +13 -13
- package/src/lib/menu/{llm-menu.d.ts.map → atl-menu.d.ts.map} +1 -1
- package/src/lib/menu/{llm-menu.js → atl-menu.js} +10 -10
- package/src/lib/menu/{llm-menu.js.map → atl-menu.js.map} +1 -1
- package/src/lib/pagination/{llm-pagination.css → atl-pagination.css} +1 -1
- package/src/lib/pagination/{llm-pagination.d.ts → atl-pagination.d.ts} +6 -6
- package/src/lib/pagination/{llm-pagination.d.ts.map → atl-pagination.d.ts.map} +1 -1
- package/src/lib/pagination/{llm-pagination.js → atl-pagination.js} +4 -4
- package/src/lib/pagination/{llm-pagination.js.map → atl-pagination.js.map} +1 -1
- package/src/lib/progress/{llm-progress.css → atl-progress.css} +9 -9
- package/src/lib/progress/{llm-progress.d.ts → atl-progress.d.ts} +6 -6
- package/src/lib/progress/{llm-progress.d.ts.map → atl-progress.d.ts.map} +1 -1
- package/src/lib/progress/{llm-progress.js → atl-progress.js} +4 -4
- package/src/lib/progress/{llm-progress.js.map → atl-progress.js.map} +1 -1
- package/src/lib/radio/{llm-radio.css → atl-radio.css} +11 -11
- package/src/lib/radio/{llm-radio.d.ts → atl-radio.d.ts} +7 -7
- package/src/lib/radio/{llm-radio.d.ts.map → atl-radio.d.ts.map} +1 -1
- package/src/lib/radio/{llm-radio.js → atl-radio.js} +6 -6
- package/src/lib/radio/{llm-radio.js.map → atl-radio.js.map} +1 -1
- package/src/lib/radio-group/{llm-radio-group.css → atl-radio-group.css} +6 -6
- package/src/lib/radio-group/{llm-radio-group.d.ts → atl-radio-group.d.ts} +6 -6
- package/src/lib/radio-group/{llm-radio-group.d.ts.map → atl-radio-group.d.ts.map} +1 -1
- package/src/lib/radio-group/{llm-radio-group.js → atl-radio-group.js} +4 -4
- package/src/lib/radio-group/{llm-radio-group.js.map → atl-radio-group.js.map} +1 -1
- package/src/lib/select/{llm-select.css → atl-select.css} +11 -11
- package/src/lib/select/{llm-select.d.ts → atl-select.d.ts} +10 -10
- package/src/lib/select/{llm-select.d.ts.map → atl-select.d.ts.map} +1 -1
- package/src/lib/select/{llm-select.js → atl-select.js} +6 -6
- package/src/lib/select/{llm-select.js.map → atl-select.js.map} +1 -1
- package/src/lib/skeleton/{llm-skeleton.css → atl-skeleton.css} +6 -6
- package/src/lib/skeleton/{llm-skeleton.d.ts → atl-skeleton.d.ts} +6 -6
- package/src/lib/skeleton/{llm-skeleton.d.ts.map → atl-skeleton.d.ts.map} +1 -1
- package/src/lib/skeleton/{llm-skeleton.js → atl-skeleton.js} +4 -4
- package/src/lib/skeleton/{llm-skeleton.js.map → atl-skeleton.js.map} +1 -1
- package/src/lib/spec.d.ts +120 -120
- package/src/lib/spec.js.map +1 -1
- package/src/lib/stepper/{llm-stepper.css → atl-stepper.css} +5 -5
- package/src/lib/stepper/{llm-stepper.d.ts → atl-stepper.d.ts} +9 -9
- package/src/lib/stepper/{llm-stepper.d.ts.map → atl-stepper.d.ts.map} +1 -1
- package/src/lib/stepper/{llm-stepper.js → atl-stepper.js} +11 -11
- package/src/lib/stepper/{llm-stepper.js.map → atl-stepper.js.map} +1 -1
- package/src/lib/table/{llm-table.css → atl-table.css} +30 -30
- package/src/lib/table/atl-table.d.ts +40 -0
- package/src/lib/table/{llm-table.d.ts.map → atl-table.d.ts.map} +1 -1
- package/src/lib/table/{llm-table.js → atl-table.js} +14 -14
- package/src/lib/table/{llm-table.js.map → atl-table.js.map} +1 -1
- package/src/lib/tabs/{llm-tabs.css → atl-tabs.css} +17 -17
- package/src/lib/tabs/{llm-tabs.d.ts → atl-tabs.d.ts} +12 -12
- package/src/lib/tabs/{llm-tabs.d.ts.map → atl-tabs.d.ts.map} +1 -1
- package/src/lib/tabs/{llm-tabs.js → atl-tabs.js} +11 -11
- package/src/lib/tabs/{llm-tabs.js.map → atl-tabs.js.map} +1 -1
- package/src/lib/textarea/{llm-textarea.css → atl-textarea.css} +15 -15
- package/src/lib/textarea/{llm-textarea.d.ts → atl-textarea.d.ts} +6 -6
- package/src/lib/textarea/{llm-textarea.d.ts.map → atl-textarea.d.ts.map} +1 -1
- package/src/lib/textarea/{llm-textarea.js → atl-textarea.js} +4 -4
- package/src/lib/textarea/{llm-textarea.js.map → atl-textarea.js.map} +1 -1
- package/src/lib/toast/{llm-toast.css → atl-toast.css} +16 -16
- package/src/lib/toast/atl-toast.d.ts +54 -0
- package/src/lib/toast/{llm-toast.d.ts.map → atl-toast.d.ts.map} +1 -1
- package/src/lib/toast/{llm-toast.js → atl-toast.js} +12 -12
- package/src/lib/toast/{llm-toast.js.map → atl-toast.js.map} +1 -1
- package/src/lib/toggle/{llm-toggle.css → atl-toggle.css} +16 -16
- package/src/lib/toggle/{llm-toggle.d.ts → atl-toggle.d.ts} +6 -6
- package/src/lib/toggle/{llm-toggle.d.ts.map → atl-toggle.d.ts.map} +1 -1
- package/src/lib/toggle/{llm-toggle.js → atl-toggle.js} +4 -4
- package/src/lib/toggle/{llm-toggle.js.map → atl-toggle.js.map} +1 -1
- package/src/lib/tooltip/{llm-tooltip.css → atl-tooltip.css} +12 -12
- package/src/lib/tooltip/atl-tooltip.d.ts +17 -0
- package/src/lib/tooltip/{llm-tooltip.d.ts.map → atl-tooltip.d.ts.map} +1 -1
- package/src/lib/tooltip/{llm-tooltip.js → atl-tooltip.js} +7 -7
- package/src/lib/tooltip/{llm-tooltip.js.map → atl-tooltip.js.map} +1 -1
- package/src/lib/badge/llm-badge.d.ts +0 -27
- package/src/lib/breadcrumbs/llm-breadcrumbs.d.ts +0 -38
- package/src/lib/card/llm-card.js +0 -30
- package/src/lib/icon/llm-icon.d.ts +0 -24
- package/src/lib/table/llm-table.d.ts +0 -40
- package/src/lib/toast/llm-toast.d.ts +0 -54
- package/src/lib/tooltip/llm-tooltip.d.ts +0 -17
|
@@ -1,20 +1,20 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { createContext, useContext, useRef, useState, useEffect, } from 'react';
|
|
3
|
-
import './
|
|
3
|
+
import './atl-menu.css';
|
|
4
4
|
const MenuContext = createContext({ close: () => undefined });
|
|
5
5
|
/**
|
|
6
6
|
* A menu component for displaying a list of choices.
|
|
7
7
|
*/
|
|
8
|
-
export function
|
|
9
|
-
const classes = ['
|
|
8
|
+
export function AtlMenu({ variant = 'default', children, className, ...rest }) {
|
|
9
|
+
const classes = ['atl-menu', `variant-${variant}`, className].filter(Boolean).join(' ');
|
|
10
10
|
return (_jsx("div", { className: classes, role: "menu", ...rest, children: children }));
|
|
11
11
|
}
|
|
12
12
|
/**
|
|
13
13
|
* An individual item within a menu.
|
|
14
14
|
*/
|
|
15
|
-
export function
|
|
15
|
+
export function AtlMenuItem({ disabled = false, onTriggered, children, className, onClick, ...rest }) {
|
|
16
16
|
const ctx = useContext(MenuContext);
|
|
17
|
-
const classes = ['
|
|
17
|
+
const classes = ['atl-menu-item', disabled && 'is-disabled', className]
|
|
18
18
|
.filter(Boolean)
|
|
19
19
|
.join(' ');
|
|
20
20
|
const handleClick = (e) => {
|
|
@@ -29,13 +29,13 @@ export function LlmMenuItem({ disabled = false, onTriggered, children, className
|
|
|
29
29
|
/**
|
|
30
30
|
* A separator for dividing groups of menu items.
|
|
31
31
|
*/
|
|
32
|
-
export function
|
|
33
|
-
return _jsx("hr", { className: "
|
|
32
|
+
export function AtlMenuSeparator() {
|
|
33
|
+
return _jsx("hr", { className: "atl-menu-separator" });
|
|
34
34
|
}
|
|
35
35
|
/**
|
|
36
36
|
* A component that manages the state of a menu and its trigger.
|
|
37
37
|
*/
|
|
38
|
-
export function
|
|
38
|
+
export function AtlMenuTrigger({ menu, children }) {
|
|
39
39
|
const [open, setOpen] = useState(false);
|
|
40
40
|
const triggerRef = useRef(null);
|
|
41
41
|
const menuRef = useRef(null);
|
|
@@ -59,6 +59,6 @@ export function LlmMenuTrigger({ menu, children }) {
|
|
|
59
59
|
document.removeEventListener('keydown', handleKeyDown);
|
|
60
60
|
};
|
|
61
61
|
}, [open]);
|
|
62
|
-
return (_jsx(MenuContext.Provider, { value: { close: () => setOpen(false) }, children: _jsxs("div", { className: "
|
|
62
|
+
return (_jsx(MenuContext.Provider, { value: { close: () => setOpen(false) }, children: _jsxs("div", { className: "atl-menu-trigger-wrapper", style: { position: 'relative', display: 'inline-block' }, children: [children({ onClick: () => setOpen((v) => !v), ref: triggerRef }), open && (_jsx("div", { ref: menuRef, className: "atl-menu-panel", children: menu }))] }) }));
|
|
63
63
|
}
|
|
64
|
-
//# sourceMappingURL=
|
|
64
|
+
//# sourceMappingURL=atl-menu.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"
|
|
1
|
+
{"version":3,"file":"atl-menu.js","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/menu/atl-menu.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n createContext,\n useContext,\n useRef,\n useState,\n useEffect,\n ReactNode,\n HTMLAttributes,\n RefObject,\n} from 'react';\nimport type {\n AtlMenuSpec,\n AtlMenuItemSpec,\n} from '../spec';\nimport './atl-menu.css';\n\ninterface MenuContextValue {\n close: () => void;\n}\n\nconst MenuContext = createContext<MenuContextValue>({ close: () => undefined });\n\n/**\n * Properties for the AtlMenu component.\n */\nexport interface AtlMenuProps extends HTMLAttributes<HTMLDivElement>, AtlMenuSpec {\n /**\n * The visual style variant of the menu.\n */\n variant?: 'default' | 'compact';\n /**\n * The menu items to be rendered.\n */\n children?: ReactNode;\n}\n\n/**\n * A menu component for displaying a list of choices.\n */\nexport function AtlMenu({ variant = 'default', children, className, ...rest }: AtlMenuProps) {\n const classes = ['atl-menu', `variant-${variant}`, className].filter(Boolean).join(' ');\n return (\n <div className={classes} role=\"menu\" {...rest}>\n {children}\n </div>\n );\n}\n\n/**\n * Properties for the AtlMenuItem component.\n */\nexport interface AtlMenuItemProps\n extends HTMLAttributes<HTMLButtonElement>,\n AtlMenuItemSpec {\n /**\n * Whether the menu item is disabled.\n */\n disabled?: boolean;\n /**\n * Callback triggered when the item is selected.\n */\n onTriggered?: () => void;\n /**\n * The content of the menu item.\n */\n children?: ReactNode;\n}\n\n/**\n * An individual item within a menu.\n */\nexport function AtlMenuItem({\n disabled = false,\n onTriggered,\n children,\n className,\n onClick,\n ...rest\n}: AtlMenuItemProps) {\n const ctx = useContext(MenuContext);\n const classes = ['atl-menu-item', disabled && 'is-disabled', className]\n .filter(Boolean)\n .join(' ');\n\n const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n if (!disabled) {\n onTriggered?.();\n ctx.close();\n onClick?.(e);\n }\n };\n\n return (\n <button\n className={classes}\n role=\"menuitem\"\n disabled={disabled}\n onClick={handleClick}\n {...rest}\n >\n {children}\n </button>\n );\n}\n\n/**\n * A separator for dividing groups of menu items.\n */\nexport function AtlMenuSeparator() {\n return <hr className=\"atl-menu-separator\" />;\n}\n\n/**\n * Properties for the AtlMenuTrigger component.\n */\nexport interface AtlMenuTriggerProps {\n /**\n * The menu to be displayed.\n */\n menu: ReactNode;\n /**\n * Render prop that provides trigger functionality.\n */\n children: (props: {\n onClick: () => void;\n ref: RefObject<HTMLElement | null>;\n }) => ReactNode;\n}\n\n/**\n * A component that manages the state of a menu and its trigger.\n */\nexport function AtlMenuTrigger({ menu, children }: AtlMenuTriggerProps) {\n const [open, setOpen] = useState(false);\n const triggerRef = useRef<HTMLElement>(null);\n const menuRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n if (!open) return;\n\n const handleOutsideClick = (e: MouseEvent) => {\n if (\n !menuRef.current?.contains(e.target as Node) &&\n !triggerRef.current?.contains(e.target as Node)\n ) {\n setOpen(false);\n }\n };\n\n const handleKeyDown = (e: globalThis.KeyboardEvent) => {\n if (e.key === 'Escape') setOpen(false);\n };\n\n document.addEventListener('mousedown', handleOutsideClick);\n document.addEventListener('keydown', handleKeyDown);\n return () => {\n document.removeEventListener('mousedown', handleOutsideClick);\n document.removeEventListener('keydown', handleKeyDown);\n };\n }, [open]);\n\n return (\n <MenuContext.Provider value={{ close: () => setOpen(false) }}>\n <div\n className=\"atl-menu-trigger-wrapper\"\n style={{ position: 'relative', display: 'inline-block' }}\n >\n {children({ onClick: () => setOpen((v) => !v), ref: triggerRef })}\n {open && (\n <div ref={menuRef} className=\"atl-menu-panel\">\n {menu}\n </div>\n )}\n </div>\n </MenuContext.Provider>\n );\n}\n"]}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { HTMLAttributes } from 'react';
|
|
2
|
-
import type {
|
|
3
|
-
import './
|
|
2
|
+
import type { AtlPaginationSpec } from '../spec';
|
|
3
|
+
import './atl-pagination.css';
|
|
4
4
|
/**
|
|
5
|
-
* Properties for the
|
|
5
|
+
* Properties for the AtlPagination component.
|
|
6
6
|
*/
|
|
7
|
-
export interface
|
|
7
|
+
export interface AtlPaginationProps extends Omit<HTMLAttributes<HTMLElement>, 'onChange'>, AtlPaginationSpec {
|
|
8
8
|
/**
|
|
9
9
|
* The currently active page.
|
|
10
10
|
*/
|
|
@@ -29,5 +29,5 @@ export interface LlmPaginationProps extends Omit<HTMLAttributes<HTMLElement>, 'o
|
|
|
29
29
|
/**
|
|
30
30
|
* A pagination component for navigating through paged content.
|
|
31
31
|
*/
|
|
32
|
-
export declare function
|
|
33
|
-
//# sourceMappingURL=
|
|
32
|
+
export declare function AtlPagination({ page, pageCount, siblingCount, showFirstLast, onPageChange, className, ...rest }: AtlPaginationProps): import("react").JSX.Element;
|
|
33
|
+
//# sourceMappingURL=atl-pagination.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"
|
|
1
|
+
{"version":3,"file":"atl-pagination.d.ts","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/pagination/atl-pagination.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAW,MAAM,OAAO,CAAC;AAChD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AACjD,OAAO,sBAAsB,CAAC;AAsC9B;;GAEG;AACH,MAAM,WAAW,kBACf,SAAQ,IAAI,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,UAAU,CAAC,EACnD,iBAAiB;IACnB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC;AAED;;GAEG;AACH,wBAAgB,aAAa,CAAC,EAC5B,IAAQ,EACR,SAAa,EACb,YAAgB,EAChB,aAAoB,EACpB,YAAY,EACZ,SAAS,EACT,GAAG,IAAI,EACR,EAAE,kBAAkB,+BAmGpB"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { useMemo } from 'react';
|
|
3
|
-
import './
|
|
3
|
+
import './atl-pagination.css';
|
|
4
4
|
function buildPageItems(page, pageCount, siblingCount) {
|
|
5
5
|
if (pageCount <= 1)
|
|
6
6
|
return [{ type: 'page', page: 1 }];
|
|
@@ -28,8 +28,8 @@ function buildPageItems(page, pageCount, siblingCount) {
|
|
|
28
28
|
/**
|
|
29
29
|
* A pagination component for navigating through paged content.
|
|
30
30
|
*/
|
|
31
|
-
export function
|
|
32
|
-
const classes = ['
|
|
31
|
+
export function AtlPagination({ page = 1, pageCount = 1, siblingCount = 1, showFirstLast = true, onPageChange, className, ...rest }) {
|
|
32
|
+
const classes = ['atl-pagination', className].filter(Boolean).join(' ');
|
|
33
33
|
const pageItems = useMemo(() => buildPageItems(page, pageCount, siblingCount), [page, pageCount, siblingCount]);
|
|
34
34
|
const goTo = (p) => {
|
|
35
35
|
const clamped = Math.min(Math.max(p, 1), pageCount);
|
|
@@ -51,4 +51,4 @@ export function LlmPagination({ page = 1, pageCount = 1, siblingCount = 1, showF
|
|
|
51
51
|
.filter(Boolean)
|
|
52
52
|
.join(' '), disabled: page >= pageCount, "aria-label": "Last page", onClick: () => goTo(pageCount), children: "\u00BB" }) }))] }) }));
|
|
53
53
|
}
|
|
54
|
-
//# sourceMappingURL=
|
|
54
|
+
//# sourceMappingURL=atl-pagination.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"
|
|
1
|
+
{"version":3,"file":"atl-pagination.js","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/pagination/atl-pagination.tsx"],"names":[],"mappings":"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","sourcesContent":["import { HTMLAttributes, useMemo } from 'react';\nimport type { AtlPaginationSpec } from '../spec';\nimport './atl-pagination.css';\n\ntype PageItem =\n | { type: 'page'; page: number }\n | { type: 'ellipsis'; key: string };\n\nfunction buildPageItems(page: number, pageCount: number, siblingCount: number): PageItem[] {\n if (pageCount <= 1) return [{ type: 'page', page: 1 }];\n\n const items: PageItem[] = [];\n\n // Always include first page\n items.push({ type: 'page', page: 1 });\n\n const left = Math.max(2, page - siblingCount);\n const right = Math.min(pageCount - 1, page + siblingCount);\n\n // Left ellipsis\n if (left > 2) {\n items.push({ type: 'ellipsis', key: 'ellipsis-start' });\n }\n\n // Middle pages\n for (let p = left; p <= right; p++) {\n items.push({ type: 'page', page: p });\n }\n\n // Right ellipsis\n if (right < pageCount - 1) {\n items.push({ type: 'ellipsis', key: 'ellipsis-end' });\n }\n\n // Always include last page\n items.push({ type: 'page', page: pageCount });\n\n return items;\n}\n\n/**\n * Properties for the AtlPagination component.\n */\nexport interface AtlPaginationProps\n extends Omit<HTMLAttributes<HTMLElement>, 'onChange'>,\n AtlPaginationSpec {\n /**\n * The currently active page.\n */\n page?: number;\n /**\n * The total number of pages.\n */\n pageCount?: number;\n /**\n * The number of pages to show on either side of the current page.\n */\n siblingCount?: number;\n /**\n * Whether to show buttons for first and last pages.\n */\n showFirstLast?: boolean;\n /**\n * Callback triggered when the page changes.\n */\n onPageChange?: (page: number) => void;\n}\n\n/**\n * A pagination component for navigating through paged content.\n */\nexport function AtlPagination({\n page = 1,\n pageCount = 1,\n siblingCount = 1,\n showFirstLast = true,\n onPageChange,\n className,\n ...rest\n}: AtlPaginationProps) {\n const classes = ['atl-pagination', className].filter(Boolean).join(' ');\n\n const pageItems = useMemo(\n () => buildPageItems(page, pageCount, siblingCount),\n [page, pageCount, siblingCount]\n );\n\n const goTo = (p: number) => {\n const clamped = Math.min(Math.max(p, 1), pageCount);\n if (clamped !== page) {\n onPageChange?.(clamped);\n }\n };\n\n return (\n <nav className={classes} aria-label=\"Pagination\" {...rest}>\n <ul className=\"page-list\">\n {showFirstLast && (\n <li>\n <button\n className={['page-btn', page <= 1 ? 'is-disabled' : ''].filter(Boolean).join(' ')}\n disabled={page <= 1}\n aria-label=\"First page\"\n onClick={() => goTo(1)}\n >\n «\n </button>\n </li>\n )}\n <li>\n <button\n className={['page-btn', page <= 1 ? 'is-disabled' : ''].filter(Boolean).join(' ')}\n disabled={page <= 1}\n aria-label=\"Previous page\"\n onClick={() => goTo(page - 1)}\n >\n ‹\n </button>\n </li>\n\n {pageItems.map((item, index) =>\n item.type === 'page' ? (\n <li key={item.page}>\n <button\n className={['page-btn', item.page === page ? 'is-active' : '']\n .filter(Boolean)\n .join(' ')}\n aria-current={item.page === page ? 'page' : undefined}\n aria-label={`Page ${item.page}`}\n onClick={() => goTo(item.page)}\n >\n {item.page}\n </button>\n </li>\n ) : (\n <li key={item.key}>\n <span className=\"ellipsis\" aria-hidden=\"true\">\n …\n </span>\n </li>\n )\n )}\n\n <li>\n <button\n className={[\n 'page-btn',\n page >= pageCount ? 'is-disabled' : '',\n ]\n .filter(Boolean)\n .join(' ')}\n disabled={page >= pageCount}\n aria-label=\"Next page\"\n onClick={() => goTo(page + 1)}\n >\n ›\n </button>\n </li>\n {showFirstLast && (\n <li>\n <button\n className={[\n 'page-btn',\n page >= pageCount ? 'is-disabled' : '',\n ]\n .filter(Boolean)\n .join(' ')}\n disabled={page >= pageCount}\n aria-label=\"Last page\"\n onClick={() => goTo(pageCount)}\n >\n »\n </button>\n </li>\n )}\n </ul>\n </nav>\n );\n}\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
.
|
|
1
|
+
.atl-progress {
|
|
2
2
|
display: block;
|
|
3
3
|
width: 100%;
|
|
4
4
|
font-family: var(--ui-font-family);
|
|
@@ -13,15 +13,15 @@
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
/* Size variants — modernised for visibility (sm was 4px → 6px) */
|
|
16
|
-
.
|
|
16
|
+
.atl-progress.size-sm .track {
|
|
17
17
|
height: 6px;
|
|
18
18
|
}
|
|
19
19
|
|
|
20
|
-
.
|
|
20
|
+
.atl-progress.size-md .track {
|
|
21
21
|
height: 10px;
|
|
22
22
|
}
|
|
23
23
|
|
|
24
|
-
.
|
|
24
|
+
.atl-progress.size-lg .track {
|
|
25
25
|
height: 14px;
|
|
26
26
|
}
|
|
27
27
|
|
|
@@ -34,15 +34,15 @@
|
|
|
34
34
|
}
|
|
35
35
|
|
|
36
36
|
/* Color variants */
|
|
37
|
-
.
|
|
37
|
+
.atl-progress.variant-success .fill {
|
|
38
38
|
background-color: var(--ui-color-success);
|
|
39
39
|
}
|
|
40
40
|
|
|
41
|
-
.
|
|
41
|
+
.atl-progress.variant-warning .fill {
|
|
42
42
|
background-color: var(--ui-color-warning);
|
|
43
43
|
}
|
|
44
44
|
|
|
45
|
-
.
|
|
45
|
+
.atl-progress.variant-danger .fill {
|
|
46
46
|
background-color: var(--ui-color-danger);
|
|
47
47
|
}
|
|
48
48
|
|
|
@@ -56,13 +56,13 @@
|
|
|
56
56
|
}
|
|
57
57
|
}
|
|
58
58
|
|
|
59
|
-
.
|
|
59
|
+
.atl-progress.is-indeterminate .fill {
|
|
60
60
|
width: 40% !important;
|
|
61
61
|
animation: progress-indeterminate 1.4s var(--ui-ease-in-out) infinite;
|
|
62
62
|
}
|
|
63
63
|
|
|
64
64
|
@media (prefers-reduced-motion: reduce) {
|
|
65
|
-
.
|
|
65
|
+
.atl-progress.is-indeterminate .fill {
|
|
66
66
|
animation: none;
|
|
67
67
|
opacity: 0.5;
|
|
68
68
|
}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { HTMLAttributes } from 'react';
|
|
2
|
-
import type {
|
|
3
|
-
import './
|
|
2
|
+
import type { AtlProgressSpec } from '../spec';
|
|
3
|
+
import './atl-progress.css';
|
|
4
4
|
/**
|
|
5
|
-
* Properties for the
|
|
5
|
+
* Properties for the AtlProgress component.
|
|
6
6
|
*/
|
|
7
|
-
export interface
|
|
7
|
+
export interface AtlProgressProps extends HTMLAttributes<HTMLDivElement>, AtlProgressSpec {
|
|
8
8
|
/**
|
|
9
9
|
* The current progress value.
|
|
10
10
|
*/
|
|
@@ -34,5 +34,5 @@ export interface LlmProgressProps extends HTMLAttributes<HTMLDivElement>, LlmPro
|
|
|
34
34
|
/**
|
|
35
35
|
* A progress bar component for displaying task progress.
|
|
36
36
|
*/
|
|
37
|
-
export declare function
|
|
38
|
-
//# sourceMappingURL=
|
|
37
|
+
export declare function AtlProgress({ value, max, variant, size, indeterminate, label, className, ...rest }: AtlProgressProps): import("react").JSX.Element;
|
|
38
|
+
//# sourceMappingURL=atl-progress.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"
|
|
1
|
+
{"version":3,"file":"atl-progress.d.ts","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/progress/atl-progress.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAC/C,OAAO,oBAAoB,CAAC;AAE5B;;GAEG;AACH,MAAM,WAAW,gBACf,SAAQ,cAAc,CAAC,cAAc,CAAC,EACpC,eAAe;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;IACvD;;OAEG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;GAEG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAS,EACT,GAAS,EACT,OAAmB,EACnB,IAAW,EACX,aAAqB,EACrB,KAAK,EACL,SAAS,EACT,GAAG,IAAI,EACR,EAAE,gBAAgB,+BA2BlB"}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import './
|
|
2
|
+
import './atl-progress.css';
|
|
3
3
|
/**
|
|
4
4
|
* A progress bar component for displaying task progress.
|
|
5
5
|
*/
|
|
6
|
-
export function
|
|
6
|
+
export function AtlProgress({ value = 0, max = 100, variant = 'default', size = 'md', indeterminate = false, label, className, ...rest }) {
|
|
7
7
|
const clampedValue = Math.min(Math.max(value, 0), max);
|
|
8
8
|
const fillWidth = indeterminate ? '100%' : `${(clampedValue / max) * 100}%`;
|
|
9
9
|
const classes = [
|
|
10
|
-
'
|
|
10
|
+
'atl-progress',
|
|
11
11
|
`variant-${variant}`,
|
|
12
12
|
`size-${size}`,
|
|
13
13
|
indeterminate && 'is-indeterminate',
|
|
@@ -15,4 +15,4 @@ export function LlmProgress({ value = 0, max = 100, variant = 'default', size =
|
|
|
15
15
|
].filter(Boolean).join(' ');
|
|
16
16
|
return (_jsx("div", { className: classes, role: "progressbar", "aria-label": label, "aria-valuemin": 0, "aria-valuenow": indeterminate ? undefined : clampedValue, "aria-valuemax": indeterminate ? undefined : max, ...rest, children: _jsx("div", { className: "track", children: _jsx("div", { className: "fill", style: { width: fillWidth } }) }) }));
|
|
17
17
|
}
|
|
18
|
-
//# sourceMappingURL=
|
|
18
|
+
//# sourceMappingURL=atl-progress.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"
|
|
1
|
+
{"version":3,"file":"atl-progress.js","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/progress/atl-progress.tsx"],"names":[],"mappings":";AAEA,OAAO,oBAAoB,CAAC;AAmC5B;;GAEG;AACH,MAAM,UAAU,WAAW,CAAC,EAC1B,KAAK,GAAG,CAAC,EACT,GAAG,GAAG,GAAG,EACT,OAAO,GAAG,SAAS,EACnB,IAAI,GAAG,IAAI,EACX,aAAa,GAAG,KAAK,EACrB,KAAK,EACL,SAAS,EACT,GAAG,IAAI,EACU;IACjB,MAAM,YAAY,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC;IACvD,MAAM,SAAS,GAAG,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,YAAY,GAAG,GAAG,CAAC,GAAG,GAAG,GAAG,CAAC;IAE5E,MAAM,OAAO,GAAG;QACd,cAAc;QACd,WAAW,OAAO,EAAE;QACpB,QAAQ,IAAI,EAAE;QACd,aAAa,IAAI,kBAAkB;QACnC,SAAS;KACV,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAE5B,OAAO,CACL,cACE,SAAS,EAAE,OAAO,EAClB,IAAI,EAAC,aAAa,gBACN,KAAK,mBACF,CAAC,mBACD,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,YAAY,mBACxC,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG,KAC1C,IAAI,YAER,cAAK,SAAS,EAAC,OAAO,YACpB,cAAK,SAAS,EAAC,MAAM,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,GAAI,GACjD,GACF,CACP,CAAC;AACJ,CAAC","sourcesContent":["import { HTMLAttributes } from 'react';\nimport type { AtlProgressSpec } from '../spec';\nimport './atl-progress.css';\n\n/**\n * Properties for the AtlProgress component.\n */\nexport interface AtlProgressProps\n extends HTMLAttributes<HTMLDivElement>,\n AtlProgressSpec {\n /**\n * The current progress value.\n */\n value?: number;\n /**\n * The maximum progress value.\n */\n max?: number;\n /**\n * The visual style variant of the progress bar.\n */\n variant?: 'default' | 'success' | 'warning' | 'danger';\n /**\n * The size of the progress bar.\n */\n size?: 'sm' | 'md' | 'lg';\n /**\n * Whether the progress bar is in an indeterminate state.\n */\n indeterminate?: boolean;\n /**\n * Accessible name for the progress bar — rendered as `aria-label`.\n * Required by ARIA when there is no visible label nearby.\n */\n label?: string;\n}\n\n/**\n * A progress bar component for displaying task progress.\n */\nexport function AtlProgress({\n value = 0,\n max = 100,\n variant = 'default',\n size = 'md',\n indeterminate = false,\n label,\n className,\n ...rest\n}: AtlProgressProps) {\n const clampedValue = Math.min(Math.max(value, 0), max);\n const fillWidth = indeterminate ? '100%' : `${(clampedValue / max) * 100}%`;\n\n const classes = [\n 'atl-progress',\n `variant-${variant}`,\n `size-${size}`,\n indeterminate && 'is-indeterminate',\n className,\n ].filter(Boolean).join(' ');\n\n return (\n <div\n className={classes}\n role=\"progressbar\"\n aria-label={label}\n aria-valuemin={0}\n aria-valuenow={indeterminate ? undefined : clampedValue}\n aria-valuemax={indeterminate ? undefined : max}\n {...rest}\n >\n <div className=\"track\">\n <div className=\"fill\" style={{ width: fillWidth }} />\n </div>\n </div>\n );\n}\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
.
|
|
1
|
+
.atl-radio {
|
|
2
2
|
display: inline-flex;
|
|
3
3
|
align-items: center;
|
|
4
4
|
gap: var(--ui-spacing-3);
|
|
@@ -13,11 +13,11 @@
|
|
|
13
13
|
transition: color var(--ui-transition-fast);
|
|
14
14
|
}
|
|
15
15
|
|
|
16
|
-
.
|
|
16
|
+
.atl-radio:hover:not(.is-disabled) {
|
|
17
17
|
color: var(--ui-color-primary);
|
|
18
18
|
}
|
|
19
19
|
|
|
20
|
-
.
|
|
20
|
+
.atl-radio input[type='radio'] {
|
|
21
21
|
appearance: none;
|
|
22
22
|
-webkit-appearance: none;
|
|
23
23
|
flex-shrink: 0;
|
|
@@ -36,43 +36,43 @@
|
|
|
36
36
|
margin: 0;
|
|
37
37
|
}
|
|
38
38
|
|
|
39
|
-
.
|
|
39
|
+
.atl-radio:hover input[type='radio']:not(:disabled) {
|
|
40
40
|
border-color: var(--ui-color-primary);
|
|
41
41
|
}
|
|
42
42
|
|
|
43
|
-
.
|
|
43
|
+
.atl-radio input[type='radio']:focus-visible {
|
|
44
44
|
box-shadow: var(--ui-focus-ring);
|
|
45
45
|
border-color: var(--ui-color-primary);
|
|
46
46
|
}
|
|
47
47
|
|
|
48
48
|
/* Checked state — thick inner ring */
|
|
49
|
-
.
|
|
49
|
+
.atl-radio input[type='radio']:checked {
|
|
50
50
|
border-color: var(--ui-color-primary);
|
|
51
51
|
border-width: 6px;
|
|
52
52
|
}
|
|
53
53
|
|
|
54
54
|
/* Invalid state */
|
|
55
|
-
.
|
|
55
|
+
.atl-radio.is-invalid input[type='radio'] {
|
|
56
56
|
border-color: var(--ui-color-input-border-invalid);
|
|
57
57
|
}
|
|
58
58
|
|
|
59
|
-
.
|
|
59
|
+
.atl-radio.is-invalid:hover input[type='radio'] {
|
|
60
60
|
border-color: var(--ui-color-danger-hover);
|
|
61
61
|
}
|
|
62
62
|
|
|
63
|
-
.
|
|
63
|
+
.atl-radio.is-invalid input[type='radio']:focus-visible {
|
|
64
64
|
border-color: var(--ui-color-input-border-invalid);
|
|
65
65
|
box-shadow: 0 0 0 2px var(--ui-color-surface), 0 0 0 4px var(--ui-color-danger);
|
|
66
66
|
}
|
|
67
67
|
|
|
68
68
|
/* Disabled state */
|
|
69
|
-
.
|
|
69
|
+
.atl-radio.is-disabled {
|
|
70
70
|
opacity: var(--ui-opacity-disabled);
|
|
71
71
|
cursor: not-allowed;
|
|
72
72
|
color: var(--ui-color-text-muted);
|
|
73
73
|
}
|
|
74
74
|
|
|
75
|
-
.
|
|
75
|
+
.atl-radio.is-disabled input[type='radio'] {
|
|
76
76
|
cursor: not-allowed;
|
|
77
77
|
border-color: var(--ui-color-border);
|
|
78
78
|
}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { ReactNode } from 'react';
|
|
2
|
-
import type {
|
|
3
|
-
import './
|
|
2
|
+
import type { AtlRadioSpec } from '../spec';
|
|
3
|
+
import './atl-radio.css';
|
|
4
4
|
/**
|
|
5
|
-
* Properties for the
|
|
5
|
+
* Properties for the AtlRadio component.
|
|
6
6
|
*/
|
|
7
|
-
export interface
|
|
7
|
+
export interface AtlRadioProps extends AtlRadioSpec {
|
|
8
8
|
/**
|
|
9
9
|
* The value of the radio button.
|
|
10
10
|
*/
|
|
@@ -19,7 +19,7 @@ export interface LlmRadioProps extends LlmRadioSpec {
|
|
|
19
19
|
children?: ReactNode;
|
|
20
20
|
}
|
|
21
21
|
/**
|
|
22
|
-
* An individual radio button component, meant to be used within
|
|
22
|
+
* An individual radio button component, meant to be used within AtlRadioGroup.
|
|
23
23
|
*/
|
|
24
|
-
export declare function
|
|
25
|
-
//# sourceMappingURL=
|
|
24
|
+
export declare function AtlRadio({ radioValue, disabled, children }: AtlRadioProps): import("react").JSX.Element;
|
|
25
|
+
//# sourceMappingURL=atl-radio.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"
|
|
1
|
+
{"version":3,"file":"atl-radio.d.ts","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/radio/atl-radio.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAE5C,OAAO,iBAAiB,CAAC;AAEzB;;GAEG;AACH,MAAM,WAAW,aAAc,SAAQ,YAAY;IACjD;;OAEG;IACH,UAAU,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;GAEG;AACH,wBAAgB,QAAQ,CAAC,EAAE,UAAU,EAAE,QAAgB,EAAE,QAAQ,EAAE,EAAE,aAAa,+BA+BjF"}
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { useRadioGroup } from '../radio-group/
|
|
3
|
-
import './
|
|
2
|
+
import { useRadioGroup } from '../radio-group/atl-radio-group';
|
|
3
|
+
import './atl-radio.css';
|
|
4
4
|
/**
|
|
5
|
-
* An individual radio button component, meant to be used within
|
|
5
|
+
* An individual radio button component, meant to be used within AtlRadioGroup.
|
|
6
6
|
*/
|
|
7
|
-
export function
|
|
7
|
+
export function AtlRadio({ radioValue, disabled = false, children }) {
|
|
8
8
|
const ctx = useRadioGroup();
|
|
9
9
|
const isDisabled = disabled || ctx.disabled;
|
|
10
10
|
const isReadOnly = ctx.readOnly;
|
|
11
11
|
const isChecked = ctx.value === radioValue;
|
|
12
12
|
const classes = [
|
|
13
|
-
'
|
|
13
|
+
'atl-radio',
|
|
14
14
|
isDisabled && 'is-disabled',
|
|
15
15
|
isReadOnly && 'is-readonly',
|
|
16
16
|
isChecked && 'is-checked',
|
|
@@ -20,4 +20,4 @@ export function LlmRadio({ radioValue, disabled = false, children }) {
|
|
|
20
20
|
.join(' ');
|
|
21
21
|
return (_jsxs("label", { className: classes, children: [_jsx("input", { type: "radio", name: ctx.name || undefined, value: radioValue, checked: isChecked, disabled: isDisabled, readOnly: isReadOnly, onChange: () => !isDisabled && !isReadOnly && ctx.onSelect(radioValue), onBlur: () => ctx.onBlur() }), children && _jsx("span", { className: "radio-text", children: children })] }));
|
|
22
22
|
}
|
|
23
|
-
//# sourceMappingURL=
|
|
23
|
+
//# sourceMappingURL=atl-radio.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"
|
|
1
|
+
{"version":3,"file":"atl-radio.js","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/radio/atl-radio.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,gCAAgC,CAAC;AAC/D,OAAO,iBAAiB,CAAC;AAoBzB;;GAEG;AACH,MAAM,UAAU,QAAQ,CAAC,EAAE,UAAU,EAAE,QAAQ,GAAG,KAAK,EAAE,QAAQ,EAAiB;IAChF,MAAM,GAAG,GAAG,aAAa,EAAE,CAAC;IAC5B,MAAM,UAAU,GAAG,QAAQ,IAAI,GAAG,CAAC,QAAQ,CAAC;IAC5C,MAAM,UAAU,GAAG,GAAG,CAAC,QAAQ,CAAC;IAChC,MAAM,SAAS,GAAG,GAAG,CAAC,KAAK,KAAK,UAAU,CAAC;IAE3C,MAAM,OAAO,GAAG;QACd,WAAW;QACX,UAAU,IAAI,aAAa;QAC3B,UAAU,IAAI,aAAa;QAC3B,SAAS,IAAI,YAAY;QACzB,GAAG,CAAC,OAAO,IAAI,YAAY;KAC5B;SACE,MAAM,CAAC,OAAO,CAAC;SACf,IAAI,CAAC,GAAG,CAAC,CAAC;IAEb,OAAO,CACL,iBAAO,SAAS,EAAE,OAAO,aACvB,gBACE,IAAI,EAAC,OAAO,EACZ,IAAI,EAAE,GAAG,CAAC,IAAI,IAAI,SAAS,EAC3B,KAAK,EAAE,UAAU,EACjB,OAAO,EAAE,SAAS,EAClB,QAAQ,EAAE,UAAU,EACpB,QAAQ,EAAE,UAAU,EACpB,QAAQ,EAAE,GAAG,EAAE,CAAC,CAAC,UAAU,IAAI,CAAC,UAAU,IAAI,GAAG,CAAC,QAAQ,CAAC,UAAU,CAAC,EACtE,MAAM,EAAE,GAAG,EAAE,CAAC,GAAG,CAAC,MAAM,EAAE,GAC1B,EACD,QAAQ,IAAI,eAAM,SAAS,EAAC,YAAY,YAAE,QAAQ,GAAQ,IACrD,CACT,CAAC;AACJ,CAAC","sourcesContent":["import { ReactNode } from 'react';\nimport type { AtlRadioSpec } from '../spec';\nimport { useRadioGroup } from '../radio-group/atl-radio-group';\nimport './atl-radio.css';\n\n/**\n * Properties for the AtlRadio component.\n */\nexport interface AtlRadioProps extends AtlRadioSpec {\n /**\n * The value of the radio button.\n */\n radioValue: string;\n /**\n * Whether the radio button is disabled.\n */\n disabled?: boolean;\n /**\n * The content to be rendered as the label for the radio button.\n */\n children?: ReactNode;\n}\n\n/**\n * An individual radio button component, meant to be used within AtlRadioGroup.\n */\nexport function AtlRadio({ radioValue, disabled = false, children }: AtlRadioProps) {\n const ctx = useRadioGroup();\n const isDisabled = disabled || ctx.disabled;\n const isReadOnly = ctx.readOnly;\n const isChecked = ctx.value === radioValue;\n\n const classes = [\n 'atl-radio',\n isDisabled && 'is-disabled',\n isReadOnly && 'is-readonly',\n isChecked && 'is-checked',\n ctx.invalid && 'is-invalid',\n ]\n .filter(Boolean)\n .join(' ');\n\n return (\n <label className={classes}>\n <input\n type=\"radio\"\n name={ctx.name || undefined}\n value={radioValue}\n checked={isChecked}\n disabled={isDisabled}\n readOnly={isReadOnly}\n onChange={() => !isDisabled && !isReadOnly && ctx.onSelect(radioValue)}\n onBlur={() => ctx.onBlur()}\n />\n {children && <span className=\"radio-text\">{children}</span>}\n </label>\n );\n}\n"]}
|
|
@@ -1,29 +1,29 @@
|
|
|
1
|
-
.
|
|
1
|
+
.atl-radio-group {
|
|
2
2
|
display: flex;
|
|
3
3
|
font-family: var(--ui-font-family);
|
|
4
4
|
gap: var(--ui-spacing-3);
|
|
5
5
|
}
|
|
6
6
|
|
|
7
|
-
.
|
|
7
|
+
.atl-radio-group.orientation-vertical {
|
|
8
8
|
flex-direction: column;
|
|
9
9
|
}
|
|
10
10
|
|
|
11
|
-
.
|
|
11
|
+
.atl-radio-group.orientation-horizontal {
|
|
12
12
|
flex-direction: row;
|
|
13
13
|
flex-wrap: wrap;
|
|
14
14
|
}
|
|
15
15
|
|
|
16
|
-
.
|
|
16
|
+
.atl-radio-group.is-disabled {
|
|
17
17
|
opacity: var(--ui-opacity-disabled);
|
|
18
18
|
cursor: not-allowed;
|
|
19
19
|
}
|
|
20
20
|
|
|
21
21
|
/* Error messages */
|
|
22
|
-
.
|
|
22
|
+
.atl-radio-group .errors {
|
|
23
23
|
margin-top: var(--ui-spacing-2);
|
|
24
24
|
}
|
|
25
25
|
|
|
26
|
-
.
|
|
26
|
+
.atl-radio-group .error-message {
|
|
27
27
|
margin: 0;
|
|
28
28
|
font-size: var(--ui-font-size-sm);
|
|
29
29
|
color: var(--ui-color-error-text);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { InputHTMLAttributes, ReactNode } from 'react';
|
|
2
|
-
import type {
|
|
3
|
-
import './
|
|
2
|
+
import type { AtlRadioGroupSpec } from '../spec';
|
|
3
|
+
import './atl-radio-group.css';
|
|
4
4
|
/**
|
|
5
5
|
* Interface for the RadioGroup context.
|
|
6
6
|
*/
|
|
@@ -36,9 +36,9 @@ export interface RadioGroupContextValue {
|
|
|
36
36
|
}
|
|
37
37
|
export declare const RadioGroupContext: import("react").Context<RadioGroupContextValue>;
|
|
38
38
|
/**
|
|
39
|
-
* Properties for the
|
|
39
|
+
* Properties for the AtlRadioGroup component.
|
|
40
40
|
*/
|
|
41
|
-
export interface
|
|
41
|
+
export interface AtlRadioGroupProps extends Omit<InputHTMLAttributes<HTMLDivElement>, 'onChange'>, AtlRadioGroupSpec {
|
|
42
42
|
/**
|
|
43
43
|
* The current value of the radio group.
|
|
44
44
|
*/
|
|
@@ -83,6 +83,6 @@ export interface LlmRadioGroupProps extends Omit<InputHTMLAttributes<HTMLDivElem
|
|
|
83
83
|
/**
|
|
84
84
|
* A group of radio buttons.
|
|
85
85
|
*/
|
|
86
|
-
export declare function
|
|
86
|
+
export declare function AtlRadioGroup({ value, onValueChange, orientation, name, disabled, readOnly: reactReadOnly, readonly: specReadOnly, invalid, required, errors, children, className, ...rest }: AtlRadioGroupProps): import("react").JSX.Element;
|
|
87
87
|
export declare function useRadioGroup(): RadioGroupContextValue;
|
|
88
|
-
//# sourceMappingURL=
|
|
88
|
+
//# sourceMappingURL=atl-radio-group.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"
|
|
1
|
+
{"version":3,"file":"atl-radio-group.d.ts","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/radio-group/atl-radio-group.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,mBAAmB,EACnB,SAAS,EACV,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AACjD,OAAO,uBAAuB,CAAC;AAE/B;;GAEG;AACH,MAAM,WAAW,sBAAsB;IACrC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,QAAQ,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,QAAQ,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,OAAO,EAAE,OAAO,CAAC;IACjB;;OAEG;IACH,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC;;OAEG;IACH,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAED,eAAO,MAAM,iBAAiB,iDAQ5B,CAAC;AAEH;;GAEG;AACH,MAAM,WAAW,kBACf,SAAQ,IAAI,CAAC,mBAAmB,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,EAC3D,iBAAiB;IACnB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC;;OAEG;IACH,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;GAEG;AACH,wBAAgB,aAAa,CAAC,EAC5B,KAAU,EACV,aAAa,EACb,WAAwB,EACxB,IAAS,EACT,QAAgB,EAChB,QAAQ,EAAE,aAAa,EACvB,QAAQ,EAAE,YAAY,EACtB,OAAe,EACf,QAAgB,EAChB,MAAW,EACX,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACR,EAAE,kBAAkB,+BAsEpB;AAED,wBAAgB,aAAa,IAAI,sBAAsB,CAEtD"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { createContext, useContext, useRef, } from 'react';
|
|
3
|
-
import './
|
|
3
|
+
import './atl-radio-group.css';
|
|
4
4
|
export const RadioGroupContext = createContext({
|
|
5
5
|
value: '',
|
|
6
6
|
name: '',
|
|
@@ -13,7 +13,7 @@ export const RadioGroupContext = createContext({
|
|
|
13
13
|
/**
|
|
14
14
|
* A group of radio buttons.
|
|
15
15
|
*/
|
|
16
|
-
export function
|
|
16
|
+
export function AtlRadioGroup({ value = '', onValueChange, orientation = 'vertical', name = '', disabled = false, readOnly: reactReadOnly, readonly: specReadOnly, invalid = false, required = false, errors = [], children, className, ...rest }) {
|
|
17
17
|
const readOnly = reactReadOnly ?? specReadOnly ?? false;
|
|
18
18
|
const groupRef = useRef(null);
|
|
19
19
|
// Roving arrow-key navigation per the WAI-ARIA radiogroup pattern: Arrow
|
|
@@ -38,7 +38,7 @@ export function LlmRadioGroup({ value = '', onValueChange, orientation = 'vertic
|
|
|
38
38
|
onValueChange?.(target.value);
|
|
39
39
|
};
|
|
40
40
|
const classes = [
|
|
41
|
-
'
|
|
41
|
+
'atl-radio-group',
|
|
42
42
|
`orientation-${orientation}`,
|
|
43
43
|
invalid && 'is-invalid',
|
|
44
44
|
disabled && 'is-disabled',
|
|
@@ -60,4 +60,4 @@ export function LlmRadioGroup({ value = '', onValueChange, orientation = 'vertic
|
|
|
60
60
|
export function useRadioGroup() {
|
|
61
61
|
return useContext(RadioGroupContext);
|
|
62
62
|
}
|
|
63
|
-
//# sourceMappingURL=
|
|
63
|
+
//# sourceMappingURL=atl-radio-group.js.map
|