@vellira-ui/react-native 2.93.0 → 2.95.0

package/dist/index.js

@@ -740,57 +740,60 @@ function useThemeStyles(createStyles) {
 }
 //#endregion
 //#region src/components/Accordion/Accordion.styles.ts
-const createStyles$23 = (theme) => StyleSheet.create({
-	root: {
-		width: "100%",
-		overflow: "hidden",
-		borderWidth: 1,
-		borderColor: theme.semantic.border.muted,
-		borderRadius: theme.tokens.radius.lg,
-		backgroundColor: theme.semantic.surface.default
-	},
-	rootDisabled: { opacity: .7 },
-	item: {
-		borderBottomWidth: 1,
-		borderBottomColor: theme.semantic.border.muted
-	},
-	trigger: {
-		minHeight: theme.tokens.spacing[10],
-		justifyContent: "center",
-		paddingHorizontal: theme.tokens.spacing[4],
-		paddingVertical: theme.tokens.spacing[3],
-		backgroundColor: theme.semantic.surface.default
-	},
-	triggerExpanded: { backgroundColor: theme.semantic.surface.subtle },
-	triggerPressed: { backgroundColor: theme.semantic.surface.muted },
-	triggerDisabled: { backgroundColor: theme.semantic.surface.subtle },
-	triggerContent: {
-		flexDirection: "row",
-		alignItems: "center",
-		justifyContent: "space-between",
-		gap: theme.tokens.spacing[3]
-	},
-	triggerText: {
-		flex: 1,
-		color: theme.semantic.text.primary,
-		fontSize: theme.tokens.typography.size.md,
-		fontWeight: theme.tokens.typography.weight.medium,
-		lineHeight: theme.tokens.typography.lineHeight.md
-	},
-	triggerTextDisabled: { color: theme.semantic.text.disabled },
-	indicator: {
-		width: theme.tokens.spacing[4],
-		height: theme.tokens.spacing[4],
-		alignItems: "center",
-		justifyContent: "center"
-	},
-	indicatorExpanded: { transform: [{ rotate: "180deg" }] },
-	content: {
-		padding: theme.tokens.spacing[4],
-		backgroundColor: theme.semantic.surface.subtle
-	},
-	contentHidden: { display: "none" }
-});
+const createStyles$23 = (theme) => {
+	const accordion = theme.components.accordion;
+	return StyleSheet.create({
+		root: {
+			width: "100%",
+			overflow: "hidden",
+			borderWidth: 1,
+			borderColor: accordion.root.border,
+			borderRadius: theme.tokens.radius.lg,
+			backgroundColor: accordion.root.bg
+		},
+		rootDisabled: { opacity: .7 },
+		item: {
+			borderBottomWidth: 1,
+			borderBottomColor: accordion.divider
+		},
+		trigger: {
+			minHeight: theme.tokens.spacing[10],
+			justifyContent: "center",
+			paddingHorizontal: theme.tokens.spacing[4],
+			paddingVertical: theme.tokens.spacing[3],
+			backgroundColor: accordion.trigger.default.bg
+		},
+		triggerExpanded: { backgroundColor: accordion.trigger.expanded.bg },
+		triggerPressed: { backgroundColor: accordion.trigger.pressed.bg },
+		triggerDisabled: { backgroundColor: accordion.trigger.disabled.bg },
+		triggerContent: {
+			flexDirection: "row",
+			alignItems: "center",
+			justifyContent: "space-between",
+			gap: theme.tokens.spacing[3]
+		},
+		triggerText: {
+			flex: 1,
+			color: accordion.trigger.default.fg,
+			fontSize: theme.tokens.typography.size.md,
+			fontWeight: theme.tokens.typography.weight.medium,
+			lineHeight: theme.tokens.typography.lineHeight.md
+		},
+		triggerTextDisabled: { color: accordion.trigger.disabled.fg },
+		indicator: {
+			width: theme.tokens.spacing[4],
+			height: theme.tokens.spacing[4],
+			alignItems: "center",
+			justifyContent: "center"
+		},
+		indicatorExpanded: { transform: [{ rotate: "180deg" }] },
+		content: {
+			padding: theme.tokens.spacing[4],
+			backgroundColor: accordion.content.bg
+		},
+		contentHidden: { display: "none" }
+	});
+};
 //#endregion
 //#region src/components/Accordion/Content/AccordionContent.tsx
 function AccordionContent({ children, forceMount = false, hidden = false }) {
@@ -817,6 +820,7 @@ function AccordionItem({ children }) {
 function AccordionTrigger({ children, disabled = false, expanded = false, onActivate }) {
 	const { theme } = useTheme();
 	const styles = createStyles$23(theme);
+	const accordionTokens = theme.components.accordion;
 	return /* @__PURE__ */ jsx(Pressable, {
 		disabled,
 		accessibilityRole: "button",
@@ -844,7 +848,7 @@ function AccordionTrigger({ children, disabled = false, expanded = false, onActi
 				children: /* @__PURE__ */ jsx(ChevronDown, {
 					width: 16,
 					height: 16,
-					color: disabled ? theme.semantic.text.disabled : theme.semantic.text.secondary
+					color: disabled ? accordionTokens.trigger.disabled.fg : accordionTokens.indicator
 				})
 			})]
 		})

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vellira-ui/react-native",
-  "version": "2.93.0",
+  "version": "2.95.0",
   "description": "React Native components for Vellira Design System",
   "keywords": [
     "vellira",