wiki.techinc.nl/resources/lib/codex/README.md
Anne Tomasevich 38e79e99f4 Update Codex from v0.4.0 to v0.4.2
Bug: T295605
Bug: T312023
Bug: T312024
Bug: T312025
Bug: T313933
Bug: T323684
Bug: T323753
Bug: T324397
Bug: T324792
Bug: T324900
Change-Id: I57c8f5f8c3933bbbd229bc566a07fc37378810fc
2022-12-13 18:51:02 -05:00

953 B

Codex

Codex is a toolkit for building user interfaces within the Wikimedia Design System. Codex contains:

  • Vue components, in this package
  • Design tokens, in the @wikimedia/codex-tokens package
  • Icons, in the @wikimedia/codex-icons package

For more details, read the Codex documentation.

Using Codex components

To use a component, import it from this package:

// If using ES modules:
import { CdxButton } from '@wikimedia/codex';

// or, if using CommonJS:
const { CdxButton } = require( '@wikimedia/codex' );

then pass it into the components option of your Vue component:

<template>
	<div>
		<cdx-button action="progressive" type="primary">
			Click me!
		</cdx-button>
	</div>
</template>

<script>
import { defineComponent } from 'vue';
import { CdxButton } from '@wikimedia/codex';

export default defineComponent( {
	components: {
		CdxButton
	},
	// ...
} );
</script>