view release on metacpan or  search on metacpan

lib/CSS/Prepare/Plugin/Contain.pm  view on Meta::CPAN

package CSS::Prepare::Plugin::Contain;

# TODO
#   -   how to inject styles for _DIFFERENT_ selectors? (append to the end of
#       the current block, which helps with the following)
#   -   stop optimise from turning display:inline; display:block; into
#       one rule by putting it within two chunks ($prep->add_chunk()?)

use Modern::Perl;
use CSS::Prepare::Property::Expansions;
use CSS::Prepare::Property::Values;

my $contain_value = qr{ 
            (?'overflow' overflow )
        |
            (?'easy' easy ) 
            (?: \s+ (?'easytype' valid | hack ) )?
    }x;



sub expand {
    my $self      = shift;
    my $property  = shift;
    my $value     = shift;
    my $selectors = shift;
    
    return
        unless $property eq '-cp-contain';
    
    # validate the value, and if not understood, just pass it through as
    # contain: $value
    return 
        unless $value =~ m{$contain_value};
    my %match = %+;
    
    return [{ property => 'overflow', value =>  'auto' }]
        if defined $match{'overflow'};
    
    # mungle the selectors
    my @after_selectors;
    map { push @after_selectors, "${_}:after" } @$selectors;
    
    if ( defined $match{'easytype'} && $match{'easytype'} eq 'valid' ) {
        return
            [{ property => 'display', value => 'inline-block' }],
            [],
            [
                {
                    block => {
                        'content'    => '"."',
                        'display'    => 'block',
                        'height'     => '0',
                        'clear'      => 'both',
                        'visibility' => 'hidden',
                    },
                    selectors => \@after_selectors,
                },
                {   type => 'boundary' },
                {
                    block => { 'display' => 'block' },
                    selectors => $selectors,
                }
            ];
    }
    else {
        return
            [{ property => '_zoom', value => '1' }],
            [],