JeffreyWay

import Assignment from "./Assignment.js";
import AssignmentTags from "./AssignmentTags.js";
import Panel from "./Panel.js";

export default {
    components: { Assignment, AssignmentTags, Panel },

    template: `
        <Panel v-show="assignments.length" class="w-60">
            <div class="flex justify-between items-start">

JeffreyWay

import Assignment from "./Assignment.js";
import AssignmentTags from "./AssignmentTags.js";

export default {
    components: { Assignment, AssignmentTags },

    template: `
        <section v-show="assignments.length" class="w-60">
            <div class="flex justify-between items-start">
                <h2 class="font-bold mb-2">

JeffreyWay

import AssignmentList from "./AssignmentList.js";
import AssignmentCreate from "./AssignmentCreate.js";

export default {
    components: { AssignmentList, AssignmentCreate },

    template: `
        <section class="space-y-6">
            <assignment-list :assignments="filters.inProgress" title="In Progress"></assignment-list>
            <assignment-list :assignments="filters.completed" title="Completed"></assignment-list>

JeffreyWay

import Assignment from "./Assignment.js";
import AssignmentTags from "./AssignmentTags.js";

export default {
    components: { Assignment, AssignmentTags },

    template: `
        <section v-show="assignments.length">
            <h2 class="font-bold mb-2">
                {{ title }}

JeffreyWay

<?php

class Player {
    public function __construct(public string $name, public int $pennies)
    {
        //
    }

    public function givePenny(Player $p2): void
    {

JeffreyWay

import Assignment from "./Assignment.js";

export default {
    components: { Assignment },

    template: `
        <section v-show="assignments.length">
            <h2 class="font-bold mb-2">
                {{ title }}
                <span>({{ assignments.length }})</span>

JeffreyWay

import Assignments from "./Assignments.js";

export default {
    components: { Assignments },

    template: `
        <assignments></assignments>    
    `,
}

JeffreyWay

import Assignments from "./Assignments.js";

export default {
    components: { Assignments },

    template: `
        <assignments></assignments>    
    `,
}

JeffreyWay

import AppButton from "./AppButton.js";

export default {
    components: {
        'app-button': AppButton
    }
};

JeffreyWay

export default {
    template: `
        <button class="bg-gray-200 hover:bg-gray-400 border rounded px-5 py-2 disabled:cursor-not-allowed" :disabled="processing">
            <slot />
        </button>
    `,

    data() {
        return {
            processing: true