import { LitElement } from "lit";
export type SkyFlexcolAlignSelf = "auto" | "flex-start" | "center" | "flex-end" | "stretch" | "baseline";
/**
 * @element sky-flexcol
 *
 * @summary Flex column item for `sky-flexbox` layouts with responsive span controls.
 *
 * @status stable
 * @since 1.0.0
 *
 * @documentation https://sky-ui.com/components/flexbox
 *
 * @slot - Default slot for column content.
 *
 * @property {number} span - Base number of columns to span.
 * @property {number | undefined} spanLg - Span at large breakpoints.
 * @property {number | undefined} spanMd - Span at medium breakpoints.
 * @property {number | undefined} spanSm - Span at small breakpoints.
 * @property {number | undefined} spanXs - Span at extra-small breakpoints.
 * @property {number} grow - Flex grow factor.
 * @property {number} shrink - Flex shrink factor.
 * @property {string | null} basis - Flex basis override.
 * @property {number | undefined} order - Flex order override.
 * @property {SkyFlexcolAlignSelf | undefined} alignSelf - Cross-axis alignment override.
 * @property {string} preset - Named prop preset from nearest `sky-config-provider`. Default: `""`.
 * @method refreshStyles Re-applies CSS custom properties from current values.
 * @method getSpan Returns current base span value.
 * @method setSpan Updates base span value and refreshes styles.
 *
 * @csspart col - The flex item wrapper.
 *
 * @Behavior
 * - Designed to work within `<sky-flexbox>` containers
 * - Supports responsive column spans with breakpoint attributes
 * - Exposes all standard flex item properties
 * - Automatically syncs properties to CSS custom properties
 *
 * - `span`: Base span across columns (1 to container's column count)
 * - `span-lg`: Span at large screens (≤1200px)
 * - `span-md`: Span at medium screens (≤992px)
 * - `span-sm`: Span at small screens (≤768px)
 * - `span-xs`: Span at extra-small screens (≤576px)
 *
 * @example
 * ```html
 * <sky-flexbox col="12" gap="16px">
 *   <sky-flexcol span="8">
 *     <div class="card">Main Content</div>
 *   </sky-flexcol>
 *   <sky-flexcol span="4">
 *     <div class="card">Sidebar</div>
 *   </sky-flexcol>
 * </sky-flexbox>
 * ```
 * ```vue
 * <template>
 *   <sky-flexbox col="12" gap="16px">
 *     <sky-flexcol span="8" span-md="12">Main Content</sky-flexcol>
 *     <sky-flexcol span="4" span-md="12">Sidebar</sky-flexcol>
 *   </sky-flexbox>
 * </template>
 * ```
 * ```jsx
 * export default function Demo() {
 *   return (
 *     <sky-flexbox col="12" gap="16px">
 *       <sky-flexcol span="8" span-md="12">Main Content</sky-flexcol>
 *       <sky-flexcol span="4" span-md="12">Sidebar</sky-flexcol>
 *     </sky-flexbox>
 *   );
 * }
 * ```
 */
export declare class SkyFlexcol extends LitElement {
    /**
     * Number of columns to span.
     * @public
     */
    span: number;
    /**
     * Columns spanned at large screens (≤1200px).
     * @public
     */
    spanLg?: number;
    /**
     * Columns spanned at medium screens (≤992px).
     * @public
     */
    spanMd?: number;
    /**
     * Columns spanned at small screens (≤768px).
     * @public
     */
    spanSm?: number;
    /**
     * Columns spanned at extra-small screens (≤576px).
     * @public
     */
    spanXs?: number;
    /**
     * Flex grow factor.
     * @public
     */
    grow: number;
    /**
     * Flex shrink factor.
     * @public
     */
    shrink: number;
    /**
     * Flex basis (e.g., `"200px"` or `"auto"`).
     * @public
     */
    basis: string | null;
    /**
     * Flex order relative to siblings.
     * @public
     */
    order?: number;
    /**
     * Self alignment override.
     * @public
     */
    alignSelf?: SkyFlexcolAlignSelf;
    static styles: import("lit").CSSResult;
    /** @protected */
    /** Named prop preset from nearest `sky-config-provider`. */
    preset: string;
    private _presets;
    firstUpdated(): void;
    /** @protected */
    updated(changed: Map<string | number | symbol, unknown>): void;
    /**
     * Syncs component properties to CSS custom properties.
     * @private
     */
    private syncVars;
    /**
     * Forces resynchronization of CSS custom properties.
     * Useful when properties are changed programmatically.
     * @public
     */
    refreshStyles(): void;
    /**
     * Gets the current span value.
     * @returns Current span value
     * @public
     */
    getSpan(): number;
    /**
     * Sets the span value and updates styles.
     * @param value - New span value
     * @public
     */
    setSpan(value: number): void;
    /** @protected */
    render(): import("lit-html").TemplateResult<1>;
}