@lax-wp/design-system 0.8.32 → 0.8.34

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.
@@ -0,0 +1,45 @@
1
+ /**
2
+ * Props for the MarkdownPreview component
3
+ */
4
+ export interface MarkdownPreviewProps {
5
+ /** Markdown content to display */
6
+ content: string;
7
+ /** Additional CSS classes for the wrapper container */
8
+ className?: string;
9
+ /** Link target behavior: '_blank' for new tab, '_self' for current tab */
10
+ linkTarget?: '_blank' | '_self';
11
+ /** Whether to show syntax highlighting for code blocks */
12
+ enableSyntaxHighlighting?: boolean;
13
+ }
14
+ /**
15
+ * MarkdownPreview component displays rendered markdown content.
16
+ *
17
+ * **Supported Markdown Features:**
18
+ * - Headings (H1-H6)
19
+ * - Text formatting (bold, italic, underline, strikethrough)
20
+ * - Lists (bullet and numbered)
21
+ * - Code blocks with syntax highlighting
22
+ * - Inline code
23
+ * - Block quotes
24
+ * - Links with configurable target
25
+ * - Images (responsive)
26
+ * - Tables
27
+ * - Horizontal rules
28
+ *
29
+ * **Features:**
30
+ * - GFM (GitHub Flavored Markdown) support
31
+ * - HTML support via rehype-raw
32
+ * - Syntax highlighting for code blocks
33
+ * - Responsive images
34
+ * - Dark mode support
35
+ * - Configurable link behavior
36
+ *
37
+ * @example
38
+ * ```tsx
39
+ * <MarkdownPreview
40
+ * content="# Hello World\n\nThis is **bold** text."
41
+ * linkTarget="_blank"
42
+ * />
43
+ * ```
44
+ */
45
+ export declare const MarkdownPreview: import("react").ForwardRefExoticComponent<MarkdownPreviewProps & import("react").RefAttributes<HTMLDivElement>>;
@@ -0,0 +1,79 @@
1
+ /**
2
+ * Props for the RichMarkdownInput component
3
+ */
4
+ export interface RichMarkdownInputProps {
5
+ /** Unique identifier for the markdown input */
6
+ id?: string;
7
+ /** Current markdown value */
8
+ value?: string;
9
+ /** Placeholder text for the textarea */
10
+ placeholder?: string;
11
+ /** Minimum number of visible text lines */
12
+ minRows?: number;
13
+ /** Maximum number of visible text lines */
14
+ maxRows?: number;
15
+ /** Whether the input is disabled */
16
+ isDisabled?: boolean;
17
+ /** Additional CSS classes for the wrapper container */
18
+ className?: string;
19
+ /** Additional CSS classes for the textarea */
20
+ textareaClassName?: string;
21
+ /** Additional CSS classes for the preview container */
22
+ previewClassName?: string;
23
+ /** Label text to display above the input */
24
+ label?: string;
25
+ /** Whether the field is required */
26
+ required?: boolean;
27
+ /** Whether to show the preview button */
28
+ showPreviewOnModal?: boolean;
29
+ /** Maximum character count */
30
+ maxLength?: number;
31
+ /** Link target behavior: '_blank' for new tab, '_self' for current tab */
32
+ linkTarget?: '_blank' | '_self';
33
+ /** Callback function called when the markdown value changes */
34
+ onChange: (value: string) => void;
35
+ }
36
+ /**
37
+ * A rich markdown input component with comprehensive formatting toolbar.
38
+ *
39
+ * **Text Formatting:**
40
+ * - Bold (Ctrl+B) - Always visible
41
+ * - Italic (Ctrl+I) - Always visible
42
+ * - Underline (Ctrl+U) - Always visible
43
+ * - Strikethrough - Hidden on mobile (< 640px)
44
+ *
45
+ * **Lists:**
46
+ * - Bullet lists - Always visible
47
+ * - Numbered lists - Always visible
48
+ *
49
+ * **Additional:**
50
+ * - Inline code (Ctrl+E) - Hidden on small screens (< 1024px)
51
+ * - Block quotes - Hidden on medium screens (< 1280px)
52
+ * - Headings - Hidden on small screens (< 1024px)
53
+ * - Links (Ctrl+K) - Hidden on medium screens (< 1280px)
54
+ * - Images - Supported in preview
55
+ * - Horizontal rules - Hidden on large screens (< 1536px)
56
+ *
57
+ * **Features:**
58
+ * - Edit/Preview toggle with icons
59
+ * - Character counter (optional)
60
+ * - Preview modal with scrolling
61
+ * - Keyboard shortcuts
62
+ * - Syntax highlighting for code blocks
63
+ * - Responsive toolbar (hides buttons progressively on smaller screens)
64
+ * - Dark mode support
65
+ * - Configurable link target behavior
66
+ *
67
+ * @example
68
+ * ```tsx
69
+ * <RichMarkdownInput
70
+ * value={markdown}
71
+ * onChange={setMarkdown}
72
+ * placeholder="Enter description..."
73
+ * label="Description"
74
+ * maxLength={300}
75
+ * linkTarget="_blank"
76
+ * />
77
+ * ```
78
+ */
79
+ export declare const RichMarkdownInput: import("react").ForwardRefExoticComponent<RichMarkdownInputProps & import("react").RefAttributes<HTMLTextAreaElement>>;
@@ -0,0 +1,6 @@
1
+ export { MdInput } from './MdInput';
2
+ export type { MdInputProps } from './MdInput';
3
+ export { RichMarkdownInput } from './RichMarkdownInput';
4
+ export type { RichMarkdownInputProps } from './RichMarkdownInput';
5
+ export { MarkdownPreview } from './MarkdownPreview';
6
+ export type { MarkdownPreviewProps } from './MarkdownPreview';
@@ -1 +1 @@
1
- .ant-select-selector{padding-left:18px!important}.lax-popper-overlay.ant-popover{z-index:9999}.lax-popper-overlay .ant-popover-inner{background-color:#fff;border:1px solid #EAECF0;border-radius:8px;box-shadow:0 10px 30px #9e9e9e4d}.lax-popper-overlay .ant-popover-arrow:before{background-color:#fff;border:1px solid #EAECF0}.dark .lax-popper-overlay .ant-popover-inner{background-color:#1d2939;border-color:#344054;box-shadow:0 10px 30px #10101080}.dark .lax-popper-overlay .ant-popover-arrow:before{background-color:#1d2939;border-color:#344054}.Toastify__toast-container{z-index:100000}.Toastify__toast{min-height:64px;border-radius:4px;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.Toastify__toast--success,.Toastify__toast--error,.Toastify__toast--warning,.Toastify__toast--info{background:transparent}.Toastify__toast-body{padding:0;margin:0;color:inherit;font-size:14px;font-weight:500;line-height:1.5}.Toastify__close-button{color:inherit;opacity:.7;align-self:flex-start;background:transparent;border:none;padding:4px;margin:0;transition:opacity .2s ease}.Toastify__close-button:hover{opacity:1}.Toastify__progress-bar{background:linear-gradient(to right,#4caf50,#8bc34a,#cddc39,#ffeb3b,#ffc107,#ff9800,#ff5722)}.Toastify__progress-bar--success{background:#12b76a}.Toastify__progress-bar--error{background:#f04438}.Toastify__progress-bar--warning{background:#f79009}.Toastify__progress-bar--info{background:#016dcf}@media (prefers-color-scheme: dark){.Toastify__toast-container{background:transparent}.Toastify__toast{box-shadow:0 4px 6px -1px #0000004d,0 2px 4px -1px #0003}}@media screen and (max-width: 640px){.Toastify__toast-container{left:1rem;right:1rem;bottom:1rem;width:auto}.Toastify__toast{margin-bottom:.5rem}}.Toastify__slide-enter--bottom-right,.Toastify__slide-enter--bottom-left,.Toastify__slide-enter--bottom-center{animation-duration:.3s;animation-timing-function:cubic-bezier(.4,0,.2,1)}.Toastify__slide-exit--bottom-right,.Toastify__slide-exit--bottom-left,.Toastify__slide-exit--bottom-center{animation-duration:.2s;animation-timing-function:cubic-bezier(.4,0,1,1)}@font-face{font-family:swiper-icons;src:url(data:application/font-woff;charset=utf-8;base64,\ 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);font-weight:400;font-style:normal}:root{--swiper-theme-color: #007aff}:host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function, initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translateZ(0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-slide,.swiper-3d .swiper-cube-shadow{transform-style:preserve-3d}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-css-mode.swiper-centered>.swiper-wrapper:before{content:"";flex-shrink:0;order:9999}.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper:before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper:before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top,.swiper-3d .swiper-slide-shadow-bottom{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:#00000026}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,#00000080,#0000)}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color, var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color: #fff}.swiper-lazy-preloader-black{--swiper-preloader-color: #000}@keyframes swiper-preloader-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translateZ(0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none!important}.swiper-pagination-fraction,.swiper-pagination-custom,.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal{bottom:var(--swiper-pagination-bottom, 8px);top:var(--swiper-pagination-top, auto);left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active,.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));height:var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));display:inline-block;border-radius:var(--swiper-pagination-bullet-border-radius, 50%);background:var(--swiper-pagination-bullet-inactive-color, #000);opacity:var(--swiper-pagination-bullet-inactive-opacity, .2)}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet:only-child{display:none!important}.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color, var(--swiper-theme-color))}.swiper-vertical>.swiper-pagination-bullets,.swiper-pagination-vertical.swiper-pagination-bullets{right:var(--swiper-pagination-right, 8px);left:var(--swiper-pagination-left, auto);top:50%;transform:translate3d(0,-50%,0)}.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap, 6px) 0;display:block}.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap, 4px)}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translate(-50%);white-space:nowrap}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-fraction{color:var(--swiper-pagination-fraction-color, inherit)}.swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color, rgba(0, 0, 0, .25));position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color, var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite{width:100%;height:var(--swiper-pagination-progressbar-size, 4px);left:0;top:0}.swiper-vertical>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite{width:var(--swiper-pagination-progressbar-size, 4px);height:100%;left:0;top:0}.swiper-pagination-lock{display:none}
1
+ :root{--lax-form-focus-border: var(--color-primary-600);--lax-form-focus-shadow: 0 0 0 3px var(--color-primary-100)}.dark{--lax-form-focus-border: var(--color-primary-400);--lax-form-focus-shadow: 0 0 0 3px var(--color-primary-950)}input:where([type=text],[type=email],[type=password],[type=number],[type=search],[type=date],[type=time],[type=datetime-local],[type=url],[type=tel],[type=color]):focus,textarea:focus,select:focus,[contenteditable=true]:focus{outline:none!important;border-color:var(--lax-form-focus-border)!important;box-shadow:var(--lax-form-focus-shadow)!important}.ant-select-focused .ant-select-selector,.ant-picker-focused,.ant-input-affix-wrapper-focused,.ant-input-affix-wrapper:focus-within,.ant-input-number-focused,.ant-input-number:focus-within,.ant-input:focus{outline:none!important;border-color:var(--lax-form-focus-border)!important;box-shadow:var(--lax-form-focus-shadow)!important}.ant-checkbox-input:focus-visible+.ant-checkbox-inner{border-color:var(--lax-form-focus-border)!important;box-shadow:var(--lax-form-focus-shadow)!important}.lax-select__control--is-focused{border-color:var(--lax-form-focus-border)!important;box-shadow:var(--lax-form-focus-shadow)!important}.peer:focus-visible+.lax-toggle-track{border-color:var(--lax-form-focus-border)!important;box-shadow:var(--lax-form-focus-shadow)!important}.lax-form-trigger:focus-visible{outline:none!important;border-color:var(--lax-form-focus-border)!important;box-shadow:var(--lax-form-focus-shadow)!important}.ant-select-selector{padding-left:18px!important}.lax-popper-overlay.ant-popover{z-index:9999}.lax-popper-overlay .ant-popover-inner{background-color:#fff;border:1px solid #EAECF0;border-radius:8px;box-shadow:0 10px 30px #9e9e9e4d}.lax-popper-overlay .ant-popover-arrow:before{background-color:#fff;border:1px solid #EAECF0}.dark .lax-popper-overlay .ant-popover-inner{background-color:#1d2939;border-color:#344054;box-shadow:0 10px 30px #10101080}.dark .lax-popper-overlay .ant-popover-arrow:before{background-color:#1d2939;border-color:#344054}.Toastify__toast-container{z-index:100000}.Toastify__toast{min-height:64px;border-radius:4px;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.Toastify__toast--success,.Toastify__toast--error,.Toastify__toast--warning,.Toastify__toast--info{background:transparent}.Toastify__toast-body{padding:0;margin:0;color:inherit;font-size:14px;font-weight:500;line-height:1.5}.Toastify__close-button{color:inherit;opacity:.7;align-self:flex-start;background:transparent;border:none;padding:4px;margin:0;transition:opacity .2s ease}.Toastify__close-button:hover{opacity:1}.Toastify__progress-bar{background:linear-gradient(to right,#4caf50,#8bc34a,#cddc39,#ffeb3b,#ffc107,#ff9800,#ff5722)}.Toastify__progress-bar--success{background:#12b76a}.Toastify__progress-bar--error{background:#f04438}.Toastify__progress-bar--warning{background:#f79009}.Toastify__progress-bar--info{background:#016dcf}@media (prefers-color-scheme: dark){.Toastify__toast-container{background:transparent}.Toastify__toast{box-shadow:0 4px 6px -1px #0000004d,0 2px 4px -1px #0003}}@media screen and (max-width: 640px){.Toastify__toast-container{left:1rem;right:1rem;bottom:1rem;width:auto}.Toastify__toast{margin-bottom:.5rem}}.Toastify__slide-enter--bottom-right,.Toastify__slide-enter--bottom-left,.Toastify__slide-enter--bottom-center{animation-duration:.3s;animation-timing-function:cubic-bezier(.4,0,.2,1)}.Toastify__slide-exit--bottom-right,.Toastify__slide-exit--bottom-left,.Toastify__slide-exit--bottom-center{animation-duration:.2s;animation-timing-function:cubic-bezier(.4,0,1,1)}@font-face{font-family:swiper-icons;src:url(data:application/font-woff;charset=utf-8;base64,\ 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);font-weight:400;font-style:normal}:root{--swiper-theme-color: #007aff}:host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function, initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translateZ(0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-slide,.swiper-3d .swiper-cube-shadow{transform-style:preserve-3d}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-css-mode.swiper-centered>.swiper-wrapper:before{content:"";flex-shrink:0;order:9999}.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper:before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper:before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top,.swiper-3d .swiper-slide-shadow-bottom{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:#00000026}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,#00000080,#0000)}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color, var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color: #fff}.swiper-lazy-preloader-black{--swiper-preloader-color: #000}@keyframes swiper-preloader-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translateZ(0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none!important}.swiper-pagination-fraction,.swiper-pagination-custom,.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal{bottom:var(--swiper-pagination-bottom, 8px);top:var(--swiper-pagination-top, auto);left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active,.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));height:var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));display:inline-block;border-radius:var(--swiper-pagination-bullet-border-radius, 50%);background:var(--swiper-pagination-bullet-inactive-color, #000);opacity:var(--swiper-pagination-bullet-inactive-opacity, .2)}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet:only-child{display:none!important}.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color, var(--swiper-theme-color))}.swiper-vertical>.swiper-pagination-bullets,.swiper-pagination-vertical.swiper-pagination-bullets{right:var(--swiper-pagination-right, 8px);left:var(--swiper-pagination-left, auto);top:50%;transform:translate3d(0,-50%,0)}.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap, 6px) 0;display:block}.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap, 4px)}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translate(-50%);white-space:nowrap}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-fraction{color:var(--swiper-pagination-fraction-color, inherit)}.swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color, rgba(0, 0, 0, .25));position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color, var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite{width:100%;height:var(--swiper-pagination-progressbar-size, 4px);left:0;top:0}.swiper-vertical>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite{width:var(--swiper-pagination-progressbar-size, 4px);height:100%;left:0;top:0}.swiper-pagination-lock{display:none}
package/dist/index.d.ts CHANGED
@@ -1,3 +1,4 @@
1
+ import "./components/forms/shared/FormFieldFocus.css";
1
2
  export { InputField } from "./components/forms/input-field/InputField";
2
3
  export type { InputFieldProps } from "./components/forms/input-field/InputField";
3
4
  export { BaseInputField, default as BaseInputFieldDefault } from "./components/forms/base-input-field/BaseInputField";
package/dist/index.es.js CHANGED
@@ -1035,7 +1035,7 @@ const dA = ({ labels: A = [] }) => {
1035
1035
  {
1036
1036
  className: q(
1037
1037
  "flex gap-0.5 relative",
1038
- R && y ? "border rounded-lg border-primary-100 bg-primary-50 p-1 focus:ring-blue-500 focus:border-blue-500 dark:focus:ring-neutral-50 dark:focus:border-neutral-50" : ""
1038
+ R && y ? "border rounded-lg border-primary-100 bg-primary-50 p-1 focus:ring-primary-500 focus:border-primary-500 dark:focus:ring-neutral-50 dark:focus:border-neutral-50" : ""
1039
1039
  ),
1040
1040
  onMouseEnter: () => K(!0),
1041
1041
  onMouseLeave: () => K(!1),
@@ -1137,8 +1137,8 @@ const dA = ({ labels: A = [] }) => {
1137
1137
  o && o,
1138
1138
  c || "text-neutral-900 dark:text-black-100",
1139
1139
  x || "text-sm",
1140
- "rounded-md block w-full px-3 py-1.5 font-medium disabled:opacity-70 focus:outline-none focus:ring-2",
1141
- "focus:ring-primary-500 dark:focus:ring-primary-400 focus:border-primary-500 dark:focus:border-primary-400 disabled:!bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400",
1140
+ "rounded-md block w-full px-3 py-1.5 font-medium disabled:opacity-70 focus:outline-none focus:ring-0",
1141
+ "focus:border-primary-600 dark:focus:border-primary-400 focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)] disabled:!bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400",
1142
1142
  P || "",
1143
1143
  N && Q?.color ? `bg-${Q?.color}-50 border-${Q?.color}-300` : "bg-white dark:bg-black-600"
1144
1144
  ),
@@ -1269,7 +1269,7 @@ const qM = Re(
1269
1269
  }
1270
1270
  }
1271
1271
  g.onKeyDown?.(H);
1272
- }, y = m || `textarea-${Math.random().toString(36).substr(2, 9)}`, w = t?.length || 0, P = h && w > h - Math.min(50, h / 5), S = h && w >= h, C = () => s === "error" ? "border-red-300 dark:border-red-500 focus:border-red-500 focus:ring-red-200 dark:focus:ring-red-400" : s === "success" ? "border-green-300 dark:border-green-500 focus:border-green-500 focus:ring-green-200 dark:focus:ring-green-400" : s === "info" ? "border-blue-300 dark:border-blue-500 focus:border-blue-500 focus:ring-blue-200 dark:focus:ring-blue-400" : "border-gray-300 dark:border-gray-600", O = () => s === "error" ? "text-red-500 dark:text-red-400" : s === "success" ? "text-green-500 dark:text-green-400" : s === "info" ? "text-blue-500 dark:text-blue-400" : "text-gray-500 dark:text-gray-400";
1272
+ }, y = m || `textarea-${Math.random().toString(36).substr(2, 9)}`, w = t?.length || 0, P = h && w > h - Math.min(50, h / 5), S = h && w >= h, C = () => s === "error" ? "border-red-300 dark:border-red-500" : s === "success" ? "border-green-300 dark:border-green-500" : s === "info" ? "border-blue-300 dark:border-blue-500" : "border-gray-300 dark:border-gray-600", O = () => s === "error" ? "text-red-500 dark:text-red-400" : s === "success" ? "text-green-500 dark:text-green-400" : s === "info" ? "text-blue-500 dark:text-blue-400" : "text-gray-500 dark:text-gray-400";
1273
1273
  return /* @__PURE__ */ k("div", { className: q("flex flex-col gap-0.5 relative", d), children: [
1274
1274
  A && /* @__PURE__ */ l(
1275
1275
  "label",
@@ -1304,13 +1304,16 @@ const qM = Re(
1304
1304
  // Base styles
1305
1305
  "border rounded-lg bg-white dark:bg-black-600 block w-full py-2.5 px-3",
1306
1306
  "font-inter font-medium text-sm transition-colors duration-200",
1307
- "focus:ring-2 focus:outline-none resize-vertical min-h-[2.5rem]",
1307
+ "resize-vertical min-h-[2.5rem] focus:outline-none focus:ring-0",
1308
+ "hover:border-primary-500 dark:hover:border-primary-400",
1309
+ "focus:border-primary-600 dark:focus:border-primary-400",
1310
+ "focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)]",
1308
1311
  // State-based border styles
1309
1312
  !p && C(),
1310
1313
  // State-based styles
1311
1314
  {
1312
1315
  // No border
1313
- "border-none focus:border-none focus:ring-0": p,
1316
+ "border-none focus:border-none focus:ring-0 focus:shadow-none": p,
1314
1317
  // Disabled state
1315
1318
  "bg-gray-50 dark:bg-gray-700 text-gray-400 dark:text-gray-500 cursor-not-allowed": c,
1316
1319
  "placeholder:text-gray-400 dark:placeholder:text-gray-500": c,
@@ -1498,8 +1501,8 @@ const qM = Re(
1498
1501
  value: t,
1499
1502
  required: o,
1500
1503
  className: q(
1501
- `border rounded-lg bg-white dark:bg-black-600 focus:ring-primary-500 focus:border-primary-500
1502
- dark:focus:ring-primary-400 dark:focus:border-primary-400 block w-full py-2.5 px-3 font-inter font-medium text-sm
1504
+ `border rounded-lg bg-white dark:bg-black-600 focus:outline-none focus:ring-0 focus:border-[var(--color-primary-600)] dark:focus:border-[var(--color-primary-400)] focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)]
1505
+ block w-full py-2.5 px-3 font-inter font-medium text-sm
1503
1506
  disabled:bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400`,
1504
1507
  {
1505
1508
  "border-red-300": i,
@@ -2390,7 +2393,7 @@ const M9 = ({
2390
2393
  id: r,
2391
2394
  type: "checkbox",
2392
2395
  value: "",
2393
- className: "w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:!bg-neutral-600 dark:border-gray-600",
2396
+ className: "w-4 h-4 text-primary-600 bg-gray-100 border-gray-300 rounded focus:ring-primary-500 dark:focus:ring-primary-400 dark:ring-offset-gray-800 focus:ring-2 dark:!bg-neutral-600 dark:border-gray-600",
2394
2397
  ...n
2395
2398
  }
2396
2399
  ),
@@ -2655,7 +2658,7 @@ const kd = () => {
2655
2658
  padding: "0 4px 0 12px",
2656
2659
  opacity: L.isDisabled ? 0.6 : 1,
2657
2660
  cursor: L.isDisabled ? "not-allowed" : "pointer",
2658
- boxShadow: "none",
2661
+ boxShadow: L.isFocused ? v ? "0 0 0 1.5px var(--color-primary-950)" : "0 0 0 1.5px var(--color-primary-100)" : "none",
2659
2662
  "&:hover": {
2660
2663
  borderColor: t && c ? v ? "#F04438" : "#fda49b" : "var(--color-primary-600)"
2661
2664
  }
@@ -2796,6 +2799,7 @@ const kd = () => {
2796
2799
  {
2797
2800
  ...x,
2798
2801
  id: "cm" + e,
2802
+ classNamePrefix: "lax-select",
2799
2803
  required: c,
2800
2804
  options: r,
2801
2805
  isClearable: !1,
@@ -2891,7 +2895,7 @@ const y0 = ({
2891
2895
  const S = {
2892
2896
  control: (N, T) => ({
2893
2897
  ...N,
2894
- borderColor: o && a ? "#F04438" : T.isFocused ? b ? "#1e1e1e" : g[600] : b ? "#1e1e1e" : "#e2e8f0",
2898
+ borderColor: o && a ? "#F04438" : T.isFocused ? b ? g[400] : g[600] : b ? "#1e1e1e" : "#e2e8f0",
2895
2899
  backgroundColor: T.isDisabled ? b ? "#1a1a1a" : "#f5f5f5" : b ? "#262626" : "#FFFFFF",
2896
2900
  color: T.isDisabled ? b ? "#666666" : "#a0a0a0" : b ? "#d4d4d4" : "#0F172A",
2897
2901
  borderRadius: "6px",
@@ -2900,7 +2904,7 @@ const y0 = ({
2900
2904
  padding: "0px 10px",
2901
2905
  cursor: T.isDisabled ? "not-allowed" : "default",
2902
2906
  opacity: (T.isDisabled, 1),
2903
- boxShadow: T.isFocused ? b ? `0 0 0 2px ${g[400]}` : `0 0 0 2px ${g[500]}` : "none"
2907
+ boxShadow: T.isFocused ? b ? `0 0 0 3px ${g[950]}` : `0 0 0 3px ${g[100]}` : "none"
2904
2908
  }),
2905
2909
  valueContainer: (N) => ({
2906
2910
  ...N,
@@ -3091,6 +3095,7 @@ const y0 = ({
3091
3095
  bg,
3092
3096
  {
3093
3097
  required: !0,
3098
+ classNamePrefix: "lax-select",
3094
3099
  options: t,
3095
3100
  placeholder: r,
3096
3101
  value: u,
@@ -3555,7 +3560,7 @@ const w0 = ({
3555
3560
  inputRef: u || S,
3556
3561
  type: "text",
3557
3562
  className: q(
3558
- `absolute inset-0 dark:text-[#98A2B3] text-neutral-900 ${m ? "pl-2" : "pl-10"} pl-10 pr-7 w-full text-sm dark:text-white bg-transparent rounded-lg focus:outline-none focus:!ring-primary-500 focus:!border-primary-500`,
3563
+ `absolute inset-0 dark:text-[#98A2B3] text-neutral-900 ${m ? "pl-2" : "pl-10"} pl-10 pr-7 w-full text-sm dark:text-white bg-transparent rounded-lg focus:outline-none focus:ring-primary-500 focus:border-primary-500`,
3559
3564
  "border border-solid",
3560
3565
  "dark:border-neutral-800 border-neutral-200",
3561
3566
  "dark:caret-white",
@@ -3688,7 +3693,7 @@ const V9 = (A, e, t, r = "medium") => {
3688
3693
  large: "peer-checked:after:translate-x-5"
3689
3694
  };
3690
3695
  return q(
3691
- "p-0.5 rounded-full peer after:content-[''] after:absolute after:rounded-full after:transition-all bg-gray-200 dark:bg-black-400 peer-focus-visible:outline-none peer-focus-visible:ring-2 peer-focus-visible:ring-primary-500 peer-focus-visible:ring-offset-2 peer-focus-visible:ring-offset-white dark:peer-focus-visible:ring-primary-400 dark:peer-focus-visible:ring-offset-black-900",
3696
+ "p-0.5 rounded-full peer after:content-[''] after:absolute after:rounded-full after:transition-all bg-gray-200 dark:bg-black-400 peer-focus-visible:outline-none peer-focus-visible:ring-2 peer-focus-visible:ring-primary-500 peer-focus-visible:ring-offset-2 peer-focus-visible:ring-offset-white dark:peer-focus-visible:ring-primary-400 dark:peer-focus-visible:ring-offset-black-900 peer-focus-visible:shadow-[0_0_0_3px_var(--color-primary-100)] dark:peer-focus-visible:shadow-[0_0_0_3px_var(--color-primary-950)]",
3692
3697
  n[r],
3693
3698
  i[r],
3694
3699
  {
@@ -4278,7 +4283,7 @@ const Yl = (A, e) => {
4278
4283
  target: { value: "0.00" }
4279
4284
  }), C?.();
4280
4285
  }, B = () => {
4281
- const G = "pl-11 border h-[32px] text-sm rounded-lg block w-full p-2.5 font-inter font-medium text-neutral-900 dark:text-black-200 disabled:bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400", _ = n ? "border-red-300" : T && N?.color ? `border-${N.color}-300` : "border-gray-300 dark:border-black-600", Ce = `${T && N?.color ? `bg-${N.color}-50` : "bg-white dark:bg-black-600"}`;
4286
+ const G = "pl-11 border h-[32px] text-sm rounded-lg block w-full p-2.5 font-inter font-medium text-neutral-900 dark:text-black-200 disabled:bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400 focus:outline-none focus:ring-0 focus:border-[var(--color-primary-600)] dark:focus:border-[var(--color-primary-400)] focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)]", _ = n ? "border-red-300" : T && N?.color ? `border-${N.color}-300` : "border-gray-300 dark:border-black-600", Ce = `${T && N?.color ? `bg-${N.color}-50` : "bg-white dark:bg-black-600"}`;
4282
4287
  return `${G} ${_} ${Ce} ${f}`;
4283
4288
  };
4284
4289
  return Ae(() => {
@@ -6004,8 +6009,9 @@ const x6 = ({
6004
6009
  i,
6005
6010
  o,
6006
6011
  "dark:bg-black-700 text-neutral-900 dark:text-neutral-100 text-[14px] rounded-md",
6007
- "focus:outline-none focus:ring-2 focus:ring-primary-500 dark:focus:ring-primary-400",
6008
- "focus:border-primary-500 dark:focus:border-primary-400",
6012
+ "focus:outline-none focus:ring-0",
6013
+ "focus:border-[var(--color-primary-600)] dark:focus:border-[var(--color-primary-400)]",
6014
+ "focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)]",
6009
6015
  "block w-full h-8 px-3 py-1.5 font-inter font-medium",
6010
6016
  "disabled:opacity-70 disabled:!bg-neutral-50 dark:disabled:!bg-black-800"
6011
6017
  ),
@@ -6399,7 +6405,7 @@ const Ht = ({
6399
6405
  }, [A, e]), D = ua(), Q = Oe(() => m?.length ? m.map((L) => {
6400
6406
  const M = wd[L];
6401
6407
  return M ? D === "macos" ? M.macos : M.other : L;
6402
- }) : [], [m, D]), N = () => /* @__PURE__ */ l(qe, { children: /* @__PURE__ */ l(md, { size: 24, className: "inline mr-2 spinner" }) }), T = u || (A === "primary" ? "submit" : u);
6408
+ }) : [], [m, D]), N = () => /* @__PURE__ */ l(qe, { children: /* @__PURE__ */ l(md, { size: 24, className: "inline mr-2 spinner" }) }), T = u || (A === "primary" && e === "filled" ? "submit" : u);
6403
6409
  return /* @__PURE__ */ l(De, { title: f, placement: p, shortcuts: b, delayShow: !0, children: /* @__PURE__ */ k(
6404
6410
  "button",
6405
6411
  {
@@ -11737,7 +11743,7 @@ const W7 = Re(
11737
11743
  disabled: s,
11738
11744
  min: a,
11739
11745
  max: o,
11740
- className: `border ${n ? "border-red-300" : N && Q?.color ? `border-${Q.color}-300` : "border-gray-300"} ${u} h-[32px] text-gray-900 dark:bg-black-600 dark:text-neutral-200 text-sm rounded-lg focus:ring-primary-500 focus:border-primary-500 block w-full p-2.5 font-inter font-medium
11746
+ className: `border ${n ? "border-red-300" : N && Q?.color ? `border-${Q.color}-300` : "border-gray-300"} ${u} h-[32px] text-gray-900 dark:bg-black-600 dark:text-neutral-200 text-sm rounded-lg focus:outline-none focus:ring-0 focus:border-[var(--color-primary-600)] dark:focus:border-[var(--color-primary-400)] focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)] block w-full p-2.5 font-inter font-medium
11741
11747
  disabled:bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400
11742
11748
  ${N && Q?.color && `bg-${Q.color}-50`}
11743
11749
  ${f || ""}
@@ -12309,7 +12315,7 @@ const BM = ({
12309
12315
  ref: d,
12310
12316
  type: "button",
12311
12317
  id: `btn-icon-picker-icon-${A ? "selected" : "unselected"}`,
12312
- className: `min-w-[83px] py-1.5 px-3 rounded-md border ${i ? "cursor-not-allowed opacity-60 bg-neutral-50 dark:bg-black-800" : "bg-white dark:bg-black-800"} ${s ? "border-red-500" : "focus:border-primary-200 "} flex items-center justify-between gap-2`,
12318
+ className: `lax-form-trigger min-w-[83px] py-1.5 px-3 rounded-md border ${i ? "cursor-not-allowed opacity-60 bg-neutral-50 dark:bg-black-800" : "bg-white dark:bg-black-800"} ${s ? "border-red-500" : "focus:border-primary-600 dark:focus:border-primary-400"} flex items-center justify-between gap-2`,
12313
12319
  disabled: i,
12314
12320
  onClick: (f) => {
12315
12321
  if (i) {
@@ -37590,7 +37596,14 @@ const Tz = _1(M3), eD = (A, e, t) => {
37590
37596
  {
37591
37597
  id: o,
37592
37598
  type: d ? "number" : "text",
37593
- className: q(e),
37599
+ className: q(
37600
+ "border border-neutral-200 dark:border-black-600 rounded-md block w-full px-3 py-1.5 h-[32px] font-medium text-sm text-neutral-900 dark:text-black-100",
37601
+ "bg-white dark:bg-black-600 disabled:opacity-70 disabled:!bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400",
37602
+ "hover:border-primary-500 dark:hover:border-primary-400",
37603
+ "focus:outline-none focus:ring-0 focus:border-primary-600 dark:focus:border-primary-400",
37604
+ "focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)]",
37605
+ e
37606
+ ),
37594
37607
  disabled: t,
37595
37608
  onChange: ({ target: p }) => r && r(p.value),
37596
37609
  onFocus: h,