Giter Club home page Giter Club logo

yii-bootstrap5's Introduction

Yii Framework Twitter Bootstrap 5 Extension


This Yii Framework extension encapsulates [Twitter Bootstrap 5] components and plugins in terms of Yii widgets, and thus makes using Bootstrap components/plugins in Yii applications extremely easy.

For license information check the LICENSE-file.

Documentation is at docs/guide/README.md.

Latest Stable Version Total Downloads Build status Scrutinizer Code Quality Code Coverage Mutation testing badge static analysis type-coverage

Installation

The preferred way to install this extension is through composer.

php composer.phar require --prefer-dist yiisoft/yii-bootstrap5

Install assets

There are several ways to install the assets, they are:

  1. Using the AssetPackagist package manager.

Add to composer.json the following:

{
    "require": {
        "npm-asset/bootstrap": "^5.3",
        "oomphinc/composer-installers-extender": "^2.0"
    },
    "extra": {
        "installer-types": [
            "npm-asset"
        ],
        "installer-paths": {
            "./node_modules/{$name}": [
                "type:npm-asset"
            ]
        }
    },
    "repositories": [
        {
            "type": "composer",
            "url": "https://asset-packagist.org"
        }
    ]
}

Once the changes are made, you can install the assets using the following command:

composer update
  1. Using the npm-asset package manager.

Run the following command at the root directory of your application.

General usage

For example, the following single line of code in a view file would render a Bootstrap Progress plugin:

<?= Yiisoft\Yii\Bootstrap5\Progress::widget()
    ->percent('60')
    ->label('test') ?>

Unit testing

The package is tested with PHPUnit. To run tests:

./vendor/bin/phpunit

Mutation testing

The package tests are checked with Infection mutation framework. To run it:

./vendor/bin/infection

Static analysis

The code is statically analyzed with Psalm. To run static analysis:

./vendor/bin/psalm

Support the project

Open Collective

Follow updates

Official website Twitter Telegram Facebook Slack

License

The Yii Framework Twitter Bootstrap 5 Extension is free software. It is released under the terms of the BSD License. Please see LICENSE for more information.

Maintained by Yii Software.

yii-bootstrap5's People

Contributors

albertborsos avatar arhell avatar dependabot[bot] avatar devanych avatar dood- avatar fantom409 avatar gerych1984 avatar luke- avatar mister-42 avatar ostrojen avatar roxblnfk avatar rustamwin avatar samdark avatar sankaest avatar stylecibot avatar terabytesoftw avatar viktorprogger avatar vjik avatar xepozz avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

yii-bootstrap5's Issues

update irc link

What steps will reproduce the problem?

What is the expected result?

What do you get instead?

Additional info

Q A
Version 1.0.?
PHP version
Operating system

Incomplete and/or invalid BS5 components

Same problem as in package yii2-bootstrap5, that's widgets generates not complete or invalid BS5 components.
For example, simplest component in BS5 - buttons, widget Button not implements:

  • <a>s don’t support the disabled attribute, so you must add the .disabled class to make it visually appear disabled
  • Disabled buttons using <a> should include the aria-disabled="true" attribute to indicate the state of the element to assistive technologies
  • Disabled buttons using <a> should not include the href attribute
  • <a> should be given a role="button" to appropriately convey their purpose to assistive technologies

basic HTML generator's features:

  • auto escape content (escape only if not contains < and >)
  • normalize attribute values (boolean attributes set as "" or "attribute" too)

too not implemented...

What's doing widget? Add class btn and and generate tag i.e.

echo Button::widget()->label('Action')->options(['class' => 'btn-lg']);

generates

<button class="btn btn-lg">Action</button>

HTML tag less than PHP code!
This shows that dummy-widgets like as Button are useless to generates BS5 components.

update docs folder links

What steps will reproduce the problem?

What is the expected result?

What do you get instead?

Additional info

Q A
Version 1.0.?
PHP version
Operating system

Why is cloning the widget required here?

I'm confused about cloning here:

public function id(string $value): self
{
    $new = clone $this;
    $new->id = $value;
    return $new;
}

Why not just updating $id?

public function id(string $value): void
{
    $this->id= $value;
}

This would only make sense if we had a readonly / immutable property $id (PHP8.1). But then, the method name should be changed (e.g. cloneWithId()).

What am I missing?

This applies here...

$new = clone $this;

and here...

$new = clone $this;

NavBar Item and Corousel Item (s) are returning escaped html and will not render as html

yii-bootstrap5 returns html escaped strings for items after clean setup as online readme

  • <a class="nav-link" href="/blog">Blog</a>
  • <a class="nav-link" href="/blog/comments/">Comments Feed</a>
  • <a class="nav-link" href="/user">Users</a>
  • <a class="nav-link" href="/contact">Contact</a>
  • <a class="nav-link" href="/swagger">Swagger</a>
  • <a class="nav-link" href="/login">Login</a>
  • <a class="nav-link" href="/signup">Signup</a>
  • What steps will reproduce the problem?

    • php8.0.4 fresh install - composer 2.0 fresh install
    • git clone yiisoft/yii-demo
    • follow readme
    • open localhost:8080

    What is the expected result?

    clean demo bootstrap

    What do you get instead?

    elements created with item are returned as escaped html and not as html

    Additional info

    Q A
    Version 3.0@dev
    PHP version 8.0.4
    Operating system ubuntu 20.0.4

    The asset manager ended with an error

    Hello, I updated the composer to version 2.
    Replaces fxp/composer-asset-plugin with foxy/foxy.
    I decided to install yiisoft/yii-bootstrap5 and I'm having the following errors:

    error Couldn't find any versions for "bootstrap" that matches "^5.0.0"

    [RuntimeException]
    The asset manager ended with an error

    Failing phpunit tests

    There were 3 errors:
    
    1) Yiisoft\Yii\Bootstrap5\Tests\ButtonGroupTest::testContainerOptions
    Undefined index: options
    
    /dev/yii-bootstrap5/src/ButtonGroup.php:85
    /dev/yii-bootstrap5/src/ButtonGroup.php:54
    /dev/yii-bootstrap5/vendor/yiisoft/widget/src/Widget.php:106
    /dev/yii-bootstrap5/tests/ButtonGroupTest.php:30
    
    2) Yiisoft\Yii\Bootstrap5\Tests\ButtonToolbarTest::testContainerOptions
    Undefined index: options
    
    /dev/yii-bootstrap5/src/ButtonGroup.php:85
    /dev/yii-bootstrap5/src/ButtonGroup.php:54
    /dev/yii-bootstrap5/vendor/yiisoft/widget/src/Widget.php:106
    /dev/yii-bootstrap5/tests/ButtonToolbarTest.php:37
    
    3) Yiisoft\Yii\Bootstrap5\Tests\ButtonToolbarTest::testAdditionalContent
    Undefined index: options
    
    /dev/yii-bootstrap5/src/ButtonGroup.php:85
    /dev/yii-bootstrap5/src/ButtonGroup.php:54
    /dev/yii-bootstrap5/src/ButtonToolbar.php:83
    /dev/yii-bootstrap5/src/ButtonToolbar.php:62
    /dev/yii-bootstrap5/vendor/yiisoft/widget/src/Widget.php:106
    /dev/yii-bootstrap5/tests/ButtonToolbarTest.php:96
    
    --
    
    There were 4 failures:
    
    1) Yiisoft\Yii\Bootstrap5\Tests\TabsTest::testDisabled
    Failed asserting that '<ul id="w0-tabs" class="nav nav-tabs" role="tablist"><li class="nav-item"><a class="nav-link disabled" href="#w0-tabs-tab0" tabindex="-1" aria-disabled="true">Page1</a></li>\n
    <li class="nav-item"><a class="nav-link active" href="#w0-tabs-tab1">Page2</a></li>\n
    <li class="nav-item"><a class="nav-link disabled" href="#w0-tabs-tab2" tabindex="-1" aria-disabled="true">DisabledPage</a></li>\n
    <li class="dropdown nav-item"><a class="dropdown-toggle nav-link" href="#" data-toggle="dropdown">Dropdown1</a><div id="w1-dropdown" class="dropdown-menu"><a class="dropdown-item" href="#w0-tabs-dd3-tab0">Page2</a>\n
    <a class="dropdown-item disabled" href="#w0-tabs-dd3-tab1" tabindex="-1" aria-disabled="true">DisabledItem</a>\n
    <a class="dropdown-item" href="#w0-tabs-dd3-tab2">Page3</a>\n
    <a class="dropdown-item" href="/other/dropdown/route">External Link</a>\n
    <a class="dropdown-item disabled" href="/other/dropdown/route" tabindex="-1" aria-disabled="true">Disabled External Link</a></div></li></ul>\n
    <div class="tab-content"><div id="w0-tabs-tab0" class="tab-pane">Page1</div>\n
    <div id="w0-tabs-tab1" class="tab-pane active">Page2</div>\n
    <div id="w0-tabs-tab2" class="tab-pane">Disabled Page Content</div>\n
    <div id="w0-tabs-dd3-tab0" class="tab-pane">Page2</div>\n
    <div id="w0-tabs-dd3-tab1" class="tab-pane">Disabled Item Content</div>\n
    <div id="w0-tabs-dd3-tab2" class="tab-pane">Page3</div></div>' contains "<li class="nav-item"><a class="nav-link disabled" href="#w0-tabs-tab0" data-toggle="tab" role="tab" aria-controls="w0-tabs-tab0" tabindex="-1" aria-disabled="true">Page1</a></li>".
    
    /dev/yii-bootstrap5/tests/TabsTest.php:189
    
    2) Yiisoft\Yii\Bootstrap5\Tests\TabsTest::testActivateFirstVisibleTab
    Failed asserting that '<ul id="mytab" class="nav nav-tabs" role="tablist"><li class="nav-item"><a class="nav-link disabled" href="#mytab-tab1" tabindex="-1" aria-disabled="true">Tab 2</a></li>\n
    <li class="nav-item"><a class="nav-link active" href="#mytab-tab2">Tab 3</a></li>\n
    <li class="nav-item"><a class="nav-link" href="#mytab-tab3">Tab 4</a></li></ul>\n
    <div class="tab-content"><div id="mytab-tab1" class="tab-pane">some content</div>\n
    <div id="mytab-tab2" class="tab-pane active">some content</div>\n
    <div id="mytab-tab3" class="tab-pane">some content</div></div>' contains "<li class="nav-item"><a class="nav-link active" href="#mytab-tab2" data-toggle="tab" role="tab" aria-controls="mytab-tab2" aria-selected="true">Tab 3</a></li>".
    
    /dev/yii-bootstrap5/tests/TabsTest.php:294
    
    3) Yiisoft\Yii\Bootstrap5\Tests\TabsTest::testActivateTab
    Failed asserting that '<ul id="mytab" class="nav nav-tabs" role="tablist"><li class="nav-item"><a class="nav-link" href="#mytab-tab1">Tab 2</a></li>\n
    <li class="nav-item"><a class="nav-link active" href="#mytab-tab2">Tab 3</a></li>\n
    <li class="nav-item"><a class="nav-link" href="#mytab-tab3">Tab 4</a></li></ul>\n
    <div class="tab-content"><div id="mytab-tab1" class="tab-pane">some content</div>\n
    <div id="mytab-tab2" class="tab-pane active">some content</div>\n
    <div id="mytab-tab3" class="tab-pane">some content</div></div>' contains "<li class="nav-item"><a class="nav-link active" href="#mytab-tab2" data-toggle="tab" role="tab" aria-controls="mytab-tab2" aria-selected="true">Tab 3</a></li>".
    
    /dev/yii-bootstrap5/tests/TabsTest.php:328
    
    4) Yiisoft\Yii\Bootstrap5\Tests\TabsTest::testIdRendering
    Failed asserting that two strings are equal.
    --- Expected
    +++ Actual
    @@ @@
    -'<ul id="w0-tabs" class="nav nav-tabs" role="tablist"><li class="nav-item"><a class="nav-link active" href="#pane1" data-toggle="tab" role="tab" aria-controls="pane1" aria-selected="true">Tab 1</a></li>\n
    -<li class="nav-item"><a class="nav-link" href="#w0-tabs-tab1" data-toggle="tab" role="tab" aria-controls="w0-tabs-tab1" aria-selected="false">Tab 2</a></li></ul>\n
    +'<ul id="w0-tabs" class="nav nav-tabs" role="tablist"><li class="nav-item"><a class="nav-link active" href="#pane1">Tab 1</a></li>\n
    +<li class="nav-item"><a class="nav-link" href="#w0-tabs-tab1">Tab 2</a></li></ul>\n
     <div class="tab-content"><div id="pane1" class="tab-pane active"><div>Content 1</div></div>\n
     <div id="w0-tabs-tab1" class="tab-pane"><div>Content 2</div></div></div>'
    
    /dev/yii-bootstrap5/tests/TestCase.php:71
    /dev/yii-bootstrap5/tests/TabsTest.php:390
    

    Create virtual package yii-bootstrap

    Hello devs,

    Would you please consider creating a virtual package yii-bootstrap, that both yii-bootstrap4 and yii-bootstrap5 'provide' to? That way we can require yii-bootstrap and leave it up to the individual devs to choose a version.

    update src folder links

    What steps will reproduce the problem?

    http=>https

    What is the expected result?

    What do you get instead?

    Additional info

    Q A
    Version 1.0.?
    PHP version
    Operating system

    ["homeLink" => false] parameter does not work anymore

    What steps will reproduce the problem?

    Create a new instance of the breadcrumbs widget

    <?= Breadcrumbs::widget([                                   
        'homeLink' => false,
        'links' => isset($this->params['breadcrumbs']) ? $this->params['breadcrumbs'] : [],
    ]) ?>
    

    What is the expected result?

    The home link should not be rendered

    What do you get instead?

    TypeError
    Argument 1 passed to yii\bootstrap5\Breadcrumbs::renderItem() must be of the type array, bool given
    

    Additional info

    Q A
    Version 1.0.?
    PHP version 7.4.3
    Operating system Windows 10 WSL ubuntu

    Installation Problem

    What steps will reproduce the problem?

    Installation

    What do you get instead?

    Problem 1
    - Installation request for yiisoft/yii-bootstrap5 ^3.0@dev -> satisfiable by yiisoft/yii-bootstrap5[3.0.x-dev].
    - yiisoft/yii-bootstrap5 3.0.x-dev requires npm-asset/bootstrap ^5.0.0 -> satisfiable by npm-asset/bootstrap[5.0.0-beta3, 5.0.0-beta2, 5.0.0-beta1, 5.0.0-alpha3, 5.0.0-alpha2, 5.0.0-alpha1] but these conflict with your requirements or minimum-stability.

    Additional info

    Q A
    Yii version 2.0.42-dev
    PHP version PHP 7.4.3 (cli)
    Operating system Ubuntu 20.04 LTS

    remove "guide-" from folder names.

    remove "guide-" from folder names. I believe this is out of the norm

    What is the expected result?

    follow the normal pattern for translation folders

    Could not find package yiisoft/yii-bootstrap5

    Hello there. Trying to install package on a clean yii2 installation, but i'm receiving this error message. Any idea why?

    php composer.phar require yiisoft/yii-bootstrap5
    
                                                      
      [InvalidArgumentException]                      
      Could not find package yiisoft/yii-bootstrap5.  
                                                      
      Did you mean one of these?                      
          yiisoft/yii-bootstrap5                      
          yiisoft/yii-bootstrap4                      
                                                      
    
    require [--dev] [--dry-run] [--prefer-source] [--prefer-dist] [--fixed] [--no-suggest] [--no-progress] [--no-update] [--no-install] [--no-scripts] [--update-no-dev] [-w|--update-with-dependencies] [-W|--update-with-all-dependencies] [--with-dependencies] [--with-all-dependencies] [--ignore-platform-req IGNORE-PLATFORM-REQ] [--ignore-platform-reqs] [--prefer-stable] [--prefer-lowest] [--sort-packages] [-o|--optimize-autoloader] [-a|--classmap-authoritative] [--apcu-autoloader] [--apcu-autoloader-prefix APCU-AUTOLOADER-PREFIX] [--] [<packages>]...
    
    

    Regards!

    improve $menuItems example in Nav class

    This example:

    * if ($user->getId() !== null) {
    * $menuItems = [
    * [
    * 'label' => 'About',
    * 'url' => '/about',
    * ],
    * [
    * 'label' => 'Contact',
    * 'url' => '/contact',
    * ],
    * [
    * 'label' => 'Logout' . ' ' . '(' . $user->getUsername() . ')',
    * 'url' => '/logout'
    * ],
    * ];
    * } else {
    * $menuItems = [
    * [
    * 'label' => 'About',
    * 'url' => '/about',
    * ],
    * [
    * 'label' => 'Contact',
    * 'url' => '/contact',
    * ],
    * [
    * 'label' => 'Login',
    * 'url' => '/login',
    * ],
    * ];
    * }

    would look better this way:

     *    $menuItems = [
     *        [
     *            'label' => 'About',
     *            'url' => '/about',
     *        ],
     *        [
     *            'label' => 'Contact',
     *            'url' => '/contact',
     *        ],
     *        [
     *            'label' => 'Login',
     *            'url' => '/login',
     *            'visible' => $user->getId() === null,
     *        ],
     *        [
     *            'label' => 'Logout' . ' ' . '(' . $user->getUsername() . ')',
     *            'url' => '/logout',
     *            'visible' => $user->getId() !== null,
     *        ],
     *    ];

    Exception during installation

    What steps will reproduce the problem?

    Installation

    What is the expected result?

    composer require --prefer-dist yiisoft/yii-bootstrap5

    What do you get instead?

    [InvalidArgumentException]
    Could not find a version of package yiisoft/yii-bootstrap5 matching your minimum-stability (stabl
    e). Require it with an explicit version constraint allowing its desired stability.

    Additional info

    Q A
    Version 5.alpha
    PHP version PHP 7.4.3 (cli)
    Operating system Ubuntu 20.04

    update root folder links

    What steps will reproduce the problem?

    What is the expected result?

    What do you get instead?

    Additional info

    Q A
    Version 1.0.?
    PHP version
    Operating system

    Fresh Instllation: Call to undefined method Yiisoft\Yii\Bootstrap5\Assets\BootstrapAsset::publish()

    What steps will reproduce the problem?

    • fresh github installation of yii2 basic
    • install bs5 via composer / packagist repo
    • connfigure AppAsset.php like this:
      AppAssets.php
      [...]
    public $depends = [
            'yii\web\YiiAsset',
            'Yiisoft\Yii\Bootstrap5\Assets\BootstrapAsset', // this line
        ];
    
    • load page

    What is the expected result?

    • no error

    What do you get instead?

    vendor/yiisoft/yii2/web/AssetManager.php:

    Call to undefined method Yiisoft\Yii\Bootstrap5\Assets\BootstrapAsset::publish()

    */
     protected function loadBundle($name, $config = [], $publish = true)
     {
         if (!isset($config['class'])) {
             $config['class'] = $name;
         }
         /* @var $bundle AssetBundle */
         $bundle = Yii::createObject($config);
         if ($publish) {
             $bundle->publish($this);
         }
    
         return $bundle;
     }
    
     /**
      * Loads dummy bundle by name.
      *
      * @param string $name
    

    Additional info

    Q A
    Version 2.0.41
    PHP version 7.4.9
    Operating system debian

    Installation Problem

    Hi!

    What steps will reproduce the problem?

    Installation.
    Checked for a new project.

    php composer.phar create-project yiisoft/app --prefer-dist --stability=dev app-test
    

    Install bootstrap 5

    php composer.phar require --prefer-dist yiisoft/yii-bootstrap5
    

    What do you get instead?

    Problem 1
        - yiisoft/yii-bootstrap5[dev-dependabot/composer/rector/rector-tw-0.17.6, dev-dependabot/composer/rector/rector-tw-0.17.7, dev-dependabot/composer/vimeo/psalm-tw-5.13, dev-dependabot/composer/phpunit/phpunit-tw-10.2, dev-master, 3.0.x-dev] require npm-asset/bootstrap ^5.0.0 -> could not be found in any version, but the following packages provide it:
          - demokn/yii2-composer-asset
          - kriss/yii2-advanced Yii2 advanced project template, Frontend for API and Backend with AdminLTE
          - yzchan/yii2-asset-provider
          Consider requiring one of these to satisfy the npm-asset/bootstrap requirement.
        - yiisoft/yii-bootstrap5 3.0.x-dev is an alias of yiisoft/yii-bootstrap5 dev-master and thus requires it to be installed too.
        - Root composer.json requires yiisoft/yii-bootstrap5 * -> satisfiable by yiisoft/yii-bootstrap5[dev-dependabot/composer/rector/rector-tw-0.17.6, dev-dependabot/composer/rector/rector-tw-0.17.7, dev-dependabot/composer/vimeo/psalm-tw-5.13, dev-dependabot/composer/phpunit/phpunit-tw-10.2, dev-master, 3.0.x-dev (alias of dev-master)].
    
    Potential causes:
     - A typo in the package name
     - The package is not available in a stable-enough version according to your minimum-stability setting
       see <https://getcomposer.org/doc/04-schema.md#minimum-stability> for more details.
     - It's a private package and you forgot to add a custom repository to find it
    

    Additional info

    Q A
    Version 3
    PHP version 8.2.8
    Operating system 22.04.1-Ubuntu

    Recommend Projects

    • React photo React

      A declarative, efficient, and flexible JavaScript library for building user interfaces.

    • Vue.js photo Vue.js

      🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

    • Typescript photo Typescript

      TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

    • TensorFlow photo TensorFlow

      An Open Source Machine Learning Framework for Everyone

    • Django photo Django

      The Web framework for perfectionists with deadlines.

    • D3 photo D3

      Bring data to life with SVG, Canvas and HTML. 📊📈🎉

    Recommend Topics

    • javascript

      JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

    • web

      Some thing interesting about web. New door for the world.

    • server

      A server is a program made to process requests and deliver data to clients.

    • Machine learning

      Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

    • Game

      Some thing interesting about game, make everyone happy.

    Recommend Org

    • Facebook photo Facebook

      We are working to build community through open source technology. NB: members must have two-factor auth.

    • Microsoft photo Microsoft

      Open source projects and samples from Microsoft.

    • Google photo Google

      Google ❤️ Open Source for everyone.

    • D3 photo D3

      Data-Driven Documents codes.