thread-ui 0.1.2 → 0.1.3
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/dist/components/button/base-button/base-button.d.ts +3 -0
- package/dist/components/button/base-button/base-button.d.ts.map +1 -0
- package/dist/components/button/base-button/base-button.js +40 -0
- package/dist/components/button/base-button/base-button.js.map +1 -0
- package/dist/components/button/base-button/base-button.types.d.ts +15 -0
- package/dist/components/button/base-button/base-button.types.d.ts.map +1 -0
- package/dist/components/button/base-button/base-button.types.js +2 -0
- package/dist/components/button/base-button/base-button.types.js.map +1 -0
- package/dist/components/button/button.d.ts +1 -1
- package/dist/components/button/button.d.ts.map +1 -1
- package/dist/components/button/button.js +3 -27
- package/dist/components/button/button.js.map +1 -1
- package/dist/components/button/button.types.d.ts +2 -6
- package/dist/components/button/button.types.d.ts.map +1 -1
- package/dist/components/icon/icon.d.ts +9 -0
- package/dist/components/icon/icon.d.ts.map +1 -1
- package/dist/components/icon/icon.js +10 -2
- package/dist/components/icon/icon.js.map +1 -1
- package/dist/components/icon-button/icon-button.d.ts +3 -0
- package/dist/components/icon-button/icon-button.d.ts.map +1 -0
- package/dist/components/icon-button/icon-button.js +10 -0
- package/dist/components/icon-button/icon-button.js.map +1 -0
- package/dist/components/icon-button/icon-button.types.d.ts +8 -0
- package/dist/components/icon-button/icon-button.types.d.ts.map +1 -0
- package/dist/components/icon-button/icon-button.types.js +2 -0
- package/dist/components/icon-button/icon-button.types.js.map +1 -0
- package/dist/components/icon-button/index.d.ts +3 -0
- package/dist/components/icon-button/index.d.ts.map +1 -0
- package/dist/components/icon-button/index.js +2 -0
- package/dist/components/icon-button/index.js.map +1 -0
- package/dist/components/toggle/index.d.ts +4 -0
- package/dist/components/toggle/index.d.ts.map +1 -0
- package/dist/components/toggle/index.js +3 -0
- package/dist/components/toggle/index.js.map +1 -0
- package/dist/components/toggle/mode-toggle/mode-toggle.d.ts +2 -0
- package/dist/components/toggle/mode-toggle/mode-toggle.d.ts.map +1 -0
- package/dist/components/toggle/mode-toggle/mode-toggle.js +9 -0
- package/dist/components/toggle/mode-toggle/mode-toggle.js.map +1 -0
- package/dist/components/toggle/toggle.d.ts +4 -0
- package/dist/components/toggle/toggle.d.ts.map +1 -0
- package/dist/components/toggle/toggle.js +57 -0
- package/dist/components/toggle/toggle.js.map +1 -0
- package/dist/components/toggle/toggle.types.d.ts +7 -0
- package/dist/components/toggle/toggle.types.d.ts.map +1 -0
- package/dist/components/toggle/toggle.types.js +2 -0
- package/dist/components/toggle/toggle.types.js.map +1 -0
- package/dist/defaults/theme/default-theme.js +1 -1
- package/dist/index.d.ts +3 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +3 -1
- package/dist/index.js.map +1 -1
- package/dist/styles/thread.css +14 -0
- package/dist/types/colors/utility-color-options.types.d.ts +1 -1
- package/dist/types/colors/utility-color-options.types.d.ts.map +1 -1
- package/dist/types/index.d.ts +1 -0
- package/dist/types/index.d.ts.map +1 -1
- package/dist/types/theme/size/themeSizes.types.d.ts +1 -0
- package/dist/types/theme/size/themeSizes.types.d.ts.map +1 -1
- package/dist/utils/get-utility-color/get-utility-color-value.d.ts.map +1 -1
- package/dist/utils/get-utility-color/get-utility-color-value.js +2 -0
- package/dist/utils/get-utility-color/get-utility-color-value.js.map +1 -1
- package/dist/utils/get-utility-size/get-utility-size-value.d.ts +3 -0
- package/dist/utils/get-utility-size/get-utility-size-value.d.ts.map +1 -0
- package/dist/utils/get-utility-size/get-utility-size-value.js +14 -0
- package/dist/utils/get-utility-size/get-utility-size-value.js.map +1 -0
- package/dist/utils/index.d.ts +1 -0
- package/dist/utils/index.d.ts.map +1 -1
- package/dist/utils/index.js +1 -1
- package/dist/utils/index.js.map +1 -1
- package/package.json +2 -2
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { BaseButtonProps } from './base-button.types';
|
|
2
|
+
export declare const BaseButton: ({ children, fullWidth, color, onClick, type, margin, disabled, onHoverStateChange, }: BaseButtonProps) => import("react/jsx-runtime").JSX.Element;
|
|
3
|
+
//# sourceMappingURL=base-button.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"base-button.d.ts","sourceRoot":"","sources":["../../../../src/components/button/base-button/base-button.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,eAAO,MAAM,UAAU,yFASpB,eAAe,4CAiDjB,CAAC"}
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import { useState } from 'react';
|
|
4
|
+
import { getUtilityColorValue, useTheme } from '../../../utils';
|
|
5
|
+
export const BaseButton = ({ children, fullWidth, color = 'primary', onClick, type = 'button', margin, disabled = false, onHoverStateChange, }) => {
|
|
6
|
+
const { theme } = useTheme();
|
|
7
|
+
const [isHovered, setIsHovered] = useState(false);
|
|
8
|
+
const colorValue = getUtilityColorValue(color);
|
|
9
|
+
const buttonStyles = {
|
|
10
|
+
padding: `${theme.space * 2}px`,
|
|
11
|
+
width: fullWidth ? '100%' : 'fit-content',
|
|
12
|
+
transition: 'background-color 0.2s ease',
|
|
13
|
+
border: `${theme.border.size.md}px ${colorValue} solid`,
|
|
14
|
+
borderRadius: `${theme.border.radius.md}px`,
|
|
15
|
+
color: theme.colors.white,
|
|
16
|
+
backgroundColor: colorValue,
|
|
17
|
+
margin: margin ?? 'auto',
|
|
18
|
+
display: 'flex',
|
|
19
|
+
flexDirection: 'row',
|
|
20
|
+
gap: theme.space,
|
|
21
|
+
justifyContent: 'center',
|
|
22
|
+
alignItems: 'center',
|
|
23
|
+
cursor: 'pointer',
|
|
24
|
+
userSelect: 'none',
|
|
25
|
+
opacity: disabled ? 0.6 : 1,
|
|
26
|
+
};
|
|
27
|
+
const hoverButton = {
|
|
28
|
+
...buttonStyles,
|
|
29
|
+
backgroundColor: disabled ? colorValue : theme.colors.white,
|
|
30
|
+
color: disabled ? theme.colors.white : colorValue,
|
|
31
|
+
};
|
|
32
|
+
const handleHover = (hovered) => {
|
|
33
|
+
if (!disabled) {
|
|
34
|
+
setIsHovered(hovered);
|
|
35
|
+
onHoverStateChange?.(hovered);
|
|
36
|
+
}
|
|
37
|
+
};
|
|
38
|
+
return (_jsx("button", { type: type, style: isHovered ? hoverButton : buttonStyles, onMouseEnter: () => handleHover(true), onMouseLeave: () => handleHover(false), onClick: disabled ? undefined : onClick, children: children }));
|
|
39
|
+
};
|
|
40
|
+
//# sourceMappingURL=base-button.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"base-button.js","sourceRoot":"","sources":["../../../../src/components/button/base-button/base-button.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AACb,OAAO,EAAiB,QAAQ,EAAE,MAAM,OAAO,CAAC;AAChD,OAAO,EAAE,oBAAoB,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAEhE,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EAC1B,QAAQ,EACR,SAAS,EACT,KAAK,GAAG,SAAS,EACjB,OAAO,EACP,IAAI,GAAG,QAAQ,EACf,MAAM,EACN,QAAQ,GAAG,KAAK,EAChB,kBAAkB,GACD,EAAE,EAAE;IACrB,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,EAAE,CAAC;IAC7B,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAElD,MAAM,UAAU,GAAG,oBAAoB,CAAC,KAAK,CAAC,CAAC;IAE/C,MAAM,YAAY,GAAkB;QACnC,OAAO,EAAE,GAAG,KAAK,CAAC,KAAK,GAAG,CAAC,IAAI;QAC/B,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,aAAa;QACzC,UAAU,EAAE,4BAA4B;QACxC,MAAM,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,MAAM,UAAU,QAAQ;QACvD,YAAY,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,IAAI;QAC3C,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK;QACzB,eAAe,EAAE,UAAU;QAC3B,MAAM,EAAE,MAAM,IAAI,MAAM;QACxB,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,KAAK;QACpB,GAAG,EAAE,KAAK,CAAC,KAAK;QAChB,cAAc,EAAE,QAAQ;QACxB,UAAU,EAAE,QAAQ;QACpB,MAAM,EAAE,SAAS;QACjB,UAAU,EAAE,MAAM;QAClB,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;KAC3B,CAAC;IAEF,MAAM,WAAW,GAAkB;QAClC,GAAG,YAAY;QACf,eAAe,EAAE,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK;QAC3D,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU;KACjD,CAAC;IAEF,MAAM,WAAW,GAAG,CAAC,OAAgB,EAAE,EAAE;QACxC,IAAI,CAAC,QAAQ,EAAE,CAAC;YACf,YAAY,CAAC,OAAO,CAAC,CAAC;YACtB,kBAAkB,EAAE,CAAC,OAAO,CAAC,CAAC;QAC/B,CAAC;IACF,CAAC,CAAC;IAEF,OAAO,CACN,iBACC,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,YAAY,EAC7C,YAAY,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,EACrC,YAAY,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,KAAK,CAAC,EACtC,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,YAEtC,QAAQ,GACD,CACT,CAAC;AACH,CAAC,CAAC"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
import { UtilityColorOptions } from '../../../types';
|
|
3
|
+
export type RootButtonProps = {
|
|
4
|
+
fullWidth?: boolean;
|
|
5
|
+
color?: UtilityColorOptions;
|
|
6
|
+
type?: 'button' | 'submit' | 'reset';
|
|
7
|
+
onClick?: () => void;
|
|
8
|
+
margin?: string;
|
|
9
|
+
disabled?: boolean;
|
|
10
|
+
};
|
|
11
|
+
export type BaseButtonProps = RootButtonProps & {
|
|
12
|
+
children?: ReactNode;
|
|
13
|
+
onHoverStateChange?: (isHovered: boolean) => void;
|
|
14
|
+
};
|
|
15
|
+
//# sourceMappingURL=base-button.types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"base-button.types.d.ts","sourceRoot":"","sources":["../../../../src/components/button/base-button/base-button.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,OAAO,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAGrD,MAAM,MAAM,eAAe,GAAG;IAC7B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,mBAAmB,CAAC;IAC5B,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IACrC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAGF,MAAM,MAAM,eAAe,GAAG,eAAe,GAAG;IAC/C,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,kBAAkB,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CAClD,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"base-button.types.js","sourceRoot":"","sources":["../../../../src/components/button/base-button/base-button.types.ts"],"names":[],"mappings":""}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { ButtonProps } from './button.types';
|
|
2
|
-
export declare const Button: ({ children, fullWidth, color, onClick, type, margin }: ButtonProps) => import("react/jsx-runtime").JSX.Element;
|
|
2
|
+
export declare const Button: ({ children, fullWidth, color, onClick, type, margin, disabled, }: ButtonProps) => import("react/jsx-runtime").JSX.Element;
|
|
3
3
|
//# sourceMappingURL=button.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/button/button.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/button/button.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAG7C,eAAO,MAAM,MAAM,qEAQhB,WAAW,4CAMb,CAAC"}
|
|
@@ -1,31 +1,7 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
-
import {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
const { theme } = useTheme();
|
|
7
|
-
const [isHovered, setIsHovered] = useState(false);
|
|
8
|
-
const colorValue = getUtilityColorValue(color);
|
|
9
|
-
const buttonStyles = {
|
|
10
|
-
padding: `${theme.space * 2}px`,
|
|
11
|
-
width: fullWidth ? '100%' : 'fit-content',
|
|
12
|
-
transition: 'background-color 0.2s ease',
|
|
13
|
-
border: `${theme.border.size.md}px ${colorValue} solid`,
|
|
14
|
-
borderRadius: `${theme.border.radius.md}px`,
|
|
15
|
-
color: theme.colors.white,
|
|
16
|
-
backgroundColor: colorValue,
|
|
17
|
-
margin: margin ?? 'auto',
|
|
18
|
-
display: 'flex',
|
|
19
|
-
justifyContent: 'center',
|
|
20
|
-
alignItems: 'center',
|
|
21
|
-
cursor: 'pointer',
|
|
22
|
-
userSelect: 'none',
|
|
23
|
-
};
|
|
24
|
-
const hoverButton = {
|
|
25
|
-
...buttonStyles,
|
|
26
|
-
backgroundColor: theme.colors.white,
|
|
27
|
-
color: colorValue,
|
|
28
|
-
};
|
|
29
|
-
return (_jsx("button", { type: type, style: isHovered ? hoverButton : buttonStyles, onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), onClick: onClick, children: children }));
|
|
3
|
+
import { BaseButton } from './base-button/base-button';
|
|
4
|
+
export const Button = ({ children, fullWidth, color = 'primary', onClick, type = 'button', margin, disabled = false, }) => {
|
|
5
|
+
return (_jsx(BaseButton, { fullWidth: fullWidth, color: color, onClick: onClick, type: type, margin: margin, disabled: disabled, children: children }));
|
|
30
6
|
};
|
|
31
7
|
//# sourceMappingURL=button.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../src/components/button/button.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;
|
|
1
|
+
{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../src/components/button/button.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAIb,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAEvD,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,EACtB,QAAQ,EACR,SAAS,EACT,KAAK,GAAG,SAAS,EACjB,OAAO,EACP,IAAI,GAAG,QAAQ,EACf,MAAM,EACN,QAAQ,GAAG,KAAK,GACH,EAAE,EAAE;IACjB,OAAO,CACN,KAAC,UAAU,IAAC,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,YAC9G,QAAQ,GACG,CACb,CAAC;AACH,CAAC,CAAC"}
|
|
@@ -1,10 +1,6 @@
|
|
|
1
1
|
import { ReactNode } from 'react';
|
|
2
|
-
|
|
2
|
+
import { RootButtonProps } from './base-button/base-button.types';
|
|
3
|
+
export type ButtonProps = RootButtonProps & {
|
|
3
4
|
children: ReactNode;
|
|
4
|
-
fullWidth?: boolean;
|
|
5
|
-
color?: 'primary' | 'secondary' | 'tertiary' | 'black' | 'grey' | 'success' | 'error' | 'info';
|
|
6
|
-
type?: 'button' | 'submit' | 'reset';
|
|
7
|
-
onClick?: () => void;
|
|
8
|
-
margin?: string;
|
|
9
5
|
};
|
|
10
6
|
//# sourceMappingURL=button.types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.types.d.ts","sourceRoot":"","sources":["../../../src/components/button/button.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"button.types.d.ts","sourceRoot":"","sources":["../../../src/components/button/button.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAGlE,MAAM,MAAM,WAAW,GAAG,eAAe,GAAG;IAC3C,QAAQ,EAAE,SAAS,CAAC;CACpB,CAAC"}
|
|
@@ -1,4 +1,13 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { IconProps } from './icon.types';
|
|
3
|
+
/**
|
|
4
|
+
* Standard Icon Component from Phosphor
|
|
5
|
+
* @param name Icon Name from Phosphor Icons
|
|
6
|
+
* @param color Icon Color
|
|
7
|
+
* @param size Icon Size [8 | 12 | 16 | 24 | 32 | 48 | 64]
|
|
8
|
+
* @param weight Icon Weight ['light' | 'regular' | 'bold']
|
|
9
|
+
* @param filled Icon Fill
|
|
10
|
+
* @returns ReactNode Icon
|
|
11
|
+
*/
|
|
3
12
|
export declare const Icon: React.FC<IconProps>;
|
|
4
13
|
//# sourceMappingURL=icon.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../../src/components/icon/icon.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAIzC,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,
|
|
1
|
+
{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../../src/components/icon/icon.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAIzC;;;;;;;;GAQG;AACH,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAUpC,CAAC"}
|
|
@@ -1,9 +1,17 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
3
|
import * as PhosphorIcons from '@phosphor-icons/react';
|
|
4
|
-
import { getUtilityColorValue
|
|
4
|
+
import { getUtilityColorValue } from '../../utils';
|
|
5
|
+
/**
|
|
6
|
+
* Standard Icon Component from Phosphor
|
|
7
|
+
* @param name Icon Name from Phosphor Icons
|
|
8
|
+
* @param color Icon Color
|
|
9
|
+
* @param size Icon Size [8 | 12 | 16 | 24 | 32 | 48 | 64]
|
|
10
|
+
* @param weight Icon Weight ['light' | 'regular' | 'bold']
|
|
11
|
+
* @param filled Icon Fill
|
|
12
|
+
* @returns ReactNode Icon
|
|
13
|
+
*/
|
|
5
14
|
export const Icon = ({ name, color, size = 24, weight = 'regular', filled = false }) => {
|
|
6
|
-
const { theme } = useTheme();
|
|
7
15
|
const IconComponent = PhosphorIcons[name];
|
|
8
16
|
const colorValue = getUtilityColorValue(color);
|
|
9
17
|
return _jsx(IconComponent, { color: colorValue, size: size, weight: filled ? 'fill' : weight });
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon.js","sourceRoot":"","sources":["../../../src/components/icon/icon.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,aAAa,MAAM,uBAAuB,CAAC;AAGvD,OAAO,EAAE,oBAAoB,
|
|
1
|
+
{"version":3,"file":"icon.js","sourceRoot":"","sources":["../../../src/components/icon/icon.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,aAAa,MAAM,uBAAuB,CAAC;AAGvD,OAAO,EAAE,oBAAoB,EAAY,MAAM,aAAa,CAAC;AAE7D;;;;;;;;GAQG;AACH,MAAM,CAAC,MAAM,IAAI,GAAwB,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,GAAG,EAAE,EAAE,MAAM,GAAG,SAAS,EAAE,MAAM,GAAG,KAAK,EAAE,EAAE,EAAE;IAC3G,MAAM,aAAa,GAAG,aAAa,CAAC,IAAI,CAItC,CAAC;IAEH,MAAM,UAAU,GAAG,oBAAoB,CAAC,KAAK,CAAC,CAAC;IAE/C,OAAO,KAAC,aAAa,IAAC,KAAK,EAAE,UAAU,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,GAAI,CAAC;AAC3F,CAAC,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"icon-button.d.ts","sourceRoot":"","sources":["../../../src/components/icon-button/icon-button.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAEtD,eAAO,MAAM,UAAU,2EASpB,eAAe,4CAiBjB,CAAC"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { useState } from 'react';
|
|
4
|
+
import { BaseButton } from '../button/base-button/base-button';
|
|
5
|
+
import { Icon } from '../icon/icon';
|
|
6
|
+
export const IconButton = ({ children, fullWidth, color = 'primary', onClick, type = 'button', margin, disabled = false, name, }) => {
|
|
7
|
+
const [isHovered, setIsHovered] = useState(false);
|
|
8
|
+
return (_jsxs(BaseButton, { fullWidth: fullWidth, color: color, onClick: onClick, type: type, margin: margin, disabled: disabled, onHoverStateChange: setIsHovered, children: [_jsx(Icon, { color: isHovered ? color : 'text', name: name, size: 24 }), children] }));
|
|
9
|
+
};
|
|
10
|
+
//# sourceMappingURL=icon-button.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"icon-button.js","sourceRoot":"","sources":["../../../src/components/icon-button/icon-button.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AACb,OAAO,EAAiB,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEhD,OAAO,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAC/D,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAGpC,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EAC1B,QAAQ,EACR,SAAS,EACT,KAAK,GAAG,SAAS,EACjB,OAAO,EACP,IAAI,GAAG,QAAQ,EACf,MAAM,EACN,QAAQ,GAAG,KAAK,EAChB,IAAI,GACa,EAAE,EAAE;IACrB,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAElD,OAAO,CACN,MAAC,UAAU,IACV,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,kBAAkB,EAAE,YAAY,aAEhC,KAAC,IAAI,IAAC,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,GAAI,EAChE,QAAQ,IACG,CACb,CAAC;AACH,CAAC,CAAC"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
import { RootButtonProps } from '../button/base-button/base-button.types';
|
|
3
|
+
import { IconNames } from '../icon/icon.types';
|
|
4
|
+
export type IconButtonProps = RootButtonProps & {
|
|
5
|
+
name: IconNames;
|
|
6
|
+
children?: ReactNode;
|
|
7
|
+
};
|
|
8
|
+
//# sourceMappingURL=icon-button.types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"icon-button.types.d.ts","sourceRoot":"","sources":["../../../src/components/icon-button/icon-button.types.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,eAAe,EAAE,MAAM,yCAAyC,CAAC;AAC1E,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAG/C,MAAM,MAAM,eAAe,GAAG,eAAe,GAAG;IAC/C,IAAI,EAAE,SAAS,CAAC;IAChB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"icon-button.types.js","sourceRoot":"","sources":["../../../src/components/icon-button/icon-button.types.tsx"],"names":[],"mappings":""}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/icon-button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/icon-button/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/toggle/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/toggle/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"mode-toggle.d.ts","sourceRoot":"","sources":["../../../../src/components/toggle/mode-toggle/mode-toggle.tsx"],"names":[],"mappings":"AAIA,eAAO,MAAM,UAAU,+CAItB,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import Toggle from '../toggle';
|
|
4
|
+
import { useThemeMode } from '../../../utils';
|
|
5
|
+
export const ModeToggle = () => {
|
|
6
|
+
const [mode, setMode] = useThemeMode();
|
|
7
|
+
return _jsx(Toggle, { isOn: mode === 'dark', onToggle: () => setMode(mode === 'light' ? 'dark' : 'light'), color: "primary" });
|
|
8
|
+
};
|
|
9
|
+
//# sourceMappingURL=mode-toggle.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"mode-toggle.js","sourceRoot":"","sources":["../../../../src/components/toggle/mode-toggle/mode-toggle.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AACb,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAE9C,MAAM,CAAC,MAAM,UAAU,GAAG,GAAG,EAAE;IAC9B,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,YAAY,EAAE,CAAC;IAEvC,OAAO,KAAC,MAAM,IAAC,IAAI,EAAE,IAAI,KAAK,MAAM,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,EAAE,KAAK,EAAC,SAAS,GAAG,CAAC;AACxH,CAAC,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"toggle.d.ts","sourceRoot":"","sources":["../../../src/components/toggle/toggle.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C,eAAO,MAAM,MAAM,8BAA2C,WAAW,4CAiExE,CAAC;AAEF,eAAe,MAAM,CAAC"}
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { getUtilityColorValue, useTheme } from '../../utils';
|
|
4
|
+
export const Toggle = ({ isOn, onToggle, color = 'success' }) => {
|
|
5
|
+
const { theme } = useTheme();
|
|
6
|
+
const colorValue = getUtilityColorValue(color);
|
|
7
|
+
const styles = {
|
|
8
|
+
button: {
|
|
9
|
+
position: 'relative',
|
|
10
|
+
display: 'inline-flex',
|
|
11
|
+
alignItems: 'center',
|
|
12
|
+
height: '24px',
|
|
13
|
+
width: '44px',
|
|
14
|
+
borderRadius: '9999px',
|
|
15
|
+
transition: 'background-color 200ms ease-in-out',
|
|
16
|
+
outline: 'none',
|
|
17
|
+
},
|
|
18
|
+
buttonOn: {
|
|
19
|
+
backgroundColor: colorValue,
|
|
20
|
+
},
|
|
21
|
+
buttonOff: {
|
|
22
|
+
backgroundColor: theme.colors.gray.main,
|
|
23
|
+
},
|
|
24
|
+
knob: {
|
|
25
|
+
display: 'inline-block',
|
|
26
|
+
height: '16px',
|
|
27
|
+
width: '16px',
|
|
28
|
+
backgroundColor: 'white',
|
|
29
|
+
borderRadius: '9999px',
|
|
30
|
+
transform: 'translateX(4px)',
|
|
31
|
+
transition: 'transform 200ms ease-in-out',
|
|
32
|
+
},
|
|
33
|
+
knobOn: {
|
|
34
|
+
transform: 'translateX(24px)',
|
|
35
|
+
},
|
|
36
|
+
srOnly: {
|
|
37
|
+
position: 'absolute',
|
|
38
|
+
width: '1px',
|
|
39
|
+
height: '1px',
|
|
40
|
+
padding: '0',
|
|
41
|
+
margin: '-1px',
|
|
42
|
+
overflow: 'hidden',
|
|
43
|
+
clip: 'rect(0, 0, 0, 0)',
|
|
44
|
+
whiteSpace: 'nowrap',
|
|
45
|
+
borderWidth: '0',
|
|
46
|
+
},
|
|
47
|
+
};
|
|
48
|
+
return (_jsxs("button", { type: "button", onClick: onToggle, style: {
|
|
49
|
+
...styles.button,
|
|
50
|
+
...(isOn ? styles.buttonOn : styles.buttonOff),
|
|
51
|
+
}, children: [_jsx("span", { style: styles.srOnly, children: isOn ? 'On' : 'Off' }), _jsx("span", { style: {
|
|
52
|
+
...styles.knob,
|
|
53
|
+
...(isOn ? styles.knobOn : {}),
|
|
54
|
+
} })] }));
|
|
55
|
+
};
|
|
56
|
+
export default Toggle;
|
|
57
|
+
//# sourceMappingURL=toggle.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"toggle.js","sourceRoot":"","sources":["../../../src/components/toggle/toggle.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,oBAAoB,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAG7D,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,GAAG,SAAS,EAAe,EAAE,EAAE;IAC5E,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,EAAE,CAAC;IAE7B,MAAM,UAAU,GAAG,oBAAoB,CAAC,KAAK,CAAC,CAAC;IAE/C,MAAM,MAAM,GAAkC;QAC7C,MAAM,EAAE;YACP,QAAQ,EAAE,UAAU;YACpB,OAAO,EAAE,aAAa;YACtB,UAAU,EAAE,QAAQ;YACpB,MAAM,EAAE,MAAM;YACd,KAAK,EAAE,MAAM;YACb,YAAY,EAAE,QAAQ;YACtB,UAAU,EAAE,oCAAoC;YAChD,OAAO,EAAE,MAAM;SACf;QACD,QAAQ,EAAE;YACT,eAAe,EAAE,UAAU;SAC3B;QACD,SAAS,EAAE;YACV,eAAe,EAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI;SACvC;QACD,IAAI,EAAE;YACL,OAAO,EAAE,cAAc;YACvB,MAAM,EAAE,MAAM;YACd,KAAK,EAAE,MAAM;YACb,eAAe,EAAE,OAAO;YACxB,YAAY,EAAE,QAAQ;YACtB,SAAS,EAAE,iBAAiB;YAC5B,UAAU,EAAE,6BAA6B;SACzC;QACD,MAAM,EAAE;YACP,SAAS,EAAE,kBAAkB;SAC7B;QACD,MAAM,EAAE;YACP,QAAQ,EAAE,UAAU;YACpB,KAAK,EAAE,KAAK;YACZ,MAAM,EAAE,KAAK;YACb,OAAO,EAAE,GAAG;YACZ,MAAM,EAAE,MAAM;YACd,QAAQ,EAAE,QAAQ;YAClB,IAAI,EAAE,kBAAkB;YACxB,UAAU,EAAE,QAAQ;YACpB,WAAW,EAAE,GAAG;SAChB;KACD,CAAC;IAEF,OAAO,CACN,kBACC,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,QAAQ,EACjB,KAAK,EAAE;YACN,GAAG,MAAM,CAAC,MAAM;YAChB,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC;SAC9C,aAED,eAAM,KAAK,EAAE,MAAM,CAAC,MAAM,YAAG,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,GAAQ,EACxD,eACC,KAAK,EAAE;oBACN,GAAG,MAAM,CAAC,IAAI;oBACd,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;iBAC9B,GACA,IACM,CACT,CAAC;AACH,CAAC,CAAC;AAEF,eAAe,MAAM,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"toggle.types.d.ts","sourceRoot":"","sources":["../../../src/components/toggle/toggle.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAElD,MAAM,MAAM,WAAW,GAAG;IACzB,IAAI,EAAE,OAAO,CAAC;IACd,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,KAAK,CAAC,EAAE,mBAAmB,CAAC;CAC5B,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"toggle.types.js","sourceRoot":"","sources":["../../../src/components/toggle/toggle.types.ts"],"names":[],"mappings":""}
|
package/dist/index.d.ts
CHANGED
|
@@ -6,6 +6,8 @@ export * from './components/masonry-layout';
|
|
|
6
6
|
export * from './components/column-layout';
|
|
7
7
|
export * from './components/button';
|
|
8
8
|
export * from './components/icon';
|
|
9
|
+
export * from './components/icon-button';
|
|
10
|
+
export * from './components/toggle';
|
|
9
11
|
export * from './types';
|
|
10
|
-
export { createTheme, createAppliedTheme, ThemeProvider } from './utils';
|
|
12
|
+
export { createTheme, createAppliedTheme, ThemeProvider, useTheme } from './utils';
|
|
11
13
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,qBAAqB,CAAC;AAG7B,cAAc,wBAAwB,CAAC;AACvC,cAAc,uBAAuB,CAAC;AACtC,cAAc,sBAAsB,CAAC;AACrC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,qBAAqB,CAAC;AAG7B,cAAc,wBAAwB,CAAC;AACvC,cAAc,uBAAuB,CAAC;AACtC,cAAc,sBAAsB,CAAC;AACrC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,0BAA0B,CAAC;AACzC,cAAc,qBAAqB,CAAC;AAGpC,cAAc,SAAS,CAAC;AAGxB,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC"}
|
package/dist/index.js
CHANGED
|
@@ -8,8 +8,10 @@ export * from './components/masonry-layout';
|
|
|
8
8
|
export * from './components/column-layout';
|
|
9
9
|
export * from './components/button';
|
|
10
10
|
export * from './components/icon';
|
|
11
|
+
export * from './components/icon-button';
|
|
12
|
+
export * from './components/toggle';
|
|
11
13
|
// Export Types
|
|
12
14
|
export * from './types';
|
|
13
15
|
// Export Utility Functions
|
|
14
|
-
export { createTheme, createAppliedTheme, ThemeProvider } from './utils';
|
|
16
|
+
export { createTheme, createAppliedTheme, ThemeProvider, useTheme } from './utils';
|
|
15
17
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,yBAAyB;AACzB,OAAO,qBAAqB,CAAC;AAE7B,oBAAoB;AACpB,cAAc,wBAAwB,CAAC;AACvC,cAAc,uBAAuB,CAAC;AACtC,cAAc,sBAAsB,CAAC;AACrC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,yBAAyB;AACzB,OAAO,qBAAqB,CAAC;AAE7B,oBAAoB;AACpB,cAAc,wBAAwB,CAAC;AACvC,cAAc,uBAAuB,CAAC;AACtC,cAAc,sBAAsB,CAAC;AACrC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,0BAA0B,CAAC;AACzC,cAAc,qBAAqB,CAAC;AAEpC,eAAe;AACf,cAAc,SAAS,CAAC;AAExB,2BAA2B;AAC3B,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC"}
|
package/dist/styles/thread.css
CHANGED
|
@@ -547,6 +547,9 @@ thread-[hidden]:where(:not([hidden="until-found"])) {
|
|
|
547
547
|
.thread-h-1\/6 {
|
|
548
548
|
height: 16.666667%;
|
|
549
549
|
}
|
|
550
|
+
.thread-h-16 {
|
|
551
|
+
height: 4rem;
|
|
552
|
+
}
|
|
550
553
|
.thread-h-5\/6 {
|
|
551
554
|
height: 83.333333%;
|
|
552
555
|
}
|
|
@@ -565,6 +568,9 @@ thread-[hidden]:where(:not([hidden="until-found"])) {
|
|
|
565
568
|
.thread-min-h-full {
|
|
566
569
|
min-height: 100%;
|
|
567
570
|
}
|
|
571
|
+
.thread-w-2\/4 {
|
|
572
|
+
width: 50%;
|
|
573
|
+
}
|
|
568
574
|
.thread-w-\[391px\] {
|
|
569
575
|
width: 391px;
|
|
570
576
|
}
|
|
@@ -615,6 +621,11 @@ thread-[hidden]:where(:not([hidden="until-found"])) {
|
|
|
615
621
|
-moz-column-gap: 0.5rem;
|
|
616
622
|
column-gap: 0.5rem;
|
|
617
623
|
}
|
|
624
|
+
.thread-space-y-4 > :not([hidden]) ~ :not([hidden]) {
|
|
625
|
+
--tw-space-y-reverse: 0;
|
|
626
|
+
margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
|
|
627
|
+
margin-bottom: calc(1rem * var(--tw-space-y-reverse));
|
|
628
|
+
}
|
|
618
629
|
.thread-overflow-hidden {
|
|
619
630
|
overflow: hidden;
|
|
620
631
|
}
|
|
@@ -638,6 +649,9 @@ thread-[hidden]:where(:not([hidden="until-found"])) {
|
|
|
638
649
|
.thread-p-2 {
|
|
639
650
|
padding: 0.5rem;
|
|
640
651
|
}
|
|
652
|
+
.thread-p-4 {
|
|
653
|
+
padding: 1rem;
|
|
654
|
+
}
|
|
641
655
|
.thread-py-10 {
|
|
642
656
|
padding-top: 2.5rem;
|
|
643
657
|
padding-bottom: 2.5rem;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export type UtilityColorOptions = 'primary' | 'secondary' | 'tertiary' | 'black' | 'grey' | 'success' | 'error' | 'info';
|
|
1
|
+
export type UtilityColorOptions = 'primary' | 'secondary' | 'tertiary' | 'black' | 'grey' | 'success' | 'error' | 'info' | 'text';
|
|
2
2
|
//# sourceMappingURL=utility-color-options.types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utility-color-options.types.d.ts","sourceRoot":"","sources":["../../../src/types/colors/utility-color-options.types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,mBAAmB,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC"}
|
|
1
|
+
{"version":3,"file":"utility-color-options.types.d.ts","sourceRoot":"","sources":["../../../src/types/colors/utility-color-options.types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,mBAAmB,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC"}
|
package/dist/types/index.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
export { UtilityColorOptions } from './colors/utility-color-options.types';
|
|
2
2
|
export { Theme, AppliedTheme, ThemeMode, ThemeContextType } from './theme/theme.types';
|
|
3
3
|
export { ImageProps } from './image/image.types';
|
|
4
|
+
export { UtilitySizes } from './theme/size/themeSizes.types';
|
|
4
5
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/types/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,sCAAsC,CAAC;AAE3E,OAAO,EAAE,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAGvF,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/types/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,sCAAsC,CAAC;AAE3E,OAAO,EAAE,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAGvF,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAGjD,OAAO,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"themeSizes.types.d.ts","sourceRoot":"","sources":["../../../../src/types/theme/size/themeSizes.types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,UAAU,GAAG;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,GAAG,EAAE,MAAM,CAAC;CACZ,CAAC"}
|
|
1
|
+
{"version":3,"file":"themeSizes.types.d.ts","sourceRoot":"","sources":["../../../../src/types/theme/size/themeSizes.types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,YAAY,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE9C,MAAM,MAAM,UAAU,GAAG;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,GAAG,EAAE,MAAM,CAAC;CACZ,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-utility-color-value.d.ts","sourceRoot":"","sources":["../../../src/utils/get-utility-color/get-utility-color-value.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAGlD,eAAO,MAAM,oBAAoB,UAAW,mBAAmB,KAAG,
|
|
1
|
+
{"version":3,"file":"get-utility-color-value.d.ts","sourceRoot":"","sources":["../../../src/utils/get-utility-color/get-utility-color-value.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAGlD,eAAO,MAAM,oBAAoB,UAAW,mBAAmB,KAAG,MAwBjE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-utility-color-value.js","sourceRoot":"","sources":["../../../src/utils/get-utility-color/get-utility-color-value.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAE9C,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,KAA0B,EAAU,EAAE;IAC1E,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,EAAE,CAAC;IAC7B,QAAQ,KAAK,EAAE,CAAC;QACf,KAAK,SAAS;YACb,OAAO,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC;QAClC,KAAK,WAAW;YACf,OAAO,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC;QACpC,KAAK,UAAU;YACd,OAAO,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC;QACnC,KAAK,OAAO;YACX,OAAO,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;QAC3B,KAAK,MAAM;YACV,OAAO,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;QAC/B,KAAK,SAAS;YACb,OAAO,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC;QAClC,KAAK,OAAO;YACX,OAAO,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC;QAChC,KAAK,MAAM;YACV,OAAO,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;QAC/B;YACC,OAAO,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC;IACnC,CAAC;AACF,CAAC,CAAC"}
|
|
1
|
+
{"version":3,"file":"get-utility-color-value.js","sourceRoot":"","sources":["../../../src/utils/get-utility-color/get-utility-color-value.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAE9C,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,KAA0B,EAAU,EAAE;IAC1E,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,EAAE,CAAC;IAC7B,QAAQ,KAAK,EAAE,CAAC;QACf,KAAK,SAAS;YACb,OAAO,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC;QAClC,KAAK,WAAW;YACf,OAAO,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC;QACpC,KAAK,UAAU;YACd,OAAO,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC;QACnC,KAAK,OAAO;YACX,OAAO,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;QAC3B,KAAK,MAAM;YACV,OAAO,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;QAC/B,KAAK,SAAS;YACb,OAAO,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC;QAClC,KAAK,OAAO;YACX,OAAO,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC;QAChC,KAAK,MAAM;YACV,OAAO,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;QAC/B,KAAK,MAAM;YACV,OAAO,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC;QACpC;YACC,OAAO,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC;IACnC,CAAC;AACF,CAAC,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"get-utility-size-value.d.ts","sourceRoot":"","sources":["../../../src/utils/get-utility-size/get-utility-size-value.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAE3C,eAAO,MAAM,mBAAmB,SAAU,YAAY,KAAG,EAAE,GAAG,EAAE,GAAG,EAWlE,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"get-utility-size-value.js","sourceRoot":"","sources":["../../../src/utils/get-utility-size/get-utility-size-value.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAIb,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,IAAkB,EAAgB,EAAE;IACvE,QAAQ,IAAI,EAAE,CAAC;QACd,KAAK,IAAI;YACR,OAAO,EAAE,CAAC;QACX,KAAK,IAAI;YACR,OAAO,EAAE,CAAC;QACX,KAAK,IAAI;YACR,OAAO,EAAE,CAAC;QACX;YACC,OAAO,EAAE,CAAC;IACZ,CAAC;AACF,CAAC,CAAC"}
|
package/dist/utils/index.d.ts
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
export { useResponsiveStyles } from './responsive/responsive-styles';
|
|
2
2
|
export { getUtilityColorValue } from './get-utility-color/get-utility-color-value';
|
|
3
|
+
export { getUtilitySizeValue } from './get-utility-size/get-utility-size-value';
|
|
3
4
|
export { ThemeProvider, useTheme, useThemeMode } from './theme/use-theme';
|
|
4
5
|
export { createTheme, createAppliedTheme } from './theme/create-theme';
|
|
5
6
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,gCAAgC,CAAC;AACrE,OAAO,EAAE,oBAAoB,EAAE,MAAM,6CAA6C,CAAC;AACnF,OAAO,EAAE,mBAAmB,EAAE,MAAM,2CAA2C,CAAC;AAChF,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAE1E,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC"}
|
package/dist/utils/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
// export { useTheme } from './theme/use-theme';
|
|
2
1
|
export { useResponsiveStyles } from './responsive/responsive-styles';
|
|
3
2
|
export { getUtilityColorValue } from './get-utility-color/get-utility-color-value';
|
|
3
|
+
export { getUtilitySizeValue } from './get-utility-size/get-utility-size-value';
|
|
4
4
|
export { ThemeProvider, useTheme, useThemeMode } from './theme/use-theme';
|
|
5
5
|
export { createTheme, createAppliedTheme } from './theme/create-theme';
|
|
6
6
|
//# sourceMappingURL=index.js.map
|
package/dist/utils/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,gCAAgC,CAAC;AACrE,OAAO,EAAE,oBAAoB,EAAE,MAAM,6CAA6C,CAAC;AACnF,OAAO,EAAE,mBAAmB,EAAE,MAAM,2CAA2C,CAAC;AAChF,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAE1E,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "thread-ui",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.3",
|
|
4
4
|
"description": "UI Library for React Applications.",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/index.js",
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
"build-css": "npx postcss src/styles/styles.css -o dist/styles/thread.css",
|
|
20
20
|
"build-tailwind": "npx tailwindcss -i ./src/styles/styles.css -o ./src/styles/thread.css --watch",
|
|
21
21
|
"pack": "npm pack",
|
|
22
|
-
"pack-dev": "npm pack && mkdir -p dist && mv thread-ui-*.tgz dist/",
|
|
22
|
+
"pack-dev": "npm run prepare-publish && npm pack && mkdir -p dist && mv thread-ui-*.tgz dist/",
|
|
23
23
|
"test": "jest",
|
|
24
24
|
"storybook": "concurrently \"npm run build-tailwind\" \"storybook dev -p 6006\"",
|
|
25
25
|
"storybook:build": "storybook build",
|