@alstar/studio 0.0.0-beta.6 → 0.0.0-beta.8

package/types.ts

@@ -2,6 +2,11 @@ import { type HttpBindings } from '@hono/node-server'
 import { type Context } from 'hono'
 import { type HonoOptions } from 'hono/hono-base'
 import { type BlankInput, type BlankEnv } from 'hono/types'
+import {
+  BlockFieldInstance,
+  BlockInstance,
+  FieldInstance,
+} from './utils/define.ts'
 
 export type PrimitiveField = {
   name: string
@@ -25,71 +30,103 @@ export type Block = {
   fields: Record<string, Field | Block>
 }
 
-export type Structure = Record<string, BlockDef>
+export type Structure = Record<string, BlockDefStructure>
 
 // --- Field & block definitions ---
-type FieldType = 'text' | 'slug' | 'markdown' | 'blocks' | 'image';
+type FieldType = 'text' | 'slug' | 'markdown' | 'image'
 
 interface BaseField {
-  label: string;
-  type: FieldType;
+  label: string
+  type: FieldType
   description?: string
 }
 
 interface TextField extends BaseField {
-  type: 'text' | 'slug' | 'markdown';
+  type: 'text' | 'slug' | 'markdown'
+}
+
+interface TextFieldStructure extends TextField {
+  instanceOf: typeof FieldInstance
 }
 
 interface ImageField extends BaseField {
-  type: 'image';
+  type: 'image'
+}
+
+interface ImageFieldStructure extends ImageField {
+  instanceOf: typeof FieldInstance
+}
+
+export interface BlocksFieldDef {
+  label: string
+  type: 'blocks'
+  description?: string
+  children: Record<string, BlockDefStructure | FieldDefStructure>
 }
 
-export interface BlocksField extends BaseField {
-  type: 'blocks';
-  children: Record<string, BlockDef | FieldDef>;
+export interface BlocksFieldDefStructure extends BlocksFieldDef {
+  instanceOf: typeof BlockFieldInstance
 }
 
-export type FieldDef = TextField | ImageField | BlocksField;
+export type FieldDef = TextField | ImageField
+export type FieldDefStructure = TextFieldStructure | ImageFieldStructure
 
 export interface BlockDef {
-  label: string;
-  type: string;
-  fields: Record<string, FieldDef>;
+  label: string
+  type: string
+  fields: Record<string, FieldDefStructure | BlocksFieldDefStructure>
   description?: string
 }
 
-type DBDefaults = {
-  id: number
-  created_at: string
-  updated_at: string
-  name: string
-  label: string
-  // type: string
-  sort_order: number
-  value: string
-  options: string | null
-  status: 'enabled' | 'disabled'
-  parent_id: number | null
-  depth: number
+export interface BlockDefStructure extends BlockDef {
+  instanceOf: typeof BlockInstance
 }
 
-export type DBBlockResult = {
+// type DBDefaults = {
+//   id: number
+//   created_at: string
+//   updated_at: string
+//   name: string
+//   label: string
+//   // type: string
+//   sort_order: number
+//   value: string
+//   options: string | null
+//   status: 'enabled' | 'disabled'
+//   parent_id: number | null
+//   depth: number
+// }
+
+type BaseDBResult = {
   id: number
   created_at: string
   updated_at: string
   name: string
   label: string
-  type: string
   sort_order: number
   value: string | null
   options: any
-  status: string
+  status: 'enabled' | 'disabled'
   parent_id: number | null
   depth: number
-  children?: DBBlockResult[]
-  fields?: Record<string, DBBlockResult>
 }
 
+export type DBPrimitiveFieldResult = BaseDBResult & {
+  type: FieldDef
+}
+
+export type DBBlockFieldResult = BaseDBResult & {
+  type: 'blocks'
+  children: DBBlockResult[]
+}
+
+export type DBBlockResult = BaseDBResult & {
+  type: string
+  fields: Record<string, DBFieldResult>
+}
+
+export type DBFieldResult = DBPrimitiveFieldResult & DBBlockFieldResult
+
 export type DBBlock = Block & {
   id: number
   created_at: string
@@ -103,8 +140,9 @@ export type DBBlock = Block & {
 export type BlockStatus = 'enabled' | 'disabled'
 
 export type StudioConfig = {
-  siteName: string
+  siteName?: string
   honoConfig?: HonoOptions<BlankEnv>
+  port?: number
   structure: Structure
 }
 

package/utils/define.ts

@@ -3,27 +3,39 @@ import { type HtmlEscapedString } from './html.ts'
 
 export const defineConfig = (config: types.StudioConfig) => config
 
-// export const defineStructure = (structure: types.Block[]) => structure
-// export const defineField = (field: types.Field) => field
-// export const defineBlock = (block: types.Block) => block
-
 export const defineEntry = (
   fn: (
     c: types.RequestContext,
   ) => HtmlEscapedString | Promise<HtmlEscapedString>,
 ) => fn
 
+export const FieldInstance = Symbol('field')
+export const BlockFieldInstance = Symbol('blockfield')
+export const BlockInstance = Symbol('block')
+
 // --- Identity helpers (preserve literal types) ---
-export function defineField(field: types.FieldDef) {
-  return field
+export function defineField(field: types.FieldDef): types.FieldDefStructure {
+  return {
+    ...field,
+    instanceOf: FieldInstance,
+  }
+}
+
+export function defineBlockField(
+  field: types.BlocksFieldDef,
+): types.BlocksFieldDefStructure {
+  return {
+    ...field,
+    instanceOf: BlockFieldInstance,
+  }
 }
 
-export function defineBlock(block: types.BlockDef) {
-  return block
+export function defineBlock(block: types.BlockDef): types.BlockDefStructure {
+  return { ...block, instanceOf: BlockInstance }
 }
 
 export function defineStructure(
-  structure: Record<string, types.BlockDef>,
+  structure: Record<string, types.BlockDefStructure>,
 ) {
   return structure
 }

package/utils/file-based-router.ts

@@ -15,6 +15,7 @@ export const fileBasedRouter = async (rootdir: string) => {
   try {
     dirs = await fs.readdir(root, { recursive: true })
   } catch (error) {
+    console.log('No files in:', root)
     return
   }
 

package/utils/get-or-create-row.ts

@@ -1,13 +1,26 @@
 import { db } from '@alstar/db'
 import { query } from '../queries/index.ts'
-import type { Block, FieldDef } from '../types.ts'
+import type {
+  BlockDefStructure,
+  BlocksFieldDefStructure,
+  FieldDefStructure,
+} from '../types.ts'
+
+export function getOrCreateRow(props: {
+  parentId: string | number | null
+  name: string
+  field: BlockDefStructure | BlocksFieldDefStructure | FieldDefStructure
+  sortOrder?: number
+  id?: number
+}) {
+  const { parentId, name, field, sortOrder = 0, id } = props
+
+  if (id) {
+    return query.block({
+      id: id?.toString(),
+    })
+  }
 
-export function getOrCreateRow(
-  parentId: string | number,
-  name: string,
-  field: Block | FieldDef,
-  sortOrder: number,
-) {
   const data = query.block({
     parent_id: parentId?.toString() || null,
     name: name,

package/utils/startup-log.ts

@@ -1,9 +1,9 @@
 import packageJSON from '../package.json' with { type: 'json' }
 
-export default () => {
+export default ({ port }: { port: number }) => {
   console.log('\x1b[32m%s\x1b[0m', '╭───────────────────────╮')
   console.log('\x1b[32m%s\x1b[0m', '│ Alstar Studio         │')
   console.log('\x1b[32m%s\x1b[0m', `│ ${packageJSON.version}${' '.repeat(22 - packageJSON.version.length)}│`)
-  console.log('\x1b[32m%s\x1b[0m', `│ http://localhost:${3000} │`)
+  console.log('\x1b[32m%s\x1b[0m', `│ http://localhost:${port} │`)
   console.log('\x1b[32m%s\x1b[0m', '╰───────────────────────╯')
 }

package/bin/alstar.ts

@@ -1,42 +0,0 @@
-#!/usr/bin/env node
-import { spawn } from 'node:child_process'
-import { fileURLToPath } from 'node:url'
-import path from 'node:path'
-
-// process.removeAllListeners('warning')
-
-const __filename = fileURLToPath(import.meta.url)
-
-// Dev-only auto watch (opt out with ALSTAR_NO_WATCH=true)
-const isDev =
-  process.env.NODE_ENV !== 'production' &&
-  process.env.ALSTAR_NO_WATCH !== 'true'
-const alreadyBootstrapped = process.env.ALSTAR_WATCH_BOOTSTRAPPED === '1'
-
-if (isDev && !alreadyBootstrapped) {
-  // Start a watcher ON THIS FILE and mark the environment so the child won't re-spawn
-  const childProcess = spawn(
-    process.execPath,
-    ['--watch', __filename, ...process.argv.slice(2)],
-    // [__filename, ...process.argv.slice(2)],
-    {
-      stdio: 'inherit',
-      env: { ...process.env, ALSTAR_WATCH_BOOTSTRAPPED: '1' },
-    },
-  )
-  // Important: exit this launcher so only the watched child keeps running
-  process.on('SIGINT', () => {
-    childProcess.kill('SIGINT')
-  })
-
-  process.on('SIGTERM', () => {
-    childProcess.kill('SIGTERM')
-  })
-
-  process.exit(0)
-
-}
-
-// --- Your actual CLI logic below ---
-// console.log(import.meta.dirname, path.resolve('.'))
-// import("./main.js").then(m => m.default());

package/components/Block.ts

@@ -1,55 +0,0 @@
-import { html } from 'hono/html'
-import type { Block, BlockDef, FieldDef } from '../types.ts'
-import { type HtmlEscapedString } from 'hono/utils/html'
-import { Field } from './fields/index.ts'
-
-export default (props: {
-  entryId: number
-  parentId: number
-  blockStructure: BlockDef | Block | FieldDef
-  name: string
-  sortOrder?: number
-}): HtmlEscapedString | Promise<HtmlEscapedString> => {
-  const { entryId, parentId, blockStructure, name, sortOrder = 0 } = props
-
-  if (!blockStructure) return html`<p>No block</p>`
-
-  let entries: [string, BlockDef | Block | FieldDef][] = []
-
-  const fieldTypes = ['text', 'image', 'markdown', 'slug']
-
-  try {
-    if (fieldTypes.includes(blockStructure.type)) {
-      entries = [[name, blockStructure]]
-    } else if (blockStructure.type === 'blocks') {
-      entries = Object.entries(blockStructure.children)
-    } else if (blockStructure.fields) {
-      entries = Object.entries(blockStructure.fields)
-    } else {
-      console.log(blockStructure)
-    }
-  } catch (error) {
-    console.log(error)
-  }
-
-  return html`
-    ${entries.map(([name, field]) => {
-      switch (field.type) {
-        case 'text': {
-          return Field.Text({ entryId, parentId, name, field, sortOrder })
-        }
-        case 'slug': {
-          return Field.Text({ entryId, parentId, name, field, sortOrder })
-        }
-        case 'markdown': {
-          return Field.Text({ entryId, parentId, name, field, sortOrder })
-        }
-        case 'image': {
-          return Field.Text({ entryId, parentId, name, field, sortOrder })
-        }
-        case 'blocks': {
-          return Field.Blocks({ entryId, parentId, name, field, sortOrder })
-        }
-      }
-    })}`
-}

package/public/main.css

@@ -1,103 +0,0 @@
-/* @import './../node_modules/@alstar/ui/red.css'; */
-@import 'https://esm.sh/@alstar/ui/red.css';
-@import './admin-panel.css';
-@import './entry.css';
-@import './blocks.css';
-@import './settings.css';
-
-body {
-  min-height: 100vh;
-}
-
-body {
-  padding: 0;
-  min-height: inherit;
-
-  display: grid;
-  grid-template-columns: auto 1fr;
-  align-content: baseline;
-
-  > main {
-    padding: 40px;
-    height: 100vh;
-    overflow: auto;
-
-    section {
-      max-width: 900px;
-      margin: 0 auto;
-    }
-  }
-}
-
-.entry > .fields > .block {
-  padding-block: var(--pico-spacing);
-
-  > header {
-    margin-block: var(--pico-block-spacing-vertical);
-  }
-}
-
-.block {
-  > header {
-    margin-bottom: var(--pico-spacing);
-  }
-
-  header {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-
-    background-color: inherit;
-
-    h6,
-    h5,
-    fieldset {
-      margin-bottom: 0;
-    }
-
-    button {
-      padding: 0;
-      background-color: white;
-
-      svg {
-        padding: 8px;
-      }
-    }
-  }
-}
-
-[data-sortable] {
-  > article {
-    transition: opacity 200ms;
-  }
-
-  .sortable-ghost {
-    opacity: 0.3;
-  }
-
-  /* .sortable-chosen {
-    filter: brightness(0.9)
-  } */
-}
-
-div.ink-mde {
-  border: var(--pico-border-width) solid #2a3140;
-  border-radius: var(--pico-border-radius);
-  outline: 0;
-  background-color: var(--pico-background-color);
-  box-shadow: var(--pico-box-shadow);
-  color: var(--pico-color);
-}
-
-.ink-mde-textarea {
-  width: 100%;
-}
-
-.disclamer {
-  display: flex;
-  justify-content: center;
-}
-
-.text-secondary {
-  color: var(--pico-secondary);
-}

package/public/main.js

@@ -1,48 +0,0 @@
-import barba from '@barba/core'
-import Sortable from 'sortablejs'
-// import { wrap } from 'ink-mde'
-
-barba.init({
-  cacheIgnore: true,
-  views: [
-    {
-      namespace: 'default',
-      afterEnter() {
-        init()
-      },
-    },
-  ],
-})
-
-function init() {
-  // sortable
-  {
-    const els = document.querySelectorAll('[data-sortable]')
-
-    els.forEach((el) => {
-      const id = el.dataset.sortable
-
-      var sortable = Sortable.create(el, {
-        delay: 0,
-        animation: 250,
-        dragClass: 'sortable-drag',
-        easing: 'ease-in-out',
-        handle: `[data-handle="${id}"]`,
-      })
-    })
-  }
-
-  // // ink-mde
-  // {
-  //   const el = document.querySelector('textarea')
-
-  //   if (el) {
-  //     wrap(el, {
-  //       interface: {
-  //         // appearance: InkValues.Appearance.Auto,
-  //         attribution: false,
-  //       },
-  //     })
-  //   }
-  // }
-}