@cck-ui/core 0.12.1 → 0.13.0

package/esm/components/flex/index.mjs

@@ -0,0 +1,10 @@
+"use client";
+import { withInstall } from "../../core/utils/vue/install.mjs";
+import { withClasses, withExtend, withPropsFactory } from "../../core/utils/vue/statics.mjs";
+import flex_module_default from "./flex.module.mjs";
+import flex_default from "./flex.mjs";
+const CFlex = withInstall(withPropsFactory(withExtend(withClasses(flex_default, flex_module_default))));
+//#endregion
+export { CFlex, CFlex as default };
+
+//# sourceMappingURL=index.mjs.map

package/esm/components/flex/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":["Flex","classes"],"sources":["../../../src/components/flex/index.ts"],"sourcesContent":["import {\n  SFCWithInstallAndClasses,\n  withClasses,\n  withExtend,\n  withInstall,\n  withPropsFactory,\n} from '../../core'\nimport Flex from './flex.vue'\nimport classes from './flex.module.css'\n\nconst FlexWithStatic = withPropsFactory(withExtend(withClasses(Flex, classes)))\n\nexport const CFlex: SFCWithInstallAndClasses<typeof Flex, typeof classes> =\n  withInstall(FlexWithStatic)\n\nexport default CFlex\n\nexport * from './flex.types'\n"],"mappings":";;;;;AAYA,MAAa,QACX,YAHqB,iBAAiB,WAAW,YAAYA,cAAMC,mBAAO,CAAC,CAG/D,CAAc"}

package/esm/index.mjs

@@ -61,6 +61,7 @@ import { CTransition } from "./components/transition/index.mjs";
 import { CButton, CButtonGroup, CButtonGroupSection } from "./components/button/index.mjs";
 import { CCenter } from "./components/center/index.mjs";
 import { CContainer } from "./components/container/index.mjs";
+import { CFlex } from "./components/flex/index.mjs";
 import { CCol, CGrid } from "./components/grid/index.mjs";
 import { CGroup } from "./components/group/index.mjs";
 import { CSimpleGrid } from "./components/simple-grid/index.mjs";
@@ -82,6 +83,7 @@ const components = [
 	CCloseButton,
 	CCol,
 	CContainer,
+	CFlex,
 	CGrid,
 	CGroup,
 	CLoader,
@@ -102,6 +104,6 @@ const CckUI = { install(app) {
 	});
 } };
 //#endregion
-export { CAlert, CAspectRatio, CBox, CButton, CButtonGroup, CButtonGroupSection, transitions as CCK_TRANSITIONS, CCenter, CCloseButton, CCol, CContainer, CDefaultLoaders, CGrid, CGroup, CLoader, CONFIG_KEY, CSimpleGrid, CSpace, CSplitter, CSplitterPane, CStack, CText, CTransition, CckConfigProvider, CckUI, CckUI as default, DEFAULT_THEME, FOCUS_CLASS_NAMES, STYLE_PROPS_DATA, THEME_KEY, UnstyledButton, alpha, camelToKebabCase, colorsTuple, createTheme, createVarsResolver, darken, deepMerge, defaultCssVariablesResolver, defaultVariantColorsResolver, em, extractStyleProps, filterProps, getBaseValue, getBreakpointValue, getCSSColorVariables, getComponentName, getFontSize, getGradient, getLineHeight, getPrimaryShade, getRadius, getShadow, getSize, getSortedBreakpoints, getSpacing, getThemeColor, getTransitionProps, hashStyleProps, isLightColor, isNumber, isNumberLike, isString, isStringNumber, isUndefined, isVirtualColor, keys, luminance, mergeThemeOverrides, normalizeNumberLikeStringProp, numberLikeStringToNumber, parseStyleProps, parseThemeColor, px, rem, resolveClassNames, resolveStyles, responsiveStyleManager, rgb, rgba, stylesToString, toRgba, useCckClassNamesPrefix, useCckColorScheme, useCckCssVariablesResolver, useCckEnv, useCckIsHeadless, useCckStyleNonce, useCckStylesTransform, useCckSxTransform, useCckTheme, useCckWithStaticClasses, useComponentProps, useConfigContext, useProviderColorScheme, useRandomClassName, useStyles, virtualColor, withClasses, withExtend, withInstall, withPropsDefaultSetter, withPropsFactory, withVarsResolver };
+export { CAlert, CAspectRatio, CBox, CButton, CButtonGroup, CButtonGroupSection, transitions as CCK_TRANSITIONS, CCenter, CCloseButton, CCol, CContainer, CDefaultLoaders, CFlex, CGrid, CGroup, CLoader, CONFIG_KEY, CSimpleGrid, CSpace, CSplitter, CSplitterPane, CStack, CText, CTransition, CckConfigProvider, CckUI, CckUI as default, DEFAULT_THEME, FOCUS_CLASS_NAMES, STYLE_PROPS_DATA, THEME_KEY, UnstyledButton, alpha, camelToKebabCase, colorsTuple, createTheme, createVarsResolver, darken, deepMerge, defaultCssVariablesResolver, defaultVariantColorsResolver, em, extractStyleProps, filterProps, getBaseValue, getBreakpointValue, getCSSColorVariables, getComponentName, getFontSize, getGradient, getLineHeight, getPrimaryShade, getRadius, getShadow, getSize, getSortedBreakpoints, getSpacing, getThemeColor, getTransitionProps, hashStyleProps, isLightColor, isNumber, isNumberLike, isString, isStringNumber, isUndefined, isVirtualColor, keys, luminance, mergeThemeOverrides, normalizeNumberLikeStringProp, numberLikeStringToNumber, parseStyleProps, parseThemeColor, px, rem, resolveClassNames, resolveStyles, responsiveStyleManager, rgb, rgba, stylesToString, toRgba, useCckClassNamesPrefix, useCckColorScheme, useCckCssVariablesResolver, useCckEnv, useCckIsHeadless, useCckStyleNonce, useCckStylesTransform, useCckSxTransform, useCckTheme, useCckWithStaticClasses, useComponentProps, useConfigContext, useProviderColorScheme, useRandomClassName, useStyles, virtualColor, withClasses, withExtend, withInstall, withPropsDefaultSetter, withPropsFactory, withVarsResolver };
 
 //# sourceMappingURL=index.mjs.map

package/esm/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../src/index.ts"],"sourcesContent":["import type { App, Plugin } from 'vue'\nimport {\n  CAlert,\n  CAspectRatio,\n  CButton,\n  CButtonGroup,\n  CButtonGroupSection,\n  CCenter,\n  CCloseButton,\n  CCol,\n  CContainer,\n  CGrid,\n  CGroup,\n  CLoader,\n  CSimpleGrid,\n  CSpace,\n  CSplitter,\n  CSplitterPane,\n  CStack,\n  CText,\n  CTransition,\n  UnstyledButton,\n} from './components'\nimport { CckConfigProvider, CBox } from './core'\n\nconst INSTALLED_KEY = Symbol('INSTALLED_KEY')\n\nconst components = [\n  CckConfigProvider,\n  CBox,\n  CAlert,\n  CAspectRatio,\n  CButton,\n  CButtonGroup,\n  CButtonGroupSection,\n  CCenter,\n  CCloseButton,\n  CCol,\n  CContainer,\n  CGrid,\n  CGroup,\n  CLoader,\n  CSimpleGrid,\n  CSpace,\n  CSplitter,\n  CSplitterPane,\n  CStack,\n  CText,\n  CTransition,\n  UnstyledButton,\n]\n\nconst CckUI: Plugin = {\n  install(app: App) {\n    if ((app as any)[INSTALLED_KEY]) {\n      return\n    }\n    ;(app as any)[INSTALLED_KEY] = true\n    components.forEach((c) => {\n      if (c.name) {\n        app.component(c.name, c)\n      }\n    })\n  },\n}\n\nexport default CckUI\nexport { CckUI }\n\nexport * from './components'\nexport * from './core'\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyBA,MAAM,gBAAgB,OAAO,eAAe;AAE5C,MAAM,aAAa;CACjB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF;AAEA,MAAM,QAAgB,EACpB,QAAQ,KAAU;CAChB,IAAK,IAAY,gBACf;CAED,IAAa,iBAAiB;CAC/B,WAAW,SAAS,MAAM;EACxB,IAAI,EAAE,MACJ,IAAI,UAAU,EAAE,MAAM,CAAC;CAE3B,CAAC;AACH,EACF"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../src/index.ts"],"sourcesContent":["import type { App, Plugin } from 'vue'\nimport {\n  CAlert,\n  CAspectRatio,\n  CButton,\n  CButtonGroup,\n  CButtonGroupSection,\n  CCenter,\n  CCloseButton,\n  CCol,\n  CContainer,\n  CFlex,\n  CGrid,\n  CGroup,\n  CLoader,\n  CSimpleGrid,\n  CSpace,\n  CSplitter,\n  CSplitterPane,\n  CStack,\n  CText,\n  CTransition,\n  UnstyledButton,\n} from './components'\nimport { CckConfigProvider, CBox } from './core'\n\nconst INSTALLED_KEY = Symbol('INSTALLED_KEY')\n\nconst components = [\n  CckConfigProvider,\n  CBox,\n  CAlert,\n  CAspectRatio,\n  CButton,\n  CButtonGroup,\n  CButtonGroupSection,\n  CCenter,\n  CCloseButton,\n  CCol,\n  CContainer,\n  CFlex,\n  CGrid,\n  CGroup,\n  CLoader,\n  CSimpleGrid,\n  CSpace,\n  CSplitter,\n  CSplitterPane,\n  CStack,\n  CText,\n  CTransition,\n  UnstyledButton,\n]\n\nconst CckUI: Plugin = {\n  install(app: App) {\n    if ((app as any)[INSTALLED_KEY]) {\n      return\n    }\n    ;(app as any)[INSTALLED_KEY] = true\n    components.forEach((c) => {\n      if (c.name) {\n        app.component(c.name, c)\n      }\n    })\n  },\n}\n\nexport default CckUI\nexport { CckUI }\n\nexport * from './components'\nexport * from './core'\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BA,MAAM,gBAAgB,OAAO,eAAe;AAE5C,MAAM,aAAa;CACjB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF;AAEA,MAAM,QAAgB,EACpB,QAAQ,KAAU;CAChB,IAAK,IAAY,gBACf;CAED,IAAa,iBAAiB;CAC/B,WAAW,SAAS,MAAM;EACxB,IAAI,EAAE,MACJ,IAAI,UAAU,EAAE,MAAM,CAAC;CAE3B,CAAC;AACH,EACF"}

package/lib/components/flex/flex-props.d.ts

@@ -0,0 +1,2 @@
+import { SystemPropData } from '../../core';
+export declare const FLEX_STYLE_PROPS_DATA: Record<string, SystemPropData>;

package/lib/components/flex/flex.types.d.ts

@@ -0,0 +1,39 @@
+import { Properties } from 'csstype';
+import { BoxProps, CSpacing, ElementProps, PolymorphicFactory, StyleProp, StylesApiProps } from '../../core';
+export type FlexStylesNames = 'root';
+export interface FlexProps extends BoxProps, StylesApiProps<FlexFactory>, /* @vue-ignore */ ElementProps<'div'> {
+    /**
+     * @description Gap between columns and rows, key of `theme.spacing` or any valid CSS
+     */
+    gap?: StyleProp<CSpacing>;
+    /**
+     * @description Row gap, overrides `gap` for vertical spacing
+     */
+    rowGap?: StyleProp<CSpacing>;
+    /**
+     * @description Column gap, overrides `gap` for horizontal spacing
+     */
+    columnGap?: StyleProp<CSpacing>;
+    /**
+     * @description Sets `align-items`
+     */
+    align?: StyleProp<Properties['alignItems']>;
+    /**
+     * @description Sets `justify-content`
+     */
+    justify?: StyleProp<Properties['justifyContent']>;
+    /**
+     * @description Sets `flex-wrap`
+     */
+    wrap?: StyleProp<Properties['flexWrap']>;
+    /**
+     * @description Sets `flex-direction`
+     */
+    direction?: StyleProp<Properties['flexDirection']>;
+}
+export type FlexFactory = PolymorphicFactory<{
+    props: FlexProps;
+    defaultRef: HTMLDivElement;
+    defaultComponent: 'div';
+    stylesNames: FlexStylesNames;
+}>;

package/lib/components/flex/index.d.ts

@@ -0,0 +1,6 @@
+import { SFCWithInstallAndClasses } from '../../core';
+import Flex from './flex.vue';
+import classes from './flex.module.css';
+export declare const CFlex: SFCWithInstallAndClasses<typeof Flex, typeof classes>;
+export default CFlex;
+export * from './flex.types';

package/lib/components/index.d.ts

@@ -4,6 +4,7 @@ export * from './button';
 export * from './center';
 export * from './close-button';
 export * from './container';
+export * from './flex';
 export * from './grid';
 export * from './group';
 export * from './loader';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cck-ui/core",
-  "version": "0.12.1",
+  "version": "0.13.0",
   "description": "Vue component library focused on usability, accessibility and developer experience",
   "homepage": "https://cck-ui.jackatlas.xyz",
   "license": "ISC",

package/styles/flex.css

@@ -0,0 +1,3 @@
+.m_148db636 {
+  display: flex;
+}

package/styles/flex.layer.css

@@ -0,0 +1,4 @@
+@layer cck {.m_148db636 {
+  display: flex;
+}
+}

package/styles.css

@@ -1086,6 +1086,10 @@ fieldset:disabled .c-active:active {
         margin-inline: auto;
       }
 
+.m_148db636 {
+  display: flex;
+}
+
 .m_c031daba {
   container: c-grid / inline-size;
 }

package/styles.layer.css

@@ -1086,6 +1086,10 @@ fieldset:disabled .c-active:active {
         margin-inline: auto;
       }
 
+.m_148db636 {
+  display: flex;
+}
+
 .m_c031daba {
   container: c-grid / inline-size;
 }