create-foldkit-app 0.32.1 → 0.33.0

package/dist/templates/examples/job-application/src/view/educationEntry.ts

@@ -1,165 +0,0 @@
-import clsx from 'clsx'
-import { Array, Option } from 'effect'
-import { Submodel } from 'foldkit'
-import { type CalendarDate } from 'foldkit/calendar'
-import type { Html } from 'foldkit/html'
-
-import { Button, Listbox } from '@foldkit/ui'
-
-import { Education } from '../step'
-import { checkboxField, inputField } from './field'
-import { chevronDown } from './icon'
-
-const GRADUATION_YEAR_WINDOW_SIZE = 30
-const GRADUATION_YEAR_FORWARD_OFFSET = 6
-
-const GraduationYearListbox = Listbox.create<string>()
-
-const graduationYears = (today: CalendarDate): ReadonlyArray<string> =>
-  Array.makeBy(GRADUATION_YEAR_WINDOW_SIZE, index =>
-    String(today.year + GRADUATION_YEAR_FORWARD_OFFSET - index),
-  )
-
-export type ViewInputs = Readonly<{
-  today: CalendarDate
-}>
-
-export const educationEntryView = Submodel.defineView<
-  Education.Entry.Model,
-  Education.Entry.Message,
-  ViewInputs
->((model, viewInputs, h): Html => {
-  const { today } = viewInputs
-
-  const showGraduationYear = !model.isCurrentlyEnrolled
-
-  const graduationYearField = h.keyed('div')(
-    `${model.id}-graduation-year`,
-    [h.Class('space-y-1')],
-    [
-      h.label(
-        [h.Class('block text-sm font-medium text-gray-700')],
-        ['Graduation Year'],
-      ),
-      h.submodel({
-        slotId: model.graduationYearListbox.id,
-        model: model.graduationYearListbox,
-        view: GraduationYearListbox.view,
-        viewInputs: {
-          items: graduationYears(today),
-          maybeSelectedValue: model.maybeGraduationYear,
-          buttonContent: h.div(
-            [h.Class('flex w-full items-center justify-between gap-2')],
-            [
-              Option.match(model.maybeGraduationYear, {
-                onNone: () =>
-                  h.span([h.Class('text-gray-400')], ['Select year']),
-                onSome: graduationYear => h.span([], [graduationYear]),
-              }),
-              h.span([h.Class('text-gray-400 shrink-0')], [chevronDown()]),
-            ],
-          ),
-          buttonClassName:
-            'w-full rounded-lg border border-gray-300 bg-white px-3 py-2 text-sm text-left cursor-pointer focus:outline-none focus:ring-2 focus:ring-indigo-500',
-          itemsClassName:
-            'rounded-lg border border-gray-200 bg-white shadow-lg py-1 max-h-64 overflow-y-auto w-(--button-width)',
-          itemToConfig: (year, { isActive, isSelected }) => ({
-            className: clsx(
-              'flex items-center gap-2 px-4 py-2 text-sm cursor-pointer',
-              isActive && 'bg-gray-50',
-              isSelected && 'text-indigo-700 font-semibold',
-            ),
-            content: h.div(
-              [h.Class('flex items-center gap-2 w-full')],
-              [
-                isSelected ? h.span([], ['✓']) : h.span([h.Class('w-4')]),
-                h.span([], [year]),
-              ],
-            ),
-          }),
-          backdropClassName: 'fixed inset-0',
-          anchor: { placement: 'bottom-start', gap: 4, padding: 8 },
-        },
-        toParentMessage: message =>
-          Education.Entry.Message.GotGraduationYearListboxMessage({ message }),
-      }),
-    ],
-  )
-
-  return h.keyed('div')(
-    model.id,
-    [h.Class('py-6 space-y-4 first:pt-0')],
-    [
-      h.div(
-        [h.Class('grid grid-cols-2 gap-3')],
-        [
-          inputField(
-            {
-              id: `${model.id}-school`,
-              label: 'School',
-              field: model.school,
-              onInput: value =>
-                Education.Entry.Message.UpdatedSchool({ value }),
-              placeholder: 'e.g. MIT',
-            },
-            h,
-          ),
-          inputField(
-            {
-              id: `${model.id}-degree`,
-              label: 'Degree',
-              field: model.degree,
-              onInput: value =>
-                Education.Entry.Message.UpdatedDegree({ value }),
-              placeholder: "e.g. Bachelor's, Master's",
-            },
-            h,
-          ),
-        ],
-      ),
-      inputField(
-        {
-          id: `${model.id}-field`,
-          label: 'Field of Study',
-          field: model.fieldOfStudy,
-          onInput: value =>
-            Education.Entry.Message.UpdatedFieldOfStudy({ value }),
-          placeholder: 'e.g. Computer Science',
-        },
-        h,
-      ),
-      checkboxField(
-        {
-          id: `${model.id}-enrolled`,
-          label: 'I’m currently enrolled',
-          isChecked: model.isCurrentlyEnrolled,
-          onToggle: isChecked =>
-            Education.Entry.Message.ToggledCurrentlyEnrolled({ isChecked }),
-        },
-        h,
-      ),
-      ...(showGraduationYear ? [graduationYearField] : []),
-      h.div(
-        [h.Class('flex justify-end')],
-        [
-          Button.view(
-            {
-              onClick: Education.Entry.Message.ClickedRemoveSelf(),
-              toView: attributes =>
-                h.button(
-                  [
-                    ...attributes.button,
-                    h.Class(
-                      'text-sm text-gray-400 hover:text-red-500 transition cursor-pointer',
-                    ),
-                  ],
-                  ['Remove education'],
-                ),
-            },
-            h,
-          ),
-        ],
-      ),
-    ],
-  )
-})

package/dist/templates/examples/job-application/src/view/skills.ts

@@ -1,49 +0,0 @@
-import { Submodel } from 'foldkit'
-import type { Html } from 'foldkit/html'
-
-import { Button } from '@foldkit/ui'
-
-import { Skills } from '../step'
-import { Message } from '../step/skills'
-import { skillEntryView } from './skillEntry'
-
-export const skillsView = Submodel.defineView<Skills.Model, Skills.Message>(
-  (model, h): Html =>
-    h.div(
-      [h.Class('space-y-6')],
-      [
-        h.p(
-          [h.Class('text-sm text-gray-500')],
-          ['Add your technical and professional skills.'],
-        ),
-        h.div(
-          [h.Class('divide-y divide-gray-200')],
-          model.entries.map(entry =>
-            h.submodel({
-              slotId: entry.id,
-              model: entry,
-              view: skillEntryView,
-              toParentMessage: message =>
-                Message.GotEntryMessage({ entryId: entry.id, message }),
-            }),
-          ),
-        ),
-        Button.view(
-          {
-            onClick: Message.ClickedAddEntry(),
-            toView: attributes =>
-              h.button(
-                [
-                  ...attributes.button,
-                  h.Class(
-                    'w-full rounded-lg border-2 border-dashed border-gray-300 px-4 py-3 text-sm font-medium text-gray-600 hover:border-indigo-400 hover:text-indigo-600 transition cursor-pointer',
-                  ),
-                ],
-                ['+ Add Skill'],
-              ),
-          },
-          h,
-        ),
-      ],
-    ),
-)