@fireng/layout
Version:
Angular directives for responsive layout and visual adjustments using Fireng breakpoints.
33 lines (32 loc) • 1.66 kB
TypeScript
import { FirengFlexWrap } from '../fireng.types';
import { FirengResponsiveMap } from '@fireng/core';
import * as i0 from "@angular/core";
export declare class FirengFlexWrapDirective {
/**
* Defines how flex items are placed in the flex container, allowing them to
* wrap onto multiple lines.
* Accepted values for flexWrap are:
* - `nowrap`: All flex items will be on one line.
* - `wrap`: Flex items will wrap onto multiple lines.
* - `wrap-reverse`: Flex items will wrap onto multiple lines in reverse order.
*
* Global CSS values are also accepted: `inherit`, `initial`, `unset`, `revert`.
*
* For more details on the flex-wrap property, refer to the MDN documentation:
* @see [MDN - flex-wrap](https://developer.mozilla.org/en-US/docs/Web/CSS/flex-wrap)
*
* Can also be provided as a responsive map for different screen sizes.
* @example
* // Static usage:
* <div fireFlexWrap="wrap">...</div>
* <div fireFlexWrap="initial">...</div>
* // Responsive usage:
* <div fireFlexWrap="{ xs: 'nowrap', sm: 'wrap', md: 'wrap-reverse', lg: 'unset' }">...</div>
* @defaultValue `nowrap`
*/
flexWrap: import("@angular/core").InputSignal<FirengFlexWrap | FirengResponsiveMap<FirengFlexWrap>>;
private readonly screenService;
private readonly activeFlexWrap;
static ɵfac: i0.ɵɵFactoryDeclaration<FirengFlexWrapDirective, never>;
static ɵdir: i0.ɵɵDirectiveDeclaration<FirengFlexWrapDirective, "[fireFlexWrap]", never, { "flexWrap": { "alias": "fireFlexWrap"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
}