@brilo/base-blocks 0.1.28 → 0.1.30

package/src/blocks/career/job-position-group/JobPositionsSelectModal.tsx

@@ -0,0 +1,238 @@
+import apiFetch from '@wordpress/api-fetch'
+import {Button, Card, CardBody, __experimentalHStack as HStack, Modal, __experimentalVStack as VStack} from '@wordpress/components'
+import {DataViews, type View} from '@wordpress/dataviews/wp'
+import {__} from '@wordpress/i18n'
+import {arrowDown, arrowUp, close, plusCircle} from '@wordpress/icons'
+// biome-ignore lint/correctness/noUnusedImports: required in scope for classic JSX transform
+import React, {useEffect, useMemo, useState} from 'react'
+import type {SelectControlProps} from './types'
+
+type JobPositionRecord = {
+  id: number
+  title: {rendered: string}
+  date: string
+}
+
+const DEFAULT_VIEW: View = {
+  type: 'table',
+  search: '',
+  filters: [],
+  page: 1,
+  perPage: 20,
+  sort: {field: 'title', direction: 'asc'},
+  fields: ['date'],
+  titleField: 'title',
+}
+
+function useJobPositions() {
+  const [positions, setPositions] = useState<JobPositionRecord[]>([])
+  const [isLoading, setIsLoading] = useState(true)
+
+  useEffect(() => {
+    setIsLoading(true)
+    apiFetch<JobPositionRecord[]>({
+      path: '/wp/v2/job_position?per_page=100&orderby=title&order=asc&_fields=id,title,date',
+    })
+      .then((result) => setPositions(result))
+      .catch(() => setPositions([]))
+      .finally(() => setIsLoading(false))
+  }, [])
+
+  return {positions, isLoading}
+}
+
+function SelectedOrderList({
+  items,
+  onChange,
+  onRemove,
+}: {
+  items: JobPositionRecord[]
+  onChange: (ids: number[]) => void
+  onRemove: (id: number) => void
+}) {
+  if (0 === items.length) {
+    return <p className="i-job-position-select-modal__empty">{__('Nevybrány žádné pozice.', 'brilo-blocks')}</p>
+  }
+
+  const move = (index: number, direction: -1 | 1) => {
+    const target = index + direction
+
+    if (target < 0 || target >= items.length) {
+      return
+    }
+
+    const next = [...items]
+    ;[next[index], next[target]] = [next[target], next[index]]
+    onChange(next.map((item) => item.id))
+  }
+
+  return (
+    <VStack spacing={2}>
+      {items.map((item, index) => (
+        <Card size="small" className="i-job-position-select-modal__item" key={item.id}>
+          <CardBody>
+            <HStack alignment="center">
+              <span
+                className="i-job-position-select-modal__item-title"
+                style={{
+                  flexGrow: 1,
+                  minWidth: 0,
+                  textAlign: 'left',
+                  overflow: 'hidden',
+                  textOverflow: 'ellipsis',
+                  whiteSpace: 'nowrap',
+                }}
+              >
+                {item.title.rendered || __('(bez názvu)', 'brilo-blocks')}
+              </span>
+
+              <HStack expanded={false} spacing={1}>
+                <Button
+                  size="small"
+                  icon={arrowUp}
+                  label={__('Posunout výš', 'brilo-blocks')}
+                  onClick={() => move(index, -1)}
+                  disabled={0 === index}
+                />
+                <Button
+                  size="small"
+                  icon={arrowDown}
+                  label={__('Posunout níž', 'brilo-blocks')}
+                  onClick={() => move(index, 1)}
+                  disabled={index === items.length - 1}
+                />
+                <Button size="small" icon={close} isDestructive label={__('Odebrat', 'brilo-blocks')} onClick={() => onRemove(item.id)} />
+              </HStack>
+            </HStack>
+          </CardBody>
+        </Card>
+      ))}
+    </VStack>
+  )
+}
+
+/**
+ * Manual job_position picker built on @wordpress/dataviews, mirroring
+ * DocumentsSelectModal closely (table view, search, sort, checkbox
+ * selection, reorderable selection list) but with just title/date columns.
+ */
+export function JobPositionsSelectModal({selectedItems, onChange}: SelectControlProps) {
+  const {positions, isLoading} = useJobPositions()
+  const [isOpen, setIsOpen] = useState(false)
+  const [view, setView] = useState<View>(DEFAULT_VIEW)
+
+  const selectedPositions = useMemo(
+    () => selectedItems.map((id) => positions.find((pos) => pos.id === id)).filter((pos): pos is JobPositionRecord => undefined !== pos),
+    [selectedItems, positions],
+  )
+
+  const fields = useMemo(
+    () => [
+      {
+        id: 'title',
+        label: __('Název', 'brilo-blocks'),
+        enableHiding: false,
+        enableSorting: true,
+        render: ({item}: {item: JobPositionRecord}) => item.title.rendered || __('(bez názvu)', 'brilo-blocks'),
+      },
+      {
+        id: 'date',
+        label: __('Datum', 'brilo-blocks'),
+        enableSorting: true,
+        render: ({item}: {item: JobPositionRecord}) => (item.date ? new Date(item.date).toLocaleDateString() : '—'),
+      },
+    ],
+    [],
+  )
+
+  const {data, paginationInfo} = useMemo(() => {
+    let filtered = positions
+
+    if (view.search) {
+      const needle = view.search.toLowerCase()
+      filtered = filtered.filter((pos) => pos.title.rendered.toLowerCase().includes(needle))
+    }
+
+    if (view.sort?.field) {
+      const {field, direction} = view.sort
+      const sorted = [...filtered]
+
+      sorted.sort((a, b) => {
+        const valueA = 'title' === field ? a.title.rendered : ((a as never)[field] ?? '')
+        const valueB = 'title' === field ? b.title.rendered : ((b as never)[field] ?? '')
+        const result = String(valueA).localeCompare(String(valueB))
+
+        return 'desc' === direction ? -result : result
+      })
+
+      filtered = sorted
+    }
+
+    const perPage = view.perPage ?? 20
+    const page = view.page ?? 1
+    const start = (page - 1) * perPage
+
+    return {
+      data: filtered.slice(start, start + perPage),
+      paginationInfo: {totalItems: filtered.length, totalPages: Math.ceil(filtered.length / perPage) || 1},
+    }
+  }, [positions, view])
+
+  const toggleSelected = (id: number) => {
+    onChange(selectedItems.includes(id) ? selectedItems.filter((itemId) => itemId !== id) : [...selectedItems, id])
+  }
+
+  return (
+    <VStack spacing={3} className="i-job-position-select-modal">
+      <Button variant="secondary" icon={plusCircle} onClick={() => setIsOpen(true)}>
+        {__('Vybrat pozice', 'brilo-blocks')}
+      </Button>
+
+      <SelectedOrderList
+        items={selectedPositions}
+        onChange={onChange}
+        onRemove={(id) => onChange(selectedItems.filter((itemId) => itemId !== id))}
+      />
+
+      {isOpen && (
+        <Modal title={__('Vybrat pozice', 'brilo-blocks')} onRequestClose={() => setIsOpen(false)} size="fill">
+          <VStack spacing={4} style={{height: '100%'}}>
+            <div style={{flexGrow: 1, minHeight: 0}}>
+              <DataViews<JobPositionRecord>
+                data={data}
+                fields={fields}
+                view={view}
+                onChangeView={setView}
+                paginationInfo={paginationInfo}
+                isLoading={isLoading}
+                defaultLayouts={{table: {}}}
+                getItemId={(item) => String(item.id)}
+                selection={selectedItems.map(String)}
+                onChangeSelection={(ids) => onChange(ids.map(Number))}
+                actions={[
+                  {
+                    id: 'toggle',
+                    label: (items) =>
+                      items.length && selectedItems.includes(items[0].id) ? __('Odebrat', 'brilo-blocks') : __('Přidat', 'brilo-blocks'),
+                    supportsBulk: true,
+                    callback: (items) => {
+                      items.forEach((item) => {
+                        toggleSelected(item.id)
+                      })
+                    },
+                  },
+                ]}
+              />
+            </div>
+
+            <HStack justify="flex-end">
+              <Button variant="primary" onClick={() => setIsOpen(false)}>
+                {__('Hotovo', 'brilo-blocks')}
+              </Button>
+            </HStack>
+          </VStack>
+        </Modal>
+      )}
+    </VStack>
+  )
+}

package/src/blocks/career/job-position-group/constants.ts

@@ -0,0 +1,11 @@
+export const JOB_POSITION_GROUP_MODES = ['selected', 'listing'] as const
+export const JOB_POSITION_GROUP_SORT_BYS = ['date', 'title', 'start_date', 'menu_order'] as const
+export const JOB_POSITION_GROUP_SORT_ORDERS = ['asc', 'desc'] as const
+
+export const JOB_POSITION_GROUP_MODE = JOB_POSITION_GROUP_MODES[0]
+export const JOB_POSITION_GROUP_SORT_BY = JOB_POSITION_GROUP_SORT_BYS[0]
+export const JOB_POSITION_GROUP_SORT_ORDER = JOB_POSITION_GROUP_SORT_ORDERS[1]
+
+export const JOB_POSITION_GROUP_PER_PAGE_MIN = 1
+export const JOB_POSITION_GROUP_PER_PAGE_MAX = 24
+export const JOB_POSITION_GROUP_PER_PAGE = 6

package/src/blocks/career/job-position-group/edit.tsx

@@ -0,0 +1,93 @@
+import {InspectorControls, useBlockProps} from '@wordpress/block-editor'
+import {
+  PanelBody,
+  RangeControl,
+  __experimentalToggleGroupControl as ToggleGroupControl,
+  __experimentalToggleGroupControlOption as ToggleGroupControlOption,
+} from '@wordpress/components'
+import {__} from '@wordpress/i18n'
+import {JOB_POSITION_GROUP_PER_PAGE, JOB_POSITION_GROUP_PER_PAGE_MAX, JOB_POSITION_GROUP_PER_PAGE_MIN} from './constants'
+import type {JobPositionGroupAttributes, JobPositionGroupOptions} from './types'
+
+export function createJobPositionGroupEdit(options: JobPositionGroupOptions) {
+  return function Edit({
+    attributes,
+    setAttributes,
+  }: {
+    attributes: JobPositionGroupAttributes
+    setAttributes: (a: Partial<JobPositionGroupAttributes>) => void
+  }) {
+    const {mode, selectedPositions, perPage, sortBy, sortOrder} = attributes
+
+    const blockProps = useBlockProps({className: 'wp-block-section'})
+
+    return (
+      <>
+        <InspectorControls>
+          <PanelBody title={__('Nastavení výpisu', 'brilo-blocks')} initialOpen>
+            <ToggleGroupControl
+              label={__('Zdroj pozic', 'brilo-blocks')}
+              value={mode}
+              onChange={(value) => setAttributes({mode: value as JobPositionGroupAttributes['mode']})}
+              isBlock
+            >
+              <ToggleGroupControlOption value="selected" label={__('Vybrané', 'brilo-blocks')} />
+              <ToggleGroupControlOption value="listing" label={__('Výpis', 'brilo-blocks')} />
+            </ToggleGroupControl>
+
+            {'listing' === mode && (
+              <>
+                <RangeControl
+                  label={__('Počet pozic', 'brilo-blocks')}
+                  value={perPage}
+                  onChange={(value) => setAttributes({perPage: value ?? JOB_POSITION_GROUP_PER_PAGE})}
+                  min={JOB_POSITION_GROUP_PER_PAGE_MIN}
+                  max={JOB_POSITION_GROUP_PER_PAGE_MAX}
+                />
+
+                <ToggleGroupControl
+                  label={__('Řazení', 'brilo-blocks')}
+                  value={sortBy}
+                  onChange={(value) => setAttributes({sortBy: value as JobPositionGroupAttributes['sortBy']})}
+                  isBlock
+                >
+                  <ToggleGroupControlOption value="date" label={__('Datum publikace', 'brilo-blocks')} />
+                  <ToggleGroupControlOption value="title" label={__('Název', 'brilo-blocks')} />
+                  <ToggleGroupControlOption value="start_date" label={__('Datum nástupu', 'brilo-blocks')} />
+                  <ToggleGroupControlOption value="menu_order" label={__('Pořadí', 'brilo-blocks')} />
+                </ToggleGroupControl>
+
+                <ToggleGroupControl
+                  label={__('Směr řazení', 'brilo-blocks')}
+                  value={sortOrder}
+                  onChange={(value) => setAttributes({sortOrder: value as JobPositionGroupAttributes['sortOrder']})}
+                  isBlock
+                >
+                  <ToggleGroupControlOption value="desc" label={__('Sestupně', 'brilo-blocks')} />
+                  <ToggleGroupControlOption value="asc" label={__('Vzestupně', 'brilo-blocks')} />
+                </ToggleGroupControl>
+              </>
+            )}
+          </PanelBody>
+        </InspectorControls>
+
+        <div {...blockProps}>
+          {'selected' === mode &&
+            options.renderPositionsControl?.({
+              selectedItems: selectedPositions,
+              onChange: (ids: number[]) => setAttributes({selectedPositions: ids}),
+            })}
+
+          {'listing' === mode && (
+            <div className="components-placeholder">
+              <div className="components-placeholder__label">{__('Pracovní pozice', 'brilo-blocks')}</div>
+              <div className="components-placeholder__instructions">
+                {`${__('Zobrazí', 'brilo-blocks')} ${perPage} ${__('pracovních pozic.', 'brilo-blocks')}`}
+              </div>
+            </div>
+          )}
+        </div>
+      </>
+    )
+  }
+}

package/src/blocks/career/job-position-group/factory.tsx

@@ -0,0 +1,56 @@
+import type {BlockConfiguration} from '@wordpress/blocks'
+import {__} from '@wordpress/i18n'
+import {
+  JOB_POSITION_GROUP_MODE,
+  JOB_POSITION_GROUP_MODES,
+  JOB_POSITION_GROUP_PER_PAGE,
+  JOB_POSITION_GROUP_SORT_BY,
+  JOB_POSITION_GROUP_SORT_BYS,
+  JOB_POSITION_GROUP_SORT_ORDER,
+  JOB_POSITION_GROUP_SORT_ORDERS,
+} from './constants'
+import {createJobPositionGroupEdit} from './edit'
+import {icon as defaultIcon} from './icon'
+import type {JobPositionGroupAttributes, JobPositionGroupOptions} from './types'
+
+export type {JobPositionGroupAttributes, JobPositionGroupOptions}
+
+export function createJobPositionGroupBlock(options: JobPositionGroupOptions): BlockConfiguration<JobPositionGroupAttributes> {
+  return {
+    name: options.name,
+    title: options.title ?? __('Pracovní pozice', 'brilo-blocks'),
+    description: options.description,
+    category: options.category ?? 'widgets',
+    ...(options.parent && {parent: options.parent}),
+    icon: options.icon ?? {src: defaultIcon},
+    supports: {html: false, customClassName: false},
+    attributes: {
+      mode: {
+        type: 'string',
+        default: JOB_POSITION_GROUP_MODE,
+        enum: [...JOB_POSITION_GROUP_MODES],
+      },
+      selectedPositions: {
+        type: 'array',
+        default: [],
+        items: {type: 'number'},
+      },
+      perPage: {
+        type: 'number',
+        default: JOB_POSITION_GROUP_PER_PAGE,
+      },
+      sortBy: {
+        type: 'string',
+        default: JOB_POSITION_GROUP_SORT_BY,
+        enum: [...JOB_POSITION_GROUP_SORT_BYS],
+      },
+      sortOrder: {
+        type: 'string',
+        default: JOB_POSITION_GROUP_SORT_ORDER,
+        enum: [...JOB_POSITION_GROUP_SORT_ORDERS],
+      },
+    },
+    edit: createJobPositionGroupEdit(options),
+    save: () => null,
+  } as unknown as BlockConfiguration<JobPositionGroupAttributes>
+}

package/src/blocks/career/job-position-group/icon.tsx

@@ -0,0 +1,7 @@
+export const icon = (
+  <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <rect x="2" y="6" width="16" height="11" rx="1" stroke="black" fill="none" />
+    <path d="M7 6V4C7 3.44772 7.44772 3 8 3H12C12.5523 3 13 3.44772 13 4V6" stroke="black" fill="none" />
+    <line x1="2" y1="11" x2="18" y2="11" stroke="black" />
+  </svg>
+)

package/src/blocks/career/job-position-group/index.ts

@@ -0,0 +1,15 @@
+export type {
+  JobPositionGroupAttributes,
+  JobPositionGroupOptions,
+  JobPositionGroupMode,
+  JobPositionGroupSortBy,
+  JobPositionGroupSortOrder,
+} from './types'
+export {createJobPositionGroupBlock} from './factory'
+export {JobPositionsSelectModal} from './JobPositionsSelectModal'
+
+import type {JobPositionGroupOptions} from './types'
+
+export const jobPositionGroupDefaults: JobPositionGroupOptions = {
+  name: 'brilo/job-position-group',
+}

package/src/blocks/career/job-position-group/types.ts

@@ -0,0 +1,23 @@
+import type {BriloBlockType} from '~/types'
+import type {JOB_POSITION_GROUP_MODES, JOB_POSITION_GROUP_SORT_BYS, JOB_POSITION_GROUP_SORT_ORDERS} from './constants'
+
+export type JobPositionGroupMode = (typeof JOB_POSITION_GROUP_MODES)[number]
+export type JobPositionGroupSortBy = (typeof JOB_POSITION_GROUP_SORT_BYS)[number]
+export type JobPositionGroupSortOrder = (typeof JOB_POSITION_GROUP_SORT_ORDERS)[number]
+
+export interface JobPositionGroupAttributes extends Record<string, unknown> {
+  mode: JobPositionGroupMode
+  selectedPositions: number[]
+  perPage: number
+  sortBy: JobPositionGroupSortBy
+  sortOrder: JobPositionGroupSortOrder
+}
+
+export interface SelectControlProps {
+  selectedItems: number[]
+  onChange: (ids: number[]) => void
+}
+
+export interface JobPositionGroupOptions extends BriloBlockType {
+  renderPositionsControl?: (props: SelectControlProps) => JSX.Element
+}

package/src/blocks/document/documents-grid/constants.ts

@@ -0,0 +1,9 @@
+export const DOCUMENTS_GRID_MODES = ['manual', 'category'] as const
+export const DOCUMENTS_GRID_LISTING_STYLES = ['classic', 'group-by-category'] as const
+export const DOCUMENTS_GRID_SORT_BYS = ['menu_order', 'date', 'manual-order'] as const
+export const DOCUMENTS_GRID_COLUMN_OPTIONS = [1, 2, 3, 4, 6] as const
+
+export const DOCUMENTS_GRID_MODE = DOCUMENTS_GRID_MODES[0]
+export const DOCUMENTS_GRID_LISTING_STYLE = DOCUMENTS_GRID_LISTING_STYLES[0]
+export const DOCUMENTS_GRID_SORT_BY = DOCUMENTS_GRID_SORT_BYS[2]
+export const DOCUMENTS_GRID_COLUMNS = DOCUMENTS_GRID_COLUMN_OPTIONS[0]

package/src/blocks/document/{documents-group → documents-grid}/edit.tsx

@@ -5,20 +5,21 @@ import {
   __experimentalToggleGroupControlOption as ToggleGroupControlOption,
 } from '@wordpress/components'
 import {__} from '@wordpress/i18n'
-import {DOCUMENTS_GROUP_COLUMNS} from './constants'
-import type {DocumentsGroupAttributes, DocumentsGroupOptions} from './types'
+import clsx from 'clsx'
+import {DOCUMENTS_GRID_COLUMN_OPTIONS} from './constants'
+import type {DocumentsGridAttributes, DocumentsGridOptions} from './types'
 
-export function createDocumentsGroupEdit(options: DocumentsGroupOptions) {
+export function createDocumentsGridEdit(options: DocumentsGridOptions) {
   return function Edit({
     attributes,
     setAttributes,
   }: {
-    attributes: DocumentsGroupAttributes
-    setAttributes: (a: Partial<DocumentsGroupAttributes>) => void
+    attributes: DocumentsGridAttributes
+    setAttributes: (a: Partial<DocumentsGridAttributes>) => void
   }) {
     const {mode, listingStyle, sortBy, columns, selectedDocuments, selectedCategories} = attributes
 
-    const blockProps = useBlockProps({className: 'wp-block-section'})
+    const blockProps = useBlockProps({className: clsx(options.blockClassName ?? 'g-documents wp-block-section')})
 
     return (
       <>
@@ -28,11 +29,12 @@ export function createDocumentsGroupEdit(options: DocumentsGroupOptions) {
               label={__('Zdroj dokumentů', 'brilo-blocks')}
               value={mode}
               onChange={(value) => {
-                const nextMode = value as DocumentsGroupAttributes['mode']
-                setAttributes({
-                  mode: nextMode,
-                  sortBy: 'manual' === nextMode ? sortBy : sortBy === 'manual-order' ? 'menu_order' : sortBy,
-                })
+                const nextMode = value as DocumentsGridAttributes['mode']
+                // "manual-order" sorting only makes sense for a manually picked list —
+                // fall back to "menu_order" when switching away from manual mode.
+                const nextSortBy = 'category' === nextMode && 'manual-order' === sortBy ? 'menu_order' : sortBy
+
+                setAttributes({mode: nextMode, sortBy: nextSortBy})
               }}
               isBlock
             >
@@ -43,7 +45,7 @@ export function createDocumentsGroupEdit(options: DocumentsGroupOptions) {
             <ToggleGroupControl
               label={__('Styl výpisu', 'brilo-blocks')}
               value={listingStyle}
-              onChange={(value) => setAttributes({listingStyle: value as DocumentsGroupAttributes['listingStyle']})}
+              onChange={(value) => setAttributes({listingStyle: value as DocumentsGridAttributes['listingStyle']})}
               isBlock
             >
               <ToggleGroupControlOption value="classic" label={__('Klasický výpis', 'brilo-blocks')} />
@@ -53,7 +55,7 @@ export function createDocumentsGroupEdit(options: DocumentsGroupOptions) {
             <ToggleGroupControl
               label={__('Řazení', 'brilo-blocks')}
               value={sortBy}
-              onChange={(value) => setAttributes({sortBy: value as DocumentsGroupAttributes['sortBy']})}
+              onChange={(value) => setAttributes({sortBy: value as DocumentsGridAttributes['sortBy']})}
               isBlock
             >
               <ToggleGroupControlOption value="menu_order" label={__('Pořadí', 'brilo-blocks')} />
@@ -67,10 +69,10 @@ export function createDocumentsGroupEdit(options: DocumentsGroupOptions) {
                 'group-by-category' === listingStyle ? __('Platí pro seznam dokumentů uvnitř každé kategorie.', 'brilo-blocks') : undefined
               }
               value={String(columns)}
-              onChange={(value) => setAttributes({columns: Number(value) as DocumentsGroupAttributes['columns']})}
+              onChange={(value) => setAttributes({columns: Number(value) as DocumentsGridAttributes['columns']})}
               isBlock
             >
-              {DOCUMENTS_GROUP_COLUMNS.map((c) => (
+              {DOCUMENTS_GRID_COLUMN_OPTIONS.map((c) => (
                 <ToggleGroupControlOption key={c} value={String(c)} label={String(c)} />
               ))}
             </ToggleGroupControl>

package/src/blocks/document/documents-grid/factory.tsx

@@ -0,0 +1,63 @@
+import type {BlockConfiguration} from '@wordpress/blocks'
+import {__} from '@wordpress/i18n'
+import {
+  DOCUMENTS_GRID_COLUMN_OPTIONS,
+  DOCUMENTS_GRID_COLUMNS,
+  DOCUMENTS_GRID_LISTING_STYLE,
+  DOCUMENTS_GRID_LISTING_STYLES,
+  DOCUMENTS_GRID_MODE,
+  DOCUMENTS_GRID_MODES,
+  DOCUMENTS_GRID_SORT_BY,
+  DOCUMENTS_GRID_SORT_BYS,
+} from './constants'
+import {createDocumentsGridEdit} from './edit'
+import {icon as defaultIcon} from './icon'
+import type {DocumentsGridAttributes, DocumentsGridOptions} from './types'
+
+export type {DocumentsGridAttributes, DocumentsGridOptions}
+
+export function createDocumentsGridBlock(options: DocumentsGridOptions): BlockConfiguration<DocumentsGridAttributes> {
+  return {
+    name: options.name,
+    title: options.title ?? __('Dokumenty', 'brilo-blocks'),
+    description: options.description,
+    category: options.category ?? 'widgets',
+    ...(options.parent && {parent: options.parent}),
+    icon: options.icon ?? {src: defaultIcon},
+    supports: {html: false, customClassName: false},
+    attributes: {
+      mode: {
+        type: 'string',
+        default: DOCUMENTS_GRID_MODE,
+        enum: [...DOCUMENTS_GRID_MODES],
+      },
+      listingStyle: {
+        type: 'string',
+        default: DOCUMENTS_GRID_LISTING_STYLE,
+        enum: [...DOCUMENTS_GRID_LISTING_STYLES],
+      },
+      sortBy: {
+        type: 'string',
+        default: DOCUMENTS_GRID_SORT_BY,
+        enum: [...DOCUMENTS_GRID_SORT_BYS],
+      },
+      columns: {
+        type: 'number',
+        default: DOCUMENTS_GRID_COLUMNS,
+        enum: [...DOCUMENTS_GRID_COLUMN_OPTIONS],
+      },
+      selectedDocuments: {
+        type: 'array',
+        default: [],
+        items: {type: 'number'},
+      },
+      selectedCategories: {
+        type: 'array',
+        default: [],
+        items: {type: 'number'},
+      },
+    },
+    edit: createDocumentsGridEdit(options),
+    save: () => null,
+  } as unknown as BlockConfiguration<DocumentsGridAttributes>
+}

package/src/blocks/document/documents-grid/index.ts

@@ -0,0 +1,15 @@
+export type {
+  DocumentsGridAttributes,
+  DocumentsGridOptions,
+  DocumentsGridListingStyle,
+  DocumentsGridMode,
+  DocumentsGridSortBy,
+} from './types'
+export {createDocumentsGridBlock} from './factory'
+export {DocumentsSelectModal} from './DocumentsSelectModal'
+
+import type {DocumentsGridOptions} from './types'
+
+export const documentsGridDefaults: DocumentsGridOptions = {
+  name: 'brilo/documents-grid',
+}

package/src/blocks/document/documents-grid/types.ts

@@ -0,0 +1,31 @@
+import type {BriloBlockType} from '~/types'
+import type {
+  DOCUMENTS_GRID_COLUMN_OPTIONS,
+  DOCUMENTS_GRID_LISTING_STYLES,
+  DOCUMENTS_GRID_MODES,
+  DOCUMENTS_GRID_SORT_BYS,
+} from './constants'
+
+export type DocumentsGridMode = (typeof DOCUMENTS_GRID_MODES)[number]
+export type DocumentsGridListingStyle = (typeof DOCUMENTS_GRID_LISTING_STYLES)[number]
+export type DocumentsGridSortBy = (typeof DOCUMENTS_GRID_SORT_BYS)[number]
+export type DocumentsGridColumns = (typeof DOCUMENTS_GRID_COLUMN_OPTIONS)[number]
+
+export interface DocumentsGridAttributes extends Record<string, unknown> {
+  mode: DocumentsGridMode
+  listingStyle: DocumentsGridListingStyle
+  sortBy: DocumentsGridSortBy
+  columns: DocumentsGridColumns
+  selectedDocuments: number[]
+  selectedCategories: number[]
+}
+
+export interface SelectControlProps {
+  selectedItems: number[]
+  onChange: (ids: number[]) => void
+}
+
+export interface DocumentsGridOptions extends BriloBlockType {
+  renderCategoryControl?: (props: SelectControlProps) => JSX.Element
+  renderDocumentsControl?: (props: SelectControlProps) => JSX.Element
+}

package/src/blocks/post/post-content/edit.tsx

@@ -0,0 +1,18 @@
+import {useBlockProps} from '@wordpress/block-editor'
+import {__} from '@wordpress/i18n'
+import type {PostContentAttributes, PostContentOptions} from './types'
+
+export function createPostContentEdit(_options: PostContentOptions) {
+  return function Edit(_props: {attributes: PostContentAttributes; setAttributes: (a: Partial<PostContentAttributes>) => void}) {
+    const blockProps = useBlockProps({className: 'wp-block-section'})
+
+    return (
+      <div {...blockProps}>
+        <div className="components-placeholder">
+          <div className="components-placeholder__label">{__('Obsah postu', 'brilo-blocks')}</div>
+          <div className="components-placeholder__instructions">{__('Zobrazí obsah aktuální postu.', 'brilo-blocks')}</div>
+        </div>
+      </div>
+    )
+  }
+}