[
  {
    "id": 3323,
    "title": "更新履歴_F-13",
    "icon": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewbox=\"0 0 256 256\"><path d=\"M216,128a88,88,0,1,1-88-88A88,88,0,0,1,216,128Z\" fill=\"#9aa8c9\"/><path d=\"M136,80v43.47l36.12,21.67a8,8,0,0,1-8.24,13.72l-40-24A8,8,0,0,1,120,128V80a8,8,0,0,1,16,0Zm88-24a8,8,0,0,0-8,8V82c-6.35-7.36-12.83-14.45-20.12-21.83a96,96,0,1,0-2,137.7,8,8,0,0,0-11-11.64A80,80,0,1,1,184.54,71.4C192.68,79.64,199.81,87.58,207,96H184a8,8,0,0,0,0,16h40a8,8,0,0,0,8-8V64A8,8,0,0,0,224,56Z\" fill=\"#1a1a2e\"/></svg>",
    "keywords": [
      "更新履歴",
      "お知らせ・注意喚起"
    ],
    "slug": "lazyblock/f-update-log",
    "description": "記事の追記情報やツールのバージョンアップ内容を日付と共にリスト化するブロックです。登録件数が6件以上になると、自動で「すべて表示する」トグルボタンが出現して省スペースに収まる機能を持っています。",
    "category": "Lazyblocks Free",
    "category_label": "Lazyblocks Free",
    "supports": {
      "customClassName": true,
      "anchor": false,
      "html": false,
      "multiple": true,
      "inserter": true,
      "reusable": true,
      "color": false,
      "layout": false,
      "shadow": false,
      "spacing": false,
      "dimensions": false,
      "typography": false,
      "lock": true,
      "align": [
        "wide",
        "full"
      ],
      "ghostkit": {
        "effects": false,
        "position": false,
        "spacings": false,
        "frame": false,
        "transform": false,
        "customCSS": false,
        "display": false,
        "attributes": false
      }
    },
    "controls": {
      "control_377af845b0": {
        "type": "repeater",
        "name": "update_list",
        "default": "",
        "label": "更新履歴一覧",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "settings",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": ""
      },
      "control_4349544218": {
        "type": "date_time",
        "name": "update_date",
        "default": "",
        "label": "日付",
        "help": "",
        "child_of": "control_377af845b0",
        "placement": "content",
        "group": "settings",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": "",
        "date_time_picker": "date"
      },
      "control_3cd8e04cef": {
        "type": "textarea",
        "name": "update_content",
        "default": "",
        "label": "更新内容",
        "help": "",
        "child_of": "control_377af845b0",
        "placement": "content",
        "group": "settings",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": ""
      }
    },
    "code": {
      "output_method": "php",
      "editor_html": "",
      "editor_callback": "",
      "frontend_html": "<?php\r\n$update_list = isset( $attributes['update_list'] ) && is_array( $attributes['update_list'] ) ? $attributes['update_list'] : [];\r\n?>\r\n\r\n<?php if ( empty( $update_list ) ) : ?>\r\n  <div style=\"padding: 24px; background: #11151f; border: 2px dashed #00d2d3; border-radius: 12px; text-align: center; color: #ffffff;\">\r\n    <p style=\"margin: 0;\">🕒 <strong>更新履歴ブロック</strong><br><span style=\"font-size: 13px; color: #8b92a5;\">右側のパネルから「更新履歴一覧」を追加してください。</span></p>\r\n  </div>\r\n<?php else : \r\n  $uid   = 'update-log-' . uniqid();\r\n  $total = count( $update_list );\r\n?>\r\n  <div class=\"update-log-block\" id=\"<?php echo esc_attr( $uid ); ?>\">\r\n    <ul class=\"update-log-list\">\r\n      <?php foreach ( $update_list as $index => $item ) : \r\n        \r\n        $raw_date = isset( $item['update_date'] ) ? $item['update_date'] : '';\r\n        $date     = ! empty( $raw_date ) ? date( 'Y.m.d', strtotime( $raw_date ) ) : '';\r\n        \r\n        $content  = isset( $item['update_content'] ) ? $item['update_content'] : '';\r\n      ?>\r\n        <li class=\"update-log-item<?php echo $index >= 5 ? ' is-hidden-row' : ''; ?>\">\r\n          <span class=\"update-log-date\"><?php echo esc_html( $date ); ?></span>\r\n          <span class=\"update-log-content\"><?php echo esc_html( $content ); ?></span>\r\n        </li>\r\n      <?php endforeach; ?>\r\n    </ul>\r\n    <?php if ( $total > 5 ) : ?>\r\n      <button type=\"button\" class=\"update-log-toggle\" data-target=\"<?php echo esc_attr( $uid ); ?>\">\r\n        すべて表示（残り<?php echo (int) ( $total - 5 ); ?>件）\r\n      </button>\r\n    <?php endif; ?>\r\n  </div>\r\n\r\n  <style>\r\n  .update-log-block, .update-log-block * { box-sizing: border-box; }\r\n  .update-log-block ul, .update-log-block li { list-style: none !important; margin: 0 !important; padding: 0 !important; }\r\n  .update-log-block {\r\n    width: 100%;\r\n    background: #111622; \r\n    border: 1px solid #283042; \r\n    border-radius: 12px;\r\n    padding: 20px 24px; \r\n    font-size: 14px;\r\n    margin: 32px 0;\r\n    box-shadow: 0 4px 12px rgba(0,0,0,0.05);\r\n  }\r\n  .update-log-item { \r\n    display: flex; \r\n    gap: 16px; \r\n    padding: 12px 0; \r\n    border-bottom: 1px solid #283042; \r\n  }\r\n  .update-log-item:last-child { \r\n    border-bottom: none; \r\n  }\r\n  .update-log-item.is-hidden-row { \r\n    display: none; \r\n  }\r\n  .update-log-date { \r\n    flex-shrink: 0; \r\n    color: #00d2d3; \r\n    font-family: \"Courier New\", Courier, monospace; \r\n    font-size: 14px; \r\n    font-weight: 700;\r\n    width: 7.5em; \r\n  }\r\n  .update-log-content { \r\n    color: #b4b9c9; \r\n    line-height: 1.6;\r\n  }\r\n  .update-log-toggle {\r\n    margin-top: 16px; \r\n    background: transparent; \r\n    color: #00d2d3;\r\n    border: 1px solid #00d2d3; \r\n    border-radius: 8px; \r\n    padding: 10px 16px;\r\n    font-size: 14px; \r\n    font-weight: 700;\r\n    cursor: pointer; \r\n    width: 100%; \r\n    transition: background 0.2s ease, color 0.2s ease;\r\n  }\r\n  .update-log-toggle:hover { \r\n    background: rgba(0, 210, 211, 0.1); \r\n  }\r\n  \r\n  @media (max-width: 480px) {\r\n    .update-log-block { padding: 16px 20px; }\r\n    .update-log-item { flex-direction: column; gap: 6px; padding: 14px 0; }\r\n    .update-log-date { width: auto; font-size: 13px; }\r\n    .update-log-content { font-size: 14px; }\r\n  }\r\n  </style>\r\n\r\n  <script>\r\n  document.addEventListener(\"DOMContentLoaded\", function() {\r\n    var toggles = document.querySelectorAll( '.update-log-toggle' );\r\n    toggles.forEach( function ( btn ) {\r\n      if ( btn.dataset.bound ) return;\r\n      btn.dataset.bound = 'true';\r\n      \r\n      btn.addEventListener( 'click', function () {\r\n        var wrap = document.getElementById( btn.dataset.target );\r\n        if ( ! wrap ) return;\r\n        \r\n        var hiddenRows = wrap.querySelectorAll( '.is-hidden-row' );\r\n        var isOpen = btn.classList.toggle( 'is-open' );\r\n        \r\n        hiddenRows.forEach( function ( row ) {\r\n          row.style.display = isOpen ? 'flex' : 'none';\r\n        } );\r\n        \r\n        btn.textContent = isOpen ? '閉じる' : 'すべて表示（残り' + hiddenRows.length + '件）';\r\n      } );\r\n    } );\r\n  });\r\n  </script>\r\n<?php endif; ?>",
      "frontend_callback": "",
      "show_preview": "always",
      "single_output": true
    },
    "style": {
      "block": "",
      "editor": ""
    },
    "script": {
      "view": ""
    },
    "styles": [],
    "condition": [],
    "edit_url": null,
    "provide_context_to_blocks": "",
    "custom_context_slug": "",
    "allowed_blocks": "",
    "ancestor": ""
  }
]