Skip to content
shadcn.io

shadcn.io is not affiliated with official shadcn/ui

CRUD blocks

Pro

Content Calendar CRUD Block for Vue

A team's publishing plan in two bands: ideas without a day and scheduled posts grouped by day, a quick line that adds an idea, a schedule popover that refuses a crowded day, Unschedule, locked published posts and Delete with Undo.

Framework
UI library

Preview

Preview width

Installation

Part of Pro
Pro unlocks the code and one-line install of every Pro button and text effect, plus the MCP for your AI editor.
Get ProSign in
Have Pro already? Sign in to open it.Opens here as soon as you're Pro.

Overview

Plan what goes out and when, with this content calendar for Vue with Ark UI. A hairline frame with a plus mark on each corner opens with a Toggle Group of channels, each with its count, that filters both bands. A quick line adds an idea for a channel on Enter, and its Add button is the only Shine Button. One frame of fixed height holds the Ideas band, whose posts have no day, and the Scheduled band, grouped by day and then by channel. Schedule opens a Popover with a date and a channel: the post moves into its day, or the popover names why not, such as "Newsletter already has 2 posts on 20 Oct". Unschedule sends a post back to Ideas, and a published post shows a lock and can't change. Delete covers ideas and scheduled posts and leaves a line in the foot with an Undo. The bands are ruled by Guides, and an Empty state shows when nothing is left. For newsletters, blogs, video and any team that plans before it publishes.

FAQ

How do I fill it with my posts?

Edit START_LINES: each line is a title, a channel, an ISO day (empty for an idea) and yes when it is already published. Channels are listed in CHANNELS, and the limit of posts per channel and day is PER_DAY. The counts on the toggles and the band headings are derived from the list.

What does Schedule refuse?

A missing day, a day on or before the fourteenth of October 2026 and a day on which that channel already has two posts. The reason appears in the popover and the foot, the popover stays open, and nothing moves until the post passes. Changing the channel in the popover re-checks the day.

Why can't I change a published post?

A published post is out. It shows a lock and "Published, cannot change" in place of its buttons, so it can't be unscheduled or deleted. In your app that is a rule on the server too.

What does Undo bring back?

The last change: a scheduled post, an unscheduled one or a deletion. The whole list returns as it was, and focus goes to that post's button. A new change replaces it.

What stays local, and how do I wire a real save?

Posts live in state in this tab and a reload restores the first list; nothing is published or sent anywhere. In your app call your API from add, schedule, unschedule and remove, and keep the day and crowd checks in scheduleProblem on the server.

How does it look on a phone?

The channel toggles wrap onto two rows, the quick line keeps its Add button beside the input, and each post's buttons wrap under its title. The two bands scroll together inside their frame.

All 100 crud blocks