@qasa/qds-ui 0.27.2 → 0.29.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.
- package/README.md +2 -5
- package/dist/index.d.ts +56 -64
- package/dist/index.js +2 -345
- package/dist/index.js.map +1 -1
- package/dist/preset.css +72 -4
- package/package.json +26 -31
package/README.md
CHANGED
|
@@ -6,11 +6,8 @@ QDS UI is a React component library used internally for [Qasa](https://qasa.se)
|
|
|
6
6
|
|
|
7
7
|
## 📖 Documentation
|
|
8
8
|
|
|
9
|
-
All documentation is hosted on our [documentation site](https://qasa.
|
|
9
|
+
All documentation is hosted on our [documentation site](https://qds.qasa.com).
|
|
10
10
|
|
|
11
11
|
## ⚙️ Installation
|
|
12
12
|
|
|
13
|
-
To install the library
|
|
14
|
-
`yarn add @qasa/qds-ui @emotion/react @emotion/styled`
|
|
15
|
-
|
|
16
|
-
For a full guide on how to get started, [see the docs](https://qasa.supernova-docs.io/qds/latest/getting-started/overview.html).
|
|
13
|
+
To install the library, see the [installation guide](https://qds.qasa.com/docs/getting-started/developers#setup-qds-in-your-react-app).
|
package/dist/index.d.ts
CHANGED
|
@@ -3,13 +3,9 @@ import * as _emotion_react from '@emotion/react';
|
|
|
3
3
|
import { EmotionCache, CSSObject } from '@emotion/react';
|
|
4
4
|
import * as react from 'react';
|
|
5
5
|
import { ElementType, ComponentPropsWithoutRef, ReactNode, SVGAttributes, ReactElement, useLayoutEffect } from 'react';
|
|
6
|
-
import
|
|
7
|
-
import * as DropdownPrimitive from '@radix-ui/react-dropdown-menu';
|
|
6
|
+
import { Checkbox as Checkbox$1, DropdownMenu as DropdownMenu$1, RadioGroup as RadioGroup$1, Switch as Switch$1, Toast as Toast$1 } from 'radix-ui';
|
|
8
7
|
import * as _emotion_styled from '@emotion/styled';
|
|
9
8
|
import { LucideIcon } from 'lucide-react';
|
|
10
|
-
import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
|
|
11
|
-
import * as RadixSwitch from '@radix-ui/react-switch';
|
|
12
|
-
import * as ToastPrimitive from '@radix-ui/react-toast';
|
|
13
9
|
|
|
14
10
|
declare const theme: {
|
|
15
11
|
mediaQueries: {
|
|
@@ -433,16 +429,12 @@ type PartialRecord<K extends string | number | symbol, T> = Partial<Record<K, T>
|
|
|
433
429
|
type Merge<P1 = {}, P2 = {}> = Omit<P1, keyof P2> & P2;
|
|
434
430
|
type HTMLQdsProps<T extends ElementType> = ComponentPropsWithoutRef<T>;
|
|
435
431
|
|
|
436
|
-
type DeepPartial<T> = {
|
|
437
|
-
[P in keyof T]?: DeepPartial<T[P]>;
|
|
438
|
-
};
|
|
439
432
|
interface TypographyOverride {
|
|
440
433
|
fontFamily?: string;
|
|
441
434
|
fontWeight?: '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
|
|
442
435
|
}
|
|
443
436
|
type TypographyOverrides = PartialRecord<keyof Theme['typography'], TypographyOverride>;
|
|
444
437
|
interface ThemeOverrides {
|
|
445
|
-
colors?: DeepPartial<Theme['colors']>;
|
|
446
438
|
typography?: TypographyOverrides;
|
|
447
439
|
}
|
|
448
440
|
declare const overrideTheme: (overrides: ThemeOverrides) => {
|
|
@@ -643,6 +635,52 @@ declare const overrideTheme: (overrides: ThemeOverrides) => {
|
|
|
643
635
|
};
|
|
644
636
|
};
|
|
645
637
|
};
|
|
638
|
+
mediaQueries: {
|
|
639
|
+
readonly smUp: "@media(min-width: 480px)";
|
|
640
|
+
readonly mdUp: "@media(min-width: 768px)";
|
|
641
|
+
readonly lgUp: "@media(min-width: 1024px)";
|
|
642
|
+
readonly xlUp: "@media(min-width: 1280px)";
|
|
643
|
+
readonly '2xlUp': "@media(min-width: 1536px)";
|
|
644
|
+
};
|
|
645
|
+
spacing: {
|
|
646
|
+
'0x': string;
|
|
647
|
+
'1x': string;
|
|
648
|
+
'2x': string;
|
|
649
|
+
'3x': string;
|
|
650
|
+
'4x': string;
|
|
651
|
+
'5x': string;
|
|
652
|
+
'6x': string;
|
|
653
|
+
'8x': string;
|
|
654
|
+
'10x': string;
|
|
655
|
+
'12x': string;
|
|
656
|
+
'14x': string;
|
|
657
|
+
'16x': string;
|
|
658
|
+
'20x': string;
|
|
659
|
+
'24x': string;
|
|
660
|
+
};
|
|
661
|
+
breakpoints: {
|
|
662
|
+
readonly base: 0;
|
|
663
|
+
readonly sm: 480;
|
|
664
|
+
readonly md: 768;
|
|
665
|
+
readonly lg: 1024;
|
|
666
|
+
readonly xl: 1280;
|
|
667
|
+
readonly '2xl': 1536;
|
|
668
|
+
};
|
|
669
|
+
zIndices: {
|
|
670
|
+
hide: number;
|
|
671
|
+
auto: string;
|
|
672
|
+
base: number;
|
|
673
|
+
docked: number;
|
|
674
|
+
dropdown: number;
|
|
675
|
+
sticky: number;
|
|
676
|
+
banner: number;
|
|
677
|
+
overlay: number;
|
|
678
|
+
modal: number;
|
|
679
|
+
popover: number;
|
|
680
|
+
skipLink: number;
|
|
681
|
+
toast: number;
|
|
682
|
+
tooltip: number;
|
|
683
|
+
};
|
|
646
684
|
colors: {
|
|
647
685
|
core: {
|
|
648
686
|
black: string;
|
|
@@ -761,52 +799,6 @@ declare const overrideTheme: (overrides: ThemeOverrides) => {
|
|
|
761
799
|
positive: string;
|
|
762
800
|
};
|
|
763
801
|
};
|
|
764
|
-
mediaQueries: {
|
|
765
|
-
readonly smUp: "@media(min-width: 480px)";
|
|
766
|
-
readonly mdUp: "@media(min-width: 768px)";
|
|
767
|
-
readonly lgUp: "@media(min-width: 1024px)";
|
|
768
|
-
readonly xlUp: "@media(min-width: 1280px)";
|
|
769
|
-
readonly '2xlUp': "@media(min-width: 1536px)";
|
|
770
|
-
};
|
|
771
|
-
spacing: {
|
|
772
|
-
'0x': string;
|
|
773
|
-
'1x': string;
|
|
774
|
-
'2x': string;
|
|
775
|
-
'3x': string;
|
|
776
|
-
'4x': string;
|
|
777
|
-
'5x': string;
|
|
778
|
-
'6x': string;
|
|
779
|
-
'8x': string;
|
|
780
|
-
'10x': string;
|
|
781
|
-
'12x': string;
|
|
782
|
-
'14x': string;
|
|
783
|
-
'16x': string;
|
|
784
|
-
'20x': string;
|
|
785
|
-
'24x': string;
|
|
786
|
-
};
|
|
787
|
-
breakpoints: {
|
|
788
|
-
readonly base: 0;
|
|
789
|
-
readonly sm: 480;
|
|
790
|
-
readonly md: 768;
|
|
791
|
-
readonly lg: 1024;
|
|
792
|
-
readonly xl: 1280;
|
|
793
|
-
readonly '2xl': 1536;
|
|
794
|
-
};
|
|
795
|
-
zIndices: {
|
|
796
|
-
hide: number;
|
|
797
|
-
auto: string;
|
|
798
|
-
base: number;
|
|
799
|
-
docked: number;
|
|
800
|
-
dropdown: number;
|
|
801
|
-
sticky: number;
|
|
802
|
-
banner: number;
|
|
803
|
-
overlay: number;
|
|
804
|
-
modal: number;
|
|
805
|
-
popover: number;
|
|
806
|
-
skipLink: number;
|
|
807
|
-
toast: number;
|
|
808
|
-
tooltip: number;
|
|
809
|
-
};
|
|
810
802
|
sizes: {
|
|
811
803
|
112: string;
|
|
812
804
|
128: string;
|
|
@@ -1363,8 +1355,8 @@ interface CheckboxOptions {
|
|
|
1363
1355
|
*/
|
|
1364
1356
|
value?: string;
|
|
1365
1357
|
}
|
|
1366
|
-
type CheckboxProps = Omit<
|
|
1367
|
-
declare const Checkbox: react.ForwardRefExoticComponent<Omit<
|
|
1358
|
+
type CheckboxProps = Omit<Checkbox$1.CheckboxProps, 'asChild' | 'children' | 'checked' | 'defaultChecked' | keyof CheckboxOptions> & CheckboxOptions;
|
|
1359
|
+
declare const Checkbox: react.ForwardRefExoticComponent<Omit<Checkbox$1.CheckboxProps, "children" | "asChild" | keyof CheckboxOptions> & CheckboxOptions & react.RefAttributes<HTMLButtonElement>>;
|
|
1368
1360
|
|
|
1369
1361
|
interface DividerOptions {
|
|
1370
1362
|
/**
|
|
@@ -1378,7 +1370,7 @@ interface DividerProps extends HTMLQdsProps<'span'>, DividerOptions {
|
|
|
1378
1370
|
}
|
|
1379
1371
|
declare const Divider: react.ForwardRefExoticComponent<DividerProps & react.RefAttributes<HTMLDivElement>>;
|
|
1380
1372
|
|
|
1381
|
-
type PrimitiveContentProps =
|
|
1373
|
+
type PrimitiveContentProps = DropdownMenu$1.DropdownMenuContentProps;
|
|
1382
1374
|
interface DropdownMenuContentOptions {
|
|
1383
1375
|
/**
|
|
1384
1376
|
* Event handler called when focus moves to the trigger after closing.
|
|
@@ -1464,7 +1456,7 @@ interface DropdownMenuItemOptions {
|
|
|
1464
1456
|
*/
|
|
1465
1457
|
icon?: ElementType<IconProps>;
|
|
1466
1458
|
}
|
|
1467
|
-
interface DropdownMenuItemProps extends Omit<
|
|
1459
|
+
interface DropdownMenuItemProps extends Omit<DropdownMenu$1.DropdownMenuItemProps, 'asChild' | keyof DropdownMenuItemOptions>, DropdownMenuItemOptions {
|
|
1468
1460
|
}
|
|
1469
1461
|
|
|
1470
1462
|
type DropdownTriggerComponent = ForwardRefComponent<'button'>;
|
|
@@ -1901,7 +1893,7 @@ interface RadioCardOptions {
|
|
|
1901
1893
|
*/
|
|
1902
1894
|
isDisabled?: boolean;
|
|
1903
1895
|
}
|
|
1904
|
-
interface RadioCardProps extends Omit<
|
|
1896
|
+
interface RadioCardProps extends Omit<RadioGroup$1.RadioGroupItemProps, 'asChild' | keyof RadioCardOptions>, RadioCardOptions {
|
|
1905
1897
|
}
|
|
1906
1898
|
|
|
1907
1899
|
interface RadioButtonOptions {
|
|
@@ -1920,7 +1912,7 @@ interface RadioButtonOptions {
|
|
|
1920
1912
|
*/
|
|
1921
1913
|
isDisabled?: boolean;
|
|
1922
1914
|
}
|
|
1923
|
-
interface RadioButtonProps extends Omit<
|
|
1915
|
+
interface RadioButtonProps extends Omit<RadioGroup$1.RadioGroupItemProps, 'asChild' | keyof RadioButtonOptions>, RadioButtonOptions {
|
|
1924
1916
|
}
|
|
1925
1917
|
|
|
1926
1918
|
type RadioGroupLabelProps = HTMLQdsProps<'span'>;
|
|
@@ -1964,7 +1956,7 @@ interface RadioGroupOptions {
|
|
|
1964
1956
|
*/
|
|
1965
1957
|
errorMessage?: string;
|
|
1966
1958
|
}
|
|
1967
|
-
interface RadioGroupProps extends Omit<
|
|
1959
|
+
interface RadioGroupProps extends Omit<RadioGroup$1.RadioGroupProps, 'asChild' | keyof RadioGroupOptions>, RadioGroupOptions {
|
|
1968
1960
|
}
|
|
1969
1961
|
declare const RadioGroup: react.ForwardRefExoticComponent<RadioGroupProps & react.RefAttributes<HTMLDivElement>> & {
|
|
1970
1962
|
Card: react.ForwardRefExoticComponent<RadioCardProps & react.RefAttributes<HTMLButtonElement>>;
|
|
@@ -2087,7 +2079,7 @@ interface SwitchOptions {
|
|
|
2087
2079
|
isRequired?: boolean;
|
|
2088
2080
|
onCheckedChange?: (isChecked: boolean) => void;
|
|
2089
2081
|
}
|
|
2090
|
-
interface SwitchProps extends Omit<
|
|
2082
|
+
interface SwitchProps extends Omit<Switch$1.SwitchProps, 'asChild' | keyof SwitchOptions>, SwitchOptions {
|
|
2091
2083
|
}
|
|
2092
2084
|
declare const Switch: react.ForwardRefExoticComponent<SwitchProps & react.RefAttributes<HTMLButtonElement>>;
|
|
2093
2085
|
|
|
@@ -2149,7 +2141,7 @@ interface ToastOptions {
|
|
|
2149
2141
|
type OmittedProps$1 = 'children';
|
|
2150
2142
|
interface ToastProps extends Omit<HTMLQdsProps<'div'>, OmittedProps$1>, ToastOptions {
|
|
2151
2143
|
}
|
|
2152
|
-
declare function Toast(props: ToastProps &
|
|
2144
|
+
declare function Toast(props: ToastProps & Toast$1.ToastProps): react_jsx_runtime.JSX.Element;
|
|
2153
2145
|
|
|
2154
2146
|
interface UseBreakpointOptions {
|
|
2155
2147
|
/**
|