@codemieai/code 0.0.55 → 0.0.57

package/dist/agents/plugins/claude/plugin/skills/codemie-html-report/style-guide/css/utilities.css

@@ -0,0 +1,238 @@
+/**
+ * CodeMie Utility Classes
+ * Flexbox, spacing, display, overflow, z-index, and misc helpers.
+ */
+
+/* ============================================================
+   DISPLAY
+   ============================================================ */
+.hidden    { display: none !important; }
+.block     { display: block; }
+.inline    { display: inline; }
+.inline-block { display: inline-block; }
+.flex      { display: flex; }
+.inline-flex { display: inline-flex; }
+.grid      { display: grid; }
+
+/* ============================================================
+   FLEX
+   ============================================================ */
+.flex-col   { flex-direction: column; }
+.flex-row   { flex-direction: row; }
+.flex-wrap  { flex-wrap: wrap; }
+.flex-nowrap { flex-wrap: nowrap; }
+.flex-1     { flex: 1; }
+.flex-auto  { flex: auto; }
+.flex-none  { flex: none; }
+.flex-shrink-0 { flex-shrink: 0; }
+.grow       { flex-grow: 1; }
+
+/* Align */
+.items-start    { align-items: flex-start; }
+.items-center   { align-items: center; }
+.items-end      { align-items: flex-end; }
+.items-stretch  { align-items: stretch; }
+
+/* Justify */
+.justify-start   { justify-content: flex-start; }
+.justify-center  { justify-content: center; }
+.justify-end     { justify-content: flex-end; }
+.justify-between { justify-content: space-between; }
+
+/* ============================================================
+   GRID
+   ============================================================ */
+.grid-2   { grid-template-columns: repeat(2, minmax(0, 1fr)); }
+.grid-3   { grid-template-columns: repeat(3, minmax(0, 1fr)); }
+.grid-4   { grid-template-columns: repeat(4, minmax(0, 1fr)); }
+.grid-auto-fill-sm { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
+.grid-auto-fill-md { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
+.grid-auto-fill-lg { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
+
+/* ============================================================
+   GAP
+   ============================================================ */
+.gap-1   { gap: var(--space-1); }
+.gap-2   { gap: var(--space-2); }
+.gap-3   { gap: var(--space-3); }
+.gap-4   { gap: var(--space-4); }
+.gap-5   { gap: var(--space-5); }
+.gap-6   { gap: var(--space-6); }
+.gap-8   { gap: var(--space-8); }
+
+.gap-x-2 { column-gap: var(--space-2); }
+.gap-x-3 { column-gap: var(--space-3); }
+.gap-x-4 { column-gap: var(--space-4); }
+.gap-y-2 { row-gap: var(--space-2); }
+.gap-y-3 { row-gap: var(--space-3); }
+.gap-y-4 { row-gap: var(--space-4); }
+
+/* ============================================================
+   PADDING
+   ============================================================ */
+.p-1  { padding: var(--space-1); }
+.p-2  { padding: var(--space-2); }
+.p-3  { padding: var(--space-3); }
+.p-4  { padding: var(--space-4); }
+.p-6  { padding: var(--space-6); }
+.p-8  { padding: var(--space-8); }
+
+.px-2 { padding-left: var(--space-2); padding-right: var(--space-2); }
+.px-3 { padding-left: var(--space-3); padding-right: var(--space-3); }
+.px-4 { padding-left: var(--space-4); padding-right: var(--space-4); }
+
+.py-1 { padding-top: var(--space-1); padding-bottom: var(--space-1); }
+.py-2 { padding-top: var(--space-2); padding-bottom: var(--space-2); }
+.py-3 { padding-top: var(--space-3); padding-bottom: var(--space-3); }
+.py-4 { padding-top: var(--space-4); padding-bottom: var(--space-4); }
+
+.pt-2 { padding-top: var(--space-2); }
+.pt-4 { padding-top: var(--space-4); }
+.pt-8 { padding-top: var(--space-8); }
+.pb-2 { padding-bottom: var(--space-2); }
+.pb-4 { padding-bottom: var(--space-4); }
+
+/* ============================================================
+   MARGIN
+   ============================================================ */
+.m-auto  { margin: auto; }
+.mx-auto { margin-left: auto; margin-right: auto; }
+.ml-auto { margin-left: auto; }
+.mr-auto { margin-right: auto; }
+
+.mt-1 { margin-top: var(--space-1); }
+.mt-2 { margin-top: var(--space-2); }
+.mt-3 { margin-top: var(--space-3); }
+.mt-4 { margin-top: var(--space-4); }
+.mt-6 { margin-top: var(--space-6); }
+.mt-8 { margin-top: var(--space-8); }
+
+.mb-1 { margin-bottom: var(--space-1); }
+.mb-2 { margin-bottom: var(--space-2); }
+.mb-3 { margin-bottom: var(--space-3); }
+.mb-4 { margin-bottom: var(--space-4); }
+.mb-6 { margin-bottom: var(--space-6); }
+
+/* ============================================================
+   WIDTH / HEIGHT
+   ============================================================ */
+.w-full    { width: 100%; }
+.w-auto    { width: auto; }
+.h-full    { height: 100%; }
+.min-h-screen { min-height: 100vh; }
+.min-w-0   { min-width: 0; }
+.max-w-sm  { max-width: 384px; }
+.max-w-md  { max-width: 512px; }
+.max-w-lg  { max-width: 720px; }
+.max-w-xl  { max-width: 960px; }
+.max-w-full { max-width: 100%; }
+
+/* ============================================================
+   OVERFLOW
+   ============================================================ */
+.overflow-hidden   { overflow: hidden; }
+.overflow-auto     { overflow: auto; }
+.overflow-x-auto   { overflow-x: auto; }
+.overflow-y-auto   { overflow-y: auto; }
+.overflow-visible  { overflow: visible; }
+
+/* ============================================================
+   POSITION
+   ============================================================ */
+.relative { position: relative; }
+.absolute { position: absolute; }
+.fixed    { position: fixed; }
+.sticky   { position: sticky; }
+
+.inset-0  { inset: 0; }
+.top-0    { top: 0; }
+.bottom-0 { bottom: 0; }
+.left-0   { left: 0; }
+.right-0  { right: 0; }
+
+/* ============================================================
+   Z-INDEX
+   ============================================================ */
+.z-10     { z-index: 10; }
+.z-20     { z-index: 20; }
+.z-30     { z-index: var(--z-dropdown); }
+.z-50     { z-index: var(--z-modal); }
+.z-60     { z-index: var(--z-toast); }
+
+/* ============================================================
+   BORDER RADIUS
+   ============================================================ */
+.rounded-sm   { border-radius: var(--radius-sm); }
+.rounded-md   { border-radius: var(--radius-md); }
+.rounded-lg   { border-radius: var(--radius-lg); }
+.rounded-xl   { border-radius: var(--radius-xl); }
+.rounded-2xl  { border-radius: var(--radius-2xl); }
+.rounded-full { border-radius: var(--radius-full); }
+
+/* ============================================================
+   BACKGROUND COLORS
+   ============================================================ */
+.bg-page      { background-color: var(--color-bg-page); }
+.bg-card      { background-color: var(--color-bg-card); }
+.bg-elevated  { background-color: var(--color-bg-elevated); }
+.bg-secondary { background-color: var(--color-bg-secondary); }
+.bg-tertiary  { background-color: var(--color-bg-tertiary); }
+.bg-success   { background-color: var(--color-success-bg); }
+.bg-error     { background-color: var(--color-error-bg); }
+.bg-warning   { background-color: var(--color-warning-bg); }
+.bg-info      { background-color: var(--color-info-bg); }
+
+/* Gradient backgrounds */
+.bg-brand     { background: var(--gradient-brand); }
+.bg-magical   { background: var(--gradient-magical); }
+.bg-purple-radial { background: var(--gradient-purple-radial); }
+
+/* ============================================================
+   BORDER
+   ============================================================ */
+.border       { border: 1px solid var(--color-border-structural); }
+.border-top   { border-top: 1px solid var(--color-border-structural); }
+.border-bottom { border-bottom: 1px solid var(--color-border-structural); }
+.border-left  { border-left: 1px solid var(--color-border-structural); }
+.border-right { border-right: 1px solid var(--color-border-structural); }
+.border-none  { border: none; }
+
+/* ============================================================
+   CURSOR
+   ============================================================ */
+.cursor-pointer   { cursor: pointer; }
+.cursor-default   { cursor: default; }
+.cursor-not-allowed { cursor: not-allowed; }
+.cursor-wait      { cursor: wait; }
+
+/* ============================================================
+   POINTER EVENTS
+   ============================================================ */
+.pointer-none { pointer-events: none; }
+
+/* ============================================================
+   OPACITY
+   ============================================================ */
+.opacity-0   { opacity: 0; }
+.opacity-50  { opacity: 0.5; }
+.opacity-60  { opacity: 0.6; }
+.opacity-100 { opacity: 1; }
+
+/* ============================================================
+   SELECTION
+   ============================================================ */
+.select-none { user-select: none; }
+.select-text { user-select: text; }
+
+/* ============================================================
+   SHADOWS
+   ============================================================ */
+.shadow-sm { box-shadow: var(--shadow-sm); }
+.shadow-md { box-shadow: var(--shadow-md); }
+.shadow-lg { box-shadow: var(--shadow-lg); }
+
+/* ============================================================
+   TRANSITIONS
+   ============================================================ */
+.transition     { transition: all var(--transition-base); }
+.transition-colors { transition: color var(--transition-base), background-color var(--transition-base), border-color var(--transition-base); }

package/dist/agents/plugins/claude/plugin/skills/msgraph/SKILL.md

@@ -36,14 +36,15 @@ node ${CLAUDE_PLUGIN_ROOT}/skills/msgraph/scripts/msgraph.js status
 node ${CLAUDE_PLUGIN_ROOT}/skills/msgraph/scripts/msgraph.js login
 ```
 
-This starts the **Device Code Flow** — it will print a URL and a short code like:
-```
-To sign in, use a web browser to open the page https://microsoft.com/devicelogin
-and enter the code ABCD-1234 to authenticate.
-```
+This opens the **system browser** for Microsoft authentication (PKCE flow). If the browser
+does not open automatically, a URL will be printed in the terminal — navigate to it manually.
+After successful sign-in, the token is cached at `~/.ms_graph_token_cache.json` and all
+subsequent commands run silently.
 
-Tell the user exactly that message, then wait. Once they complete login in the browser,
-the token is cached at `~/.ms_graph_token_cache.json` and all subsequent commands run silently.
+Use `--force` to re-authenticate even when already logged in:
+```bash
+node ${CLAUDE_PLUGIN_ROOT}/skills/msgraph/scripts/msgraph.js login --force
+```
 
 ### When NOT logged in or token expired
 
@@ -53,7 +54,8 @@ If status returns `NOT_LOGGED_IN` or `TOKEN_EXPIRED`, tell the user:
 > ```
 > node ${CLAUDE_PLUGIN_ROOT}/skills/msgraph/scripts/msgraph.js login
 > ```
-> A code and URL will appear — open the URL in your browser and enter the code."
+> Your browser will open for Microsoft sign-in. If it doesn't open automatically, a URL
+> will appear in the terminal — navigate to it to complete authentication."
 
 ---