@byline/cli 0.1.1

package/dist/templates/byline-examples/collections/news/admin.tsx

@@ -0,0 +1,192 @@
+/**
+ * This Source Code is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * Copyright (c) Infonomic Company Limited
+ */
+
+import { type CollectionAdminConfig, type ColumnDefinition, defineAdmin } from '@byline/core'
+import { DateTimeFormatter } from '@byline/ui/react/fields'
+
+import { SummaryLength } from '~/components/summary-length.js'
+
+import { News } from './schema.js'
+
+/**
+ * Column definitions for the default table-based list view.
+ *
+ * These are passed to the built-in `ListView` component and control which
+ * fields appear as columns, their labels, sort behaviour, and formatters.
+ *
+ * Note: when a custom `listView` component is registered on the
+ * `CollectionAdminConfig`, it receives the raw paginated data directly and
+ * is responsible for its own layout. These column definitions can still
+ * be used in a custom list view, but they are not automatically applied
+ * as they are with the default table-based `ListView`. You can import
+ * them if needed - for example if you wanted to create a toggled grid/table
+ * custom view.
+ */
+const listViewColumns: ColumnDefinition[] = [
+  {
+    fieldName: 'title',
+    label: 'Title',
+    sortable: true,
+    align: 'left',
+    className: 'w-[25%]',
+  },
+  {
+    fieldName: 'status',
+    label: 'Status',
+    align: 'center',
+    className: 'w-[15%]',
+  },
+  {
+    fieldName: 'updatedAt',
+    label: 'Last Updated',
+    sortable: true,
+    align: 'right',
+    className: 'w-[20%]',
+    formatter: { component: DateTimeFormatter },
+  },
+]
+
+/**
+ * Columns rendered per row when a collection item appears as the
+ * target of a relation picker. Usually narrower than the list
+ * view — just enough to identify the right item at a glance.
+ */
+// const pickerViewColumns: ColumnDefinition[] = []
+
+export const NewsAdmin: CollectionAdminConfig = defineAdmin(News, {
+  /**
+   * Column definitions for the default table-based list view.
+   * Controls which fields appear as columns, their labels, sort behaviour, and formatters.
+   */
+  columns: listViewColumns,
+
+  /**
+   * Column definitions used when this collection appears as the target of a relation
+   * picker modal (opened from a `relation` field widget). Omit to fall back to a
+   * single-line render of `useAsTitle` + `path`.
+   *
+   * Shape matches `ColumnDefinition` so formatters can be reused across list and picker.
+   *
+   * @example
+   * picker: [{ fieldName: 'title', label: 'Title' }] // or defined above as `pickerViewColumns`
+   */
+  // picker: [],
+
+  /**
+   * Custom list-view component that completely replaces the default table-based `ListView`
+   * on the collection index route. Receives a `ListViewComponentProps` object and is
+   * responsible for rendering search, ordering, results, and pagination itself.
+   *
+   * When omitted, the default table-based `ListView` is used with the `columns` defined above.
+   *
+   * @example
+   * listView: MediaListView,
+   */
+  // listView: undefined,
+
+  /**
+   * Group name for organising this collection in the admin sidebar navigation.
+   *
+   * @example
+   * group: 'Editorial',
+   */
+  // group: undefined,
+
+  /**
+   * Per-field rendering overrides, keyed by field name. Use to supply custom
+   * UI component slots for a specific field without affecting placement.
+   * Placement is controlled exclusively through the layout primitives below.
+   */
+  fields: {
+    summary: {
+      components: {
+        HelpText: SummaryLength,
+      },
+    },
+  },
+
+  /**
+   * Preview URL builder for live preview links. Receives the document and an
+   * optional locale and should return a fully-qualified URL string.
+   *
+   * @example
+   * preview: (doc, { locale }) => `https://example.com/${locale}/news/${doc.fields.path}`
+   */
+  // preview: undefined,
+
+  // ---------------------------------------------------------------------------
+  // UI Layout
+  //
+  // Tab, row, and group containers control how fields are grouped and positioned
+  // in the document edit view. Field names must match those defined in the
+  // collection schema. Names for tabSets, rows, and groups must be unique and
+  // must not collide with any schema field name (a startup error is thrown if
+  // they do).
+  // ---------------------------------------------------------------------------
+
+  /**
+   * Named tab sets. Each entry creates a separate tabbed interface in the edit
+   * view. You can define more than one tab set, though a single set is sufficient
+   * for most collections. Tab sets may only appear in `layout.main`.
+   *
+   * Each tab's `fields` array accepts schema field names, row names, and group names.
+   * An optional `condition` function can show/hide a tab based on live form data.
+   */
+  tabSets: [
+    {
+      name: 'main',
+      tabs: [
+        {
+          name: 'details',
+          label: 'Details',
+          fields: ['title', 'summary', 'category', 'featureImage'],
+        },
+        {
+          name: 'content',
+          label: 'Content',
+          fields: ['content'],
+        },
+      ],
+    },
+  ],
+
+  /**
+   * Named horizontal-row layouts. Fields listed inside a row are rendered
+   * side-by-side (flex row) on desktop and stack vertically below the `sm`
+   * breakpoint. Rows are leaf containers — they accept only schema field names.
+   *
+   * Reference a row by its `name` inside a tab's `fields`, a group's `fields`,
+   * or directly in `layout.main` / `layout.sidebar`.
+   */
+  // rows: [{ name: 'titles', fields: ['text1', 'text2'] }],
+  rows: [],
+
+  /**
+   * Named labelled-fieldset clusters. Groups accept schema field names and row
+   * names (not tabSets or nested groups). An optional `label` renders a heading
+   * above the cluster.
+   *
+   * Reference a group by its `name` inside a tab's `fields` or directly in
+   * `layout.main` / `layout.sidebar`.
+   */
+  groups: [],
+
+  /**
+   * Composition of all layout primitives into the form's two render regions.
+   *
+   * - `main` — accepts tabSet names, group names, row names, and schema field names.
+   * - `sidebar` — accepts group names, row names, and schema field names (no tabSets).
+   *
+   * When omitted entirely, the renderer synthesises a default that places every
+   * schema field in `main` in declaration order.
+   */
+  layout: {
+    main: ['main'],
+    sidebar: ['availableLanguages', 'publishedOn'],
+  },
+})

package/dist/templates/byline-examples/collections/news/index.ts

@@ -0,0 +1,10 @@
+/**
+ * This Source Code is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * Copyright (c) Infonomic Company Limited
+ */
+
+export { NewsAdmin } from './admin.js'
+export { News } from './schema.js'

package/dist/templates/byline-examples/collections/news/schema.ts

@@ -0,0 +1,91 @@
+/**
+ * This Source Code is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * Copyright (c) Infonomic Company Limited
+ */
+
+import type { CollectionFieldData } from '@byline/core'
+import { defineCollection, defineWorkflow } from '@byline/core'
+
+import { availableLanguagesField } from '~/fields/available-languages-field.js'
+
+// ---- Schema (server-safe, no UI concerns) ----
+
+export const News = defineCollection({
+  path: 'news',
+  labels: {
+    singular: 'News',
+    plural: 'News',
+  },
+  // Workflow: defineWorkflow() guarantees draft, published, and archived are
+  // always present and correctly ordered. No custom statuses here — the
+  // standard three-step lifecycle is used.
+  //
+  //   Resulting order: [draft, published, archived]
+  workflow: defineWorkflow({
+    draft: { label: 'Draft', verb: 'Revert to Draft' },
+    published: { label: 'Published', verb: 'Publish' },
+    archived: { label: 'Archived', verb: 'Archive' },
+  }),
+  showStats: true,
+  search: { fields: ['title'] },
+  useAsTitle: 'title',
+  useAsPath: 'title',
+  linksInEditor: true, // See type definition for details.
+  fields: [
+    { name: 'title', label: 'Title', type: 'text', localized: true },
+    {
+      name: 'summary',
+      label: 'Summary',
+      type: 'textArea',
+      localized: true,
+      helpText:
+        'Enter a short summary. The first 150 characters are used for social media meta descriptions. Aim for 100–300 characters.',
+    },
+    {
+      name: 'category',
+      label: 'Category',
+      type: 'relation',
+      targetCollection: 'news-categories',
+      displayField: 'name',
+    },
+    // Relation field demo. Points at the Media upload collection
+    // so editors can choose a feature image via the relation picker widget.
+    // Set `displayField: 'title'` so the picker's row label reads from the
+    // uploaded item's `title` field rather than falling back to its path.
+    // Will display the picker defined columns if present in the admin.tsx
+    // configuration.
+    {
+      name: 'featureImage',
+      label: 'Feature Image',
+      type: 'relation',
+      targetCollection: 'media',
+      displayField: 'title',
+      optional: true,
+    },
+    {
+      name: 'content',
+      label: 'Content',
+      type: 'richText',
+      helpText: 'Enter the main content for this page.',
+      localized: true,
+      embedRelationsOnSave: true, // See type definition for details.
+    },
+    {
+      name: 'publishedOn',
+      label: 'Published On',
+      type: 'datetime',
+      mode: 'datetime',
+    },
+    availableLanguagesField(),
+  ],
+})
+
+/**
+ * Field data shape inferred directly from the schema. Use this as the
+ * generic to typed read calls — `client.collection('news').find<NewsFields>()`
+ * — so dot-notation on `doc.fields` is fully checked.
+ */
+export type NewsFields = CollectionFieldData<typeof News>

package/dist/templates/byline-examples/collections/news-categories/admin.tsx

@@ -0,0 +1,78 @@
+/**
+ * This Source Code is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * Copyright (c) Infonomic Company Limited
+ */
+
+import { type CollectionAdminConfig, type ColumnDefinition, defineAdmin } from '@byline/core'
+import { DateTimeFormatter } from '@byline/ui/react/fields'
+
+import { NewsCategories } from './schema.js'
+
+// ---- Admin UI config (client-only, presentation concerns) ----
+
+/**
+ * Column definitions for the default table-based list view.
+ *
+ * These are passed to the built-in `ListView` component and control which
+ * fields appear as columns, their labels, sort behaviour, and formatters.
+ *
+ * Note: when a custom `listView` component is registered on the
+ * `CollectionAdminConfig`, it receives the raw paginated data directly and
+ * is responsible for its own layout. These column definitions can still
+ * be used in a custom list view, but they are not automatically applied
+ * as they are with the default table-based `ListView`. You can import
+ * them if needed - for example if you wanted to create a toggled grid/table
+ * custom view.
+ */
+
+const listViewColumns: ColumnDefinition[] = [
+  {
+    fieldName: 'name',
+    label: 'Name',
+    sortable: true,
+    align: 'left',
+    className: 'w-[25%]',
+  },
+  {
+    fieldName: 'status',
+    label: 'Status',
+    align: 'center',
+    className: 'w-[15%]',
+  },
+  {
+    fieldName: 'updatedAt',
+    label: 'Last Updated',
+    sortable: true,
+    align: 'right',
+    className: 'w-[20%]',
+    formatter: { component: DateTimeFormatter },
+  },
+]
+
+/**
+ * Columns rendered per row when Media appears as the target of a relation
+ * picker (e.g. News → `heroImage` → Media). Narrower than the list view —
+ * just enough to identify the right media item at a glance.
+ */
+const pickerViewColumns: ColumnDefinition[] = [
+  {
+    fieldName: 'name',
+    label: 'Name',
+    align: 'left',
+    className: 'flex-1',
+  },
+  {
+    fieldName: 'status',
+    label: 'Status',
+    align: 'right',
+    className: 'w-[80px] shrink-0 text-xs text-gray-500',
+  },
+]
+
+export const NewsCategoriesAdmin: CollectionAdminConfig = defineAdmin(NewsCategories, {
+  columns: listViewColumns,
+  picker: pickerViewColumns,
+})

package/dist/templates/byline-examples/collections/news-categories/index.ts

@@ -0,0 +1,10 @@
+/**
+ * This Source Code is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * Copyright (c) Infonomic Company Limited
+ */
+
+export { NewsCategoriesAdmin } from './admin.js'
+export { NewsCategories } from './schema.js'

package/dist/templates/byline-examples/collections/news-categories/schema.ts

@@ -0,0 +1,33 @@
+/**
+ * This Source Code is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * Copyright (c) Infonomic Company Limited
+ */
+
+import type { CollectionFieldData } from '@byline/core'
+import { defineCollection, SINGLE_STATUS_WORKFLOW } from '@byline/core'
+
+// ---- Schema (server-safe, no UI concerns) ----
+
+export const NewsCategories = defineCollection({
+  path: 'news-categories',
+  labels: {
+    singular: 'News Category',
+    plural: 'News Categories',
+  },
+  // Lookup collection — no editorial lifecycle. Saves go straight to
+  // `published` and the form shows only Save / Close.
+  workflow: SINGLE_STATUS_WORKFLOW,
+  showStats: true,
+  search: { fields: ['name'] },
+  useAsTitle: 'name',
+  useAsPath: 'name',
+  fields: [
+    { name: 'name', label: 'Name', type: 'text', localized: true },
+    { name: 'description', label: 'Description', type: 'textArea', localized: true },
+  ],
+})
+
+export type NewsCategoryFields = CollectionFieldData<typeof NewsCategories>

package/dist/templates/byline-examples/collections/pages/admin.tsx

@@ -0,0 +1,183 @@
+/**
+ * This Source Code is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * Copyright (c) Infonomic Company Limited
+ */
+
+import { type CollectionAdminConfig, type ColumnDefinition, defineAdmin } from '@byline/core'
+import { DateTimeFormatter } from '@byline/ui/react/fields'
+
+import { SummaryLength } from '~/components/summary-length.js'
+
+import { Pages } from './schema.js'
+
+/**
+ * Column definitions for the default table-based list view.
+ *
+ * These are passed to the built-in `ListView` component and control which
+ * fields appear as columns, their labels, sort behaviour, and formatters.
+ *
+ * Note: when a custom `listView` component is registered on the
+ * `CollectionAdminConfig`, it receives the raw paginated data directly and
+ * is responsible for its own layout. These column definitions can still
+ * be used in a custom list view, but they are not automatically applied
+ * as they are with the default table-based `ListView`. You can import
+ * them if needed - for example if you wanted to create a toggled grid/table
+ * custom view.
+ */
+
+const listViewColumns: ColumnDefinition[] = [
+  {
+    fieldName: 'title',
+    label: 'Title',
+    sortable: true,
+    align: 'left',
+    className: 'w-[30%]',
+  },
+  {
+    fieldName: 'featured',
+    label: 'Featured',
+    align: 'center',
+    className: 'w-[10%]',
+    formatter: (value) => (value ? '★' : ''),
+  },
+  {
+    fieldName: 'status',
+    label: 'Status',
+    align: 'center',
+    className: 'w-[15%]',
+  },
+  {
+    fieldName: 'updatedAt',
+    label: 'Last Updated',
+    sortable: true,
+    align: 'right',
+    className: 'w-[20%]',
+    formatter: { component: DateTimeFormatter },
+  },
+]
+
+/**
+ * Columns rendered per row when a collection item appears as the
+ * target of a relation picker. Usually narrower than the list
+ * view — just enough to identify the right item at a glance.
+ */
+// const pickerViewColumns: ColumnDefinition[] = []
+
+export const PagesAdmin: CollectionAdminConfig = defineAdmin(Pages, {
+  /**
+   * Column definitions for the default table-based list view.
+   * Controls which fields appear as columns, their labels, sort behaviour, and formatters.
+   */
+  columns: listViewColumns,
+
+  /**
+   * Column definitions used when this collection appears as the target of a relation
+   * picker modal (opened from a `relation` field widget). Omit to fall back to a
+   * single-line render of `useAsTitle` + `path`.
+   *
+   * Shape matches `ColumnDefinition` so formatters can be reused across list and picker.
+   *
+   * @example
+   * picker: [{ fieldName: 'title', label: 'Title' }] // or defined above as `pickerViewColumns`
+   */
+  // picker: [],
+
+  /**
+   * Custom list-view component that completely replaces the default table-based `ListView`
+   * on the collection index route. Receives a `ListViewComponentProps` object and is
+   * responsible for rendering search, ordering, results, and pagination itself.
+   *
+   * When omitted, the default table-based `ListView` is used with the `columns` defined above.
+   *
+   * @example
+   * listView: MediaListView,
+   */
+  // listView: undefined,
+
+  /**
+   * Group name for organising this collection in the admin sidebar navigation.
+   *
+   * @example
+   * group: 'Editorial',
+   */
+  // group: undefined,
+
+  /**
+   * Per-field rendering overrides, keyed by field name. Use to supply custom
+   * UI component slots for a specific field without affecting placement.
+   * Placement is controlled exclusively through the layout primitives below.
+   */
+  fields: {
+    summary: {
+      components: {
+        HelpText: SummaryLength,
+      },
+    },
+  },
+
+  /**
+   * Preview URL builder for live preview links. Receives the document and an
+   * optional locale and should return a fully-qualified URL string.
+   *
+   * @example
+   * preview: (doc, { locale }) => `https://example.com/${locale}/pages/${doc.fields.path}`
+   */
+  // preview: undefined,
+
+  // ---------------------------------------------------------------------------
+  // UI Layout
+  //
+  // Tab, row, and group containers control how fields are grouped and positioned
+  // in the document edit view. Field names must match those defined in the
+  // collection schema. Names for tabSets, rows, and groups must be unique and
+  // must not collide with any schema field name (a startup error is thrown if
+  // they do).
+  // ---------------------------------------------------------------------------
+
+  /**
+   * Named tab sets. Each entry creates a separate tabbed interface in the edit
+   * view. You can define more than one tab set, though a single set is sufficient
+   * for most collections. Tab sets may only appear in `layout.main`.
+   *
+   * Each tab's `fields` array accepts schema field names, row names, and group names.
+   * An optional `condition` function can show/hide a tab based on live form data.
+   */
+  // tabSets: [],
+
+  /**
+   * Named horizontal-row layouts. Fields listed inside a row are rendered
+   * side-by-side (flex row) on desktop and stack vertically below the `sm`
+   * breakpoint. Rows are leaf containers — they accept only schema field names.
+   *
+   * Reference a row by its `name` inside a tab's `fields`, a group's `fields`,
+   * or directly in `layout.main` / `layout.sidebar`.
+   */
+  // rows: [],
+
+  /**
+   * Named labelled-fieldset clusters. Groups accept schema field names and row
+   * names (not tabSets or nested groups). An optional `label` renders a heading
+   * above the cluster.
+   *
+   * Reference a group by its `name` inside a tab's `fields` or directly in
+   * `layout.main` / `layout.sidebar`.
+   */
+  // groups: [],
+
+  /**
+   * Composition of all layout primitives into the form's two render regions.
+   *
+   * - `main` — accepts tabSet names, group names, row names, and schema field names.
+   * - `sidebar` — accepts group names, row names, and schema field names (no tabSets).
+   *
+   * When omitted entirely, the renderer synthesises a default that places every
+   * schema field in `main` in declaration order.
+   */
+  layout: {
+    main: ['title', 'summary', 'featureImage', 'category', 'content'],
+    sidebar: ['publishedOn', 'featured', 'availableLanguages'],
+  },
+})

package/dist/templates/byline-examples/collections/pages/index.ts

@@ -0,0 +1,10 @@
+/**
+ * This Source Code is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * Copyright (c) Infonomic Company Limited
+ */
+
+export { PagesAdmin } from './admin.js'
+export { Pages } from './schema.js'