@situaction/traquiste-mobile 1.0.0-next.5 → 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/components/ButtonMenu/ButtonMenu.d.ts +2 -1
- package/build/components/ButtonMenu/ButtonMenu.d.ts.map +1 -1
- package/build/components/ButtonMenu/ButtonMenu.js.map +1 -1
- package/build/context/ThemeContext.d.ts +2 -2
- package/build/context/ThemeContext.d.ts.map +1 -1
- package/build/context/ThemeContext.js +1 -1
- package/build/context/ThemeContext.js.map +1 -1
- package/package.json +1 -1
|
@@ -2,7 +2,8 @@
|
|
|
2
2
|
* ButtonMenu component — icon-only toggle button for navigation/menu bars.
|
|
3
3
|
* Supports default, active and disabled states with an optional notification dot.
|
|
4
4
|
*/
|
|
5
|
-
import React
|
|
5
|
+
import React from 'react';
|
|
6
|
+
import type { ReactElement } from 'react';
|
|
6
7
|
import type { StyleProp, ViewStyle } from 'react-native';
|
|
7
8
|
export type ButtonMenuState = 'default' | 'active' | 'disabled';
|
|
8
9
|
export interface ButtonMenuProps {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonMenu.d.ts","sourceRoot":"","sources":["../../../src/components/ButtonMenu/ButtonMenu.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AACH,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"ButtonMenu.d.ts","sourceRoot":"","sources":["../../../src/components/ButtonMenu/ButtonMenu.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AACH,OAAO,KAAmB,MAAM,OAAO,CAAC;AACxC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAGzD,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG,QAAQ,GAAG,UAAU,CAAC;AAEhE,MAAM,WAAW,eAAe;IAC9B,6CAA6C;IAC7C,IAAI,EAAE,YAAY,CAAC;IACnB,mBAAmB;IACnB,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,4BAA4B;IAC5B,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,oBAAoB;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,kCAAkC;IAClC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B;AAkBD,wBAAgB,UAAU,CAAC,EACzB,IAAI,EACJ,KAAiB,EACjB,KAAa,EACb,OAAO,EACP,KAAK,GACN,EAAE,eAAe,qBAkDjB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonMenu.js","sourceRoot":"","sources":["../../../src/components/ButtonMenu/ButtonMenu.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AACH,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"ButtonMenu.js","sourceRoot":"","sources":["../../../src/components/ButtonMenu/ButtonMenu.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AACH,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAExC,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAE/C,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AAiBtD,MAAM,UAAU,GAAoC;IAClD,OAAO,EAAG,aAAa;IACvB,MAAM,EAAI,WAAW;IACrB,QAAQ,EAAE,WAAW;CACtB,CAAC;AAEF,MAAM,YAAY,GAAgD;IAChE,OAAO,EAAG,SAAS;IACnB,MAAM,EAAI,WAAW;IACrB,QAAQ,EAAE,SAAS;CACpB,CAAC;AAEF,MAAM,kBAAkB,GAAG,WAAW,CAAC;AACvC,MAAM,SAAS,GAAG,EAAE,CAAC;AACrB,MAAM,SAAS,GAAG,CAAC,CAAC;AAEpB,MAAM,UAAU,UAAU,CAAC,EACzB,IAAI,EACJ,KAAK,GAAG,SAAS,EACjB,KAAK,GAAG,KAAK,EACb,OAAO,EACP,KAAK,GACW;IAChB,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC9C,MAAM,EAAE,MAAM,EAAE,GAAG,QAAQ,EAAE,CAAC;IAE9B,MAAM,UAAU,GAAG,KAAK,KAAK,UAAU,CAAC;IACxC,MAAM,UAAU,GAAG,OAAO,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;IACnF,MAAM,WAAW,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC;IAExC,MAAM,cAAc,GAAc;QAChC,KAAK,EAAE,EAAE;QACT,MAAM,EAAE,EAAE;QACV,OAAO,EAAE,EAAE;QACX,YAAY,EAAE,CAAC;QACf,eAAe,EAAE,UAAU;QAC3B,WAAW,EAAE,WAAW,IAAI,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS;QAChD,WAAW,EAAE,WAAW,IAAI,SAAS;QACrC,UAAU,EAAE,QAAQ;QACpB,cAAc,EAAE,QAAQ;KACzB,CAAC;IAEF,MAAM,UAAU,GAAG,KAAK,CAAC,YAAY,CAAC,IAAI,EAAE;QAC1C,IAAI,EAAE,SAAS;QACf,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS;QACpD,GAAI,IAAI,CAAC,KAAiC;KACjC,CAAC,CAAC;IAEb,OAAO,CACL,CAAC,SAAS,CACR,aAAa,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAC5C,SAAS,CAAC,CAAC,GAAG,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,CAClC,UAAU,CAAC,CAAC,GAAG,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CACpC,OAAO,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,CAC1C,KAAK,CAAC,CAAC,CAAC,cAAc,EAAE,KAAK,CAAC,CAAC,CAE/B;MAAA,CAAC,UAAU,CACX;MAAA,CAAC,KAAK,IAAI,CACR,CAAC,IAAI,CACH,KAAK,CAAC,CAAC;gBACL,QAAQ,EAAE,UAAU;gBACpB,GAAG,EAAE,CAAC;gBACN,IAAI,EAAE,EAAE;gBACR,KAAK,EAAE,SAAS;gBAChB,MAAM,EAAE,SAAS;gBACjB,YAAY,EAAE,IAAI;gBAClB,eAAe,EAAE,SAAS;aAC3B,CAAC,EACF,CACH,CACH;IAAA,EAAE,SAAS,CAAC,CACb,CAAC;AACJ,CAAC","sourcesContent":["/**\n * ButtonMenu component — icon-only toggle button for navigation/menu bars.\n * Supports default, active and disabled states with an optional notification dot.\n */\nimport React, { useState } from 'react';\nimport type { ReactElement } from 'react';\nimport { Pressable, View } from 'react-native';\nimport type { StyleProp, ViewStyle } from 'react-native';\nimport { useTheme } from '../../context/ThemeContext';\n\nexport type ButtonMenuState = 'default' | 'active' | 'disabled';\n\nexport interface ButtonMenuProps {\n /** Icon component (Phosphor Duotone icon) */\n icon: ReactElement;\n /** Toggle state */\n state?: ButtonMenuState;\n /** Show notification dot */\n notif?: boolean;\n /** Press handler */\n onPress?: () => void;\n /** Additional container styles */\n style?: StyleProp<ViewStyle>;\n}\n\nconst BACKGROUND: Record<ButtonMenuState, string> = {\n default: 'transparent',\n active: '#d1c3a033',\n disabled: '#0f0f0f0d',\n};\n\nconst BORDER_COLOR: Record<ButtonMenuState, string | undefined> = {\n default: undefined,\n active: '#afafad80',\n disabled: undefined,\n};\n\nconst PRESSED_BACKGROUND = '#d1c3a066';\nconst ICON_SIZE = 28;\nconst NOTIF_DOT = 8;\n\nexport function ButtonMenu({\n icon,\n state = 'default',\n notif = false,\n onPress,\n style,\n}: ButtonMenuProps) {\n const [pressed, setPressed] = useState(false);\n const { colors } = useTheme();\n\n const isDisabled = state === 'disabled';\n const background = pressed && !isDisabled ? PRESSED_BACKGROUND : BACKGROUND[state];\n const borderColor = BORDER_COLOR[state];\n\n const containerStyle: ViewStyle = {\n width: 48,\n height: 48,\n padding: 10,\n borderRadius: 8,\n backgroundColor: background,\n borderWidth: borderColor != null ? 1 : undefined,\n borderColor: borderColor ?? undefined,\n alignItems: 'center',\n justifyContent: 'center',\n };\n\n const clonedIcon = React.cloneElement(icon, {\n size: ICON_SIZE,\n color: isDisabled ? colors.text.disabled : undefined,\n ...(icon.props as Record<string, unknown>),\n } as object);\n\n return (\n <Pressable\n pointerEvents={isDisabled ? 'none' : 'auto'}\n onPressIn={() => setPressed(true)}\n onPressOut={() => setPressed(false)}\n onPress={isDisabled ? undefined : onPress}\n style={[containerStyle, style]}\n >\n {clonedIcon}\n {notif && (\n <View\n style={{\n position: 'absolute',\n top: 6,\n left: 34,\n width: NOTIF_DOT,\n height: NOTIF_DOT,\n borderRadius: 9999,\n backgroundColor: '#ff4747',\n }}\n />\n )}\n </Pressable>\n );\n}"]}
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
* Provides ThemeProvider and useTheme hook.
|
|
4
4
|
* Consumer apps inject their own light/dark tokens via ThemeProvider props.
|
|
5
5
|
*/
|
|
6
|
-
import
|
|
6
|
+
import { type ReactNode } from 'react';
|
|
7
7
|
import type { ColorSchemeTokens } from '../theme/type';
|
|
8
8
|
interface ThemeContextValue {
|
|
9
9
|
/** Resolved tokens for the active color scheme */
|
|
@@ -20,7 +20,7 @@ interface ThemeProviderProps {
|
|
|
20
20
|
colorScheme?: 'light' | 'dark';
|
|
21
21
|
children: ReactNode;
|
|
22
22
|
}
|
|
23
|
-
export declare function ThemeProvider({ light, dark, colorScheme: forcedScheme, children, }: ThemeProviderProps):
|
|
23
|
+
export declare function ThemeProvider({ light, dark, colorScheme: forcedScheme, children, }: ThemeProviderProps): import("react").JSX.Element;
|
|
24
24
|
/**
|
|
25
25
|
* Returns resolved color tokens for the active theme and color scheme.
|
|
26
26
|
* Falls back to light tokens when used outside a ThemeProvider.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ThemeContext.d.ts","sourceRoot":"","sources":["../../src/context/ThemeContext.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,
|
|
1
|
+
{"version":3,"file":"ThemeContext.d.ts","sourceRoot":"","sources":["../../src/context/ThemeContext.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAIL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAKf,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAMvD,UAAU,iBAAiB;IACzB,kDAAkD;IAClD,MAAM,EAAE,iBAAiB,CAAC;IAC1B,0BAA0B;IAC1B,WAAW,EAAE,OAAO,GAAG,MAAM,CAAC;CAC/B;AAaD,UAAU,kBAAkB;IAC1B,2CAA2C;IAC3C,KAAK,CAAC,EAAE,iBAAiB,CAAC;IAC1B,yCAAyC;IACzC,IAAI,CAAC,EAAE,iBAAiB,CAAC;IACzB,2DAA2D;IAC3D,WAAW,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC/B,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,aAAa,CAAC,EACE,KAAmB,EACnB,IAAiB,EACjB,WAAW,EAAE,YAAY,EACzB,QAAQ,GACT,EAAE,kBAAkB,+BAgBlD;AAMD;;;GAGG;AACH,wBAAgB,QAAQ,IAAI,iBAAiB,CAE5C"}
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
* Provides ThemeProvider and useTheme hook.
|
|
4
4
|
* Consumer apps inject their own light/dark tokens via ThemeProvider props.
|
|
5
5
|
*/
|
|
6
|
-
import
|
|
6
|
+
import { createContext, useContext, useMemo, } from 'react';
|
|
7
7
|
import { useColorScheme } from 'react-native';
|
|
8
8
|
import { lightTokens } from '../theme/tokens/light';
|
|
9
9
|
import { darkTokens } from '../theme/tokens/dark';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ThemeContext.js","sourceRoot":"","sources":["../../src/context/ThemeContext.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,
|
|
1
|
+
{"version":3,"file":"ThemeContext.js","sourceRoot":"","sources":["../../src/context/ThemeContext.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EACL,aAAa,EACb,UAAU,EACV,OAAO,GAER,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAE9C,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAclD,MAAM,aAAa,GAAsB;IACvC,MAAM,EAAE,WAAW;IACnB,WAAW,EAAE,OAAO;CACrB,CAAC;AAEF,MAAM,YAAY,GAAG,aAAa,CAAoB,aAAa,CAAC,CAAC;AAgBrE,MAAM,UAAU,aAAa,CAAC,EACE,KAAK,GAAG,WAAW,EACnB,IAAI,GAAG,UAAU,EACjB,WAAW,EAAE,YAAY,EACzB,QAAQ,GACW;IACjD,MAAM,YAAY,GAAG,cAAc,EAAE,CAAC;IACtC,MAAM,WAAW,GACf,YAAY,IAAI,CAAC,YAAY,KAAK,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC;IAE/D,MAAM,KAAK,GAAG,OAAO,CACnB,GAAG,EAAE,CAAC,CAAC;QACL,MAAM,EAAE,WAAW,KAAK,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK;QAC7C,WAAW;KACZ,CAAC,EACF,CAAC,KAAK,EAAE,IAAI,EAAE,WAAW,CAAC,CAC3B,CAAC;IAEF,OAAO,CACL,CAAC,YAAY,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,YAAY,CAAC,QAAQ,CAAC,CACxE,CAAC;AACJ,CAAC;AAED,8EAA8E;AAC9E,OAAO;AACP,8EAA8E;AAE9E;;;GAGG;AACH,MAAM,UAAU,QAAQ;IACtB,OAAO,UAAU,CAAC,YAAY,CAAC,CAAC;AAClC,CAAC","sourcesContent":["/**\n * Theme system for Traq[UI]ste Mobile.\n * Provides ThemeProvider and useTheme hook.\n * Consumer apps inject their own light/dark tokens via ThemeProvider props.\n */\n\nimport {\n createContext,\n useContext,\n useMemo,\n type ReactNode,\n} from 'react';\nimport { useColorScheme } from 'react-native';\n\nimport { lightTokens } from '../theme/tokens/light';\nimport { darkTokens } from '../theme/tokens/dark';\nimport type { ColorSchemeTokens } from '../theme/type';\n\n// ---------------------------------------------------------------------------\n// Context\n// ---------------------------------------------------------------------------\n\ninterface ThemeContextValue {\n /** Resolved tokens for the active color scheme */\n colors: ColorSchemeTokens;\n /** Active color scheme */\n colorScheme: 'light' | 'dark';\n}\n\nconst DEFAULT_VALUE: ThemeContextValue = {\n colors: lightTokens,\n colorScheme: 'light',\n};\n\nconst ThemeContext = createContext<ThemeContextValue>(DEFAULT_VALUE);\n\n// ---------------------------------------------------------------------------\n// Provider\n// ---------------------------------------------------------------------------\n\ninterface ThemeProviderProps {\n /** Light tokens — defaults to GDM light */\n light?: ColorSchemeTokens;\n /** Dark tokens — defaults to GDM dark */\n dark?: ColorSchemeTokens;\n /** Force a color scheme — defaults to system preference */\n colorScheme?: 'light' | 'dark';\n children: ReactNode;\n}\n\nexport function ThemeProvider({\n light = lightTokens,\n dark = darkTokens,\n colorScheme: forcedScheme,\n children,\n }: ThemeProviderProps) {\n const systemScheme = useColorScheme();\n const colorScheme: 'light' | 'dark' =\n forcedScheme ?? (systemScheme === 'dark' ? 'dark' : 'light');\n\n const value = useMemo<ThemeContextValue>(\n () => ({\n colors: colorScheme === 'dark' ? dark : light,\n colorScheme,\n }),\n [light, dark, colorScheme],\n );\n\n return (\n <ThemeContext.Provider value={value}>{children}</ThemeContext.Provider>\n );\n}\n\n// ---------------------------------------------------------------------------\n// Hook\n// ---------------------------------------------------------------------------\n\n/**\n * Returns resolved color tokens for the active theme and color scheme.\n * Falls back to light tokens when used outside a ThemeProvider.\n */\nexport function useTheme(): ThemeContextValue {\n return useContext(ThemeContext);\n}"]}
|