@stack-spot/citric-react 0.13.0 → 0.14.1

package/dist/citric.css

@@ -36,6 +36,7 @@
   }
 
   .text-h3 {
+    margin: 0;
     font: var(--font-h3);
   }
 
@@ -1932,6 +1933,13 @@ input[type="reset"][data-citric="icon-box"], .apply-citric input[type="reset"].c
   background-color: var(--light-400);
   width: fit-content;
 
+  &.full-width {
+    width: auto;
+    input {
+      flex: 1;
+    }
+  }
+
   > :not(:first-child) {
     border-top-left-radius: 0 !important;
     border-bottom-left-radius: 0 !important;

package/dist/components/FieldGroup.d.ts

@@ -7,7 +7,13 @@ export interface BaseFieldGroupProps {
      * @default true
      */
     auto?: boolean;
+    /**
+     * When this is true, the FieldGroup will occupy all the width available instead of just what its children need.
+     *
+     * @default false
+     */
+    fullWidth?: boolean;
 }
 export type FieldGroupProps = React.JSX.IntrinsicElements['div'] & BaseFieldGroupProps;
-export declare const FieldGroup: ({ auto, className, children, ...props }: FieldGroupProps) => import("react/jsx-runtime").JSX.Element;
+export declare const FieldGroup: ({ auto, fullWidth, className, children, ...props }: FieldGroupProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=FieldGroup.d.ts.map

package/dist/components/FieldGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FieldGroup.d.ts","sourceRoot":"","sources":["../../src/components/FieldGroup.tsx"],"names":[],"mappings":"AAIA,MAAM,WAAW,mBAAmB;IAClC;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,MAAM,MAAM,eAAe,GAAG,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,KAAK,CAAC,GAAG,mBAAmB,CAAA;AAEtF,eAAO,MAAM,UAAU,4CAA4D,eAAe,4CAIhG,CAAA"}
+{"version":3,"file":"FieldGroup.d.ts","sourceRoot":"","sources":["../../src/components/FieldGroup.tsx"],"names":[],"mappings":"AAIA,MAAM,WAAW,mBAAmB;IAClC;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,MAAM,eAAe,GAAG,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,KAAK,CAAC,GAAG,mBAAmB,CAAA;AAEtF,eAAO,MAAM,UAAU,uDAAuE,eAAe,4CAS3G,CAAA"}

package/dist/components/FieldGroup.js

@@ -2,5 +2,5 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { listToClass } from '@stack-spot/portal-theme';
 import { withRef } from '../utils/react.js';
 import { CitricComponent } from './CitricComponent.js';
-export const FieldGroup = withRef(({ auto = true, className, children, ...props }) => (_jsx(CitricComponent, { tag: "div", component: "field-group", className: listToClass([className, auto && 'auto']), ...props, children: children })));
+export const FieldGroup = withRef(({ auto = true, fullWidth, className, children, ...props }) => (_jsx(CitricComponent, { tag: "div", component: "field-group", className: listToClass([className, auto && 'auto', fullWidth && 'full-width']), ...props, children: children })));
 //# sourceMappingURL=FieldGroup.js.map

package/dist/components/FieldGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"FieldGroup.js","sourceRoot":"","sources":["../../src/components/FieldGroup.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAA;AACxC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAenD,MAAM,CAAC,MAAM,UAAU,GAAG,OAAO,CAAC,CAAC,EAAE,IAAI,GAAG,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAmB,EAAE,EAAE,CAAC,CACrG,KAAC,eAAe,IAAC,GAAG,EAAC,KAAK,EAAC,SAAS,EAAC,aAAa,EAAC,SAAS,EAAE,WAAW,CAAC,CAAC,SAAS,EAAE,IAAI,IAAI,MAAM,CAAC,CAAC,KAAM,KAAK,YAC9G,QAAQ,GACO,CACnB,CAAC,CAAA"}
+{"version":3,"file":"FieldGroup.js","sourceRoot":"","sources":["../../src/components/FieldGroup.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAA;AACxC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAqBnD,MAAM,CAAC,MAAM,UAAU,GAAG,OAAO,CAAC,CAAC,EAAE,IAAI,GAAG,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAmB,EAAE,EAAE,CAAC,CAChH,KAAC,eAAe,IACd,GAAG,EAAC,KAAK,EACT,SAAS,EAAC,aAAa,EACvB,SAAS,EAAE,WAAW,CAAC,CAAC,SAAS,EAAE,IAAI,IAAI,MAAM,EAAE,SAAS,IAAI,YAAY,CAAC,CAAC,KAC1E,KAAK,YAER,QAAQ,GACO,CACnB,CAAC,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stack-spot/citric-react",
-  "version": "0.13.0",
+  "version": "0.14.1",
   "author": "StackSpot",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",

package/src/components/FieldGroup.tsx

@@ -11,12 +11,23 @@ export interface BaseFieldGroupProps {
    * @default true 
    */
   auto?: boolean,
+  /**
+   * When this is true, the FieldGroup will occupy all the width available instead of just what its children need.
+   * 
+   * @default false
+   */
+  fullWidth?: boolean,
 }
 
 export type FieldGroupProps = React.JSX.IntrinsicElements['div'] & BaseFieldGroupProps
 
-export const FieldGroup = withRef(({ auto = true, className, children, ...props }: FieldGroupProps) => (
-  <CitricComponent tag="div" component="field-group" className={listToClass([className, auto && 'auto'])} {...props}>
+export const FieldGroup = withRef(({ auto = true, fullWidth, className, children, ...props }: FieldGroupProps) => (
+  <CitricComponent
+    tag="div"
+    component="field-group"
+    className={listToClass([className, auto && 'auto', fullWidth && 'full-width'])}
+    {...props}
+  >
     {children}
   </CitricComponent>
 ))