@stokelp/styled-system 2.24.0 → 2.25.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stokelp/styled-system",
-  "version": "2.24.0",
+  "version": "2.25.0",
   "description": "Stokelp UI styled-system",
   "type": "module",
   "publishConfig": {

package/panda.buildinfo.json

@@ -38,14 +38,21 @@
       "width]___[value:16",
       "height]___[value:16",
       "paddingInline]___[value:space-8",
+      "width]___[value:21px]___[cond:& > svg",
+      "height]___[value:15px]___[cond:& > svg",
+      "borderRadius]___[value:3px]___[cond:& > svg",
+      "display]___[value:flex",
+      "alignItems]___[value:center",
+      "gap]___[value:space-8",
+      "flexDirection]___[value:row",
+      "width]___[value:full",
+      "width]___[value:fit-content !important",
       "transitionProperty]___[value:opacity",
       "transitionDuration]___[value:fast",
       "opacity]___[value:0",
       "visibility]___[value:hidden",
       "opacity]___[value:1]___[cond:_groupHover",
       "visibility]___[value:visible]___[cond:_groupHover",
-      "display]___[value:flex",
-      "alignItems]___[value:center",
       "justifyContent]___[value:center",
       "flex]___[value:0 0 auto",
       "borderRadius]___[value:9999px",
@@ -69,7 +76,6 @@
       "gap]___[value:space-32",
       "padding]___[value:space-16",
       "marginTop]___[value:100",
-      "flexDirection]___[value:row",
       "color]___[value:primary.500",
       "color]___[value:secondary.500",
       "color]___[value:success.500",
@@ -77,7 +83,6 @@
       "borderRadius]___[value:radius-24",
       "height]___[value:200",
       "width]___[value:400",
-      "gap]___[value:space-8",
       "maxHeight]___[value:102",
       "overflowY]___[value:auto",
       "alignSelf]___[value:flex-end",
@@ -102,9 +107,7 @@
       "color]___[value:grey.100",
       "textStyle]___[value:body.lg",
       "textStyle]___[value:body.md",
-      "textStyle]___[value:body.sm",
-      "borderRadius]___[value:3px]___[cond:& > svg",
-      "width]___[value:full"
+      "textStyle]___[value:body.sm"
     ],
     "recipes": {
       "iconButton": [

package/recipes/index.d.ts

@@ -28,6 +28,7 @@ export * from './tabs';
 export * from './tag';
 export * from './status-tag-select';
 export * from './select';
+export * from './select-language';
 export * from './chip';
 export * from './action-card';
 export * from './tooltip';

package/recipes/index.mjs

@@ -27,6 +27,7 @@ export * from './tabs.mjs';
 export * from './tag.mjs';
 export * from './status-tag-select.mjs';
 export * from './select.mjs';
+export * from './select-language.mjs';
 export * from './chip.mjs';
 export * from './action-card.mjs';
 export * from './tooltip.mjs';

package/recipes/select-language.d.ts

@@ -0,0 +1,31 @@
+/* eslint-disable */
+import type { ConditionalValue } from '../types/index';
+import type { DistributiveOmit, Pretty } from '../types/system-types';
+
+interface SelectLanguageVariant {
+  /**
+ * @default "default"
+ */
+variant: "default" | "compact"
+}
+
+type SelectLanguageVariantMap = {
+  [key in keyof SelectLanguageVariant]: Array<SelectLanguageVariant[key]>
+}
+
+export type SelectLanguageVariantProps = {
+  [key in keyof SelectLanguageVariant]?: ConditionalValue<SelectLanguageVariant[key]> | undefined
+}
+
+export interface SelectLanguageRecipe {
+  __type: SelectLanguageVariantProps
+  (props?: SelectLanguageVariantProps): Pretty<Record<"label" | "positioner" | "trigger" | "indicator" | "clearTrigger" | "item" | "itemText" | "itemIndicator" | "itemGroup" | "itemGroupLabel" | "list" | "content" | "root" | "control" | "valueText", string>>
+  raw: (props?: SelectLanguageVariantProps) => SelectLanguageVariantProps
+  variantMap: SelectLanguageVariantMap
+  variantKeys: Array<keyof SelectLanguageVariant>
+  splitVariantProps<Props extends SelectLanguageVariantProps>(props: Props): [SelectLanguageVariantProps, Pretty<DistributiveOmit<Props, keyof SelectLanguageVariantProps>>]
+  getVariantProps: (props?: SelectLanguageVariantProps) => SelectLanguageVariantProps
+}
+
+
+export declare const selectLanguage: SelectLanguageRecipe

package/recipes/select-language.mjs

@@ -0,0 +1,97 @@
+import { compact, getSlotCompoundVariant, memo, splitProps } from '../helpers.mjs';
+import { createRecipe } from './create-recipe.mjs';
+
+const selectLanguageDefaultVariants = {
+  "variant": "default"
+}
+const selectLanguageCompoundVariants = []
+
+const selectLanguageSlotNames = [
+  [
+    "label",
+    "select-language__label"
+  ],
+  [
+    "positioner",
+    "select-language__positioner"
+  ],
+  [
+    "trigger",
+    "select-language__trigger"
+  ],
+  [
+    "indicator",
+    "select-language__indicator"
+  ],
+  [
+    "clearTrigger",
+    "select-language__clearTrigger"
+  ],
+  [
+    "item",
+    "select-language__item"
+  ],
+  [
+    "itemText",
+    "select-language__itemText"
+  ],
+  [
+    "itemIndicator",
+    "select-language__itemIndicator"
+  ],
+  [
+    "itemGroup",
+    "select-language__itemGroup"
+  ],
+  [
+    "itemGroupLabel",
+    "select-language__itemGroupLabel"
+  ],
+  [
+    "list",
+    "select-language__list"
+  ],
+  [
+    "content",
+    "select-language__content"
+  ],
+  [
+    "root",
+    "select-language__root"
+  ],
+  [
+    "control",
+    "select-language__control"
+  ],
+  [
+    "valueText",
+    "select-language__valueText"
+  ]
+]
+const selectLanguageSlotFns = /* @__PURE__ */ selectLanguageSlotNames.map(([slotName, slotKey]) => [slotName, createRecipe(slotKey, selectLanguageDefaultVariants, getSlotCompoundVariant(selectLanguageCompoundVariants, slotName))])
+
+const selectLanguageFn = memo((props = {}) => {
+  return Object.fromEntries(selectLanguageSlotFns.map(([slotName, slotFn]) => [slotName, slotFn.recipeFn(props)]))
+})
+
+const selectLanguageVariantKeys = [
+  "variant"
+]
+const getVariantProps = (variants) => ({ ...selectLanguageDefaultVariants, ...compact(variants) })
+
+export const selectLanguage = /* @__PURE__ */ Object.assign(selectLanguageFn, {
+  __recipe__: false,
+  __name__: 'selectLanguage',
+  raw: (props) => props,
+  variantKeys: selectLanguageVariantKeys,
+  variantMap: {
+  "variant": [
+    "default",
+    "compact"
+  ]
+},
+  splitVariantProps(props) {
+    return splitProps(props, selectLanguageVariantKeys)
+  },
+  getVariantProps
+})

package/types/prop-type.d.ts

@@ -146,7 +146,7 @@ export interface UtilityValues {
 	transitionDuration: Tokens["durations"];
 	transition: "all" | "common" | "background" | "colors" | "opacity" | "shadow" | "transform";
 	animation: Tokens["animations"];
-	animationName: "blob" | "bounce" | "fade-in" | "fade-out" | "fadeIn" | "fadeInFromRight" | "fadeInSkew" | "fadeOut" | "fadeOutFromRight" | "fadeOutSkew" | "ping" | "pulse" | "skeleton-pulse" | "slide-in" | "slide-in-left" | "slide-in-modal" | "slide-in-right" | "slide-out" | "slide-out-left" | "slide-out-modal" | "slide-out-right" | "slideInFromBottom" | "slideOutToBottom" | "collapse-in" | "collapse-out" | "spin";
+	animationName: "blob" | "bounce" | "fade-in" | "fade-out" | "fadeIn" | "fadeInFromRight" | "fadeInSkew" | "fadeOut" | "fadeOutFromRight" | "fadeOutSkew" | "ping" | "pulse" | "skeleton-pulse" | "slide-in" | "slide-in-left" | "slide-in-modal" | "slide-in-top-modal" | "slide-in-right" | "slide-out" | "slide-out-left" | "slide-out-modal" | "slide-out-top-modal" | "slide-out-right" | "slideInFromBottom" | "slideOutToBottom" | "collapse-in" | "collapse-out" | "spin";
 	animationTimingFunction: Tokens["easings"];
 	animationDuration: Tokens["durations"];
 	animationDelay: Tokens["durations"];