Skip to content

Instantly share code, notes, and snippets.

@prashantdsala
Last active August 2, 2024 10:20
Show Gist options
  • Save prashantdsala/51b5113e0a800b5ec531051589dead52 to your computer and use it in GitHub Desktop.
Save prashantdsala/51b5113e0a800b5ec531051589dead52 to your computer and use it in GitHub Desktop.
SDC in Drupal
1. Creating a schema within your my-component.component.yml is mandatory for modules, but optional for themes.
2. Note you can force all components within your theme to require schemas by adding the following to your themename.info.yml.
enforce_prop_schemas: true
3. You can load additional styles, scripts, and dependencies using the libraryOverrides key within your component’s YML file if necessary.
4. The final directory structure looks something like this https://www.drupal.org/docs/develop/theming-drupal/using-single-directory-components/creating-a-single-directory-component#s-to-create-your-first-single-directory-component-follow-these-steps
5. Only .twig and .yml files are required others are optional
6. Schema follows https://json-schema.org/understanding-json-schema
7. Only themes can override components (modules cannot override
8. For a theme to override a component, use the "replaces" key within the mytheme.component.yml file. e.g. replaces: 'sdc_theme_test:my-card'
9. In addition, both components must have schemas defined within their YML files, and the schemas’ props and slots must match.
10. https://www.drupal.org/docs/develop/theming-drupal/using-single-directory-components/creating-a-single-directory-component#s-overriding-components-provided-by-other-modules-or-themes
11. To use a component in an *.html.twig template use Twig’s built in embed http://twig.symfony.com/doc/3.x/tags/embed.html or include functions.
12. There is a special render element that allows you to render a component based solely on the component ID and the component props.
13. Component data validation: The justinrainbow/json-schema composer package must be installed. This can easily be installed via drupal/core-dev:
composer require drupal/core-dev --dev
14. Assertions must be enabled. If assertions are disabled within your local environment, you can add the following to your settings.php to enable them:
ini_set('zend.assertions', 1);
15. Note that enforce_prop_schemas: false only applies to the absence of a schema definition for the entire component. Even with this setting present, each individual element of the schema will be validated individually.
16. The component plugin manager (the service with name plugin.manager.sdc).
17. The render element and its class \Drupal\sdc\Element\ComponentElement.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment