{{-- Layout Reference --}}
@extends('Limitless::Help.Layout.Master')

@section('Limitless::Content')

    {{-- Description --}}
    @Limitless::ElementCardStart(['title' => "Random Select", 'icon' => 'icon-shuffle'])
    <p>Selects one random item from a <i>one (1)</i> level array.</p>
    @Limitless::ElementCardStop

    {{-- Elements --}}
    @Limitless::ElementCardStart(['title' => "Fragments", 'icon' => 'icon-grid5'])

        <div class="bg-dark rounded py-2 px-3 mb-3">
            <h6 class="mb-0 font-weight-semibold">RandomSelect</h6>
            <p class="mb-3 text-muted">Selects one random item from a <i>one (1)</i> level array.</p>
            <p class="font-italic font-size-lg">Parameters</p>
            <div class="row mt-2">
                @Limitless::TableStart([ 'extra' => ['class' => 'table table-xs table-striped'] ])

                @Limitless::TableAutofillHeader([
                    ['name' => 'Key'],
                    ['name' => 'Type'],
                    ['name' => 'Description']
                ])

                @Limitless::TableAutofillBody([
                    [
                        ['value' => 'items'],
                        ['value' => '<i>Array</i> [Default = <code>[]</code>]', 'secure' => false],
                        ['value' => 'The array of items.']
                    ]
                ])
                @Limitless::TableStop
            </div>
        </div>

    @Limitless::ElementCardStop

    {{-- Sample Output --}}
    @Limitless::ElementCardStart(['title' => "Sample Output", 'icon' => 'icon-display4' ] )
        @php
            $items = ['Item1', 'Item2', 'Item3', 'Item4', 'Item5'];
        @endphp

        <div> @Limitless::RandomSelect($items) </div>
        <div> @Limitless::RandomSelect($items) </div>
        <div> @Limitless::RandomSelect($items) </div>
        <div> @Limitless::RandomSelect($items) </div>
        <div> @Limitless::RandomSelect($items) </div>
    @Limitless::ElementCardStop

    @php
        $example = base64_decode("QHBocAoJJGl0ZW1zID0gWydJdGVtMScsICdJdGVtMicsICdJdGVtMycsICdJdGVtNCcsICdJdGVtNSddOwpAZW5kcGhwCgo8ZGl2PiBATGltaXRsZXNzOjpSYW5kb21TZWxlY3QoJGl0ZW1zKSA8L2Rpdj4KPGRpdj4gQExpbWl0bGVzczo6UmFuZG9tU2VsZWN0KCRpdGVtcykgPC9kaXY+CjxkaXY+IEBMaW1pdGxlc3M6OlJhbmRvbVNlbGVjdCgkaXRlbXMpIDwvZGl2Pgo8ZGl2PiBATGltaXRsZXNzOjpSYW5kb21TZWxlY3QoJGl0ZW1zKSA8L2Rpdj4KPGRpdj4gQExpbWl0bGVzczo6UmFuZG9tU2VsZWN0KCRpdGVtcykgPC9kaXY+");
    @endphp

    {{-- Sample Code --}}
    @Limitless::ElementCardStart(['title' => "Sample Code", 'icon' => 'icon-circle-code' ] )
        @Limitless::Codemirror([ 'language' => 'javascript', 'theme' => 'zenburn', 'value' => $example ])
    @Limitless::ElementCardStop

@stop
